miki

commit 48c426693e94096a827371155befde2b5fcc4727
parent af396c28024bc1345812a47cbe0512b13de76e41
Author: weetat <wtenison@protonmail.com>
Date:   Thu, 13 Feb 2025 18:29:15 +0000

Structured header content flow.

Diffstat:
M
web/index.html
 | 
8
++++++--
M
web/styles.css
 | 
17
+++++++++++++----

2 files changed, 19 insertions(+), 6 deletions(-)
diff --git a/web/index.html b/web/index.html
@@ -10,9 +10,13 @@
 <body>
 
     <header>
-        <div class="_content">
+        <section class="_content">
 
-        </div>
+            <div id="left">MENU</div>
+            <div id="title">TEST</div>
+            <div id="right">SEARCH</div>
+
+        </section>
     </header>
 
     <section class="_content">
diff --git a/web/styles.css b/web/styles.css
@@ -97,17 +97,19 @@
         left: 0;
 
         display: grid;
+        justify-content: center;
 
         color: var(--color__ff);
         background-color: var(--color__bf);
 
         >._content {
-            width: min(100vw, var(--miki_page__max-width));
-            display: grid;
-            justify-self: center;
+            width: min(100vw, var(--miki_page__max-width)); 
+
+            display: inline-grid;
+            grid-auto-flow: column;
+            justify-content: space-between;
             justify-items: center;
             align-items: center;
-            grid-template-columns: auto minmax(0, 100%) auto;
         }
 
         a {
@@ -115,9 +117,16 @@
         }
 
         #title {
+            position: absolute;
             font-size: calc(var(--miki_header__height) * .33);
         }
 
+        #left {
+        }
+
+        #right {
+        }
+
         .collapsible_ {
             >._button {
                 padding: var(--miki_padding);