troldspejlet/hugo-theme-stack
troldspejlet/hugo-theme-stack
1
0
Fork 0
mirror of https://github.com/CaiJimmy/hugo-theme-stack.git synced 2024-11-23 18:31:45 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

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 {
margin-bottom: var(--section-separation);
.widget-title {
//padding-left: 15px;
}
}
.related-contents {
overflow-x: auto;
//padding: 0 15px;
padding-bottom: 15px;
& > .flex {
@ -170,23 +166,19 @@
margin-right: 15px;
flex-shrink: 0;
overflow: hidden;
@media (max-width: $on-phone) {
height: 250px;
width: 200px;
}
@media (min-width: $on-phone) {
height: 200px;
width: 300px;
}
width: 250px;
height: 150px;
.article-title {
font-size: 1.8rem;
margin: 0;
}
.article-details {
transition: background-color 0.5s ease;
&.has-image {
.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="flex article-list--tile">
{{ range . }}
{{ partial "article-list/tile" (dict "context" . "size" "250x350") }}
{{ partial "article-list/tile" (dict "context" . "size" "250x150") }}
{{ end }}
</div>
</div>