diff --git a/assets/base.css b/assets/base.css index 05e086a3403..67a657761e4 100644 --- a/assets/base.css +++ b/assets/base.css @@ -2207,20 +2207,9 @@ input[type='checkbox'] { grid-template-areas: 'left-icon heading icons'; grid-template-columns: 1fr 2fr 1fr; align-items: center; - padding-top: 1rem; - padding-bottom: 1rem; } @media screen and (min-width: 990px) { - .header { - padding-top: 2rem; - padding-bottom: 2rem; - } - - .header--has-menu:not(.header--middle-left) { - padding-bottom: 0; - } - .header--top-left, .header--middle-left:not(.header--has-menu) { grid-template-areas: diff --git a/sections/header.liquid b/sections/header.liquid index 40a6e65deb6..2a2e4720e3b 100644 --- a/sections/header.liquid +++ b/sections/header.liquid @@ -71,6 +71,11 @@ {%- style -%} + .header { + padding-top: {{ section.settings.padding_top | times: 0.5 | round: 0 }}px; + padding-bottom: {{ section.settings.padding_bottom | times: 0.5 | round: 0 }}px; + } + .section-header { margin-bottom: {{ section.settings.margin_bottom | times: 0.75 | round: 0 }}px; } @@ -80,6 +85,13 @@ margin-bottom: {{ section.settings.margin_bottom }}px; } } + + @media screen and (min-width: 990px) { + .header { + padding-top: {{ section.settings.padding_top }}px; + padding-bottom: {{ section.settings.padding_bottom }}px; + } + } {%- endstyle -%} @@ -826,6 +838,30 @@ "unit": "px", "label": "t:sections.header.settings.margin_bottom.label", "default": 0 + }, + { + "type": "header", + "content": "t:sections.all.padding.section_padding_heading" + }, + { + "type": "range", + "id": "padding_top", + "min": 4, + "max": 36, + "step": 4, + "unit": "px", + "label": "t:sections.all.padding.padding_top", + "default": 20 + }, + { + "type": "range", + "id": "padding_bottom", + "min": 4, + "max": 36, + "step": 4, + "unit": "px", + "label": "t:sections.all.padding.padding_bottom", + "default": 20 } ] }