WordPress/wp-content/themes/twentyfourteen/css/editor-style.css
Tammie Lister f46632a0f1 Twenty Fourteen: Resolves post content links not being underlined.
In the page list block the text decoration was not the same on the front as the editor. This adds underline to links when in the post editor classic or block. This does not resolve the font size issue that needs to be fixed in block editor reset styles.

Props viralsampat, sabernhardt.
Fixes #61441.

Built from https://develop.svn.wordpress.org/trunk@58463


git-svn-id: http://core.svn.wordpress.org/trunk@57912 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2024-06-23 13:37:16 +00:00

724 lines
12 KiB
CSS

/*
Theme Name: Twenty Fourteen
Description: Used to style the TinyMCE editor.
*/
/**
* Table of Contents:
*
* 1.0 - Body
* 2.0 - Headings
* 3.0 - Text Elements
* 4.0 - Links
* 5.0 - Alignment
* 6.0 - Tables
* 7.0 - Images
* 8.0 - Galleries
* 9.0 - Audio/Video
* 10.0 - RTL
* ----------------------------------------------------------------------------
*/
/**
* 1.0 Body
* ----------------------------------------------------------------------------
*/
html .mceContentBody {
font-size: 100%;
max-width: 474px;
}
body {
color: #2b2b2b;
font-family: Lato, sans-serif;
font-weight: 400;
line-height: 1.5;
vertical-align: baseline;
}
/**
* 2.0 Headings
* ----------------------------------------------------------------------------
*/
h1,
h2,
h3,
h4,
h5,
h6 {
clear: both;
font-weight: 700;
margin: 36px 0 12px;
}
h1 {
font-size: 26px;
line-height: 1.3846153846;
}
h2 {
font-size: 24px;
line-height: 1;
}
h3 {
font-size: 22px;
line-height: 1.0909090909;
}
h4 {
font-size: 20px;
line-height: 1.2;
}
h5 {
font-size: 18px;
line-height: 1.3333333333;
}
h6 {
font-size: 16px;
line-height: 1.5;
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
margin-top: 0;
}
/**
* 3.0 Text Elements
* ----------------------------------------------------------------------------
*/
address {
font-style: italic;
margin-bottom: 24px;
}
abbr[title] {
border-bottom: 1px dotted #2b2b2b;
cursor: help;
}
b,
strong {
font-weight: 700;
}
cite {
border: 0;
}
cite,
dfn,
em,
i {
font-style: italic;
}
mark,
ins {
background: #fff9c0;
border: 0;
color: inherit;
text-decoration: none;
}
p {
margin: 0 0 24px;
}
code,
kbd,
tt,
var,
samp,
pre {
font-family: monospace, serif;
font-size: 15px;
line-height: 1.6;
}
pre {
border: 1px solid rgba(0, 0, 0, 0.1);
margin-bottom: 24px;
overflow: auto;
padding: 12px;
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
blockquote {
color: #767676;
font-size: 19px;
font-style: italic;
font-weight: 300;
line-height: 1.2631578947;
margin: 0 0 24px;
}
blockquote cite,
blockquote small {
color: #2b2b2b;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
}
blockquote em,
blockquote i,
blockquote cite {
font-style: normal;
}
blockquote strong,
blockquote b {
font-weight: 400;
}
small {
font-size: smaller;
}
big {
font-size: 125%;
}
sup,
sub {
font-size: 75%;
height: 0;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
bottom: 1ex;
}
sub {
top: .5ex;
}
dl {
margin: 0 0 24px;
}
dt {
font-weight: bold;
}
dd {
margin: 0 0 24px;
}
ul,
ol {
list-style: none;
margin: 0 0 24px 20px;
padding-left: 0;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin: 0 0 0 20px;
}
del {
color: #767676;
}
hr {
background-color: rgba(0, 0, 0, 0.1);
border: 0;
height: 1px;
margin-bottom: 23px;
}
/**
* 4.0 Links
* ----------------------------------------------------------------------------
*/
a {
color: #24890d;
text-decoration: none;
}
a:visited {
color: #24890d;
}
a:focus {
outline: thin dotted;
}
a:active,
a:hover {
color: #41a62a;
outline: 0;
}
:where(.mce-content-body[class*="post-type-"], .wp-block-post-content) a {
text-decoration: underline;
}
/**
* 5.0 Alignment
* ----------------------------------------------------------------------------
*/
.alignleft {
float: left;
margin: 7px 24px 7px 0;
}
.alignright {
float: right;
margin: 7px 0 7px 24px;
}
.aligncenter {
clear: both;
display: block;
margin: 7px auto;
}
blockquote.alignleft,
blockquote.alignright {
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
padding-top: 17px;
width: 50%;
}
blockquote.alignleft p,
blockquote.alignright p {
margin-bottom: 17px;
}
/**
* 6.0 Tables
* ----------------------------------------------------------------------------
*/
.mceItemTable,
.mce-item-table {
border: 1px solid rgba(0, 0, 0, 0.1);
border-width: 1px 0 0 1px;
border-collapse: separate;
border-spacing: 0;
font-size: 14px;
line-height: 1.2857142857;
margin-bottom: 24px;
width: 100%;
}
.mceItemTable th,
.mceItemTable caption,
.mce-item-table th,
.mce-item-table caption {
border: 1px solid rgba(0, 0, 0, 0.1);
border-width: 0 1px 1px 0;
font-weight: 700;
padding: 8px;
text-align: left;
text-transform: uppercase;
vertical-align: baseline;
}
.mceItemTable td,
.mce-item-table td {
border: 1px solid rgba(0, 0, 0, 0.1);
border-width: 0 1px 1px 0;
font-family: Lato, sans-serif;
font-size: 14px;
padding: 8px;
vertical-align: baseline;
}
/**
* 7.0 Images
* ----------------------------------------------------------------------------
*/
img {
height: auto;
max-width: 100%;
vertical-align: middle;
}
.wp-caption {
background: transparent;
border: none;
color: #767676;
margin: 0 0 24px 0;
max-width: 100%;
padding: 0;
text-align: left;
}
.html5-captions .wp-caption {
padding: 0;
}
.wp-caption.alignleft {
margin: 7px 14px 7px 0;
}
.html5-captions .wp-caption.alignleft {
margin-right: 24px;
}
.wp-caption.alignright {
margin: 7px 0 7px 14px;
}
.wp-caption.alignright img,
.wp-caption.alignright .wp-caption-dd {
padding-left: 10px;
}
.html5-captions .wp-caption.alignright {
margin-left: 24px;
}
.html5-captions .wp-caption.alignright img,
.html5-captions .wp-caption.alignright .wp-caption-dd {
padding: 0;
}
.wp-caption.aligncenter {
margin: 7px auto;
}
.wp-caption-dt {
margin: 0;
}
.wp-caption .wp-caption-text,
.wp-caption-dd {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 12px;
font-style: italic;
line-height: 1.5;
margin: 9px 0;
padding: 0 10px 0 0; /* Avoid the caption to overflow the width of the image because wp-caption has 10px wider width */
text-align: left;
}
.mceTemp + ul,
.mceTemp + ol {
list-style-position: inside;
}
/**
* 8.0 Gallery
* -----------------------------------------------------------------------------
*/
.gallery .gallery-item {
float: left;
margin: 0 4px 4px 0;
overflow: hidden;
padding: 0;
position: relative;
}
.gallery-columns-1 .gallery-item {
max-width: 100%;
width: auto;
}
.gallery-columns-2 .gallery-item {
max-width: 48%;
max-width: -webkit-calc(50% - 14px);
max-width: calc(50% - 14px);
width: auto;
}
.gallery-columns-3 .gallery-item {
max-width: 32%;
max-width: -webkit-calc(33.3% - 11px);
max-width: calc(33.3% - 11px);
width: auto;
}
.gallery-columns-4 .gallery-item {
max-width: 23%;
max-width: -webkit-calc(25% - 9px);
max-width: calc(25% - 9px);
width: auto;
}
.gallery-columns-5 .gallery-item {
max-width: 19%;
max-width: -webkit-calc(20% - 8px);
max-width: calc(20% - 8px);
width: auto;
}
.gallery-columns-6 .gallery-item {
max-width: 15%;
max-width: -webkit-calc(16.7% - 7px);
max-width: calc(16.7% - 7px);
width: auto;
}
.gallery-columns-7 .gallery-item {
max-width: 13%;
max-width: -webkit-calc(14.28% - 7px);
max-width: calc(14.28% - 7px);
width: auto;
}
.gallery-columns-8 .gallery-item {
max-width: 11%;
max-width: -webkit-calc(12.5% - 6px);
max-width: calc(12.5% - 6px);
width: auto;
}
.gallery-columns-9 .gallery-item {
max-width: 9%;
max-width: -webkit-calc(11.1% - 6px);
max-width: calc(11.1% - 6px);
width: auto;
}
.gallery-columns-1 .gallery-item:nth-of-type(1n),
.gallery-columns-2 .gallery-item:nth-of-type(2n),
.gallery-columns-3 .gallery-item:nth-of-type(3n),
.gallery-columns-4 .gallery-item:nth-of-type(4n),
.gallery-columns-5 .gallery-item:nth-of-type(5n),
.gallery-columns-6 .gallery-item:nth-of-type(6n),
.gallery-columns-7 .gallery-item:nth-of-type(7n),
.gallery-columns-8 .gallery-item:nth-of-type(8n),
.gallery-columns-9 .gallery-item:nth-of-type(9n) {
margin-right: 0;
}
.gallery-columns-1 .gallery-item:nth-of-type(1n),
.gallery-columns-2 .gallery-item:nth-of-type(2n - 1),
.gallery-columns-3 .gallery-item:nth-of-type(3n - 2),
.gallery-columns-4 .gallery-item:nth-of-type(4n - 3),
.gallery-columns-5 .gallery-item:nth-of-type(5n - 4),
.gallery-columns-6 .gallery-item:nth-of-type(6n - 5),
.gallery-columns-7 .gallery-item:nth-of-type(7n - 6),
.gallery-columns-8 .gallery-item:nth-of-type(8n - 7),
.gallery-columns-9 .gallery-item:nth-of-type(9n - 8) {
margin-left: 12px; /* Compensate for the default negative margin on .gallery, which can't be changed. */
}
.gallery .gallery-caption {
background-color: rgba(0, 0, 0, 0.7);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
font-size: 12px;
line-height: 1.5;
margin: 0;
max-height: 50%;
opacity: 0;
padding: 6px 8px;
position: absolute;
bottom: 0;
left: 0;
text-align: left;
width: 100%;
}
.gallery .gallery-caption:before {
content: "";
height: 100%;
min-height: 49px;
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.gallery-item:hover .gallery-caption {
opacity: 1;
}
.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {
display: none;
}
/**
* 9.0 Audio/Video
* ----------------------------------------------------------------------------
*/
.mejs-mediaelement,
.mejs-container .mejs-controls {
background: #000;
}
.mejs-controls .mejs-time-rail .mejs-time-loaded,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: #fff;
}
.mejs-controls .mejs-time-rail .mejs-time-current {
background: #24890d;
}
.mejs-controls .mejs-time-rail .mejs-time-total,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
background: rgba(255, 255, 255, .33);
}
.mejs-controls .mejs-time-rail span,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
border-radius: 0;
}
.mejs-overlay-loading {
background: transparent;
}
.mejs-overlay-button {
background-color: #fff;
background-image: none;
border-radius: 2px;
box-shadow: 1px 1px 1px rgba(0,0,0,.8);
color: #000;
height: 36px;
width: 48px;
}
.mejs-overlay-button:before {
-webkit-font-smoothing: antialiased;
content: '\f452';
display: inline-block;
font: normal 32px/1.125 Genericons;
position: relative;
top: 1px;
left: 10px;
}
.mejs-controls .mejs-button button:focus {
outline: none;
}
.mejs-controls .mejs-button button {
-webkit-font-smoothing: antialiased;
background: none;
color: #fff;
display: inline-block;
font: normal 16px/1 Genericons;
}
.mejs-playpause-button.mejs-play button:before {
content: '\f452';
}
.mejs-playpause-button.mejs-pause button:before {
content: '\f448';
}
.mejs-volume-button.mejs-mute button:before {
content: '\f109';
font-size: 20px;
position: absolute;
top: -2px;
left: 0;
}
.mejs-volume-button.mejs-unmute button:before {
content: '\f109';
left: 0;
position: absolute;
top: 0;
}
.mejs-fullscreen-button button:before {
content: '\f474';
}
.mejs-fullscreen-button.mejs-unfullscreen button:before {
content: '\f406';
}
.mejs-overlay:hover .mejs-overlay-button {
background-color: #24890d;
color: #fff;
}
.mejs-controls .mejs-button button:hover {
color: #41a62a;
}
/**
* 10.0 RTL
* ----------------------------------------------------------------------------
*/
html .mceContentBody.rtl {
direction: rtl;
unicode-bidi: embed;
}
.rtl ol,
.rtl ul {
margin-left: 0;
margin-right: 24px;
}
.rtl .wp-caption,
.rtl tr th {
text-align: right;
}
.rtl td {
text-align: right;
}