golem
/
twentyGOLEM
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Twenty Eleven: Add border styles to images so we can better style linked images on :focus; includes updates to editor styles and improvements to Image Post styles; See #17524 

git-svn-id: http://svn.automattic.com/wordpress/trunk@18132 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
iandstewart 2011-06-03 21:11:41 +00:00
parent 20ad00f2f1
commit 08fb0d4133
4 changed files with 198 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
wp-content/themes/twentyeleven/colors/dark.css
View File

@ -145,6 +145,42 @@ a {
color: #000;
}
/* Images */
.wp-caption {
background: #2c2c2c;
}
.wp-caption .wp-caption-text {
color: #999;
}
.wp-caption .wp-caption-text:before {
color: #999;
}
/* Image borders */
.entry-content img,
.widget img,
#content .gallery .gallery-icon img {
border-color: #2c2c2c;
}
.wp-caption img {
border-color: #2c2c2c;
}
.entry-content a:focus img,
.entry-content a:hover img,
.entry-content a:active img,
.widget a:focus img,
.widget a:hover img,
.widget a:active img {
background: #2c2c2c;
border-color: #444;
}
.wp-caption a:focus img,
.wp-caption a:active img,
.wp-caption a:hover img {
background: #0f0f0f;
border-color: #2c2c2c;
}
/* Password Protected Posts */
.post-password-required input[type=password] {
background: #ddd;
@ -208,10 +244,13 @@ a {
/* =Image
----------------------------------------------- */
.format-image .entry-meta .edit-link a {
.indexed.format-image .wp-caption {
background: #242424;
}
.indexed.format-image .entry-meta .edit-link a {
color: #ddd;
}
.format-image .entry-meta .edit-link a:hover {
.indexed.format-image .entry-meta .edit-link a:hover {
color: #fff;
}
@ -339,19 +378,14 @@ section.recent-posts .other-recent-posts .comments-link a:hover {
background: #060606;
border-color: #222;
}
/* =Images
----------------------------------------------- */
.wp-caption {
background: #0b0d12;
.image-attachment div.attachment a img {
border-color: #060606;
}
.wp-caption .wp-caption-text {
color: #999;
}
.wp-caption .wp-caption-text:before {
color: #64759d;
.image-attachment div.attachment a:focus img,
.image-attachment div.attachment a:hover img,
.image-attachment div.attachment a:active img {
border-color: #2c2c2c;
background: #0f0f0f;
}

9
wp-content/themes/twentyeleven/content-image.php
View File

@ -9,8 +9,7 @@
* @since Twenty Eleven 1.0
*/
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<article id="post-<?php the_ID(); ?>" <?php post_class( 'indexed' ); ?>>
<header class="entry-header">
<hgroup>
<h1 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyeleven' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h1>
@ -24,16 +23,10 @@
<?php endif; ?>
</header><!-- .entry-header -->
<?php if ( is_search() ) : // Only display Excerpts for Search ?>
<div class="entry-summary">
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
<?php else : ?>
<div class="entry-content">
<?php the_content( __( 'Continue reading <span class="meta-nav">&rarr;</span>', 'twentyeleven' ) ); ?>
<?php wp_link_pages( array( 'before' => '<div class="page-link">' . __( '<span>Pages:</span>', 'twentyeleven' ), 'after' => '</div>' ) ); ?>
</div><!-- .entry-content -->
<?php endif; ?>
<footer class="entry-meta">
<?php if ( 'post' == $post->post_type ) : // Hide category and tag text for pages on Search ?>

31
wp-content/themes/twentyeleven/editor-style.css
View File

@ -49,6 +49,9 @@ hr {
}
/* Text elements */
p, ul, ol, dl {
font-weight: 300;
}
p {
margin-bottom: 1.625em;
}
@ -247,17 +250,27 @@ p img,
.wp-caption {
margin-top: 0.4em;
}
img {
border: 1px solid #ddd;
padding: 6px;
}
img.alignleft,
img.alignright,
img.aligncenter {
margin-bottom: 1.625em;
}
.wp-caption {
background: #f4f2ed;
background: #eee;
border: none;
margin-bottom: 1.625em;
max-width: 96%;
padding: 12px;
padding: 9px;
}
.wp-caption img {
display: block;
margin: 5px auto 0 !important;
max-width: 98%;
border-color: #eee;
}
.wp-caption .wp-caption-text,
.wp-caption-dd {
@ -270,7 +283,7 @@ p img,
text-align: left;
}
.wp-caption .wp-caption-text:before {
color: #9b8a62;
color: #666;
content: '\2014';
font-size: 14px;
font-style: normal;
@ -279,4 +292,16 @@ p img,
position: absolute;
left: 10px;
top: 7px;
}
a:focus img,
a:hover img,
a:active img {
background: #eee;
border-color: #bbb;
}
.wp-caption a:focus img,
.wp-caption a:active img,
.wp-caption a:hover img {
background: #fff;
border-color: #ddd;
}

203
wp-content/themes/twentyeleven/style.css
View File

@ -828,6 +828,98 @@ dl.gallery-item {
display: block;
}
/* Images */
img.size-auto,
img.size-large,
img.size-full,
img.size-medium,
img.size-thumbnail {
height: auto;
max-width: 97.5%;
}
img.wp-smiley {
margin-bottom: 0;
margin-top: 0;
}
img.alignleft,
img.alignright,
img.aligncenter {
margin-bottom: 1.625em;
}
p img,
.wp-caption {
margin-top: 0.4em;
}
.wp-caption {
background: #eee;
margin-bottom: 1.625em;
max-width: 96%;
padding: 9px;
}
.wp-caption img {
display: block;
margin: 0 auto;
max-width: 98%;
}
.wp-caption .wp-caption-text,
.gallery-caption {
color: #666;
font-family: Georgia, serif;
font-size: 12px;
}
.wp-caption .wp-caption-text {
margin-bottom: 0.6em;
padding: 10px 0px 5px 40px;
position: relative;
}
.wp-caption .wp-caption-text:before {
color: #666;
content: '\2014';
font-size: 14px;
font-style: normal;
font-weight: bold;
margin-right: 5px;
position: absolute;
left: 10px;
top: 7px;
}
.gallery {
margin: 0 auto 1.625em !important;
}
#content .gallery a img {
border: none;
}
img#wpstats {
display: block;
margin: 0 auto 1.625em;
}
/* Image borders */
.entry-content img,
.widget img,
#content .gallery .gallery-icon img {
border: 1px solid #ddd;
padding: 6px;
}
.wp-caption img {
border-color: #eee;
}
.entry-content a:focus img,
.entry-content a:hover img,
.entry-content a:active img,
.widget a:focus img,
.widget a:hover img,
.widget a:active img {
background: #eee;
border-color: #bbb;
}
.wp-caption a:focus img,
.wp-caption a:active img,
.wp-caption a:hover img {
background: #fff;
border-color: #ddd;
}
/* Password Protected Posts */
.post-password-required .entry-header .comments-link {
margin: 1.625em 0 0;
@ -1104,53 +1196,54 @@ blockquote.pull {
/* =Image
----------------------------------------------- */
.format-image .entry-content {
.indexed.format-image .entry-content {
padding-top: 0.5em;
}
.format-image p {
margin: 0;
.indexed.format-image p img {
margin-bottom: 0;
}
.format-image footer.entry-meta {
.indexed.format-image footer.entry-meta {
background: #e0e6e8;
margin-top: -6px;
padding: 20px 30px;
overflow: hidden;
}
.format-image div.entry-meta {
.indexed.format-image div.entry-meta {
display: inline-block;
float: left;
width: 35%;
}
.format-image div.entry-meta + div.entry-meta {
.indexed.format-image div.entry-meta + div.entry-meta {
float: none;
width: 65%;
}
.format-image .entry-meta span.cat-links,
.format-image .entry-meta span.tag-links,
.format-image .entry-meta span.comments-link {
.indexed.format-image .entry-meta span.cat-links,
.indexed.format-image .entry-meta span.tag-links,
.indexed.format-image .entry-meta span.comments-link {
display: block;
}
.format-image footer.entry-meta a {
.indexed.format-image footer.entry-meta a {
color: #444;
}
.format-image .wp-caption {
#content .indexed.format-image img {
border: none;
max-width: 100%;
padding: 0;
}
.indexed.format-image .wp-caption {
background: #111;
margin-bottom: 0;
max-width: 96%;
padding: 11px;
}
.format-image .wp-caption .wp-caption-text {
.indexed.format-image .wp-caption .wp-caption-text {
color: #ddd;
}
.format-image .wp-caption .wp-caption-text:before {
.indexed.format-image .wp-caption .wp-caption-text:before {
color: #444;
}
.single .format-image footer.entry-meta {
background: transparent;
padding: 30px 0;
}
.one-column .format-image footer.entry-meta {
margin-right: 2px;
.indexed.format-image a:hover img {
opacity: 0.8;
}
@ -1502,6 +1595,15 @@ section.recent-posts .other-recent-posts li:after {
margin: 0 auto 1.625em;
width: 100%;
}
.image-attachment div.attachment a img {
border-color: #f9f9f9;
}
.image-attachment div.attachment a:focus img,
.image-attachment div.attachment a:hover img,
.image-attachment div.attachment a:active img {
border-color: #ddd;
background: #fff;
}
.image-attachment .entry-caption p {
font-size: 10px;
letter-spacing: 0.1em;
@ -1511,69 +1613,6 @@ section.recent-posts .other-recent-posts li:after {
}
/* =Images
----------------------------------------------- */
img.size-auto,
img.size-large,
img.size-full,
img.size-medium,
img.size-thumbnail {
height: auto;
max-width: 100%;
}
img.wp-smiley {
margin-bottom: 0;
margin-top: 0;
}
p img,
.wp-caption {
margin-top: 0.4em;
}
.wp-caption {
background: #f4f2ed;
margin-bottom: 1.625em;
max-width: 96%;
padding: 12px;
}
.wp-caption img {
display: block;
margin: 5px auto 0;
max-width: 98%;
}
.wp-caption .wp-caption-text {
color: #666;
font-family: Georgia, serif;
font-size: 12px;
margin-bottom: 0.6em;
padding: 10px 0px 5px 40px;
position: relative;
}
.wp-caption .wp-caption-text:before {
color: #9b8a62;
content: '\2014';
font-size: 14px;
font-style: normal;
font-weight: bold;
margin-right: 5px;
position: absolute;
left: 10px;
top: 7px;
}
.gallery {
margin: 0 auto 1.625em !important;
}
#content .gallery a img {
border: none;
}
.gallery-caption {
}
img#wpstats {
display: block;
margin: 0 auto 1.625em;
}
/* =Navigation
-------------------------------------------------------------- */