Skip to content

Commit 6e29abe

Browse files
peterzimonpeterzimon
authored
Various design improvements (#42)
There are a couple of minor improvements which customers solve at the moment with various hacks and should be part of the theme instead. * Removed max-width from card excerpt * Updated custom theme settings - Added show/hide "Read more" section in posts - Added drop-cap option for posts - Added show/hide metadata for posts * Added lock icon for members-only posts on list * Updated excerpt logic to work with access levels * Fixing missing id's for input fields * Updated secondary color contrast
1 parent dc3e6cb commit 6e29abe

File tree

11 files changed

+80
-34
lines changed

11 files changed

+80
-34
lines changed

‎assets/built/screen.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎assets/built/screen.css.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎assets/css/screen.css‎

Lines changed: 25 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,9 @@ production stylesheet in assets/built/screen.css
5959
--color-darker-gray: #15171a;
6060
--color-black: #000;
6161
--color-primary-text: var(--color-darker-gray);
62-
--color-secondary-text: rgb(0 0 0 / 0.5);
62+
--color-secondary-text: rgb(0 0 0 / 0.55);
6363
--color-border: rgb(0 0 0 / 0.08);
64-
--color-dark-border: rgb(0 0 0 / 0.5);
64+
--color-dark-border: rgb(0 0 0 / 0.55);
6565
--font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
6666
--font-serif: "EB Garamond", Georgia, Times, serif;
6767
--font-serif-alt: Georgia, Times, serif;
@@ -369,7 +369,7 @@ button.gh-form-input {
369369
.gh-form {
370370
font-size: 1.6rem;
371371
}
372-
372+
373373
.gh-form .gh-button {
374374
padding-inline: 12px;
375375
}
@@ -973,7 +973,6 @@ Search LOGO Login Subscribe
973973
display: -webkit-box;
974974
overflow-y: hidden;
975975
margin-top: 8px;
976-
max-width: 720px;
977976
font-size: 1.45rem;
978977
line-height: 1.4;
979978
-webkit-line-clamp: 2;
@@ -984,6 +983,7 @@ Search LOGO Login Subscribe
984983
display: flex;
985984
gap: 4px;
986985
flex-wrap: wrap;
986+
align-items: center;
987987
padding-bottom: 1px;
988988
font-size: 1.25rem;
989989
font-weight: 500;
@@ -992,6 +992,13 @@ Search LOGO Login Subscribe
992992
color: var(--color-secondary-text);
993993
}
994994

995+
.gh-card-meta svg {
996+
width: 16px;
997+
height: 16px;
998+
margin-right: 2px;
999+
margin-top: -2px;
1000+
}
1001+
9951002
.gh-card-meta:not(:empty) {
9961003
margin-top: 12px;
9971004
}
@@ -2128,6 +2135,20 @@ unless a heading is the very first element in the post content */
21282135
margin-top: calc(56px * var(--content-spacing-factor, 1));
21292136
}
21302137

2138+
/* Add drop cap setting */
2139+
.post-template .gh-content.drop-cap > p:first-of-type:first-letter {
2140+
margin :0 0.2em 0em 0;
2141+
font-size: 3.1em;
2142+
float:left;
2143+
line-height: 1;
2144+
margin-left: -1px;
2145+
font-weight: 700;
2146+
}
2147+
2148+
.has-serif-body.post-template .gh-content.drop-cap > p:first-of-type:first-letter {
2149+
font-size: 3.2em;
2150+
}
2151+
21312152
/* Add a small margin between a heading and paragraph after it */
21322153
.gh-content > [id] + p {
21332154
margin-top: calc(12px * var(--content-spacing-factor, 1));

‎package.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -191,6 +191,21 @@
191191
"type": "boolean",
192192
"default": false,
193193
"group": "homepage"
194+
},
195+
"show_post_metadata": {
196+
"type": "boolean",
197+
"default": true,
198+
"group": "post"
199+
},
200+
"enable_drop_caps_on_posts": {
201+
"type": "boolean",
202+
"default": false,
203+
"group": "post"
204+
},
205+
"show_related_articles": {
206+
"type": "boolean",
207+
"default": true,
208+
"group": "post"
194209
}
195210
}
196211
},

