create-riebeckite 0.0.27 → 0.0.29

package/templates/scaffold/presets/starter/app/style.css

@@ -2,17 +2,6 @@
 @import "./.riebeckite/plugin-styles.css";
 @import "./.riebeckite/theme-styles.css";
 
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-
-body {
-  margin: 0;
-  font-family: system-ui, sans-serif;
-}
-
 .riebeckite-page {
   --site-toc-sticky-top: var(--rb-space-3, 1.5rem);
   display: flex;
@@ -43,7 +32,7 @@ body {
 }
 
 .site-header,
-.rb-site-footer {
+.site-footer {
   width: min(100% - 2rem, var(--rb-layout-page-max, 80rem));
 }
 
@@ -57,51 +46,17 @@ body {
   text-decoration: none;
 }
 
-.rb-nav {
-  color: var(--rb-color-ink);
-}
-
-.rb-nav > .rb-nav__list {
-  display: flex;
-  align-items: center;
-  gap: var(--rb-space-3, 1.5rem);
-}
-
-.rb-nav__link {
-  color: inherit;
-  text-decoration: none;
-}
-
-.rb-nav__link:hover,
-.rb-nav__link:focus-visible,
-.rb-nav__link--active {
-  color: var(--rb-color-accent);
-}
-
-.rb-nav__link:focus-visible,
-.rb-nav__toggle:focus-visible {
-  outline: 2px solid var(--rb-color-accent);
-  outline-offset: 2px;
-}
-
-.rb-nav__children {
-  padding: var(--rb-space-2, 1rem);
-  background: var(--rb-color-surface);
-  border: 1px solid var(--rb-color-border);
-}
-
-.rb-nav__mobile {
+.site-header__mobile-navigation {
   display: none;
 }
 
-.rb-site-footer {
+.site-footer {
   margin-top: 1rem;
   border-top: 1px solid var(--rb-color-border);
 }
 
 @media (min-width: 30.001rem) and (max-width: 48rem) {
-  .rb-site-header,
-  .rb-nav > .rb-nav__list {
+  .site-header {
     flex-wrap: wrap;
   }
 }
@@ -111,51 +66,17 @@ body {
     padding-block: var(--rb-space-3, 1.5rem);
   }
 
-  .rb-site-header {
+  .site-header {
     flex-wrap: wrap;
   }
 
-  .rb-site-header > .rb-nav {
+  .site-header__primary-navigation {
     display: none;
   }
 
-  .rb-nav__mobile {
-    position: relative;
+  .site-header__mobile-navigation {
     display: block;
   }
-
-  .rb-nav__mobile > .rb-nav {
-    position: absolute;
-    z-index: 10;
-    top: calc(100% + var(--rb-space-2, 1rem));
-    right: 0;
-    min-width: 12rem;
-    padding: var(--rb-space-3, 1.5rem);
-    background: var(--rb-color-surface);
-    border: 1px solid var(--rb-color-border);
-    box-shadow: 0 4px 12px
-      color-mix(in oklab, var(--rb-color-ink) 14%, transparent);
-  }
-
-  .rb-nav__mobile .rb-nav__list,
-  .rb-nav__mobile .rb-nav__children {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-start;
-    gap: var(--rb-space-2, 1rem);
-  }
-
-  .rb-nav__mobile .rb-nav__list {
-    padding: 0;
-  }
-
-  .rb-nav__mobile .rb-nav__children {
-    position: static;
-    margin-top: var(--rb-space-2, 1rem);
-    padding: 0;
-    background: transparent;
-    border: 0;
-  }
 }
 
 .site-header__logo {
@@ -187,19 +108,24 @@ body {
   display: none;
 }
 
-@media (min-width: 64rem) {
+@media (min-width: 80rem) {
   .site-article__layout {
     display: grid;
     width: 100%;
-    grid-template-columns: minmax(0, var(--rb-layout-article-max, 48rem)) minmax(0, var(--rb-layout-sidebar, 14rem));
-    gap: var(--rb-layout-gap, 2rem);
+    grid-template-columns: minmax(0, 1fr) minmax(0, var(--rb-layout-article-max, 48rem)) minmax(0, 1fr);
     align-items: start;
   }
 
+  .site-article__layout > .rb-article-body {
+    grid-column: 2;
+  }
+
   .site-article__aside {
     display: block;
     min-width: 0;
     align-self: stretch;
+    grid-column: 3;
+    padding-inline-start: var(--rb-layout-gap, 2rem);
   }
 
   .site-article__aside > .rr-table-of-contents--desktop {