GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2026-03-24 23:15:46 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

tweak mobile styling

Browse Source
This commit is contained in:
Carson Clarke-Magrab 2024-06-13 14:51:35 -04:00
parent 7cb6ca1ffd
commit 9f26a56189
2 changed files with 21 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
quartz/components/RecentBlog.tsx
View File

@ -46,9 +46,12 @@ export default (() => {
<img class="preview-image" src="./Resources/crepuscular_rays_fake.png" width="150" height="150" />
<div class="preview-content">
<div class="preview-title">
<a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
{title}
</a>
<div>
<a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
{title}
</a>
</div>
<i>{parseDate(page.dates?.published!)}</i>
</div>

16
quartz/components/styles/recentblog.scss
View File

@ -1,6 +1,7 @@
.preview {
display: flex;
flex-direction: row;
align-items: baseline;
padding: 16px 16px;
border-style: solid;
@ -11,17 +12,19 @@
& > .preview-image {
margin: 0px 0px;
align-self: center;
}
& > .preview-content {
margin: 0px 10px;
align-self: flex-start;
& > .preview-title {
display: flex;
justify-content: space-between;
margin-top: 6px;
& > a {
& > div a {
font-size: 20;
}
}
@ -31,4 +34,15 @@
margin-top: 4px;
}
}
}
@media (max-width: 767px) {
.preview {
& > .preview-content {
& > .preview-title {
flex-direction: column;
justify-content: unset;
}
}
}
}