233 lines
5.8 KiB
CSS
233 lines
5.8 KiB
CSS
/**
|
|
* Navier Instruments Theme - Editor Styles
|
|
*
|
|
* Gutenberg block editor styles
|
|
*
|
|
* @package Navier_Instruments
|
|
*/
|
|
|
|
/* ==========================================================================
|
|
Editor Typography
|
|
========================================================================== */
|
|
.editor-styles-wrapper {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
font-size: 16px;
|
|
line-height: 1.6;
|
|
color: #4A4A5A;
|
|
}
|
|
|
|
.editor-styles-wrapper h1,
|
|
.editor-styles-wrapper h2,
|
|
.editor-styles-wrapper h3,
|
|
.editor-styles-wrapper h4,
|
|
.editor-styles-wrapper h5,
|
|
.editor-styles-wrapper h6 {
|
|
font-family: 'Montserrat', 'Inter', sans-serif;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
color: #1A1A2E;
|
|
}
|
|
|
|
.editor-styles-wrapper h1 {
|
|
font-size: 2.5rem;
|
|
}
|
|
|
|
.editor-styles-wrapper h2 {
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.editor-styles-wrapper h3 {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.editor-styles-wrapper h4 {
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Links
|
|
========================================================================== */
|
|
.editor-styles-wrapper a {
|
|
color: #0A4D8C;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.editor-styles-wrapper a:hover {
|
|
color: #083A6A;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Buttons
|
|
========================================================================== */
|
|
.editor-styles-wrapper .wp-block-button__link {
|
|
font-family: 'Inter', sans-serif;
|
|
font-weight: 600;
|
|
padding: 0.875rem 1.75rem;
|
|
border-radius: 8px;
|
|
transition: all 0.25s ease;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-button__link:not(.has-background) {
|
|
background: linear-gradient(135deg, #0A4D8C 0%, #083A6A 100%);
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Colors
|
|
========================================================================== */
|
|
.editor-styles-wrapper .has-primary-color {
|
|
color: #0A4D8C;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-primary-background-color {
|
|
background-color: #0A4D8C;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-secondary-color {
|
|
color: #2ECC71;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-secondary-background-color {
|
|
background-color: #2ECC71;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-accent-color {
|
|
color: #00B4D8;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-accent-background-color {
|
|
background-color: #00B4D8;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-dark-color {
|
|
color: #1A1A2E;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-dark-background-color {
|
|
background-color: #1A1A2E;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-light-gray-color {
|
|
color: #F4F4F8;
|
|
}
|
|
|
|
.editor-styles-wrapper .has-light-gray-background-color {
|
|
background-color: #F4F4F8;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Quote Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper .wp-block-quote {
|
|
border-left: 4px solid #0A4D8C;
|
|
padding: 1.5rem 2rem;
|
|
background: #F4F4F8;
|
|
margin: 2rem 0;
|
|
border-radius: 0 8px 8px 0;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-quote p {
|
|
font-style: italic;
|
|
font-size: 1.125rem;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-quote cite {
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
color: #6B6B7B;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Code Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper code {
|
|
font-family: 'Fira Code', 'Monaco', 'Consolas', monospace;
|
|
padding: 0.125em 0.375em;
|
|
background: #F4F4F8;
|
|
border-radius: 4px;
|
|
color: #0A4D8C;
|
|
}
|
|
|
|
.editor-styles-wrapper pre {
|
|
padding: 1.5rem;
|
|
background: #1A1A2E;
|
|
color: #F4F4F8;
|
|
border-radius: 8px;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.editor-styles-wrapper pre code {
|
|
padding: 0;
|
|
background: transparent;
|
|
color: inherit;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Table Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper .wp-block-table table {
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-table th,
|
|
.editor-styles-wrapper .wp-block-table td {
|
|
padding: 0.75rem 1rem;
|
|
border: 1px solid #B8B8C8;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-table th {
|
|
background: #F4F4F8;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Image Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper .wp-block-image img {
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.editor-styles-wrapper .wp-block-image figcaption {
|
|
font-size: 0.875rem;
|
|
color: #6B6B7B;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor Separator Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper hr.wp-block-separator {
|
|
border: none;
|
|
border-top: 2px solid #B8B8C8;
|
|
margin: 2rem 0;
|
|
}
|
|
|
|
.editor-styles-wrapper hr.wp-block-separator.is-style-dots {
|
|
border: none;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Editor List Block
|
|
========================================================================== */
|
|
.editor-styles-wrapper ul,
|
|
.editor-styles-wrapper ol {
|
|
padding-left: 1.5rem;
|
|
}
|
|
|
|
.editor-styles-wrapper li {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Wide Alignment Support
|
|
========================================================================== */
|
|
.editor-styles-wrapper .alignwide {
|
|
max-width: 1200px;
|
|
}
|
|
|
|
.editor-styles-wrapper .alignfull {
|
|
max-width: none;
|
|
margin-left: calc(-50vw + 50%);
|
|
margin-right: calc(-50vw + 50%);
|
|
}
|