More editor styles, excepting blockquotes, pullquotes, and list margins/padding.
This commit is contained in:
Caroline Moore
parent
41319a0f4f
commit
c2dac1d3a4
2 changed files with 113 additions and 171 deletions
|
|
@ -167,6 +167,7 @@ figure.alignfull,
|
|||
/* File */
|
||||
|
||||
.wp-block-file .wp-block-file__button {
|
||||
border-radius: 0;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
|
|
@ -210,7 +211,6 @@ figure.alignfull,
|
|||
color: inherit;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
letter-spacing: 0px;
|
||||
line-height: inherit;
|
||||
margin-bottom: 1.5em;
|
||||
max-width: 100%;
|
||||
|
|
@ -224,10 +224,13 @@ figure.alignfull,
|
|||
font-family: 'Courier 10 Pitch', Courier, monospace;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
|
||||
overflow: auto;
|
||||
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.6em;
|
||||
padding: 1.6em;
|
||||
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -150,14 +150,7 @@
|
|||
/* Images */
|
||||
|
||||
.wp-block-image figcaption {
|
||||
margin: 10px 0 0;
|
||||
text-align: center;
|
||||
color: #7f8d8c;
|
||||
font-family: "PT Serif", serif;
|
||||
font-size: 0.73em;
|
||||
line-height: 1.3;
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -167,13 +160,7 @@
|
|||
/* Main column width */
|
||||
|
||||
.wp-block {
|
||||
max-width: 870px; /* 81.5em + 30px to account for padding */
|
||||
}
|
||||
|
||||
@media screen and (max-width: 959px) and (min-width: 768px) {
|
||||
.wp-block {
|
||||
max-width: 678px; /* 648px + 30px to account for padding */
|
||||
}
|
||||
max-width: 690px; /* 660px + 30px to account for padding */
|
||||
}
|
||||
|
||||
/* Link styles */
|
||||
|
|
@ -181,7 +168,10 @@
|
|||
.edit-post-visual-editor a,
|
||||
.editor-block-list__block a,
|
||||
.wp-block-freeform.block-library-rich-text__tinymce a {
|
||||
color: #e06d5e;
|
||||
color: #81699b;
|
||||
-webkit-transition: .3s all ease-in-out;
|
||||
-moz-transition: .3s all ease-in-out;
|
||||
transition: .3s all ease-in-out;
|
||||
}
|
||||
|
||||
.edit-post-visual-editor a:hover,
|
||||
|
|
@ -193,7 +183,7 @@
|
|||
.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: #7f8d8c;
|
||||
color: #557d73;
|
||||
}
|
||||
|
||||
/* List styles */
|
||||
|
|
@ -204,7 +194,7 @@
|
|||
.edit-post-visual-editor ol,
|
||||
.editor-block-list__block ol,
|
||||
.block-library-list ol {
|
||||
margin: 0 0 .75em;
|
||||
margin: 0 0 1.5em 3em;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
|
|
@ -235,17 +225,6 @@
|
|||
margin-left: 1.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.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 {
|
||||
margin-left: .75em;
|
||||
}
|
||||
}
|
||||
|
||||
.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,
|
||||
|
|
@ -257,30 +236,10 @@
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.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: .75em;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Captions */
|
||||
|
||||
[class^="wp-block-"] figcaption {
|
||||
margin: 10px 0 0;
|
||||
text-align: center;
|
||||
color: #7f8d8c;
|
||||
font-family: "PT Serif", serif;
|
||||
font-size: 0.73em;
|
||||
line-height: 1.3;
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -403,22 +362,35 @@
|
|||
|
||||
/* File */
|
||||
|
||||
.wp-block-file__textlink {
|
||||
box-shadow: 0 1px 0 0 currentColor;
|
||||
color: #e06d5e;
|
||||
.wp-block-file .wp-block-file__button {
|
||||
border-radius: 0;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
padding: .75em;
|
||||
|
||||
cursor: pointer;
|
||||
-webkit-transition: .3s all ease-in-out;
|
||||
-moz-transition: .3s all ease-in-out;
|
||||
transition: .3s all ease-in-out;
|
||||
text-transform: uppercase;
|
||||
|
||||
color: #222;
|
||||
border: 2px solid #222;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.wp-block-file .wp-block-file__button {
|
||||
padding: 10px .75em;
|
||||
background: #464d4d;
|
||||
border: 1px solid #464d4d;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
cursor: pointer;
|
||||
/* Improves usability and consistency of cursor style between image-type 'input' and others */
|
||||
-webkit-appearance: button;
|
||||
/* Corrects inability to style clickable 'input' types in iOS */
|
||||
.wp-block-file .wp-block-file__button:hover,
|
||||
.wp-block-file .wp-block-file__button:focus {
|
||||
-webkit-transition: .3s all ease-in-out;
|
||||
-moz-transition: .3s all ease-in-out;
|
||||
transition: .3s all ease-in-out;
|
||||
color: #fff;
|
||||
border-color: #222;
|
||||
background: #222;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -441,20 +413,23 @@
|
|||
/* Code */
|
||||
|
||||
.wp-block-code {
|
||||
padding: 0 5px .75em 5px;
|
||||
background: #f1f2f3;
|
||||
font-family: "Source Code Pro", monospace;
|
||||
letter-spacing: -0.05em;
|
||||
position: relative;
|
||||
font-family: 'Courier 10 Pitch', Courier, monospace;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
|
||||
overflow: auto;
|
||||
margin-bottom: .75em;
|
||||
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.6em;
|
||||
padding: 1.6em;
|
||||
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
/* Classic */
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce address {
|
||||
margin-bottom: .75em;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce ol {
|
||||
|
|
@ -463,25 +438,8 @@
|
|||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.wp-block-freeform.block-library-rich-text__tinymce ol {
|
||||
padding-left: .75em;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce blockquote {
|
||||
padding-left: 1.5em;
|
||||
margin: 0;
|
||||
font-family: "PT Serif", serif;
|
||||
font-size: 26px;
|
||||
border-left: 2px solid #e06d5e;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.wp-block-freeform.block-library-rich-text__tinymce blockquote {
|
||||
padding-left: .75em;
|
||||
font-size: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce blockquote p {
|
||||
|
|
@ -516,12 +474,6 @@
|
|||
padding-right: 1.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.rtl .wp-block-freeform.block-library-rich-text__tinymce blockquote {
|
||||
padding-right: .75em;
|
||||
}
|
||||
}
|
||||
|
||||
.rtl .wp-block-freeform.block-library-rich-text__tinymce .alignleft {
|
||||
float: left;
|
||||
}
|
||||
|
|
@ -610,20 +562,23 @@
|
|||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce pre {
|
||||
background: #f1f2f3;
|
||||
font-family: "Source Code Pro", monospace;
|
||||
letter-spacing: -0.05em;
|
||||
position: relative;
|
||||
font-family: 'Courier 10 Pitch', Courier, monospace;
|
||||
font-size: 15px;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.6;
|
||||
|
||||
overflow: auto;
|
||||
padding: .75em;
|
||||
margin-bottom: .75em;
|
||||
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.6em;
|
||||
padding: 1.6em;
|
||||
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce table {
|
||||
border-bottom: 1px solid #eee;
|
||||
margin: 0 0 1.5em 0;
|
||||
width: 100%;
|
||||
margin: 0 0 1.5em;
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce .alternate {
|
||||
|
|
@ -631,15 +586,17 @@
|
|||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce table td {
|
||||
border: 0;
|
||||
border-top: 1px solid #eee;
|
||||
padding: 0.4em;
|
||||
padding: 3px 5px;
|
||||
|
||||
border-bottom: 1px solid #aaa;
|
||||
}
|
||||
|
||||
.wp-block-freeform.block-library-rich-text__tinymce table th {
|
||||
font-weight: bold;
|
||||
padding: 0.4em;
|
||||
text-transform: uppercase;
|
||||
|
||||
padding: 10px 5px 5px;
|
||||
|
||||
border-bottom: 4px solid #222;
|
||||
}
|
||||
|
||||
.rtl .wp-block-freeform.block-library-rich-text__tinymce th,
|
||||
|
|
@ -649,14 +606,17 @@
|
|||
/* Preformatted */
|
||||
|
||||
.editor-block-list__block .wp-block-preformatted pre {
|
||||
background: #f1f2f3;
|
||||
font-family: "Source Code Pro", monospace;
|
||||
letter-spacing: -0.05em;
|
||||
position: relative;
|
||||
font-family: 'Courier 10 Pitch', Courier, monospace;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
|
||||
overflow: auto;
|
||||
padding: .75em;
|
||||
margin-bottom: .75em;
|
||||
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.6em;
|
||||
padding: 1.6em;
|
||||
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
/* Pullquote */
|
||||
|
|
@ -687,37 +647,14 @@
|
|||
font-size: 26px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.wp-block-pullquote {
|
||||
padding-left: .75em;
|
||||
font-size: 21px;
|
||||
}
|
||||
|
||||
.wp-block-pullquote blockquote {
|
||||
font-size: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-pullquote.alignleft {
|
||||
margin-right: 1.5em;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1260px) {
|
||||
.wp-block-pullquote.alignleft {
|
||||
margin-left: -130px;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-pullquote.alignright {
|
||||
margin-left: 1.5em;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1260px) {
|
||||
.wp-block-pullquote.alignright {
|
||||
margin-right: -130px;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-block-pullquote blockquote > .editor-rich-text p {
|
||||
color: inherit;
|
||||
margin: 0;
|
||||
|
|
@ -745,30 +682,22 @@
|
|||
}
|
||||
|
||||
.editor-block-list__block table.wp-block-table {
|
||||
display: table;
|
||||
margin: 0 0 .75em;
|
||||
width: 100%;
|
||||
border-top: 1px solid #f1f2f3;
|
||||
margin: 0 0 1.5em;
|
||||
}
|
||||
|
||||
.editor-block-list__block table.wp-block-table td {
|
||||
border: 0;
|
||||
padding: 10px .75em;
|
||||
border-bottom: 1px solid #f1f2f3;
|
||||
padding: 3px 5px;
|
||||
border-bottom: 1px solid #aaa;
|
||||
}
|
||||
|
||||
.editor-block-list__block table.wp-block-table th {
|
||||
background: #f1f2f3;
|
||||
font-weight: bold;
|
||||
padding: 10px .75em;
|
||||
border-bottom: 1px solid #f1f2f3;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.editor-block-list__block table.wp-block-table th,
|
||||
.editor-block-list__block table.wp-block-table td {
|
||||
padding: 5px 10px;
|
||||
}
|
||||
padding: 10px 5px 5px;
|
||||
|
||||
border-bottom: 4px solid #222;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -777,15 +706,19 @@
|
|||
|
||||
/* Buttons */
|
||||
.wp-block-button .wp-block-button__link {
|
||||
padding: 10px .75em;
|
||||
border: 1px solid;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
padding: .75em;
|
||||
cursor: pointer;
|
||||
/* Improves usability and consistency of cursor style between image-type 'input' and others */
|
||||
-webkit-transition: .3s all ease-in-out;
|
||||
-moz-transition: .3s all ease-in-out;
|
||||
transition: .3s all ease-in-out;
|
||||
text-transform: uppercase;
|
||||
border: 2px solid currentColor;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.wp-block-button .wp-block-button__link:active,
|
||||
|
|
@ -794,44 +727,50 @@
|
|||
}
|
||||
|
||||
.wp-block-button__link:not(.has-background) {
|
||||
background: #464d4d;
|
||||
border: 1px solid #464d4d;
|
||||
background: transparent;
|
||||
border: 2px solid #222;
|
||||
}
|
||||
|
||||
.wp-block-button__link:not(.has-background):focus {
|
||||
background: #e06d5e;
|
||||
border-color: #222;
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.wp-block-button__link:not(.has-text-color) {
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.wp-block-button__link:not(.has-text-color),
|
||||
.wp-block-button__link:not(.has-text-color):active,
|
||||
.wp-block-button__link:not(.has-text-color):focus,
|
||||
.wp-block-button__link:not(.has-text-color):hover {
|
||||
color: white;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.wp-block-button__link:not(.has-background):active,
|
||||
.wp-block-button__link:not(.has-background):focus,
|
||||
.wp-block-button__link:not(.has-background):hover {
|
||||
background: #e06d5e;
|
||||
border-color: #e06d5e;
|
||||
background: #222;
|
||||
border: 2px solid #222;
|
||||
}
|
||||
|
||||
/* Separator */
|
||||
|
||||
.wp-block-separator {
|
||||
margin-bottom: .75em;
|
||||
height: 1px;
|
||||
background: #f1f2f3;
|
||||
margin-bottom: 1.5em;
|
||||
border: 0;
|
||||
max-width: 66%;
|
||||
background-color: #ccc;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
|
||||
max-width: 66%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-block-separator.is-style-wide {
|
||||
max-width: 100%;
|
||||
max-width: 120%;
|
||||
margin-left: -10%;
|
||||
margin-right: -10%;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -857,7 +796,7 @@
|
|||
}
|
||||
|
||||
.wp-block-latest-comments .wp-block-latest-comments__comment {
|
||||
border-top: 1px solid #e6e6e6;
|
||||
border-top: 1px solid #ccc;
|
||||
margin-bottom: 0;
|
||||
padding: .75em 0;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue