mirror of
https://github.com/fleetdm/fleet
synced 2026-05-23 00:49:03 +00:00
Website: Update article template (#36924)
Closes: #35379 Changes: - Added "Last updated on" to the publish date on article pages and updated the layout of the article details section on mobile devices (<575px screen width).
This commit is contained in:
parent
d83c30761b
commit
240d58b686
2 changed files with 18 additions and 6 deletions
|
|
@ -425,6 +425,7 @@
|
|||
[purpose='article-details'] {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
flex-direction: row;
|
||||
span {
|
||||
color: @core-fleet-black-50;
|
||||
}
|
||||
|
|
@ -901,6 +902,15 @@
|
|||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
[purpose='article-details'] {
|
||||
flex-direction: column;
|
||||
[purpose='divider'] {
|
||||
display: none;
|
||||
}
|
||||
[purpose='article-author'] {
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 375px) {
|
||||
|
|
|
|||
14
website/views/pages/articles/basic-article.ejs
vendored
14
website/views/pages/articles/basic-article.ejs
vendored
|
|
@ -33,11 +33,13 @@
|
|||
<h2 v-if="articleHasSubtitle && articleSubtitle !== undefined">{{articleSubtitle}}</h2>
|
||||
</div>
|
||||
<div class="d-flex flex-sm-row flex-column justify-content-between align-items-sm-center">
|
||||
<div purpose="article-details" class="d-flex flex-row align-items-center">
|
||||
<span><js-timestamp format="billing" :at="thisPage.meta.publishedOn"></js-timestamp></span>
|
||||
<span class="px-2">|</span>
|
||||
<img style="height: 28px; width: 28px; border-radius: 100%;" alt="The author's GitHub profile picture" :src="'https://github.com/'+thisPage.meta.authorGitHubUsername+'.png?size=200'">
|
||||
<p class="pl-2 font-weight-bold"><%=thisPage.meta.authorFullName %></p>
|
||||
<div purpose="article-details" class="d-flex align-items-sm-center">
|
||||
<span>Last updated on <js-timestamp format="billing" :at="thisPage.meta.publishedOn"></js-timestamp></span>
|
||||
<span purpose="divider" class="px-2">|</span>
|
||||
<div purpose="article-author" class="d-flex flex-row align-items-center">
|
||||
<img style="height: 28px; width: 28px; border-radius: 100%;" alt="The author's GitHub profile picture" :src="'https://github.com/'+thisPage.meta.authorGitHubUsername+'.png?size=200'">
|
||||
<p class="pl-2 font-weight-bold"><%=thisPage.meta.authorFullName %></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -110,7 +112,7 @@
|
|||
</div>
|
||||
<div class="d-flex flex-sm-row flex-column justify-content-between align-items-sm-center">
|
||||
<div purpose="article-details" class="d-flex flex-row align-items-center">
|
||||
<span><js-timestamp format="billing" :at="thisPage.meta.publishedOn"></js-timestamp></span>
|
||||
<span>Last updated on <js-timestamp format="billing" :at="thisPage.meta.publishedOn"></js-timestamp></span>
|
||||
<span class="px-2">|</span>
|
||||
<img style="height: 28px; width: 28px; border-radius: 100%;" alt="The author's GitHub profile picture" :src="'https://github.com/'+thisPage.meta.authorGitHubUsername+'.png?size=200'">
|
||||
<p class="pl-2 font-weight-bold"><%=thisPage.meta.authorFullName %></p>
|
||||
|
|
|
|||
Loading…
Reference in a new issue