WordPress.org

Make WordPress Core

Changeset 17756


Ignore:
Timestamp:
04/28/2011 10:15:36 PM (9 years ago)
Author:
iandstewart
Message:

Twenty Eleven: First pass at dark color scheme w/ simplification of borders above and below the menu; See #17198

Location:
trunk/wp-content/themes/twentyeleven
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-content/themes/twentyeleven/colors/dark.css

    r17721 r17756  
    1 /* Placeholder for a Twenty Eleven dark color scheme */
     1/*
     2    A dark color scheme for Twenty Eleven
     3*/
     4
     5/* =Global
     6----------------------------------------------- */
     7
     8body {
     9    background: #1d1d1d;
     10    color: #bbb;
     11}
     12#page {
     13    background: #0f0f0f;
     14}
     15
     16/* Headings */
     17hr {
     18    background-color: #333;
     19}
     20
     21/* Text elements */
     22blockquote cite {
     23    color: #999;
     24}
     25pre {
     26    background: #0b0b0b;
     27}
     28code, kbd {
     29    font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
     30}
     31abbr, acronym, dfn {
     32    border-bottom: 1px dotted #999;
     33}
     34ins {
     35    background: #00063f;
     36}
     37input[type=text],
     38textarea {
     39    border: 1px solid #222;
     40}
     41input[type=text]:focus,
     42textarea:focus {
     43}
     44
     45/* Links */
     46a {
     47    color: #e4741f;
     48}
     49
     50
     51/* =Header
     52----------------------------------------------- */
     53
     54#branding {
     55    border-top: 2px solid #444;
     56}
     57#site-title a {
     58    color: #eee;
     59}
     60#site-description {
     61    color: #858585;
     62}
     63#branding #s {
     64    background-color: #fff;
     65}
     66
     67
     68/* =Menu
     69----------------------------------------------- */
     70
     71#access {
     72    border-bottom: 1px solid #222;
     73}
     74
     75/* =Content
     76----------------------------------------------- */
     77
     78.page-title {
     79    color: #ccc;
     80}
     81.hentry {
     82    border-color: #222;
     83}
     84.entry-title {
     85    color: #ddd;
     86}
     87.entry-title,
     88.entry-title a {
     89    color: #ddd;
     90}
     91.entry-title a:hover {
     92    color: #e4741f;
     93}
     94.entry-meta {
     95    color: #999;
     96}
     97.entry-content h1,
     98.entry-content h2,
     99.comment-content h1,
     100.comment-content h2 {
     101    color: #fff;
     102}
     103.entry-content table,
     104.comment-content table {
     105    border-color: #222;
     106}
     107.entry-content th,
     108.comment-content th {
     109    color: #999;
     110}
     111.entry-content td,
     112.comment-content td {
     113    border-color: #222;
     114}
     115.page-link {
     116    background: #0e0e0e;
     117    border-color: #222;
     118    color: #777;
     119}
     120.page-link a {
     121    background: #272727;
     122    color: #bbb;
     123}
     124.page-link a:hover {
     125    background: #888;
     126    color: #000;
     127}
     128.entry-meta .edit-link a {
     129    background: #555;
     130    color: #000;
     131}
     132.entry-meta .edit-link a:hover {
     133    background: #888;
     134}
     135
     136/* Author Info */
     137.singular #author-info {
     138    background: #060606;
     139    border-color: #222;
     140}
     141.archive #author-info {
     142    border-color: #222;
     143}
     144#author-avatar img {
     145    background: #000;
     146    -webkit-box-shadow: 0 1px 2px #444;
     147    -moz-box-shadow: 0 1px 2px #444;
     148    box-shadow: 0 1px 2px #444;
     149}
     150#author-description h2 {
     151    color: #fff;
     152}
     153
     154/* Comments link */
     155.entry-header .comments-link a {
     156    background: #111;
     157    border-color: #222;
     158    color: #888;
     159}
     160.entry-header .comments-link a:hover {
     161    background: #888;
     162    border-color: #aaa;
     163    color: #000;
     164}
     165
     166/* Singular content styles for Posts and Pages */
     167.singular .entry-title {
     168    color: #fff;
     169}
     170.singular .entry-meta .edit-link a {
     171    color: #000;
     172}
     173
     174
     175/* =Status
     176----------------------------------------------- */
     177
     178.format-status img.avatar {
     179    -webkit-box-shadow: 0 1px 2px #333;
     180    -moz-box-shadow: 0 1px 2px #333;
     181    box-shadow: 0 1px 2px #333;
     182}
     183
     184
     185/* =Quote
     186----------------------------------------------- */
     187
     188.format-quote blockquote {
     189    color: #aaa;
     190}
     191
     192
     193/* =error404
     194----------------------------------------------- */
     195.error404 #main #searchform {
     196    background: #060606;
     197    border-color: #222;
     198}
     199
     200
     201/* =Showcase
     202----------------------------------------------- */
     203
     204h1.showcase-heading {
     205    color: #ccc;
     206}
     207
     208/* Intro */
     209article.intro {
     210    background: #060606;
     211}
     212article.intro .entry-content {
     213    color: #eee;
     214}
     215article.intro .edit-link a {
     216    background: #555;
     217    color: #000;
     218}
     219article.intro .edit-link a:hover {
     220    background: #888;
     221}
     222
     223/* Featured post */
     224section.featured-post .hentry {
     225    color: #999;
     226}
     227
     228/* Small featured post */
     229section.featured-post .attachment-small-feature {
     230    border-color: #444;
     231}
     232section.featured-post .attachment-small-feature:hover {
     233    border-color: #777;
     234}
     235article.feature-image.small .entry-summary {
     236    color: #aaa;
     237}
     238article.feature-image.small .entry-summary p a {
     239    background: #ddd;
     240    color: #111;
     241}
     242article.feature-image.small .entry-summary p a:hover {
     243    background: #e4741f;
     244    color: #40220c;
     245}
     246
     247/* Large featured post */
     248article.feature-image.large .entry-title a {
     249    background: #ddd;
     250    background: rgba(0,0,0,0.8);
     251    color: #000;
     252}
     253section.feature-image.large:hover .entry-title a,
     254section.feature-image.large .entry-title:hover a {
     255    background: #111;
     256    background: rgba(255,255,255,0.8);
     257    color: #ddd;
     258}
     259section.feature-image.large img {
     260    border-bottom: 1px solid #222;
     261}
     262
     263/* Featured Slider */
     264.featured-posts {
     265    border-bottom: 1px solid #171717;
     266}
     267.featured-posts section.featured-post {
     268    background: #000;
     269}
     270.feature-slider a {
     271    background: #c3c3c3;
     272    background: rgba(60,60,60,0.9);
     273    -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
     274    -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
     275    box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
     276}
     277.feature-slider a.active {
     278    background: #000;
     279    background: rgba(255,255,255,0.8);
     280    -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
     281    -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
     282    box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
     283}
     284
     285/* Recent Posts */
     286section.recent-posts .other-recent-posts {
     287    border-color: #222;
     288}
     289section.recent-posts .other-recent-posts .entry-title {
     290    border-color: #222;
     291}
     292section.recent-posts .other-recent-posts a[rel="bookmark"] {
     293    color: #ccc;
     294}
     295section.recent-posts .other-recent-posts a[rel="bookmark"]:hover {
     296    color: #e4741f;
     297}
     298section.recent-posts .other-recent-posts .comments-link a,
     299section.recent-posts .other-recent-posts .comments-link > span {
     300    border-color: #666;
     301    color: #bbb;
     302}
     303section.recent-posts .other-recent-posts .comments-link > span {
     304    border-color: #444;
     305    color: #777;
     306}
     307section.recent-posts .other-recent-posts .comments-link a:hover {
     308    color: #e4741f;
     309    border-color: #e4741f;
     310}
     311
     312
     313/* =Attachments
     314----------------------------------------------- */
     315
     316.image-attachment div.attachment {
     317    background: #060606;
     318    border-color: #222;
     319}
     320
     321
     322/* =Images
     323----------------------------------------------- */
     324
     325.wp-caption {
     326    background: #0b0d12;
     327}
     328.wp-caption .wp-caption-text {
     329    color: #999;
     330}
     331.wp-caption .wp-caption-text:before {
     332    color: #64759d;
     333}
     334
     335
     336/* =Widgets
     337----------------------------------------------- */
     338
     339.widget-title {
     340    color: #ccc;
     341}
     342.widget ul li {
     343    color: #888;
     344}
     345
     346/* Search Widget */
     347.widget_search #searchsubmit {
     348    background: #222;
     349    border-color: #333;
     350    -webkit-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
     351    -moz-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
     352    box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
     353    color: #777;
     354}
     355.widget_search #searchsubmit:active {
     356    background: #e4741f;
     357    border-color: #f79e5a;
     358    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
     359    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
     360    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
     361    color: #40220c;
     362}
     363
     364/* Calendar Widget */
     365.widget_calendar #wp-calendar {
     366    color: #aaa;
     367}
     368.widget_calendar #wp-calendar th {
     369    background: #0b0b0b;
     370    border-color: #333;
     371}
     372.widget_calendar #wp-calendar tfoot td {
     373    background: #0b0b0b;
     374    border-color: #333;
     375}
     376
     377
     378/* =Comments
     379----------------------------------------------- */
     380
     381#comments-title {
     382    color: #bbb;
     383}
     384.nocomments {
     385    color: #555;
     386}
     387.commentlist > li.comment {
     388    background: #090909;
     389    border-color: #222;
     390}
     391.commentlist .children li.comment {
     392    background: #000;
     393    border-color: #222;
     394}
     395.comment-meta {
     396    color: #999;
     397}
     398.commentlist > li:before {
     399    content: url(images/comment-arrow.png) no-repeat;
     400}
     401
     402/* Post author highlighting */
     403.commentlist > li.bypostauthor {
     404    background: #ddd;
     405    border-color: #fff;
     406    color: #333;
     407}
     408.commentlist > li.bypostauthor .comment-meta {
     409    color: #333;
     410}
     411.commentlist > li.bypostauthor:before {
     412    content: url(images/comment-arrow-bypostauthor.png);
     413}
     414
     415/* Post Author threaded comments */
     416.commentlist .children > li.bypostauthor {
     417    background: #ddd;
     418    border-color: #fff;
     419}
     420.commentlist .children > li.bypostauthor > article,
     421.commentlist .children > li.bypostauthor > article .comment-meta {
     422    color: #333;
     423}
     424.commentlist .children > li.bypostauthor > article .comment-reply-link {
     425    color: #333;
     426}
     427
     428/* Comment Form */
     429#respond {
     430    background: #222;
     431    border-color: #2c2c2c;
     432    color: #bbb;
     433}
     434#respond input[type="text"],
     435#respond textarea {
     436    background: #000;
     437    border: 4px solid #111;
     438    -webkit-box-shadow: inset 0 1px 3px #333;
     439    -moz-box-shadow: inset 0 1px 3px #333;
     440    box-shadow: inset 0 1px 3px #333;
     441}
     442#respond .comment-form-author label,
     443#respond .comment-form-email label,
     444#respond .comment-form-url label,
     445#respond .comment-form-comment label {
     446    background: #111;
     447    -webkit-box-shadow: 1px 1px 2px #333;
     448    -moz-box-shadow: 1px 1px 2px #333;
     449    box-shadow: 1px 1px 2px #333;
     450    color: #aaa;
     451}
     452#respond .comment-form-author .required,
     453#respond .comment-form-email .required {
     454    color: #42caff;
     455}
     456#respond input#submit {
     457    background: #ddd;
     458    -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
     459    -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
     460    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
     461    color: #111;
     462    text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
     463}
     464#respond input#submit:active {
     465    background: #e4741f;
     466    color: #40220c;
     467}
     468#respond #cancel-comment-reply-link {
     469    color: #999;
     470}
     471#reply-title {
     472    color: #ccc;
     473}
     474#cancel-comment-reply-link {
     475    color: #777;
     476}
     477#cancel-comment-reply-link:focus,
     478#cancel-comment-reply-link:active,
     479#cancel-comment-reply-link:hover {
     480    color: #00b4cc;
     481}
     482
     483
     484/* =Footer
     485----------------------------------------------- */
     486
     487#supplementary {
     488    border-color: #222;
     489}
     490
     491/* Site Generator Line */
     492#site-generator {
     493    background: #060606;
     494    border-color: #222;
     495}
     496
     497
     498/* =Print
     499----------------------------------------------- */
     500
     501@media print {
     502    body {
     503        color: #333;
     504        background: none !important;
     505    }
     506    #page {
     507        background: none !important;
     508    }
     509
     510    /* Comments */
     511    .commentlist > li.comment {
     512    }
     513   
     514    /* Post author highlighting */
     515    .commentlist > li.bypostauthor {
     516        color: #333;
     517    }
     518    .commentlist > li.bypostauthor .comment-meta {
     519        color: #666;
     520    }
     521    .commentlist > li:before {
     522        content: none;
     523    }
     524
     525    /* Post Author threaded comments */
     526    .commentlist .children > li.bypostauthor {
     527        background: #fff;
     528        border-color: #ddd;
     529    }
     530    .commentlist .children > li.bypostauthor > article,
     531    .commentlist .children > li.bypostauthor > article .comment-meta {
     532        color: #666;
     533    }
  • trunk/wp-content/themes/twentyeleven/style.css

    r17755 r17756  
    482482#branding img {
    483483    height: auto;
    484     margin-bottom: -6px;
     484    margin-bottom: -7px;
    485485    width: 100%;
    486486}
     
    622622
    623623#main {
    624     border-top: 2px solid #eee;
    625     -webkit-box-shadow: 0 -1px 0 #dee7b1;
    626     -moz-box-shadow: 0 -1px 0 #dee7b1;
    627     box-shadow: 0 -1px 0 #dee7b1;
    628624    clear: both;
    629625    padding: 1.625em 0 0;
     
    10521048    background: #f9f9f9;
    10531049    border-bottom: none;
    1054     border-top: 5px solid #6F98A8;
    1055     -webkit-box-shadow: 0 -5px 0 #305A7A;
    1056     -moz-box-shadow: 0 -5px 0 #305A7A;
    1057     box-shadow: 0 -5px 0 #305A7A;
    10581050    margin: -1.855em -8.9% 1.625em;
    10591051    padding: 0 8.9%;
    1060     /* border-top: 5px solid #94BB32;
    1061     -webkit-box-shadow: 0 -5px 0 #506815; */
    10621052}
    10631053article.intro .entry-title {
Note: See TracChangeset for help on using the changeset viewer.