mirrors/binario
1
0
Fork 0
mirror of https://github.com/Vimux/Binario.git synced 2024-11-11 01:38:28 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add card layout for list pages

Browse source
This commit is contained in:
vimux 2018-03-10 07:40:22 +03:00
parent d11d050428
commit 031c995310
3 changed files with 43 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
layouts/_default/list.html
View file

@ -8,7 +8,7 @@
{{ end }}
<div class="cards">
{{ range .Paginator.Pages }}
<div class="card">
<div class="card{{ with .Site.Params.CardsColumns }} card--{{ . }}col{{ else }} card--2col{{ end }}">
{{ .Render "summary" }}
</div>
{{ end }}

2
layouts/_default/summary.html
View file

@ -1,4 +1,4 @@
<article class="post block">
<article class="post card__box block">
<h1 class="post__title"><a class="post__title-link" href="{{ .RelPermalink }}">{{ .Title }}</a></h1>
<div class="post__content">{{- .Summary }}</div>
<div class="post__meta meta mt tar">{{ partial "post_meta.html" . }}</div>

41
static/css/main.css
View file

@ -411,6 +411,47 @@ mark {
text-decoration: none;
}
/* Cards UI*/
.cards {
display: flex;
flex-wrap: wrap;
}
.card {
display: flex;
width: 100%;
padding: 3px 0;
}
@media screen and (min-width: 480px) {
.card {
padding: 5px;
}
}
@media screen and (min-width: 720px) {
.card--2col {
width: 50%;
}
.card--3col {
width: 50%;
}
}
@media screen and (min-width: 860px) {
.card--3col {
width: 33.333%;
}
}
.card__box {
display: flex;
flex-direction: column;
width: 100%;
margin: 0;
}
/* Taxonomies */
.page__title {
margin-bottom: 0;