Cleanup header style

This commit is contained in:
Sodbileg Gansukh 2022-05-14 23:10:43 +08:00
parent 4c8ccde081
commit 6c922fca35
6 changed files with 33 additions and 24 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -117,6 +117,8 @@ production stylesheet in assets/built/screen.css
.site-header-content.vertical {
align-items: center;
padding-top: 84px;
padding-bottom: 32px;
}
.has-cover-image .site-header-content {
@ -142,10 +144,17 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
text-align: center;
}
.site-icon {
.site-logo {
flex-shrink: 0;
width: 120px;
height: 120px;
object-fit: contain;
}
.site-header-content.vertical .site-logo {
width: auto;
height: auto;
max-height: 120px;
}
.site-title {
@ -164,6 +173,11 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
line-height: 1.3;
}
.site-header-content.vertical .site-description {
margin-top: 0;
padding-bottom: 32px;
}
@media (max-width: 600px) {
.site-description {
max-width: 80vmin;
@ -217,18 +231,17 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
.gh-head-logo {
display: block;
padding: 10px 0;
font-weight: 800;
font-size: 2.6rem;
letter-spacing: -0.02em;
}
.home-template .gh-head-logo {
.no-logo .gh-head-logo {
display: none;
}
.gh-head-logo img {
max-height: 26px;
max-height: 40px;
}
@ -241,7 +254,7 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
font-weight: 500;
}
.home-template .gh-head-menu {
.no-logo .gh-head-menu {
margin-left: -32px;
}
@ -249,13 +262,14 @@ body:not(.has-cover-image) .site-header-content:not(.vertical) {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
gap: 24px;
list-style: none;
margin: 0;
padding: 0;
}
.gh-head-menu .nav li {
margin: 0 32px 0 0;
margin: 0;
padding: 0;
}
@ -330,7 +344,7 @@ a.gh-head-button {
padding: 8px 16px;
height: 40px;
font-weight: 600;
letter-spacing: -0.01em;
letter-spacing: -0.005em;
font-size: 1.5rem;
border-radius: 6px;
color: #fff;

View file

@ -27,7 +27,7 @@
{{ghost_head}}
</head>
<body class="{{body_class}}{{#match @custom.title_font "=" "Elegant serif"}} has-serif-title{{/match}}{{#match @custom.body_font "=" "Modern sans-serif"}} has-sans-body{{/match}}{{#if @site.cover_image}} has-cover-image{{/if}}">
<body class="{{body_class}}{{#match @custom.title_font "=" "Elegant serif"}} has-serif-title{{/match}}{{#match @custom.body_font "=" "Modern sans-serif"}} has-sans-body{{/match}}{{#if @site.cover_image}} has-cover-image{{/if}}{{#is "home"}}{{#match @custom.identity "!=" "None"}}{{#if @custom.include_logo_in_identity}} no-logo{{/if}}{{/match}}{{/is}}">
<div class="viewport">
<header id="gh-head" class="gh-head outer">

View file

@ -20,8 +20,10 @@ into the {body} of the default.hbs template --}}
{{#match @custom.identity "!=" "None"}}
<section class="site-header-inner inner">
{{#if @site.icon}}
<img class="site-icon" src="{{@site.icon}}" alt="{{@site.title}}">
{{#if @custom.include_logo_in_identity}}
{{#if @site.logo}}
<img class="site-logo" src="{{@site.logo}}" alt="{{@site.title}}">
{{/if}}
{{/if}}
<div class="site-header-wrapper">
{{#match @custom.identity "Horizontal"}}

View file

@ -115,6 +115,11 @@
"default": "Horizontal",
"group": "homepage"
},
"include_logo_in_identity": {
"type": "boolean",
"default": true,
"group": "homepage"
},
"feed_layout": {
"type": "select",
"options": [
@ -134,18 +139,6 @@
],
"default": "Light"
},
"header_button_background": {
"type": "color",
"default": "#ffffff"
},
"header_button_text_color": {
"type": "select",
"options": [
"Light",
"Dark"
],
"default": "Dark"
},
"post_image_width": {
"type": "select",
"options": [