KureShisen/Hugo-theme-stack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(article/related contents): style change

Browse Source
This commit is contained in:
Jimmy Cai 2020-09-05 00:50:08 +02:00
parent 2d68b9e8ce
commit 99eb6cdfd0
No known key found for this signature in database
GPG Key ID: 3EA408E527F37B18
2 changed files with 9 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
assets/scss/partials/layout/article.scss
View File

@ -152,14 +152,10 @@
.related-contents--wrapper { .related-contents--wrapper {
margin-bottom: var(--section-separation); margin-bottom: var(--section-separation);
.widget-title {
//padding-left: 15px;
}
} }
.related-contents { .related-contents {
overflow-x: auto; overflow-x: auto;
//padding: 0 15px;
padding-bottom: 15px; padding-bottom: 15px;
& > .flex { & > .flex {
@ -170,23 +166,19 @@
margin-right: 15px; margin-right: 15px;
flex-shrink: 0; flex-shrink: 0;
overflow: hidden; overflow: hidden;
width: 250px;
@media (max-width: $on-phone) { height: 150px;
height: 250px;
width: 200px;
}
@media (min-width: $on-phone) {
height: 200px;
width: 300px;
}
.article-title { .article-title {
font-size: 1.8rem; font-size: 1.8rem;
margin: 0;
} }
.article-details { &.has-image {
transition: background-color 0.5s ease; .article-details {
padding: 20px;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.75) 100%);
}
} }
} }
} }

2
layouts/partials/article/components/related-contents.html
View File

@ -5,7 +5,7 @@
<div class="related-contents"> <div class="related-contents">
<div class="flex article-list--tile"> <div class="flex article-list--tile">
{{ range . }} {{ range . }}
{{ partial "article-list/tile" (dict "context" . "size" "250x350") }} {{ partial "article-list/tile" (dict "context" . "size" "250x150") }}
{{ end }} {{ end }}
</div> </div>
</div> </div>