dbrun/blowfish
1
0
Fork 0
mirror of https://github.com/nunocoracao/blowfish.git synced 2026-01-30 15:31:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(header): align width with body

Browse Source 
remove all horizontal padding
align layout padding settings with body
split body classes into three variables
This commit is contained in:
ZhenShuo Leo
2025-10-03 04:00:39 +08:00
parent d4620d5318
commit 9665fe953c
7 changed files with 21 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/compiled/main.css
+7 -17
View File
@@ -1171,9 +1171,6 @@ body.zen-mode-enable {
.mr-5 { .mr-5 {
margin-right: calc(var(--spacing) * 5); margin-right: calc(var(--spacing) * 5);
} }
.mr-auto {
margin-right: auto;
}
.\!mb-0 { .\!mb-0 {
margin-bottom: calc(var(--spacing) * 0) !important; margin-bottom: calc(var(--spacing) * 0) !important;
} }
@@ -1225,9 +1222,6 @@ body.zen-mode-enable {
.ml-3 { .ml-3 {
margin-left: calc(var(--spacing) * 3); margin-left: calc(var(--spacing) * 3);
} }
.ml-auto {
margin-left: auto;
}
.box-border { .box-border {
box-sizing: border-box; box-sizing: border-box;
} }
@@ -1455,9 +1449,6 @@ body.zen-mode-enable {
.max-w-\[5rem\] { .max-w-\[5rem\] {
max-width: 5rem; max-width: 5rem;
} }
.max-w-\[64rem\] {
max-width: 64rem;
}
.max-w-\[200px\] { .max-w-\[200px\] {
max-width: 200px; max-width: 200px;
} }
@@ -2091,15 +2082,12 @@ body.zen-mode-enable {
.pt-\[5px\] { .pt-\[5px\] {
padding-top: 5px; padding-top: 5px;
} }
.pr-0 { .pr-2 {
padding-right: calc(var(--spacing) * 0); padding-right: calc(var(--spacing) * 2);
} }
.pr-8 { .pr-8 {
padding-right: calc(var(--spacing) * 8); padding-right: calc(var(--spacing) * 8);
} }
.pr-\[24px\] {
padding-right: 24px;
}
.pb-0 { .pb-0 {
padding-bottom: calc(var(--spacing) * 0); padding-bottom: calc(var(--spacing) * 0);
} }
@@ -2127,9 +2115,6 @@ body.zen-mode-enable {
.pl-4 { .pl-4 {
padding-left: calc(var(--spacing) * 4); padding-left: calc(var(--spacing) * 4);
} }
.pl-\[24px\] {
padding-left: 24px;
}
.text-center { .text-center {
text-align: center; text-align: center;
} }
@@ -3049,6 +3034,11 @@ body.zen-mode-enable {
padding-inline: calc(var(--spacing) * 24); padding-inline: calc(var(--spacing) * 24);
} }
} }
.md\:pr-4 {
@media (width >= 853px) {
padding-right: calc(var(--spacing) * 4);
}
}
.lg\:absolute { .lg\:absolute {
@media (width >= 1024px) { @media (width >= 1024px) {
position: absolute; position: absolute;
layouts/_default/baseof.html
+4 -3
View File
@@ -7,9 +7,10 @@
data-auto-appearance="{{ site.Params.autoSwitchAppearance | default `true` }}"> data-auto-appearance="{{ site.Params.autoSwitchAppearance | default `true` }}">
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
{{ $bodyLayout := "flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32" }}
<body {{ $bodyColor := "text-lg bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral" }}
class="flex flex-col h-screen px-6 m-auto text-lg leading-7 max-w-7xl bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral sm:px-14 md:px-24 lg:px-32 scrollbar-thin scrollbar-track-neutral-200 scrollbar-thumb-neutral-400 dark:scrollbar-track-neutral-800 dark:scrollbar-thumb-neutral-600"> {{ $bodyScrollbar := "scrollbar-thin scrollbar-track-neutral-200 scrollbar-thumb-neutral-400 dark:scrollbar-track-neutral-800 dark:scrollbar-thumb-neutral-600" }}
<body class="{{ $bodyLayout }} {{ $bodyColor }} {{ $bodyScrollbar }}">
<div id="the-top" class="absolute flex self-center"> <div id="the-top" class="absolute flex self-center">
<a <a
class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600" class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600"
layouts/partials/header/basic.html
+1 -1
View File
@@ -243,7 +243,7 @@
{{/* ========== Render HTML ========== */}} {{/* ========== Render HTML ========== */}}
<div <div
class="main-menu flex items-center justify-between px-4 py-6 sm:px-6 md:justify-start gap-x-3 pt-[2px] pr-0 pb-[3px] pl-0"> class="main-menu flex items-center justify-between py-6 md:justify-start gap-x-3 pt-[2px] pr-2 md:pr-4 pb-[3px] pl-0">
{{ template "HeaderLogo" . }} {{ template "HeaderLogo" . }}
<div class="flex flex-1 items-center justify-between"> <div class="flex flex-1 items-center justify-between">
<nav class="flex space-x-3"> <nav class="flex space-x-3">
layouts/partials/header/fixed-fill-blur.html
+2 -2
View File
@@ -1,9 +1,9 @@
<div class="min-h-[148px]"></div> <div class="min-h-[148px]"></div>
<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100"> <div class="fixed inset-x-0 z-100">
<div <div
id="menu-blur" id="menu-blur"
class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom bg-neutral dark:bg-neutral-800"></div> class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom bg-neutral dark:bg-neutral-800"></div>
<div class="relative max-w-[64rem] ml-auto mr-auto"> <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
{{ partial "header/basic.html" . }} {{ partial "header/basic.html" . }}
</div> </div>
</div> </div>
layouts/partials/header/fixed-fill.html
+2 -2
View File
@@ -1,6 +1,6 @@
<div class="min-h-[148px]"></div> <div class="min-h-[148px]"></div>
<div class="fixed inset-x-0 pl-[24px] pr-[24px] bg-neutral dark:bg-neutral-800 z-100"> <div class="fixed inset-x-0 bg-neutral dark:bg-neutral-800 z-100">
<div class="relative max-w-[64rem] ml-auto mr-auto"> <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
{{ partial "header/basic.html" . }} {{ partial "header/basic.html" . }}
</div> </div>
</div> </div>
layouts/partials/header/fixed-gradient.html
+3 -3
View File
@@ -1,11 +1,11 @@
<div class="min-h-[148px]"></div> <div class="min-h-[148px]"></div>
<div <div
class="fixed inset-x-0 min-h-[130px] opacity-65 pl-[24px] pr-[24px] bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal z-80"></div> class="fixed inset-x-0 min-h-[130px] opacity-65 bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal z-80"></div>
<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100"> <div class="fixed inset-x-0 z-100">
<div <div
id="menu-blur" id="menu-blur"
class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div> class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
<div class="relative max-w-[64rem] ml-auto mr-auto"> <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
{{ partial "header/basic.html" . }} {{ partial "header/basic.html" . }}
</div> </div>
</div> </div>
layouts/partials/header/fixed.html
+2 -2
View File
@@ -1,9 +1,9 @@
<div class="min-h-[148px]"></div> <div class="min-h-[148px]"></div>
<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100"> <div class="fixed inset-x-0 z-100">
<div <div
id="menu-blur" id="menu-blur"
class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div> class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
<div class="relative max-w-[64rem] ml-auto mr-auto"> <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
{{ partial "header/basic.html" . }} {{ partial "header/basic.html" . }}
</div> </div>
</div> </div>