Add Gutenberg theme settings and block styling
This commit is contained in:
+85
-9
@@ -60,9 +60,7 @@ body.editor-styles-wrapper {
|
||||
font-family: "Crimson Pro", Georgia, serif;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block {
|
||||
max-width: 760px;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Gutenberg's visual editor uses this wrapper (rather than <body>) as its canvas.
|
||||
@@ -86,13 +84,12 @@ body.editor-styles-wrapper {
|
||||
line-height: inherit !important;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block[data-align="wide"] {
|
||||
max-width: 1180px;
|
||||
}
|
||||
/*
|
||||
* theme.json supplies contentSize and wideSize to Gutenberg's root container.
|
||||
* Do not override its alignment geometry here: it also handles full-width blocks
|
||||
* in the editor sidebar and other constrained editor layouts.
|
||||
*/
|
||||
|
||||
.editor-styles-wrapper .wp-block[data-align="full"] {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper a {
|
||||
color: #c3480b;
|
||||
@@ -194,3 +191,82 @@ body.editor-styles-wrapper {
|
||||
border: 0;
|
||||
border-top: 1px solid #d8d0c6;
|
||||
}
|
||||
|
||||
/* Match frontend previews for core blocks whose structure needs explicit editor styling. */
|
||||
.editor-styles-wrapper .wp-block-button__link,
|
||||
.editor-styles-wrapper .wp-element-button {
|
||||
border: 1px solid #c3480b;
|
||||
border-radius: 2px;
|
||||
background: #c3480b;
|
||||
color: #fff;
|
||||
font-family: "Berkeley Mono", monospace;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .is-style-outline > .wp-block-button__link {
|
||||
background: transparent;
|
||||
color: #c3480b;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-table {
|
||||
overflow-x: auto;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-table table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-table th,
|
||||
.editor-styles-wrapper .wp-block-table td {
|
||||
padding: 0.55em 0.7em;
|
||||
border: 1px solid #d8d0c6;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-table th,
|
||||
.editor-styles-wrapper .wp-block-quote__citation,
|
||||
.editor-styles-wrapper .wp-block-pullquote__citation {
|
||||
font-family: "Berkeley Mono", monospace;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-table th,
|
||||
.editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
|
||||
background: #fffdf9;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-pullquote {
|
||||
padding: 2rem 0;
|
||||
border-top: 2px solid #c3480b;
|
||||
border-bottom: 2px solid #c3480b;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-pullquote blockquote {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
color: #1d1b19;
|
||||
font-family: "Alpha Lyrae", sans-serif;
|
||||
font-size: clamp(1.7rem, 1.3rem + 1.7vw, 2.75rem);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-cover__inner-container {
|
||||
max-width: 760px;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-gallery .wp-element-caption {
|
||||
margin: 0.5rem 0 0;
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-media-text {
|
||||
gap: clamp(1rem, 3vw, 2.5rem);
|
||||
}
|
||||
|
||||
.editor-styles-wrapper .wp-block-group.has-background,
|
||||
.editor-styles-wrapper .wp-block-columns.has-background {
|
||||
padding: clamp(1.25rem, 4vw, 3rem);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user