themes/default/layouts/_default/baseof: Rebase columns

5 files changed, 52 insertions, 56 deletions

diff --git a/assets/css/default.css b/assets/css/default.css
index 2414d92..5f4f37e 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -598,7 +598,7 @@ document-attachment object p {
   margin: 1rem;
 }
 
-column-left nav {
+column-base[position="left"] nav {
   position: sticky;
   position: -webkit-sticky;
   align-self: flex-start;
@@ -606,7 +606,7 @@ column-left nav {
   text-align: right;
 }
 
-column-left nav a {
+column-base[position="left"] nav a {
   align-items: center;
   color: inherit;
   color: var(--foreground);
@@ -618,26 +618,26 @@ column-left nav a {
   border-radius: 0.5rem;
 }
 
-column-left nav li {
+column-base[position="left"] nav li {
   margin-bottom: 0.25rem;
 }
 
-column-left nav li:hover a {
+column-base[position="left"] nav li:hover a {
   background-color: #eee;
   background-color: var(--hover-background);
   border-radius: 0.5rem;
 }
 
-column-left nav li:hover svg {
+column-base[position="left"] nav li:hover svg {
   fill: #cce1ff;
   fill: var(--active-background-alternate);
 }
 
-column-left nav a span {
+column-base[position="left"] nav a span {
   padding: 0 1rem;
 }
 
-column-left nav a svg {
+column-base[position="left"] nav a svg {
   height: 1.5795rem;
   width: 1.5795rem;
 }
@@ -919,22 +919,22 @@ body[data-document="xhtml"] {
   max-width: 1250px;
 }
 
-column-left {
+column-base[position="left"] {
   display: flex;
   width: 14.25%;
   justify-content: flex-end;
 }
 
-column-right {
+column-base[position="right"] {
   width: 28%;
 }
 
-column-left,
-column-right {
+column-base[position="left"],
+column-base[position="right"] {
   margin: 0.5rem 2rem;
 }
 
-column-middle {
+column-base[position="middle"] {
   max-width: 600px;
   min-height: 100vh;
   width: 100%;
@@ -1396,7 +1396,7 @@ tab-bar nav a:hover {
   text-decoration: underline;
 }
 
-column-middle main > nav {
+column-base[position="middle"] main > nav {
   align-items: center;
   background-color: #fefefe;
   background-color: var(--background);
@@ -1412,27 +1412,27 @@ column-middle main > nav {
   height: 4rem;
 }
 
-column-middle main > nav section h2,
-column-middle main > nav section small {
+column-base[position="middle"] main > nav section h2,
+column-base[position="middle"] main > nav section small {
   margin: 0;
 }
 
 micro-author micro-header h2,
 micro-author micro-header h3,
 micro-author micro-header time,
-column-middle main > nav section h2,
-column-middle main > nav section small {
+column-base[position="middle"] main > nav section h2,
+column-base[position="middle"] main > nav section small {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-column-middle main > nav section {
+column-base[position="middle"] main > nav section {
   line-height: 1.25;
   padding: 0 0.5rem;
 }
 
-column-middle main > footer {
+column-base[position="middle"] main > footer {
   margin: 1rem 0;
 }
 
@@ -2122,7 +2122,7 @@ li:target [role="doc-backlink"][href^="#fnref\:"] {
   display: block;
 }
 
-[xml-data] column-middle nav section {
+[xml-data] column-base[position="middle"] nav section {
   flex-grow: 1;
 }
 
@@ -2141,33 +2141,33 @@ li:target [role="doc-backlink"][href^="#fnref\:"] {
 /* ----- Responsive ----- */
 
 @media screen and (max-width: 1220px) {
-  column-left {
+  column-base[position="left"] {
     flex: none;
     margin: 0.5rem;
   }
-  column-left nav a {
+  column-base[position="left"] nav a {
     flex-direction: column-reverse;
     justify-content: center;
     white-space: nowrap;
     overflow: hidden;
   }
-  column-left nav a span {
+  column-base[position="left"] nav a span {
     padding-top: 0.5rem;
   }
 }
 
 @media screen and (max-width: 1055px) {
-  column-left,
+  column-base[position="left"],
   search-entry,
-  column-middle main > nav section {
+  column-base[position="middle"] main > nav section {
     display: none;
   }
-  column-middle main > nav {
+  column-base[position="middle"] main > nav {
     justify-content: space-between;
     overflow-x: auto;
     overflow-y: hidden;
   }
-  column-middle main > nav icon-navigator[hidden] {
+  column-base[position="middle"] main > nav icon-navigator[hidden] {
     display: inline;
   }
   tag-deck {
@@ -2176,14 +2176,14 @@ li:target [role="doc-backlink"][href^="#fnref\:"] {
 }
 
 @media screen and (max-width: 925px) {
-  column-right {
+  column-base[position="right"] {
     display: none;
   }
-  column-middle {
+  column-base[position="middle"] {
     display: block;
     max-width: 100%;
   }
-  column-middle main > nav {
+  column-base[position="middle"] main > nav {
     position: fixed;
     box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
   }
@@ -2236,11 +2236,11 @@ li:target [role="doc-backlink"][href^="#fnref\:"] {
   tab-bar:focus,
   tab-bar:focus-within,
   tab-bar:focus-visible,
-  column-middle main > nav:active,
-  column-middle main > nav:hover,
-  column-middle main > nav:focus,
-  column-middle main > nav:focus-within,
-  column-middle main > nav:focus-visible {
+  column-base[position="middle"] main > nav:active,
+  column-base[position="middle"] main > nav:hover,
+  column-base[position="middle"] main > nav:focus,
+  column-base[position="middle"] main > nav:focus-within,
+  column-base[position="middle"] main > nav:focus-visible {
     box-shadow: 1rem -0.2rem 1rem -1rem inset, -1rem -0.2rem 1rem -1rem inset;
   }
 }
@@ -2273,7 +2273,7 @@ li:target [role="doc-backlink"][href^="#fnref\:"] {
     display: none;
   }
   main > footer,
-  column-middle main > nav,
+  column-base[position="middle"] main > nav,
   navigation-separator hr[hidden] {
     display: none;
   }
diff --git a/themes/default/layouts/_default/baseof.html b/themes/default/layouts/_default/baseof.html
index d479454..e2b05fe 100644
--- a/themes/default/layouts/_default/baseof.html
+++ b/themes/default/layouts/_default/baseof.html
@@ -28,24 +28,24 @@
       <a href="#main">Skip to main content</a>
     </skip-link>
 
-    <column-left>
+    <column-base position="left">
       {{- partial "navigator-left.html" . -}}
-    </column-left>
+    </column-base>
 
-    <column-middle>
+    <column-base position="middle">
       <main id="main">
         {{- block "middle" . -}}
           <footer>Silence is golden.</footer>
         {{- end -}}
         {{- partial "base-footer.html" . -}}
       </main>
-    </column-middle>
+    </column-base>
 
-    <column-right>
+    <column-base position="right">
       {{- block "right" . -}}
         <footer>Silence is golden.</footer>
       {{- end -}}
-    </column-right>
+    </column-base>
   </body>
 </html>
 {{- end -}}
diff --git a/themes/default/layouts/_default/home.xslt.rss.xsl b/themes/default/layouts/_default/home.xslt.rss.xsl
index 42afeb9..5735fc0 100644
--- a/themes/default/layouts/_default/home.xslt.rss.xsl
+++ b/themes/default/layouts/_default/home.xslt.rss.xsl
@@ -16,9 +16,8 @@
         {{- partial "base-css.html" . -}}
       </head>
       <body data-document="xhtml">
-        <column-left>
-        </column-left>
-        <column-middle>
+        <column-base position="left"></column-base>
+        <column-base position="middle">
          <main>
           <nav>
             <icon-button>
@@ -99,9 +98,8 @@
           </micro-card>
           </xsl:for-each>
           </main>
-        </column-middle>
-        <column-right>
-        </column-right>
+        </column-base>
+        <column-base position="right"></column-base>
       </body>
     </html>
   </xsl:template>
diff --git a/themes/default/layouts/_default/home.xslt.sitemap.xsl b/themes/default/layouts/_default/home.xslt.sitemap.xsl
index 9a074c9..6d7b03c 100644
--- a/themes/default/layouts/_default/home.xslt.sitemap.xsl
+++ b/themes/default/layouts/_default/home.xslt.sitemap.xsl
@@ -14,9 +14,8 @@
         {{- partial "base-css.html" . -}}
       </head>
       <body data-document="xhtml">
-        <column-left>
-        </column-left>
-        <column-middle>
+        <column-base position="left"></column-base>
+        <column-base position="middle">
           <main>
             <nav>
               <icon-button>
@@ -83,9 +82,8 @@
               </table>
             </section>
           </main>
-        </column-middle>
-        <column-right>
-        </column-right>
+        </column-base>
+        <column-base position="right"></column-base>
       </body>
     </html>
   </xsl:template>
diff --git a/themes/default/layouts/partials/styles-navigator.html b/themes/default/layouts/partials/styles-navigator.html
index 80ebcd6..b7bb3f0 100644
--- a/themes/default/layouts/partials/styles-navigator.html
+++ b/themes/default/layouts/partials/styles-navigator.html
@@ -1,9 +1,9 @@
 icon-navigator a[href="{{ "" | absURL }}{{ .Link }}"],
-column-left nav a[href="{{ "" | absURL }}{{ .Link }}"] {
+column-base[position="left"] nav a[href="{{ "" | absURL }}{{ .Link }}"] {
   font-weight: 700;
 }
 
-column-left nav a[href="{{ "" | absURL }}{{ .Link }}"] {
+column-base[position="left"] nav a[href="{{ "" | absURL }}{{ .Link }}"] {
   background-color: #f0f6ff;
   background-color: var(--hover-background-alternate);
 }