` /* * Theme Name: Canard * Description: Gutenberg Block Editor Styles */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- 1.0 General Typography 2.0 General Block Styles 3.0 Blocks - Common Blocks 4.0 Blocks - Formatting 5.0 Blocks - Layout Elements 6.0 Blocks - Widgets --------------------------------------------------------------*/ /*-------------------------------------------------------------- 1.0 General Typography --------------------------------------------------------------*/ .edit-post-visual-editor .editor-block-list__block, .edit-post-visual-editor .editor-block-list__block p, .editor-default-block-appender textarea.editor-default-block-appender__content { font-family: "PT Serif", serif; font-size: 16px; } @media screen and ( min-width: 768px ) { .edit-post-visual-editor .editor-block-list__block, .edit-post-visual-editor .editor-block-list__block p, .editor-default-block-appender textarea.editor-default-block-appender__content { font-size: 20px; } } .edit-post-visual-editor .editor-block-list__block { color: #222; } .alignleft { margin-right: 30px; } .alignright { margin-left: 30px; } /* Title */ .editor-post-title__block .editor-post-title__input { clear: both; font-family: "Playfair Display", serif; font-weight: bold; margin-top: 0; font-size: 39px; line-height: 1.54; } /* Headings */ .edit-post-visual-editor h1, .edit-post-visual-editor h2, .edit-post-visual-editor h3, .edit-post-visual-editor h4, .edit-post-visual-editor h5, .edit-post-visual-editor h6 { clear: both; font-family: "Playfair Display", serif; font-weight: bold; margin-top: 0; } .edit-post-visual-editor h1 { font-size: 49px; line-height: 1.225; margin-bottom: 30px; } .edit-post-visual-editor h2 { font-size: 39px; line-height: 1.54; margin-bottom: 30px; } .edit-post-visual-editor h3 { font-size: 31px; line-height: 1.452; margin-bottom: 30px; } .edit-post-visual-editor h4 { font-size: 25px; line-height: 1.2; margin-bottom: 30px; } .edit-post-visual-editor h5 { font-size: 20px; line-height: 1.5; margin-bottom: 30px; } .edit-post-visual-editor h6 { font-size: 16px; line-height: 1.5; margin-bottom: 30px; } /* Paragraphs */ .edit-post-visual-editor p { margin: 0 0 30px; } .edit-post-visual-editor blockquote p { margin-bottom: 30px; } /*-------------------------------------------------------------- 2.0 General Block Styles --------------------------------------------------------------*/ /* Main column width */ .wp-block { max-width: 750px; /* 720px + 30px padding */ } @media screen and (min-width: 960px) { .wp-block { max-width: 584px; /* 554px + 30px padding */ } } @media screen and (min-width: 1080px) { .wp-block { max-width: 674px; /* 644px + 30px padding */ } } @media screen and (min-width: 1380px) { .wp-block { max-width: 899px; /* 869px + 30px padding */ } } /* Link styles */ .edit-post-visual-editor a, .editor-block-list__block a, .wp-block-freeform.block-library-rich-text__tinymce a { color: #d11415; font-weight: bold; text-decoration: none; } .edit-post-visual-editor a:hover, .edit-post-visual-editor a:focus, .edit-post-visual-editor a:active, .editor-block-list__block a:hover, .editor-block-list__block a:focus, .editor-block-list__block a:active, .wp-block-freeform.block-library-rich-text__tinymce a:hover, .wp-block-freeform.block-library-rich-text__tinymce a:focus, .wp-block-freeform.block-library-rich-text__tinymce a:active { color: inherit; outline: none; } .edit-post-visual-editor a:visited, .editor-block-list__block a:visited, .wp-block-freeform.block-library-rich-text__tinymce a:visited { font-weight: normal; } /* List styles */ .edit-post-visual-editor ul:not(.wp-block-gallery), .editor-block-list__block ul:not(.wp-block-gallery), .block-library-list ul, .wp-block-freeform.block-library-rich-text__tinymce ul { list-style: square inside; } .edit-post-visual-editor ol, .editor-block-list__block ol, .block-library-list ol, .wp-block-freeform.block-library-rich-text__tinymce ol { list-style: decimal inside; } .edit-post-visual-editor ul:not(.wp-block-gallery) li, .editor-block-list__block ul:not(.wp-block-gallery) li, .edit-post-visual-editor ol li, .editor-block-list__block ol li, .block-library-list li, .wp-block-freeform.block-library-rich-text__tinymce ul li, .wp-block-freeform.block-library-rich-text__tinymce ol li { margin-bottom: 0; } .edit-post-visual-editor ul:not(.wp-block-gallery) li > ul, .editor-block-list__block ul:not(.wp-block-gallery) li > ul, .block-library-list li > ul, .edit-post-visual-editor li > ol, .editor-block-list__block li > ol, .block-library-list li > ol, .wp-block-freeform.block-library-rich-text__tinymce li > ul, .wp-block-freeform.block-library-rich-text__tinymce li > ol { margin-bottom: 0; margin-left: 30px; } .rtl .edit-post-visual-editor ul:not(.wp-block-gallery), .rtl .editor-block-list__block ul:not(.wp-block-gallery), .rtl .block-library-list ul, .rtl .edit-post-visual-editor ol, .rtl .editor-block-list__block ol, .rtl .block-library-list ol { margin-left: 0; margin-right: 30px; padding: 0; } .rtl .edit-post-visual-editor ol, .rtl .editor-block-list__block ol, .rtl .block-library-list ol { margin-left: 0; margin-right: 30px; } /* Captions */ [class^="wp-block-"] figcaption { color: #777; font-family: Lato, sans-serif; font-size: 16px; line-height: 1.25; max-width: 100%; } /*-------------------------------------------------------------- 3.0 Blocks - Common Blocks --------------------------------------------------------------*/ /* Paragraph */ .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter { font-size: 64px; } /* Image */ .wp-block-image figcaption { color: #777; font-family: Lato, sans-serif; font-size: 16px; line-height: 1.25; margin-bottom: 25px; max-width: 100%; } /* Quote */ .editor-block-list__block .wp-block-quote:not(.is-large):not(.is-style-large) { border-left: 0; } .wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align:right"], .wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align: right"] { border-right: 0; } .editor-block-list__block .wp-block-quote:before { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-family: Genericons; font-size: 24px; font-style: normal; font-weight: normal; height: 30px; line-height: 1.25; speak: none; text-decoration: inherit; vertical-align: top; width: 30px; color: #ddd; content: "\f106"; float: left; } .rtl .editor-block-list__block .wp-block-quote:before { float: right; } .wp-block-quote { color: #555; font-style: italic; margin: 0 0 30px; padding: 0; position: relative; } .rtl .editor-block-list__block blockquote { border-left: 0; border-right: 0; padding-left: 0; text-align: right !important; } .rtl .wp-block-quote:not(.is-large):not(.is-style-large) { border-right: 0; padding-right: 0; } .wp-block-quote:not(.is-large):not(.is-style-large), .wp-block-quote:not(.is-large):not(.is-style-large).alignleft, .wp-block-quote:not(.is-large):not(.is-style-large).alignright { } .editor-block-list__block .wp-block-quote p { color: inherit; margin-bottom: 0; } .wp-block-quote__citation { color: inherit; font-style: normal; font-weight: bold; font-size: inherit; margin-top: 0; } .wp-block-quote__citation:before { } .wp-block-quote em, .wp-block-quote i, .wp-block-quote__citation:before { font-style: normal; } .wp-block-quote > :last-child { margin-bottom: 0; } .wp-block-quote.alignleft { margin: 15px 30px 15px 0; } .wp-block-quote.alignright { margin: 15px 0 15px 30px; } .wp-block-quote.aligncenter { margin-bottom: 30px; } .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignleft, .rtl .wp-block-quote:not(.is-large):not(.is-style-large).alignright { } .edit-post-visual-editor .editor-block-list__block .wp-block-quote.is-large p, .edit-post-visual-editor .editor-block-list__block .wp-block-quote.is-style-large p { font-size: 120%; } /* Audio */ .wp-block-audio audio { display: block; width: 100%; } /* Cover */ .edit-post-visual-editor .editor-block-list__block .wp-block-cover-image .wp-block-cover-image-text, .edit-post-visual-editor .editor-block-list__block .wp-block-cover-image .wp-block-cover-text, .edit-post-visual-editor .editor-block-list__block .wp-block-cover-image h2, .edit-post-visual-editor .editor-block-list__block .wp-block-cover .wp-block-cover-image-text, .edit-post-visual-editor .editor-block-list__block .wp-block-cover .wp-block-cover-text, .edit-post-visual-editor .editor-block-list__block .wp-block-cover h2 { font-size: 2.0em; /* Cover images inherit the paragraph size; this resets it */ } /* File */ .wp-block-file__textlink { color: #d11415; font-weight: bold; } .wp-block-file .wp-block-file__button { background: #d11415; border: 2px solid #d11415; border-radius: 0; color: #fff; font-family: Lato, sans-serif; font-weight: bold; padding: 5.5px 13px; text-transform: uppercase; } /*-------------------------------------------------------------- 4.0 Blocks - Formatting --------------------------------------------------------------*/ /* Verse */ .wp-block-verse pre { background: transparent; border-left: 0; color: inherit; font-family: inherit; line-height: inherit; margin-bottom: 30px; max-width: 100%; overflow: auto; padding: 0; } /* Code */ .wp-block-code { font-family: Inconsolata, monospace; background: #eee; border: 0; border-left: 2px solid #d11415; border-radius: 0; max-width: 100%; overflow: auto; padding: 30px; } .wp-block-code textarea { background: transparent; } .rtl .wp-block-code { border-left: 0; border-right: 2px solid #d11415; } /* Classic */ .wp-block-freeform.block-library-rich-text__tinymce blockquote:before { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-family: Genericons; font-size: 24px; font-style: normal; font-weight: normal; height: 30px; line-height: 1.25; speak: none; text-decoration: inherit; vertical-align: top; width: 30px; color: #ddd; content: "\f106"; float: left; } .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote:before { float: right; } .wp-block-freeform.block-library-rich-text__tinymce blockquote { border-left: 0; color: #555; font-style: italic; margin: 0 0 30px; padding: 0; position: relative; } .wp-block-freeform.block-library-rich-text__tinymce blockquote p { } .wp-block-freeform.block-library-rich-text__tinymce blockquote > :last-child { margin-bottom: 0; } .editor-block-list__block .wp-block-freeform.block-library-rich-text__tinymce blockquote:not(.alignleft):not(.alignright) { } .wp-block-freeform.block-library-rich-text__tinymce blockquote cite { font-weight: bold; font-style: normal; } .wp-block-freeform.block-library-rich-text__tinymce blockquote cite:before { } .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft { } .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright { } .wp-block-freeform.block-library-rich-text__tinymce blockquote.aligncenter { } .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote { } .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignleft { float: left; } .rtl .wp-block-freeform.block-library-rich-text__tinymce .alignright { float: right; } .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft { margin: .75em 30px .75em 0; } .rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright { margin: .75em 0 .75em 30px; } .wp-block-freeform.block-library-rich-text__tinymce h1 { font-size: 49px; line-height: 1.225; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce h2 { font-size: 39px; line-height: 1.54; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce h3 { font-size: 31px; line-height: 1.452; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce h4 { font-size: 25px; line-height: 1.2; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce h5 { font-size: 20px; line-height: 1.5; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce h6 { font-size: 16px; line-height: 1.5; margin-bottom: 30px; } .wp-block-freeform.block-library-rich-text__tinymce pre { background: #eee; border-left: 2px solid #d11415; font-size: 16px; max-width: 100%; overflow: auto; padding: 30px; } .rtl .wp-block-freeform.block-library-rich-text__tinymce pre { border-left: 0; border-right: 2px solid #d11415; } .wp-block-freeform.block-library-rich-text__tinymce table { border: 0; border-collapse: collapse; border-top: 1px solid #ddd; margin: 0 0 30px; text-align: left; width: 100%; } .wp-block-freeform.block-library-rich-text__tinymce .alternate { background: transparent; } .wp-block-freeform.block-library-rich-text__tinymce table td, .wp-block-freeform.block-library-rich-text__tinymce table th { border: 0; border-bottom: 1px solid #ddd; padding: 5px; } .wp-block-freeform.block-library-rich-text__tinymce table thead { background-color: #eee; } .wp-block-freeform.block-library-rich-text__tinymce table td a, .wp-block-freeform.block-library-rich-text__tinymce table th a { } .wp-block-freeform.block-library-rich-text__tinymce table th { border-bottom: 1px solid #ddd; font-family: Lato, sans-serif; text-transform: uppercase; } .rtl .wp-block-freeform.block-library-rich-text__tinymce th, .rtl .wp-block-freeform.block-library-rich-text__tinymce td { text-align: right; } /* Preformatted */ .editor-block-list__block .wp-block-preformatted pre { background: #eee; border-left: 2px solid #d11415; max-width: 100%; overflow: auto; padding: 30px; } .rtl .editor-block-list__block .wp-block-preformatted pre { border-left: 0; border-right: 2px solid #d11415; } /* Pullquote */ .editor-block-list__block .wp-block-pullquote blockquote { border-top: 4px solid currentColor; border-bottom: 2px solid currentColor; color: #555; font-style: italic; margin: 0 0 30px; padding: 15px 0; position: relative; } .wp-block-pullquote { padding: 0; border: 0; } .wp-block-pullquote.alignleft { float: left; margin-right: 30px; } .wp-block-pullquote.alignright { float: right; margin-left: 30px; } .wp-block-pullquote blockquote > .editor-rich-text p { color: inherit; margin: 0; } .wp-block-pullquote.alignleft blockquote p, .wp-block-pullquote.alignright blockquote p { font-size: 20px; } .wp-block-pullquote.alignleft .wp-block-pullquote__citation, .wp-block-pullquote.alignright .wp-block-pullquote__citation { font-size: 16px; } .wp-block-pullquote .wp-block-pullquote__citation { text-transform: none; font-size: inherit; font-weight: bold; } /* Table */ .wp-block-table { border-top: 1px solid #ddd; margin: 0 0 30px; text-align: left; width: 100%; } .wp-block-table thead { background: #eee; } .wp-block-table th { border: 0; border-bottom: 1px solid #ddd; font-family: "Lato", sans-serif; font-weight: bold; padding: 0; text-transform: uppercase; } .wp-block-table td { border: 0; border-bottom: 1px solid #ddd; padding: 0; } .wp-block-table .wp-block-table__cell-content { padding: 3px 5px; } .rtl .wp-block-table { text-align: right; } /* Definition List styles */ .wp-block-freeform.block-library-rich-text__tinymce dt { font-weight: bold; } .wp-block-freeform.block-library-rich-text__tinymce dd { margin: 0 0 30px; } /*-------------------------------------------------------------- 5.0 Blocks - Layout Elements --------------------------------------------------------------*/ /* Buttons */ .wp-block-button__link { background: #d11415; border: 2px solid; display: inline-block; font-family: Lato, sans-serif; font-weight: bold; padding: 5.5px 13px; text-transform: uppercase; } .wp-block-button__link:not(.has-background) { border-color: #d11415; } .is-style-outline .wp-block-button__link { color: #d11415; border-color: currentColor; } /* Separator */ .wp-block-separator { background-color: #ddd; border: 0; margin-bottom: 30px; max-width: 66%; } .wp-block-separator:not(.is-style-dots) { height: 1px; } .wp-block-separator.is-wide { max-width: 100%; } /*-------------------------------------------------------------- 6.0 Blocks - Widgets --------------------------------------------------------------*/ /* Categories & Archives */ .edit-post-visual-editor [data-align="center"] .wp-block-categories__list, .edit-post-visual-editor [data-align="center"] .wp-block-archives, .edit-post-visual-editor [data-align="center"] .wp-block-lastest-posts { list-style-position: inside; } /* Latest Comments */ .editor-block-list__block .wp-block-latest-comments__comment-meta a { box-shadow: none; font-weight: 700; text-decoration: none; } .wp-block-latest-comments__comment-date { } .wp-block-latest-comments .wp-block-latest-comments__comment { border-top: 1px solid #ddd; margin-bottom: 0; padding: 30px 0; } .wp-block-latest-comments__comment-excerpt p:last-child { margin-bottom: 0; } /* Latest Posts */ .edit-post-visual-editor .wp-block-latest-posts.is-grid { list-style: none; margin-left: 0; margin-right: 0; } .edit-post-visual-editor .wp-block-latest-posts.is-grid li { margin-bottom: 15px; }