diff --git a/editor-style.css b/editor-style.css index 42e998b..a06d287 100644 --- a/editor-style.css +++ b/editor-style.css @@ -50,10 +50,6 @@ body.editor-styles-wrapper { margin: 0 auto; background: #f8f5f0; color: #1d1b19; - font-family: "Crimson Pro", Georgia, serif; - font-size: clamp(1.25rem, 1.1rem + 0.4vw, 1.5rem); - font-weight: 400; - line-height: 1.55; } .editor-styles-wrapper, @@ -62,7 +58,6 @@ body.editor-styles-wrapper { } - /* * Gutenberg's visual editor uses this wrapper (rather than ) as its canvas. * Apply the frontend reading scale here so blocks do not inherit the admin's 16px UI size. @@ -105,7 +100,6 @@ body.editor-styles-wrapper { max-width: none !important; } - .editor-styles-wrapper a { color: #c3480b; text-decoration-thickness: 0.08em; @@ -179,13 +173,20 @@ body.editor-styles-wrapper { font-size: 0.8em; } +/* Mirror the frontend rule: block-code text should not receive two relative reductions. */ +.editor-styles-wrapper pre code, +.editor-styles-wrapper .wp-block-code code { + font-size: inherit !important; +} + .editor-styles-wrapper pre, .editor-styles-wrapper .wp-block-code { padding: 1rem 1.2rem; overflow: auto; + border: 1px solid #d5d0c8; border-radius: 2px; - background: #282623; - color: #f5eee5; + background: #faf8f5; + color: #272822; } .editor-styles-wrapper :not(pre) > code { @@ -195,10 +196,11 @@ body.editor-styles-wrapper { background: #fffdf9; } -.editor-styles-wrapper .wp-element-caption { +.editor-styles-wrapper .wp-element-caption, +.editor-styles-wrapper .wp-caption-text { color: #706a63; font-family: "Berkeley Mono", monospace; - font-size: 0.68rem; + font-size: 1rem; } .editor-styles-wrapper hr, @@ -215,7 +217,7 @@ body.editor-styles-wrapper { background: #c3480b; color: #fff; font-family: "Berkeley Mono", monospace; - font-size: 0.75rem; + font-size: 1rem; letter-spacing: 0.04em; } @@ -241,10 +243,19 @@ body.editor-styles-wrapper { text-align: left; } -.editor-styles-wrapper .wp-block-table th, -.editor-styles-wrapper .wp-block-quote__citation, -.editor-styles-wrapper .wp-block-pullquote__citation { +.editor-styles-wrapper .wp-block-table th { font-family: "Berkeley Mono", monospace; + font-size: 1em; +} + +.editor-styles-wrapper .wp-block-quote__citation, +.editor-styles-wrapper .wp-block-pullquote__citation, +.editor-styles-wrapper .wp-block-quote cite, +.editor-styles-wrapper .wp-block-pullquote cite { + color: #706a63; + font-family: "Berkeley Mono", monospace !important; + font-size: 1rem; + font-style: normal; } .editor-styles-wrapper .wp-block-table th, @@ -262,7 +273,8 @@ body.editor-styles-wrapper { .editor-styles-wrapper .wp-block-pullquote blockquote { padding: 0; border: 0; - margin: 0; + max-width: var(--wp--style--global--content-size, 760px); + margin: 0 auto; color: #1d1b19; font-family: "Alpha Lyrae", sans-serif; font-size: clamp(1.7rem, 1.3rem + 1.7vw, 2.75rem); diff --git a/style.css b/style.css index 1faf0ae..f4adf2a 100644 --- a/style.css +++ b/style.css @@ -56,8 +56,6 @@ License URI: https://www.gnu.org/licenses/gpl-2.0.html --line: #d8d0c6; --accent: #c3480b; --accent-hover: #8f3508; - --code-bg: #282623; - --code-text: #f5eee5; /* Monokai Light tokens use darker variants for accessible contrast on a light panel. */ --monokai-bg: #faf8f5; --monokai-border: #d5d0c8; @@ -81,8 +79,6 @@ License URI: https://www.gnu.org/licenses/gpl-2.0.html --line: #4a4540; --accent: #f07a3c; --accent-hover: #ff9d6a; - --code-bg: #0e0e0d; - --code-text: #f5eee5; --monokai-bg: #272822; --monokai-border: #3e3d32; --monokai-text: #f8f8f2; @@ -106,8 +102,6 @@ License URI: https://www.gnu.org/licenses/gpl-2.0.html --line: #4a4540; --accent: #f07a3c; --accent-hover: #ff9d6a; - --code-bg: #0e0e0d; - --code-text: #f5eee5; --monokai-bg: #272822; --monokai-border: #3e3d32; --monokai-text: #f8f8f2; @@ -321,7 +315,7 @@ input[type="submit"] { background: var(--accent); color: #fff; font-family: "Berkeley Mono", monospace; - font-size: 0.68rem; + font-size: 1rem; letter-spacing: 0.04em; } .menu-toggle { @@ -396,6 +390,14 @@ h4 { .entry-thumbnail { margin: 1.25rem 0; } + +/* Separate a leading article/page image from the body text that follows it. */ +.single .entry-thumbnail, +.page .entry-content > .wp-block-image:first-child, +.page .entry-content > figure:first-child, +.page .entry-content > .wp-block-gallery:first-child { + margin-bottom: 3rem; +} .entry-thumbnail img { width: 100%; border-radius: 2px; @@ -480,14 +482,17 @@ h4 { padding: 1rem 1.2rem; overflow: auto; border-radius: 2px; - background: var(--code-bg); - color: var(--code-text); - font-size: 0.78em; + font-size: 0.8em; } .entry-content code { font-family: "Berkeley Mono", monospace; font-size: 0.8em; } + +/* Prevent inside 
 from applying the compact inline-code scale twice. */
+.entry-content pre code {
+  font-size: inherit;
+}
 .entry-content :not(pre) > code {
   padding: 0.1em 0.3em;
   border-radius: 2px;
@@ -573,7 +578,7 @@ h4 {
 .wp-caption-text {
   color: var(--muted);
   font-family: "Berkeley Mono", monospace;
-  font-size: 0.68rem;
+  font-size: 1rem;
 }
 .wp-block-separator {
   border: 0;
@@ -585,7 +590,7 @@ h4 {
 .entry-content figcaption {
   color: var(--muted);
   font-family: "Berkeley Mono", monospace;
-  font-size: 0.68rem;
+  font-size: 1rem;
 }
 
 .wp-block-button__link,
@@ -595,7 +600,7 @@ h4 {
   background: var(--accent);
   color: #fff;
   font-family: "Berkeley Mono", monospace;
-  font-size: 0.75rem;
+  font-size: 1rem;
   letter-spacing: 0.04em;
   text-decoration: none;
 }
@@ -634,7 +639,7 @@ h4 {
 .wp-block-table th {
   background: var(--surface);
   font-family: "Berkeley Mono", monospace;
-  font-size: 0.8em;
+  font-size: 1em;
 }
 
 .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
@@ -642,10 +647,12 @@ h4 {
 }
 
 .wp-block-quote__citation,
-.wp-block-pullquote__citation {
+.wp-block-pullquote__citation,
+.wp-block-quote cite,
+.wp-block-pullquote cite {
   color: var(--muted);
-  font-family: "Berkeley Mono", monospace;
-  font-size: 0.68rem;
+  font-family: "Berkeley Mono", monospace !important;
+  font-size: 1rem;
   font-style: normal;
 }
 
@@ -748,7 +755,6 @@ h4 {
   padding-top: 1.5rem;
   border-top: 1px solid var(--line);
   font-family: "Berkeley Mono", monospace;
-  font-size: 0.7rem;
 }
 /* Archive and search pagination follows the wide page-title alignment. */
 .pagination {
@@ -1019,9 +1025,10 @@ h4 {
   }
 }
 /* Desktop submenus are positioned from their parent; nested menus fly out to the side. */
-.primary-menu > li {
+.primary-menu li {
   position: relative;
 }
+
 .primary-menu .sub-menu {
   position: absolute;
   z-index: 30;
@@ -1043,8 +1050,8 @@ h4 {
     transform 0.16s ease,
     visibility 0.16s;
 }
-.primary-menu > li:hover > .sub-menu,
-.primary-menu > li:focus-within > .sub-menu {
+.primary-menu li:hover > .sub-menu,
+.primary-menu li:focus-within > .sub-menu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
@@ -1086,8 +1093,9 @@ h4 {
   margin-left: 0.45em;
   content: "▾";
   color: var(--accent);
-  font-size: 0.85em;
-  vertical-align: 0.05em;
+  font-size: 1.45em;
+  line-height: 0.4;
+  vertical-align: -0.2em;
 }
 .primary-menu .sub-menu > li.menu-item-has-children > a {
   display: flex;
@@ -1098,19 +1106,12 @@ h4 {
 .primary-menu .sub-menu > li.menu-item-has-children > a::after {
   content: "▸";
   color: var(--accent);
-  font-size: 0.9em;
+  font-size: 1.45em;
+  line-height: 0.4;
 }
 .primary-menu .sub-menu .sub-menu {
   top: -0.6rem;
-  left: calc(100% + 0.6rem);
-}
-.primary-menu .sub-menu .sub-menu::before {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: -0.6rem;
-  width: 0.6rem;
-  content: "";
+  left: calc(100% - 1px);
 }
 @media (max-width: 760px) {
   .primary-menu > li.menu-item-has-children > a::after,
@@ -1123,23 +1124,7 @@ h4 {
     transform: none;
   }
 }
-.primary-menu li:hover > .sub-menu,
-.primary-menu li:focus-within > .sub-menu {
-  opacity: 1;
-  visibility: visible;
-  transform: translateY(0);
-}
-.primary-menu > li.menu-item-has-children > a::after,
-.primary-menu .sub-menu > li.menu-item-has-children > a::after {
-  font-size: 1.45em;
-  line-height: 0.4;
-}
-.primary-menu .sub-menu .sub-menu {
-  left: calc(100% - 1px);
-}
-.primary-menu li {
-  position: relative;
-}
+
 .site-branding {
   display: flex;
   align-items: center;
@@ -1149,9 +1134,7 @@ h4 {
   margin: 0;
   white-space: nowrap;
 }
-.primary-menu > li.menu-item-has-children > a::after {
-  vertical-align: -0.2em;
-}
+
 /* Keep the sticky header below WordPress's admin bar at each core bar height. */
 body.admin-bar .site-header {
   top: 32px;
diff --git a/theme.json b/theme.json
index 33fce3e..506c3e7 100644
--- a/theme.json
+++ b/theme.json
@@ -135,7 +135,7 @@
         "border": { "radius": "2px" },
         "color": { "background": "var:preset|color|signal-amber", "text": "#ffffff" },
         "spacing": { "padding": { "top": "0.55rem", "right": "0.9rem", "bottom": "0.55rem", "left": "0.9rem" } },
-        "typography": { "fontFamily": "var:preset|font-family|berkeley-mono", "fontSize": "0.75rem", "letterSpacing": "0.04em" }
+        "typography": { "fontFamily": "var:preset|font-family|berkeley-mono", "fontSize": "1rem", "letterSpacing": "0.04em" }
       },
       "heading": {
         "typography": { "fontFamily": "var:preset|font-family|alpha-lyrae", "fontWeight": "500", "lineHeight": "1.16" }