simon/ghost-theme-sd.ai
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed inconsistent width issue on tag/author templates

Browse Source
This commit is contained in:
Sodbileg Gansukh
2023-08-22 19:04:16 +08:00
parent 4335416f75
commit 1b3d1a6a8f
5 changed files with 67 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/built/screen.css
+1 -1
View File
File diff suppressed because one or more lines are too long
assets/built/screen.css.map
+1 -1
View File
File diff suppressed because one or more lines are too long
assets/css/screen.css
+27 -12
View File
@@ -1534,12 +1534,6 @@ Search LOGO Login Subscribe
}
}
@media (max-width: 767px) {
.gh-container-inner {
display: block;
}
}
/* 12. Post list
/* ---------------------------------------------------------- */
@@ -2225,16 +2219,31 @@ figcaption a {
.gh-archive {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-columns: repeat(16, 1fr);
gap: var(--grid-gap);
margin-block: 80px 24px;
}
.gh-archive.has-image {
margin-top: 48px;
}
.gh-archive-inner {
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--grid-gap);
grid-column: 1 / -1;
padding-bottom: clamp(40px, 2.73vw + 29.09px, 64px);
border-bottom: 1px solid var(--color-border);
}
.gh-archive.has-image {
.gh-archive.has-image .gh-archive-inner {
align-items: center;
margin-top: 24px;
grid-column: 1 / -1;
}
.gh-archive:not(.has-sidebar):not(.has-image) .gh-archive-inner {
grid-column: 3 / span 12;
}
.gh-archive .gh-article-image {
@@ -2246,7 +2255,7 @@ figcaption a {
margin-top: 0;
}
.author-template .gh-archive {
.author-template .gh-archive-inner {
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
@@ -2289,14 +2298,20 @@ figcaption a {
height: 20px;
}
@media (max-width: 767px) {
@media (max-width: 1199px) {
.gh-archive {
display: block;
}
}
@media (max-width: 767px) {
.gh-archive-inner {
display: flex;
flex-direction: column-reverse;
align-items: flex-start;
}
.author-template .gh-archive {
.author-template .gh-archive-inner {
flex-direction: column-reverse;
}
}
author.hbs
+28 -26
View File
@@ -4,35 +4,37 @@
<main class="gh-main gh-outer">
{{#author}}
<section class="gh-archive gh-inner">
<div class="gh-archive-wrapper">
<h1 class="gh-article-title is-title">
{{#if website}}
<a class="gh-author-social-link" href="{{website}}" target="_blank" rel="noopener">{{name}}</a>
{{else}}
{{name}}
<section class="gh-archive{{#if @custom.show_sidebar}} has-sidebar{{/if}} gh-inner">
<div class="gh-archive-inner">
<div class="gh-archive-wrapper">
<h1 class="gh-article-title is-title">
{{#if website}}
<a class="gh-author-social-link" href="{{website}}" target="_blank" rel="noopener">{{name}}</a>
{{else}}
{{name}}
{{/if}}
</h1>
{{#if bio}}
<p class="gh-article-excerpt">{{bio}}</p>
{{/if}}
</h1>
{{#if bio}}
<p class="gh-article-excerpt">{{bio}}</p>
<footer class="gh-author-meta">
<div class="gh-author-social">
{{#if facebook}}
<a class="gh-author-social-link" href="{{facebook_url}}" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
{{/if}}
{{#if twitter}}
<a class="gh-author-social-link" href="{{twitter_url}}" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
{{/if}}
</div>
{{#if location}}
<div class="gh-author-location">{{location}}</div>
{{/if}}
</footer>
</div>
{{#if profile_image}}
<img class="gh-article-image" src="{{img_url profile_image size="s"}}" alt="{{name}}">
{{/if}}
<footer class="gh-author-meta">
<div class="gh-author-social">
{{#if facebook}}
<a class="gh-author-social-link" href="{{facebook_url}}" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
{{/if}}
{{#if twitter}}
<a class="gh-author-social-link" href="{{twitter_url}}" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
{{/if}}
</div>
{{#if location}}
<div class="gh-author-location">{{location}}</div>
{{/if}}
</footer>
</div>
{{#if profile_image}}
<img class="gh-article-image" src="{{img_url profile_image size="s"}}" alt="{{name}}">
{{/if}}
</section>
{{/author}}
tag.hbs
+10 -8
View File
@@ -4,14 +4,16 @@
<main class="gh-main gh-outer">
{{#tag}}
<section class="gh-archive{{#if feature_image}} has-image{{/if}} gh-inner">
<header class="gh-archive-wrapper">
<h1 class="gh-article-title is-title">{{name}}</h1>
{{#if description}}
<p class="gh-article-excerpt">{{description}}</p>
{{/if}}
</header>
{{> "feature-image"}}
<section class="gh-archive{{#if feature_image}} has-image{{/if}}{{#if @custom.show_sidebar}} has-sidebar{{/if}} gh-inner">
<div class="gh-archive-inner">
<header class="gh-archive-wrapper">
<h1 class="gh-article-title is-title">{{name}}</h1>
{{#if description}}
<p class="gh-article-excerpt">{{description}}</p>
{{/if}}
</header>
{{> "feature-image"}}
</div>
</section>
{{/tag}}