WordPress/wp-content/themes/twentyeleven/blocks.css
Tammie Lister 4d6f01b32d Twenty Seventeen and Twenty Ten: Fixes gallery captions being at the bottom of images.
The margin specified in this theme caused issues when the gallery was placed in another block. This fix covers both themes as the selector is used within both.

Props pevogam, sabernhardt.
Fixes #58362.

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


git-svn-id: http://core.svn.wordpress.org/trunk@58063 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2024-07-03 10:47:16 +00:00

449 lines
8.3 KiB
CSS

/*
Theme Name: Twenty Eleven
Description: Used to style blocks.
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 General Block Styles
2.0 Blocks - Common Blocks
3.0 Blocks - Formatting
4.0 Blocks - Layout Elements
5.0 Blocks - Widgets
6.0 Blocks - Colors
--------------------------------------------------------------*/
/*--------------------------------------------------------------
1.0 General Block Styles
--------------------------------------------------------------*/
figure[class^="wp-block-"] {
margin-left: 0;
margin-right: 0;
}
/* Captions */
[class^="wp-block-"] figcaption {
font-family: Georgia, serif;
font-size: 12px;
}
[class^="wp-block-"]:not(.wp-block-gallery) > figcaption {
color: #666;
margin-bottom: 1.625em;
max-width: 96%;
max-width: calc( 100% - 18px );
padding: 3px 0 5px 40px;
position: relative;
text-align: left;
}
[class^="wp-block-"]:not(.wp-block-gallery) > figcaption:before {
color: #666;
content: '\2014';
font-size: 14px;
font-style: normal;
font-weight: bold;
margin-right: 5px;
position: absolute;
left: 10px;
top: 0;
}
.rtl [class^="wp-block-"]:not(.wp-block-gallery) > figcaption {
padding-left: 0;
padding-right: 40px;
text-align: right;
}
.rtl [class^="wp-block-"]:not(.wp-block-gallery) > figcaption:before {
left: 0;
margin-left: 5px;
margin-right: 0;
right: 10px;
}
/*--------------------------------------------------------------
2.0 Blocks - Common Blocks
--------------------------------------------------------------*/
/* Paragraph */
p.has-drop-cap:not(:focus)::first-letter {
font-size: 5em;
margin-top: 0.1em;
}
/* Gallery */
.wp-block-gallery {
margin: 0 0 1.625em;
}
.wp-block-gallery .blocks-gallery-item figcaption {
margin-bottom: 0;
padding-left: 0;
padding-right: 0;
}
.wp-block-gallery .blocks-gallery-item img {
border: 0;
padding: 0;
}
/* Quote */
.wp-block-quote {
margin: 0 3em;
}
.wp-block-quote:not(.is-large):not(.is-style-large) {
border: 0;
padding-left: 0;
padding-right: 0;
}
.wp-block-quote.is-large p,
.wp-block-quote.is-style-large p {
font-size: 20px;
}
.wp-block-quote cite {
color: #666;
font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.wp-block-quote.is-large cite,
.wp-block-quote.is-style-large cite {
font-size: 16px;
}
.wp-block-quote[style*="font-weight"] blockquote,
.wp-block-quote[style*="font-weight"] p,
.wp-block-quote[style*="font-weight"] cite {
font-weight: inherit;
}
.wp-block-quote[style*="font-style"] blockquote,
.wp-block-quote[style*="font-style"] p,
.wp-block-quote[style*="font-style"] cite {
font-style: inherit;
}
/* Audio */
.wp-block-audio audio {
display: block;
width: 100%;
}
/* Cover */
.wp-block-cover-image.aligncenter,
.wp-block-cover.aligncenter {
clear: both;
display: flex;
}
.wp-block-cover-image.alignleft,
.wp-block-cover.alignleft {
margin-right: 1.625em;
}
.wp-block-cover-image.alignright,
.wp-block-cover.alignright {
margin-left: 1.625em;
}
/* File */
.wp-block-file .wp-block-file__button {
background: #222;
border: none;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
box-shadow: 0 1px 2px rgba(0,0,0,0.3);
color: #eee;
cursor: pointer;
font-size: 15px;
padding: 5px 22px;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.wp-block-file .wp-block-file__button:active {
background: #1982d1;
color: #bfddf3;
}
.rtl .wp-block-file * + .wp-block-file__button {
margin-left: 0.75em;
margin-right: 0;
}
/*--------------------------------------------------------------
3.0 Blocks - Formatting
--------------------------------------------------------------*/
/* Code */
.wp-block-code {
background-color: transparent;
border: 0;
padding: 0;
}
/* Pullquote */
.wp-block-pullquote__citation,
.wp-block-pullquote cite,
.wp-block-pullquote footer {
color: inherit;
}
.wp-block-pullquote.alignleft {
margin-right: 1.625em;
}
.wp-block-pullquote.alignright {
margin-left: 1.625em;
}
.wp-block-pullquote[style*="font-weight"] blockquote,
.wp-block-pullquote[style*="font-weight"] p,
.wp-block-pullquote[style*="font-weight"] cite {
font-weight: inherit;
}
.wp-block-pullquote[style*="font-style"] blockquote,
.wp-block-pullquote[style*="font-style"] p,
.wp-block-pullquote[style*="font-style"] cite {
font-style: inherit;
}
/* Table */
.wp-block-table {
border-bottom: 1px solid #ddd;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
}
.wp-block-table th {
border: 0;
font-weight: bold;
padding: 6px 10px 6px 0;
text-transform: uppercase;
}
.rtl .wp-block-table th {
padding: 6px 0 6px 10px;
}
.wp-block-table .has-text-color th {
color: currentColor;
}
.wp-block-table td {
border: 0;
border-top: 1px solid #ddd;
padding: 6px 10px 6px 0;
}
/*--------------------------------------------------------------
4.0 Blocks - Layout Elements
--------------------------------------------------------------*/
/* Buttons */
.wp-block-button .wp-block-button__link {
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
box-shadow: 0 1px 2px rgba(0,0,0,0.3);
cursor: pointer;
font-size: 15px;
margin: 20px 0;
padding: 5px 22px;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.is-style-outline .wp-block-button__link:not(.has-text-color) {
color: #222;
text-shadow: none;
}
.wp-block-button__link,
.wp-block-button .wp-block-button__link:hover,
.wp-block-button .is-style-outline .wp-block-button__link:hover {
background: #222;
color: #eee;
}
.wp-block-button__link:active {
background: #1982d1;
color: #bfddf3;
}
/* Separator */
.wp-block-separator {
border: 0;
max-width: 100px;
}
.wp-block-separator.is-style-wide,
.wp-block-separator.is-style-dots {
max-width: 100%;
}
/* Media & Text */
.wp-block-media-text {
margin-bottom: 1.625em;
}
.wp-block-media-text *:first-child {
margin-top: 0;
}
.wp-block-media-text *:last-child {
margin-bottom: 0;
}
.wp-block-media-text .wp-block-media-text__content {
padding-top: 1.5em;
padding-bottom: 1.5em;
}
/*--------------------------------------------------------------
5.0 Blocks - Widgets
--------------------------------------------------------------*/
/* Archives, Categories & Latest Posts */
.wp-block-archives.aligncenter,
.wp-block-categories.aligncenter,
.wp-block-latest-posts.aligncenter {
list-style-position: inside;
margin-left: 2.5em;
text-align: center;
}
.rtl .wp-block-archives.aligncenter,
.rtl .wp-block-categories.aligncenter,
.rtl .wp-block-latest-posts.aligncenter {
margin-left: 0;
margin-right: 2.5em;
}
/* Latest Comments */
.wp-block-latest-comments {
margin: 0;
padding: 0;
}
.wp-block-latest-comments .avatar,
.wp-block-latest-comments__comment-avatar {
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 1px 2px #ccc;
-moz-box-shadow: 0 1px 2px #ccc;
box-shadow: 0 1px 2px #ccc;
}
.wp-block-latest-comments__comment,
.wp-block-latest-comments__comment-excerpt,
.wp-block-latest-comments__comment-excerpt p {
font-size: 15px;
}
.wp-block-latest-comments__comment-excerpt p:last-child {
margin-bottom: 0;
}
.wp-block-latest-comments__comment-meta,
.wp-block-latest-comments__comment-date {
color: #666;
font-size: 12px;
line-height: 2.2em;
}
.wp-block-latest-comments__comment-meta a {
font-weight: bold;
}
.wp-block-latest-comments .wp-block-latest-comments__comment {
-moz-border-radius: 3px;
border-radius: 3px;
margin: 0 0 2.625em;
position: relative;
}
/* Latest Posts */
.wp-block-latest-posts.is-grid {
margin-left: 0;
margin-right: 0;
}
/*--------------------------------------------------------------
6.0 Blocks - Colors
--------------------------------------------------------------*/
.has-blue-color {
color: #1982d1;
}
.has-blue-background-color {
background-color: #1982d1;
}
.has-black-color {
color: #000;
}
.has-black-background-color {
background-color: #000;
}
.has-dark-gray-color {
color: #373737;
}
.has-dark-gray-background-color {
background-color: #373737;
}
.has-medium-gray-color {
color: #666;
}
.has-medium-gray-background-color {
background-color: #666;
}
.has-light-gray-color {
color: #e2e2e2;
}
.has-light-gray-background-color {
background-color: #e2e2e2;
}
.has-white-color {
color: #fff;
}
.has-white-background-color {
background-color: #fff;
}