update to bootstrap 4 and change page layout
This commit is contained in:
Lukas Winkler
parent
14a87e2522
commit
9a1f774899
6 changed files with 1623 additions and 26 deletions
4
.gitignore
vendored
4
.gitignore
vendored
|
|
@ -7,4 +7,6 @@ src/tmp/github_api_cache/*
|
|||
!src/tmp/github_api_cache/.gitkeep
|
||||
src/vendor
|
||||
src/composer.phar
|
||||
src/config/config.php
|
||||
src/config/config.php
|
||||
src/node_modules/
|
||||
src/public/css/style.*
|
||||
|
|
|
|||
1533
src/package-lock.json
generated
Normal file
1533
src/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
17
src/package.json
Normal file
17
src/package.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "src",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"dependencies": {
|
||||
"bootstrap": "^4.0.0-beta",
|
||||
"node-sass": "^4.5.3"
|
||||
},
|
||||
"devDependencies": {},
|
||||
"scripts": {
|
||||
"compileCSS": "node-sass --recursive --output public/css --source-map true --source-map-contents scss",
|
||||
"watchSCSS": "node-sass --watch --recursive --output public/css --source-map true --source-map-contents scss"
|
||||
},
|
||||
"author": "",
|
||||
"license": "ISC"
|
||||
}
|
||||
24
src/scss/style.scss
Normal file
24
src/scss/style.scss
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
$grid-gutter-width: 10px;
|
||||
|
||||
@import "../node_modules/bootstrap/scss/bootstrap";
|
||||
|
||||
.card-deck {
|
||||
.row {
|
||||
align-items: stretch;
|
||||
> div {
|
||||
display: flex;
|
||||
margin-bottom: 2*$grid-gutter-width;
|
||||
.card {
|
||||
color: $gray-900;
|
||||
small {
|
||||
color: $gray-700;
|
||||
}
|
||||
text-decoration: none;
|
||||
&:hover,&:focus,&:active {
|
||||
border: 1px solid rgba(0, 0, 0, 0.5);
|
||||
background: $gray-200;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4,7 +4,7 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/css/style.css" rel="stylesheet">
|
||||
|
||||
{% block head %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -2,11 +2,11 @@
|
|||
|
||||
{% block head %}
|
||||
{% if currentPage > 1 %}
|
||||
<link rel="prev" href="{{ path_for('page', [] , { 'page': previousPage }) }}" />
|
||||
<link rel="prev" href="{{ path_for('page', [] , { 'page': previousPage }) }}"/>
|
||||
{% endif %}
|
||||
|
||||
{% if currentPage != numPages %}
|
||||
<link rel="next" href="{{ path_for('page', [], { 'page': nextPage }) }}" />
|
||||
<link rel="next" href="{{ path_for('page', [], { 'page': nextPage }) }}"/>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
|
|
@ -14,48 +14,69 @@
|
|||
{% if currentPage == 1 %}
|
||||
<div class="container">
|
||||
<div class="page-header">
|
||||
<h1>Read-only mirror of all <a href="https://github.com/{{ githubOrganization|e('url') }}/{{ githubRepository|e('url') }}/issues" target="_blank">{{ projectName }} issues</a>.</h1>
|
||||
<h1>Read-only mirror of all <a
|
||||
href="https://github.com/{{ githubOrganization|e('url') }}/{{ githubRepository|e('url') }}/issues"
|
||||
target="_blank">{{ projectName }} issues</a>.</h1>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="container">
|
||||
<div class="page-header">
|
||||
<h1>{{ projectName }} Issues <small>Page {{currentPage}}</small></h1>
|
||||
<h1>{{ projectName }} Issues
|
||||
<small>Page {{ currentPage }}</small>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<hr>
|
||||
|
||||
<div class="container">
|
||||
|
||||
{% for issue in issues %}
|
||||
<div class="list-group">
|
||||
<a href="{{ path_for('issue', { 'number': issue.number }) }}" class="list-group-item">
|
||||
<h4 class="list-group-item-heading">{{ issue.title }} <small>#{{ issue.number }}</small></h4>
|
||||
<p class="list-group-item-text">
|
||||
<small>
|
||||
opened by @{{ issue.user.login }} on {{ issue.created_at|date }}
|
||||
{% if issue.state == 'closed' %}
|
||||
<span class="label label-default">closed</span>
|
||||
{% endif %}
|
||||
</small>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div class="card-deck"><div class="row">
|
||||
{% for issue in issues %}
|
||||
<div class="col-md-3">
|
||||
<a href="{{ path_for('issue', { 'number': issue.number }) }}" class="card">
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">{{ issue.title }}
|
||||
<small>#{{ issue.number }}</small>
|
||||
</h4>
|
||||
<small>
|
||||
opened by @{{ issue.user.login }} on {{ issue.created_at|date }}
|
||||
{% if issue.state == 'closed' %}
|
||||
<span class="badge badge-secondary">closed</span>
|
||||
{% endif %}
|
||||
</small>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div></div>
|
||||
<ul class="pagination">
|
||||
{% if currentPage > 1 %}
|
||||
<li><a href="{{ path_for('page', [], { 'page': previousPage }) }}" title="Previous page">«</a></li>
|
||||
<li class="page-item">
|
||||
<a href="{{ path_for('page', [], { 'page': previousPage }) }}"
|
||||
aria-label="Previous page" class="page-link">
|
||||
<span aria-hidden="true">«</span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% for pageEntry in 1..numPages %}
|
||||
<li {% if pageEntry == currentPage %}class="active"{% endif %}>
|
||||
<a href="{{ path_for('page', [], { 'page': pageEntry }) }}" title="Page {{ pageEntry }}">{{ pageEntry }}</a>
|
||||
<li class="page-item {% if pageEntry == currentPage %}active{% endif %}">
|
||||
<a class="page-link" href="{{ path_for('page', [], { 'page': pageEntry }) }}"
|
||||
title="Page {{ pageEntry }}">{{ pageEntry }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
{% if currentPage != numPages %}
|
||||
<li><a href="{{ path_for('page', [], { 'page': nextPage }) }}" title="Next page">»</a></li>
|
||||
<li class="page-item">
|
||||
<a href="{{ path_for('page', [], { 'page': nextPage }) }}"
|
||||
class="page-link" aria-label="Next page">
|
||||
<span aria-hidden="true">»</span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
|
||||
|
|
|
|||
Reference in a new issue