Changeset 17756

Timestamp:

04/28/2011 10:15:36 PM (12 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:

• colors/dark.css (modified) (1 diff)
• style.css (modified) (3 diffs)

trunk/wp-content/themes/twentyeleven/colors/dark.css

@@ -1 @@
-/* Placeholder for a Twenty Eleven dark color scheme */
+/*
+    A dark color scheme for Twenty Eleven
+*/
+
+/* =Global
+----------------------------------------------- */
+
+body {
+    background: #1d1d1d;
+    color: #bbb;
+}
+#page {
+    background: #0f0f0f;
+}
+
+/* Headings */
+hr {
+    background-color: #333;
+}
+
+/* Text elements */
+blockquote cite {
+    color: #999;
+}
+pre {
+    background: #0b0b0b;
+}
+code, kbd {
+    font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
+}
+abbr, acronym, dfn {
+    border-bottom: 1px dotted #999;
+}
+ins {
+    background: #00063f;
+}
+input[type=text],
+textarea {
+    border: 1px solid #222;
+}
+input[type=text]:focus,
+textarea:focus {
+}
+
+/* Links */
+a {
+    color: #e4741f;
+}
+
+
+/* =Header
+----------------------------------------------- */
+
+#branding {
+    border-top: 2px solid #444;
+}
+#site-title a {
+    color: #eee;
+}
+#site-description {
+    color: #858585;
+}
+#branding #s {
+    background-color: #fff;
+}
+
+
+/* =Menu
+----------------------------------------------- */
+
+#access {
+    border-bottom: 1px solid #222;
+}
+
+/* =Content
+----------------------------------------------- */
+
+.page-title {
+    color: #ccc;
+}
+.hentry {
+    border-color: #222;
+}
+.entry-title {
+    color: #ddd;
+}
+.entry-title,
+.entry-title a {
+    color: #ddd;
+}
+.entry-title a:hover {
+    color: #e4741f;
+}
+.entry-meta {
+    color: #999;
+}
+.entry-content h1,
+.entry-content h2,
+.comment-content h1,
+.comment-content h2 {
+    color: #fff;
+}
+.entry-content table,
+.comment-content table {
+    border-color: #222;
+}
+.entry-content th,
+.comment-content th {
+    color: #999;
+}
+.entry-content td,
+.comment-content td {
+    border-color: #222;
+}
+.page-link {
+    background: #0e0e0e;
+    border-color: #222;
+    color: #777;
+}
+.page-link a {
+    background: #272727;
+    color: #bbb;
+}
+.page-link a:hover {
+    background: #888;
+    color: #000;
+}
+.entry-meta .edit-link a {
+    background: #555;
+    color: #000;
+}
+.entry-meta .edit-link a:hover {
+    background: #888;
+}
+
+/* Author Info */
+.singular #author-info {
+    background: #060606;
+    border-color: #222;
+}
+.archive #author-info {
+    border-color: #222;
+}
+#author-avatar img {
+    background: #000;
+    -webkit-box-shadow: 0 1px 2px #444;
+    -moz-box-shadow: 0 1px 2px #444;
+    box-shadow: 0 1px 2px #444;
+}
+#author-description h2 {
+    color: #fff;
+}
+
+/* Comments link */
+.entry-header .comments-link a {
+    background: #111;
+    border-color: #222;
+    color: #888;
+}
+.entry-header .comments-link a:hover {
+    background: #888;
+    border-color: #aaa;
+    color: #000;
+}
+
+/* Singular content styles for Posts and Pages */
+.singular .entry-title {
+    color: #fff;
+}
+.singular .entry-meta .edit-link a {
+    color: #000;
+}
+
+
+/* =Status
+----------------------------------------------- */
+
+.format-status img.avatar {
+    -webkit-box-shadow: 0 1px 2px #333;
+    -moz-box-shadow: 0 1px 2px #333;
+    box-shadow: 0 1px 2px #333;
+}
+
+
+/* =Quote
+----------------------------------------------- */
+
+.format-quote blockquote {
+    color: #aaa;
+}
+
+
+/* =error404
+----------------------------------------------- */
+.error404 #main #searchform {
+    background: #060606;
+    border-color: #222;
+}
+
+
+/* =Showcase
+----------------------------------------------- */
+
+h1.showcase-heading {
+    color: #ccc;
+}
+
+/* Intro */
+article.intro {
+    background: #060606;
+}
+article.intro .entry-content {
+    color: #eee;
+}
+article.intro .edit-link a {
+    background: #555;
+    color: #000;
+}
+article.intro .edit-link a:hover {
+    background: #888;
+}
+
+/* Featured post */
+section.featured-post .hentry {
+    color: #999;
+}
+
+/* Small featured post */
+section.featured-post .attachment-small-feature {
+    border-color: #444;
+}
+section.featured-post .attachment-small-feature:hover {
+    border-color: #777;
+}
+article.feature-image.small .entry-summary {
+    color: #aaa;
+}
+article.feature-image.small .entry-summary p a {
+    background: #ddd;
+    color: #111;
+}
+article.feature-image.small .entry-summary p a:hover {
+    background: #e4741f;
+    color: #40220c;
+}
+
+/* Large featured post */
+article.feature-image.large .entry-title a {
+    background: #ddd;
+    background: rgba(0,0,0,0.8);
+    color: #000;
+}
+section.feature-image.large:hover .entry-title a,
+section.feature-image.large .entry-title:hover a {
+    background: #111;
+    background: rgba(255,255,255,0.8);
+    color: #ddd;
+}
+section.feature-image.large img {
+    border-bottom: 1px solid #222;
+}
+
+/* Featured Slider */
+.featured-posts {
+    border-bottom: 1px solid #171717;
+}
+.featured-posts section.featured-post {
+    background: #000;
+}
+.feature-slider a {
+    background: #c3c3c3;
+    background: rgba(60,60,60,0.9);
+    -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
+    -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
+    box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5);
+}
+.feature-slider a.active {
+    background: #000;
+    background: rgba(255,255,255,0.8);
+    -webkit-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
+    -moz-box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
+    box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8);
+}
+
+/* Recent Posts */
+section.recent-posts .other-recent-posts {
+    border-color: #222;
+}
+section.recent-posts .other-recent-posts .entry-title {
+    border-color: #222;
+}
+section.recent-posts .other-recent-posts a[rel="bookmark"] {
+    color: #ccc;
+}
+section.recent-posts .other-recent-posts a[rel="bookmark"]:hover {
+    color: #e4741f;
+}
+section.recent-posts .other-recent-posts .comments-link a,
+section.recent-posts .other-recent-posts .comments-link > span {
+    border-color: #666;
+    color: #bbb;
+}
+section.recent-posts .other-recent-posts .comments-link > span {
+    border-color: #444;
+    color: #777;
+}
+section.recent-posts .other-recent-posts .comments-link a:hover {
+    color: #e4741f;
+    border-color: #e4741f;
+}
+
+
+/* =Attachments
+----------------------------------------------- */
+
+.image-attachment div.attachment {
+    background: #060606;
+    border-color: #222;
+}
+
+
+/* =Images
+----------------------------------------------- */
+
+.wp-caption {
+    background: #0b0d12;
+}
+.wp-caption .wp-caption-text {
+    color: #999;
+}
+.wp-caption .wp-caption-text:before {
+    color: #64759d;
+}
+
+
+/* =Widgets
+----------------------------------------------- */
+
+.widget-title {
+    color: #ccc;
+}
+.widget ul li {
+    color: #888;
+}
+
+/* Search Widget */
+.widget_search #searchsubmit {
+    background: #222;
+    border-color: #333;
+    -webkit-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
+    -moz-box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
+    box-shadow: inset 0px -1px 1px rgba(0, 0, 0, 0.09);
+    color: #777;
+}
+.widget_search #searchsubmit:active {
+    background: #e4741f;
+    border-color: #f79e5a;
+    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
+    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
+    color: #40220c;
+}
+
+/* Calendar Widget */
+.widget_calendar #wp-calendar {
+    color: #aaa;
+}
+.widget_calendar #wp-calendar th {
+    background: #0b0b0b;
+    border-color: #333;
+}
+.widget_calendar #wp-calendar tfoot td {
+    background: #0b0b0b;
+    border-color: #333;
+}
+
+
+/* =Comments
+----------------------------------------------- */
+
+#comments-title {
+    color: #bbb;
+}
+.nocomments {
+    color: #555;
+}
+.commentlist > li.comment {
+    background: #090909;
+    border-color: #222;
+}
+.commentlist .children li.comment {
+    background: #000;
+    border-color: #222;
+}
+.comment-meta {
+    color: #999;
+}
+.commentlist > li:before {
+    content: url(images/comment-arrow.png) no-repeat;
+}
+
+/* Post author highlighting */
+.commentlist > li.bypostauthor {
+    background: #ddd;
+    border-color: #fff;
+    color: #333;
+}
+.commentlist > li.bypostauthor .comment-meta {
+    color: #333;
+}
+.commentlist > li.bypostauthor:before {
+    content: url(images/comment-arrow-bypostauthor.png);
+}
+
+/* Post Author threaded comments */
+.commentlist .children > li.bypostauthor {
+    background: #ddd;
+    border-color: #fff;
+}
+.commentlist .children > li.bypostauthor > article,
+.commentlist .children > li.bypostauthor > article .comment-meta {
+    color: #333;
+}
+.commentlist .children > li.bypostauthor > article .comment-reply-link {
+    color: #333;
+}
+
+/* Comment Form */
+#respond {
+    background: #222;
+    border-color: #2c2c2c;
+    color: #bbb;
+}
+#respond input[type="text"],
+#respond textarea {
+    background: #000;
+    border: 4px solid #111;
+    -webkit-box-shadow: inset 0 1px 3px #333;
+    -moz-box-shadow: inset 0 1px 3px #333;
+    box-shadow: inset 0 1px 3px #333;
+}
+#respond .comment-form-author label,
+#respond .comment-form-email label,
+#respond .comment-form-url label,
+#respond .comment-form-comment label {
+    background: #111;
+    -webkit-box-shadow: 1px 1px 2px #333;
+    -moz-box-shadow: 1px 1px 2px #333;
+    box-shadow: 1px 1px 2px #333;
+    color: #aaa;
+}
+#respond .comment-form-author .required,
+#respond .comment-form-email .required {
+    color: #42caff;
+}
+#respond input#submit {
+    background: #ddd;
+    -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
+    -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
+    box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
+    color: #111;
+    text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
+}
+#respond input#submit:active {
+    background: #e4741f;
+    color: #40220c;
+}
+#respond #cancel-comment-reply-link {
+    color: #999;
+}
+#reply-title {
+    color: #ccc;
+}
+#cancel-comment-reply-link {
+    color: #777;
+}
+#cancel-comment-reply-link:focus,
+#cancel-comment-reply-link:active,
+#cancel-comment-reply-link:hover {
+    color: #00b4cc;
+}
+
+
+/* =Footer
+----------------------------------------------- */
+
+#supplementary {
+    border-color: #222;
+}
+
+/* Site Generator Line */
+#site-generator {
+    background: #060606;
+    border-color: #222;
+}
+
+
+/* =Print
+----------------------------------------------- */
+
+@media print {
+    body {
+        color: #333;
+        background: none !important;
+    }
+    #page {
+        background: none !important;
+    }
+
+    /* Comments */
+    .commentlist > li.comment {
+    }
+    
+    /* Post author highlighting */
+    .commentlist > li.bypostauthor {
+        color: #333;
+    }
+    .commentlist > li.bypostauthor .comment-meta {
+        color: #666;
+    }
+    .commentlist > li:before {
+        content: none;
+    }
+
+    /* Post Author threaded comments */
+    .commentlist .children > li.bypostauthor {
+        background: #fff;
+        border-color: #ddd;
+    }
+    .commentlist .children > li.bypostauthor > article,
+    .commentlist .children > li.bypostauthor > article .comment-meta {
+        color: #666;
+    }

trunk/wp-content/themes/twentyeleven/style.css

@@ -482 +482 @@
 #branding img {
     height: auto;
-    margin-bottom: -6px;
+    margin-bottom: -7px;
     width: 100%;
 }
@@ -622 +622 @@
 
 #main {
-    border-top: 2px solid #eee;
-    -webkit-box-shadow: 0 -1px 0 #dee7b1;
-    -moz-box-shadow: 0 -1px 0 #dee7b1;
-    box-shadow: 0 -1px 0 #dee7b1;
     clear: both;
     padding: 1.625em 0 0;
@@ -1052 +1048 @@
     background: #f9f9f9;
     border-bottom: none;
-    border-top: 5px solid #6F98A8;
-    -webkit-box-shadow: 0 -5px 0 #305A7A;
-    -moz-box-shadow: 0 -5px 0 #305A7A;
-    box-shadow: 0 -5px 0 #305A7A;
     margin: -1.855em -8.9% 1.625em;
     padding: 0 8.9%;
-    /* border-top: 5px solid #94BB32;
-    -webkit-box-shadow: 0 -5px 0 #506815; */
 }
 article.intro .entry-title {