diff --git a/twentytwenty-blocks/block-styles.css b/twentytwenty-blocks/block-styles.css
index 8b38d0b9..325458f9 100644
--- a/twentytwenty-blocks/block-styles.css
+++ b/twentytwenty-blocks/block-styles.css
@@ -29,8 +29,8 @@
}
.is-style-header-nav .wp-block-navigation-link > ul {
- background: #000;
- border-color: #000;
+ background: var(--wp--preset--color--foreground);
+ border-color: var(--wp--preset--color--foreground);
border-radius: 0.4rem;
font-size: 1.7rem;
opacity: 0;
diff --git a/twentytwenty-blocks/block-templates/index.html b/twentytwenty-blocks/block-templates/index.html
index 1e45b0cf..469d5eae 100644
--- a/twentytwenty-blocks/block-templates/index.html
+++ b/twentytwenty-blocks/block-templates/index.html
@@ -3,7 +3,11 @@
-
+
diff --git a/twentytwenty-blocks/experimental-theme.json b/twentytwenty-blocks/experimental-theme.json
new file mode 100644
index 00000000..f8f2c5e0
--- /dev/null
+++ b/twentytwenty-blocks/experimental-theme.json
@@ -0,0 +1,58 @@
+{
+ "global": {
+ "presets": {
+ "color": [
+ {
+ "slug": "background",
+ "value": "#f5efe0"
+ },
+ {
+ "slug": "foreground",
+ "value": "#000"
+ },
+ {
+ "slug": "primary",
+ "value": "#cd2653"
+ }
+ ],
+ "font-size": [
+ {
+ "slug": "small",
+ "value": "20px"
+ },
+ {
+ "slug": "normal",
+ "value": "22px"
+ },
+ {
+ "slug": "large",
+ "value": "37px"
+ },
+ {
+ "slug": "huge",
+ "value": "50px"
+ }
+ ],
+ "line-height": [
+ {
+ "slug": "normal",
+ "value": "1.8"
+ },
+ {
+ "slug": "heading",
+ "value": "1.4"
+ }
+ ],
+ "font-weight": [
+ {
+ "slug": "normal",
+ "value": "normal"
+ },
+ {
+ "slug": "heading",
+ "value": "700"
+ }
+ ]
+ }
+ }
+}
\ No newline at end of file
diff --git a/twentytwenty-blocks/functions.php b/twentytwenty-blocks/functions.php
index 79c184ce..b2a98652 100644
--- a/twentytwenty-blocks/functions.php
+++ b/twentytwenty-blocks/functions.php
@@ -52,29 +52,19 @@ function twentytwentyblocks_theme_support() {
'editor-color-palette',
array(
array(
- 'name' => __( 'Primary', 'twentytwenty-blocks' ),
- 'slug' => 'primary',
- 'color' => '#0073AA',
- ),
- array(
- 'name' => __( 'Secondary', 'twentytwenty-blocks' ),
- 'slug' => 'secondary',
- 'color' => '#005177',
+ 'name' => __( 'Background', 'twentytwenty-blocks' ),
+ 'slug' => 'background',
+ 'color' => '#f5efe0',
),
array(
- 'name' => __( 'Dark Gray', 'twentytwenty-blocks' ),
- 'slug' => 'dark-gray',
- 'color' => '#111',
+ 'name' => __( 'Text', 'twentytwenty-blocks' ),
+ 'slug' => 'foreground',
+ 'color' => '#000',
),
array(
- 'name' => __( 'Light Gray', 'twentytwenty-blocks' ),
- 'slug' => 'light-gray',
- 'color' => '#767676',
- ),
- array(
- 'name' => __( 'White', 'twentytwenty-blocks' ),
- 'slug' => 'white',
- 'color' => '#FFF',
+ 'name' => __( 'Primary', 'twentytwenty-blocks' ),
+ 'slug' => 'primary',
+ 'color' => '#cd2653',
),
)
);
@@ -308,6 +298,16 @@ function twentytwentyblocks_register_styles() {
}
add_action( 'wp_enqueue_scripts', 'twentytwentyblocks_register_styles' );
+/**
+ * Load styles into Edit Site
+ * (This shouldn't be necessary but it seems to be for now.)
+ */
+function twentytwentyblocks_register_FSE_styles() {
+ $theme_version = wp_get_theme()->get( 'Version' );
+ wp_register_style( 'custom_wp_admin_css', get_template_directory_uri() . '/twentytwenty-styles/editor-style-block.css', false, $theme_version );
+ wp_enqueue_style( 'custom_wp_admin_css' );
+}
+add_action( 'admin_enqueue_scripts', 'twentytwentyblocks_register_FSE_styles' );
/**
* Register Block Patterns.
@@ -321,4 +321,4 @@ function twentytwentyblocks_register_styles() {
'content' => "\n\n
\n
\n\n\n\n
Works and Days
\n\n\n\n
August 1 – December 1
\n\n\n\n
\n
\n\n\n\n
\n
\n\n\n\n
The Life I Deserve
\n\n\n\n
August 1 – December 1
\n\n\n\n
\n
\n
\n",
)
);
-}
\ No newline at end of file
+}
diff --git a/twentytwenty-blocks/style.css b/twentytwenty-blocks/style.css
index 271a42d8..1ebc3c93 100644
--- a/twentytwenty-blocks/style.css
+++ b/twentytwenty-blocks/style.css
@@ -16,6 +16,13 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
*/
@import url('twentytwenty-styles/style.css');
+/*
+ * Set the default link color.
+*/
+:root {
+ --wp--style--color--link: var(--wp--preset--color--primary);
+}
+
/*
** Header
*/
@@ -48,22 +55,13 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
background-color: #fff;
}
+
/*
-** Entry Header
+** Site Content
+** (Extra specificity here is necessary to override default theme styles for content within Group block inner containers.)
*/
-
-.site-content > h1:first-child {
- width: 100%;
- padding: 4rem 2rem;
- margin: 0 0 4rem;
- text-align: center;
- background: #FFF;
-}
-
-@media screen and (min-width: 700px) {
- .site-content > h1:first-child {
- padding: 8rem 2rem;
- }
+.site-content > .wp-block-group__inner-container > .entry-content:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
+ max-width: inherit;
}
/*
diff --git a/twentytwenty-blocks/twentytwenty-styles/editor-style-block.css b/twentytwenty-blocks/twentytwenty-styles/editor-style-block.css
index 55d1446f..caeaa80f 100644
--- a/twentytwenty-blocks/twentytwenty-styles/editor-style-block.css
+++ b/twentytwenty-blocks/twentytwenty-styles/editor-style-block.css
@@ -3,9 +3,13 @@
/* Twenty Twenty Editor Styles — Block Editor
/* ------------------------------------------- */
+body {
+ --wp--style--color--link: var(--wp--preset--color--primary);
+}
+
.editor-styles-wrapper {
- background: #f5efe0;
- color: #000;
+ background: var(--wp--preset--color--background);
+ color: var(--wp--preset--color--foreground);
letter-spacing: -0.015em;
-moz-font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
@@ -13,7 +17,8 @@
.editor-styles-wrapper > * {
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
- font-size: 18px;
+ font-size: var(--wp--preset--font-size--normal);
+ font-weight: var(--wp--preset--font-weight--normal);
}
@supports ( font-variation-settings: normal ) {
@@ -110,7 +115,7 @@ Inter variable font. Usage:
.editor-styles-wrapper .editor-rich-text__tinymce,
.editor-styles-wrapper .editor-rich-text__tinymce.mce-content-body {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
}
@@ -162,65 +167,50 @@ Inter variable font. Usage:
/* CUSTOM COLORS */
-:root .has-accent-color {
- color: #cd2653;
-}
-
-:root .has-accent-background-color {
- background-color: #cd2653;
- color: #fff;
-}
-
-:root .has-primary-color {
- color: #000;
-}
-
-:root .has-primary-background-color {
- background-color: #000;
- color: #f5efe0;
-}
-
-:root .has-secondary-color {
- color: #6d6d6d;
+.editor-styles-wrapper .has-primary-color,
+.editor-styles-wrapper .wp-block-button__link.has-primary-color {
+ color: var(--wp--preset--color--primary);
}
-:root .has-secondary-background-color {
- background-color: #6d6d6d;
- color: #fff;
+.editor-styles-wrapper .has-primary-background-color,
+.editor-styles-wrapper .wp-block-button__link.has-primary-background-color {
+ background-color: var(--wp--preset--color--primary);
}
-:root .has-subtle-background-color {
- color: #dcd7ca;
+.editor-styles-wrapper .has-foreground-color,
+.editor-styles-wrapper .wp-block-button__link.has-foreground-color {
+ color: var(--wp--preset--color--foreground);
}
-:root .has-subtle-background-background-color {
- background-color: #dcd7ca;
- color: #000;
+.editor-styles-wrapper .has-foreground-background-color,
+.editor-styles-wrapper .wp-block-button__link.has-foreground-background-color {
+ background-color: var(--wp--preset--color--foreground);
}
-:root .has-background-color {
- color: #f5efe0;
+.editor-styles-wrapper .has-background-color,
+.editor-styles-wrapper .wp-block-button__link.has-background-color {
+ color: var(--wp--preset--color--background);
}
-:root .has-background-background-color {
- background-color: #f5efe0;
- color: #000;
+.editor-styles-wrapper .has-background-background-color,
+.editor-styles-wrapper .wp-block-button__link.has-background-background-color {
+ background-color: var(--wp--preset--color--background);
}
/* GENERAL COLORS */
.has-black-background-color {
- background-color: #000;
+ background-color: var(--wp--preset--color--foreground);
color: #fff;
}
.has-white-background-color {
background-color: #fff;
- color: #000;
+ color: var(--wp--preset--color--foreground);
}
.has-black-color {
- color: #000;
+ color: var(--wp--preset--color--foreground);
}
.has-white-color {
@@ -231,7 +221,7 @@ Inter variable font. Usage:
/* Typography -------------------------------- */
.editor-styles-wrapper .editor-block-list__layout a {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
text-decoration: underline;
}
@@ -249,37 +239,37 @@ Inter variable font. Usage:
.editor-styles-wrapper .wp-block h6 {
font-feature-settings: "lnum";
font-variant-numeric: lining-nums;
- font-weight: 700;
+ font-weight: var(--wp--preset--font-weight--heading);
letter-spacing: -0.0415625em;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin: 40px 0 25px;
}
.editor-post-title__block .editor-post-title__input,
-.editor-styles-wrapper .wp-block h1 {
- font-size: 36px;
- font-weight: 800;
+.editor-styles-wrapper h1.wp-block {
+ font-size: 84px;
+ font-weight: bolder;
line-height: 1.138888889;
}
-.editor-styles-wrapper .wp-block h2 {
- font-size: 32px;
+.editor-styles-wrapper h2.wp-block {
+ font-size: 48px;
}
-.editor-styles-wrapper .wp-block h3 {
- font-size: 28px;
+.editor-styles-wrapper h3.wp-block {
+ font-size: 40px;
}
-.editor-styles-wrapper .wp-block h4 {
- font-size: 24px;
+.editor-styles-wrapper h4.wp-block {
+ font-size: 32px;
}
-.editor-styles-wrapper .wp-block h5 {
- font-size: 21px;
+.editor-styles-wrapper h5.wp-block {
+ font-size: 24px;
}
-.editor-styles-wrapper .wp-block h6 {
- font-size: 16px;
+.editor-styles-wrapper h6.wp-block {
+ font-size: 18px;
letter-spacing: 0.03125em;
text-transform: uppercase;
}
@@ -304,9 +294,9 @@ Inter variable font. Usage:
/* DROP CAP */
.editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
font-size: 5.1em;
- font-weight: 800;
+ font-weight: var(--wp--preset--font-size--huge);
margin: 0.05em 0.1em 0 0;
}
@@ -331,7 +321,7 @@ Inter variable font. Usage:
.editor-styles-wrapper pre {
border-color: #dcd7ca;
border-radius: 0;
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
padding: 1em;
}
@@ -444,7 +434,7 @@ Inter variable font. Usage:
.editor-styles-wrapper ul.wp-block-latest-posts li,
.editor-styles-wrapper ul.wp-block-categories__list li {
color: #6d6d6d;
- line-height: 1.476;
+ line-height: var(--wp--preset--line-height--normal);;
margin: 5px 0 0 0;
}
@@ -483,7 +473,7 @@ Inter variable font. Usage:
font-size: 0.7em;
font-weight: 600;
letter-spacing: normal;
- line-height: 1.476;
+ line-height: var(--wp--preset--line-height--normal);;
margin-top: 0.15em;
}
@@ -494,7 +484,7 @@ Inter variable font. Usage:
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
- font-size: 18px;
+ font-size: var(--wp--preset--font-size--normal);
margin-bottom: 1.1em;
width: 100%;
}
@@ -621,7 +611,7 @@ hr.wp-block-separator.is-style-dots::before {
}
.editor-styles-wrapper .wp-block-quote {
- border-color: #cd2653;
+ border-color: var(--wp--preset--color--primary);
border-style: solid;
border-width: 0 0 0 2px;
margin: 20px 0;
@@ -649,7 +639,7 @@ hr.wp-block-separator.is-style-dots::before {
color: #6d6d6d;
font-size: 14px;
font-weight: 600;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
}
.editor-styles-wrapper .wp-block-quote p {
@@ -769,7 +759,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .wp-block-pullquote::before {
background: #fff;
border-radius: 50%;
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
content: "”";
display: block;
font-size: 62px;
@@ -891,13 +881,13 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .wp-block-button__link,
.editor-styles-wrapper .wp-block-file__button {
- background: #cd2653;
+ background: var(--wp--preset--color--primary);
border-radius: 0;
color: #fff;
font-size: 15px;
font-weight: 600;
letter-spacing: 0.0333em;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
padding: 1.1em 1.44em;
text-transform: uppercase;
}
@@ -911,7 +901,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .is-style-outline .wp-block-button__link {
background: none;
border-color: currentColor;
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
padding: calc(1.1em - 2px) calc(1.44em - 2px);
}
@@ -995,7 +985,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper ul.wp-block-latest-posts.is-grid li {
border-style: solid;
border-width: 2px 0 0;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin: 20px 16px 16px 0;
padding-top: 12px;
}
@@ -1038,7 +1028,7 @@ hr.wp-block-separator.is-style-dots::before {
}
.editor-styles-wrapper .wp-block-file .wp-block-file__textlink {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
font-weight: 700;
text-decoration: none;
}
@@ -1207,35 +1197,6 @@ hr.wp-block-separator.is-style-dots::before {
font-size: 21px;
}
- /* TYPOGRAPHY */
-
- .editor-post-title__block .editor-post-title__input,
- .editor-styles-wrapper .wp-block h1 {
- font-size: 64px;
- }
-
- .editor-styles-wrapper .wp-block h2 {
- font-size: 48px;
- }
-
- .editor-styles-wrapper .wp-block h3 {
- font-size: 40px;
- }
-
- .editor-styles-wrapper .wp-block h4 {
- font-size: 32px;
- }
-
- .editor-styles-wrapper .wp-block h5 {
- font-size: 24px;
- }
-
- .editor-styles-wrapper li,
- .editor-styles-wrapper p,
- .editor-styles-wrapper p.wp-block-paragraph {
- line-height: 1.476;
- }
-
/* FORMS */
.editor-styles-wrapper fieldset {
@@ -1297,7 +1258,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .wp-block-pullquote.is-style-solid-color blockquote > .block-editor-rich-text p,
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="right"] .editor-rich-text p,
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="left"] .editor-rich-text p {
- font-size: 32px;
+ font-size: 48px;
}
.editor-styles-wrapper .wp-block-pullquote__citation,
@@ -1332,7 +1293,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="left"] p,
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="right"] p {
- font-size: 32px;
+ font-size: 48px;
line-height: 1.1875;
}
@@ -1344,7 +1305,7 @@ hr.wp-block-separator.is-style-dots::before {
/* BLOCK: TABLE */
.editor-styles-wrapper table.wp-block-table {
- font-size: 18px;
+ font-size: var(--wp--preset--font-size--normal);
}
/* BLOCK: SEPARATOR */
@@ -1363,7 +1324,7 @@ hr.wp-block-separator.is-style-dots::before {
/* BLOCK: COLUMNS */
.wp-block-column {
- font-size: 18px;
+ font-size: var(--wp--preset--font-size--normal);
}
/* BLOCK: SEPARATOR */
@@ -1384,18 +1345,6 @@ hr.wp-block-separator.is-style-dots::before {
@media ( min-width: 1220px ) {
-
- /* TYPOGRAPHY */
-
- .editor-post-title__block .editor-post-title__input,
- .editor-styles-wrapper .wp-block h1 {
- font-size: 84px;
- }
-
- .editor-styles-wrapper .wp-block h6 {
- font-size: 18px;
- }
-
/* BLOCK: PULLQUOTE */
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="wide"] .wp-block-pullquote.is-style-solid-color,
@@ -1405,7 +1354,7 @@ hr.wp-block-separator.is-style-dots::before {
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="wide"] blockquote p,
.editor-styles-wrapper .wp-block[data-type="core/pullquote"][data-align="full"] blockquote p {
- font-size: 64px;
+ font-size: var(--wp--preset--font-size--huge);
}
/* BLOCK: SEPARATOR */
diff --git a/twentytwenty-blocks/twentytwenty-styles/style.css b/twentytwenty-blocks/twentytwenty-styles/style.css
index 008bc0ca..ea3fcfa1 100644
--- a/twentytwenty-blocks/twentytwenty-styles/style.css
+++ b/twentytwenty-blocks/twentytwenty-styles/style.css
@@ -125,11 +125,12 @@ html {
}
body {
- background: #f5efe0;
+ background: var(--wp--preset--color--background);
box-sizing: border-box;
- color: #000;
+ color: var(--wp--preset--color--foreground);
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
- font-size: 1.8rem;
+ font-size: var(--wp--preset--font-size--normal);
+ font-weight: var(--wp--preset--font-weight--normal);
letter-spacing: -0.015em;
text-align: left;
}
@@ -305,48 +306,47 @@ h6,
.faux-heading {
font-feature-settings: "lnum";
font-variant-numeric: lining-nums;
- font-weight: 700;
+ font-weight: var(--wp--preset--font-weight--heading);
letter-spacing: -0.0415625em;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin: 3.5rem 0 2rem;
}
h1,
.heading-size-1 {
- font-size: 3.6rem;
- font-weight: 800;
- line-height: 1.138888889;
+ font-size: 6.4rem;
+ font-weight: bolder;
}
h2,
.heading-size-2 {
- font-size: 3.2rem;
+ font-size: 4.8rem;
}
h3,
.heading-size-3 {
- font-size: 2.8rem;
+ font-size: 4rem;
}
h4,
.heading-size-4 {
- font-size: 2.4rem;
+ font-size: 3.2rem;
}
h5,
.heading-size-5 {
- font-size: 2.1rem;
+ font-size: 2.4rem;
}
h6,
.heading-size-6 {
- font-size: 1.6rem;
+ font-size: 1.8rem;
letter-spacing: 0.03125em;
text-transform: uppercase;
}
p {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
margin: 0 0 1em 0;
}
@@ -405,7 +405,7 @@ acronym {
}
address {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
margin: 0 0 2rem 0;
}
@@ -456,7 +456,7 @@ hr.styled-separator::after {
}
a {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
text-decoration: underline;
}
@@ -498,7 +498,7 @@ ol ol ol {
}
li {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
margin: 0.5rem 0 0 2rem;
}
@@ -520,7 +520,7 @@ li > ol {
dt,
dd {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
}
dt {
@@ -539,7 +539,7 @@ dd + dt {
/* Quotes ------------------------------------ */
blockquote {
- border-color: #cd2653;
+ border-color: var(--wp--preset--color--primary);
border-style: solid;
/*rtl:ignore*/
@@ -557,7 +557,7 @@ cite {
font-size: 1.4rem;
font-style: normal;
font-weight: 600;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
}
blockquote cite {
@@ -590,7 +590,7 @@ samp {
pre {
border: 0.1rem solid #dcd7ca;
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
margin: 4rem 0;
overflow: auto;
padding: 3rem 2rem;
@@ -754,7 +754,7 @@ button,
input,
textarea {
border-color: #dcd7ca;
- color: #000;
+ color: var(--wp--preset--color--foreground);
}
code,
@@ -803,7 +803,7 @@ select {
textarea {
height: 12rem;
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
width: 100%;
}
@@ -836,7 +836,7 @@ input[type="reset"],
input[type="submit"] {
-webkit-appearance: none;
-moz-appearance: none;
- background: #cd2653;
+ background: var(--wp--preset--color--primary);
border: none;
border-radius: 0;
color: #fff;
@@ -845,7 +845,7 @@ input[type="submit"] {
font-size: 1.5rem;
font-weight: 600;
letter-spacing: 0.0333em;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin: 0;
opacity: 1;
padding: 1.1em 1.44em;
@@ -1092,7 +1092,7 @@ button.toggle {
.color-accent,
.color-accent-hover:focus,
.color-accent-hover:hover {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
}
/* BACKGROUND COLOR */
@@ -1100,7 +1100,7 @@ button.toggle {
.bg-accent,
.bg-accent-hover:focus,
.bg-accent-hover:hover {
- background-color: #cd2653;
+ background-color: var(--wp--preset--color--primary);
}
/* BORDER COLOR */
@@ -1108,14 +1108,14 @@ button.toggle {
.border-color-accent,
.border-color-accent-hover:focus,
.border-color-accent-hover:hover {
- border-color: #cd2653;
+ border-color: var(--wp--preset--color--primary);
}
/* FILL COLOR */
.fill-children-accent,
.fill-children-accent * {
- fill: #cd2653;
+ fill: var(--wp--preset--color--primary);
}
.fill-children-current-color,
@@ -1305,7 +1305,7 @@ ul.social-icons li {
.social-icons a {
align-items: center;
- background: #cd2653;
+ background: var(--wp--preset--color--primary);
border-radius: 50%;
color: #fff;
display: flex;
@@ -1612,7 +1612,7 @@ ul.primary-menu {
.primary-menu li {
font-size: inherit;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
position: relative;
}
@@ -1657,7 +1657,7 @@ ul.primary-menu {
/* SUB MENU */
.primary-menu ul {
- background: #000;
+ background: var(--wp--preset--color--foreground);
border-radius: 0.4rem;
color: #fff;
font-size: 1.7rem;
@@ -1697,7 +1697,7 @@ ul.primary-menu {
.primary-menu ul::after {
border: 0.8rem solid transparent;
- border-bottom-color: #000;
+ border-bottom-color: var(--wp--preset--color--foreground);
right: 1.8rem;
}
@@ -1746,7 +1746,7 @@ ul.primary-menu {
border-bottom-color: transparent;
/*rtl:ignore*/
- border-left-color: #000;
+ border-left-color: var(--wp--preset--color--foreground);
bottom: auto;
right: -1.6rem;
top: 2rem;
@@ -2406,7 +2406,7 @@ body:not(.singular) main > article:first-of-type {
}
.entry-categories {
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin-bottom: 2rem;
}
@@ -2736,21 +2736,21 @@ h2.entry-title {
/* CUSTOM COLORS */
:root .has-accent-color {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
}
:root .has-accent-background-color {
- background-color: #cd2653;
+ background-color: var(--wp--preset--color--primary);
color: #fff;
}
:root .has-primary-color {
- color: #000;
+ color: var(--wp--preset--color--primary);
}
:root .has-primary-background-color {
- background-color: #000;
- color: #f5efe0;
+ background-color: var(--wp--preset--color--primary);
+ color: var(--wp--preset--color--background);
}
:root .has-secondary-color {
@@ -2768,16 +2768,16 @@ h2.entry-title {
:root .has-subtle-background-background-color {
background-color: #dcd7ca;
- color: #000;
+ color: var(--wp--preset--color--foreground);
}
:root .has-background-color {
- color: #f5efe0;
+ color: var(--wp--preset--color--background);
}
:root .has-background-background-color {
- background-color: #f5efe0;
- color: #000;
+ background-color: var(--wp--preset--color--background);
+ color: var(--wp--preset--color--foreground);
}
@@ -2798,10 +2798,10 @@ h2.entry-title {
}
.has-drop-cap:not(:focus)::first-letter {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
font-size: 5.1em;
- font-weight: 800;
+ font-weight: var(--wp--preset--font-weight--heading);
margin: 0.05em 0.1em 0 0;
}
@@ -2981,7 +2981,7 @@ h2.entry-title {
.wp-block-latest-comments__comment-meta {
font-weight: 700;
letter-spacing: -0.025em;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
}
.wp-block-latest-comments__comment-date,
@@ -3017,7 +3017,7 @@ h2.entry-title {
}
.wp-block-button.is-style-outline {
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
}
.is-style-outline .wp-block-button__link:not(.has-text-color) {
@@ -3203,7 +3203,7 @@ figure.wp-block-gallery.alignfull {
.wp-block-pullquote::before {
background: #fff;
border-radius: 50%;
- color: #cd2653;
+ color: var(--wp--preset--color--primary);
content: "”";
display: block;
font-size: 6.2rem;
@@ -3467,7 +3467,7 @@ figure.wp-block-table.is-style-stripes {
.entry-content {
- line-height: 1.5;
+ line-height: var(--wp--preset--line-height--normal);
}
.entry-content > * {
@@ -3804,7 +3804,7 @@ div.comment:first-of-type {
}
.comment-reply-link {
- background-color: #cd2653;
+ background-color: var(--wp--preset--color--primary);
color: #fff;
display: block;
padding: 0.7rem;
@@ -3927,7 +3927,7 @@ div.comment:first-of-type {
.comment-respond input[type="checkbox"] + label {
font-size: 1.5rem;
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
}
.comment-respond input[type="text"],
@@ -4379,7 +4379,7 @@ div.comment:first-of-type {
}
.footer-menu li {
- line-height: 1.25;
+ line-height: var(--wp--preset--line-height--heading);
margin: 0.25em 0 0 0;
}
@@ -4423,7 +4423,7 @@ ul.footer-social li {
}
.footer-social a {
- background-color: #cd2653;
+ background-color: var(--wp--preset--color--primary);
height: 3.6rem;
width: 3.6rem;
}
@@ -5281,7 +5281,7 @@ a.to-the-top > * {
.entry-content p,
.entry-content li {
- line-height: 1.476;
+ line-height: var(--wp--preset--line-height--normal);;
}
.entry-content h1,