‎partials/components/cta.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
{{#if @custom.signup_subheading}}{{@custom.signup_subheading}}{{else}}{{@site.description}}{{/if}}
1515
</p>
1616
</div>
17-
{{> "email-subscription"}}
17+
{{> "email-subscription" email_field_id="cta-email"}}
1818
</div>
1919
</section>
2020
{{/match}}

‎partials/components/footer.hbs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
Powered by <a href="https://ghost.org/" target="_blank" rel="noopener">Ghost</a>
1717
</div>
1818
</div>
19-
19+
2020
{{#if @site.members_enabled}}
2121
{{#unless @member}}
2222
<section class="gh-footer-signup">
@@ -26,7 +26,7 @@
2626
<p class="gh-footer-signup-subhead is-body">
2727
{{#if @custom.signup_subheading}}{{@custom.signup_subheading}}{{else}}{{@site.description}}{{/if}}
2828
</p>
29-
{{> "email-subscription"}}
29+
{{> "email-subscription" email_field_id="footer-email"}}
3030
</section>
3131
{{/unless}}
3232
{{/if}}

‎partials/components/header-content.hbs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<section class="gh-header is-{{#match headerStyle "Magazine"}}magazine{{else match headerStyle "Highlight"}}highlight{{else}}classic{{/match}}{{#if @custom.background_image}}{{#if @site.cover_image}} has-image{{/if}}{{/if}} gh-outer">
2-
2+
33
{{!-- Background image --}}
44
{{#if @custom.background_image}}
55
{{#match headerStyle "!=" "Magazine"}}
@@ -64,7 +64,7 @@
6464
{{!-- Landing layout --}}
6565
{{#match headerStyle "Landing"}}
6666
<h1 class="gh-header-title is-title">{{#if @custom.header_text}}{{@custom.header_text}}{{else}}{{@site.description}}{{/if}}</h1>
67-
{{> "email-subscription"}}
67+
{{> "email-subscription" email_field_id="header-email"}}
6868
{{/match}}
6969

7070
{{!-- Search layout --}}

‎partials/email-subscription.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<form class="gh-form" data-members-form>
2-
<input class="gh-form-input" type="email" placeholder="[email protected]" required data-members-email>
2+
<input class="gh-form-input" id="{{email_field_id}}" type="email" placeholder="[email protected]" required data-members-email>
33
<button class="gh-button" type="submit" aria-label="Subscribe">
44
<span><span>Subscribe</span> {{> "icons/arrow"}}</span>
55
{{> "icons/loader"}}

‎partials/icons/lock.hbs‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1 @@
1-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2-
<path d="M16.25 6.875H3.75C3.40482 6.875 3.125 7.15482 3.125 7.5V16.25C3.125 16.5952 3.40482 16.875 3.75 16.875H16.25C16.5952 16.875 16.875 16.5952 16.875 16.25V7.5C16.875 7.15482 16.5952 6.875 16.25 6.875Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
3-
<path d="M7.1875 6.875V4.0625C7.1875 3.31658 7.48382 2.60121 8.01126 2.07376C8.53871 1.54632 9.25408 1.25 10 1.25C10.7459 1.25 11.4613 1.54632 11.9887 2.07376C12.5162 2.60121 12.8125 3.31658 12.8125 4.0625V6.875" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
4-
<path d="M10 13.125C10.6904 13.125 11.25 12.5654 11.25 11.875C11.25 11.1846 10.6904 10.625 10 10.625C9.30964 10.625 8.75 11.1846 8.75 11.875C8.75 12.5654 9.30964 13.125 10 13.125Z" fill="currentColor"></path>
5-
</svg>
1+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" height="20" width="20" id="Lock-1--Streamline-Ultimate"><defs></defs><title>lock-1</title><path d="M4.375 8.125h11.25s1.25 0 1.25 1.25v8.75s0 1.25 -1.25 1.25H4.375s-1.25 0 -1.25 -1.25v-8.75s0 -1.25 1.25 -1.25" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></path><path d="M5.625 8.125V5a4.375 4.375 0 0 1 8.75 0v3.125" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></path><path d="m10 12.5 0 2.5" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></path></svg>

‎partials/post-card.hbs‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,20 @@
2121
<p class="gh-card-tag">{{primary_tag.name}}</p>
2222
{{/if}}
2323
<h3 class="gh-card-title is-title">{{title}}</h3>
24-
{{#if excerpt}}
25-
<p class="gh-card-excerpt is-body">{{excerpt}}</p>
24+
{{#if custom_excerpt}}
25+
<p class="gh-card-excerpt is-body">{{custom_excerpt}}</p>
2626
{{/if}}
27-
<footer class="gh-card-meta"><!--
27+
{{#unless custom_excerpt}}
28+
{{#if excerpt}}
29+
<p class="gh-card-excerpt is-body">{{excerpt}}</p>
30+
{{/if}}
31+
{{/unless}}
32+
<footer class="gh-card-meta">
33+
{{#unless access}}
34+
{{^has visibility="public"}}
35+
{{> "icons/lock"}}
36+
{{/has}}
37+
{{/unless}}<!--
2838
-->{{#if @custom.show_author}}
2939
<span class="gh-card-author">By {{#foreach authors}}{{#if @first}}{{name}}{{else}}, {{name}}{{/if}}{{/foreach}}</span>
3040
{{/if}}

0 commit comments

Comments
 (0)