Last active
October 13, 2015 00:08
-
-
Save mannieschumpert/4108001 to your computer and use it in GitHub Desktop.
TwentyTwelve Sass-ified
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* In making a child theme of Twenty Twelve, I didn't want to use the standard @import in the production CSS. | |
* Since I'm using Sass, I "Sass-ified" Twenty Twelve so that it could be imported directly into my own stylesheet. | |
* This way it can be minifed, and I can save an http request. Double win. | |
* I removed a lot of comments, because the .sass syntax is really particular about formatting. | |
* I preserved the line numbering just in case the files needed comparing (thus all the blank lines). | |
* | |
* (FYI, I'm enqueueing a different stylesheet in the theme files than the one that identifies the theme.) | |
*/ | |
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video | |
margin: 0 | |
padding: 0 | |
border: 0 | |
font-size: 100% | |
vertical-align: baseline | |
body | |
line-height: 1 | |
ol, | |
ul | |
list-style: none | |
blockquote, | |
q | |
quotes: none | |
blockquote:before, | |
blockquote:after, | |
q:before, | |
q:after | |
content: '' | |
content: none | |
table | |
border-collapse: collapse | |
border-spacing: 0 | |
caption, | |
th, | |
td | |
font-weight: normal | |
text-align: left | |
h1, | |
h2, | |
h3, | |
h4, | |
h5, | |
h6 | |
clear: both | |
html | |
overflow-y: scroll | |
font-size: 100% | |
-webkit-text-size-adjust: 100% | |
-ms-text-size-adjust: 100% | |
a:focus | |
outline: thin dotted | |
article, | |
aside, | |
details, | |
figcaption, | |
figure, | |
footer, | |
header, | |
hgroup, | |
nav, | |
section | |
display: block | |
audio, | |
canvas, | |
video | |
display: inline-block | |
audio:not([controls]) | |
display: none | |
del | |
color: #333 | |
ins | |
background: #fff9c0 | |
text-decoration: none | |
hr | |
background-color: #ccc | |
border: 0 | |
height: 1px | |
margin: 24px | |
margin-bottom: 1.714285714rem | |
sub, | |
sup | |
font-size: 75% | |
line-height: 0 | |
position: relative | |
vertical-align: baseline | |
sup | |
top: -0.5em | |
sub | |
bottom: -0.25em | |
img | |
border: 0 | |
-ms-interpolation-mode: bicubic | |
/* Clearing floats */ | |
.clear:after, | |
.wrapper:after, | |
.format-status .entry-header:after | |
clear: both | |
.clear:before, | |
.clear:after, | |
.wrapper:before, | |
.wrapper:after, | |
.format-status .entry-header:before, | |
.format-status .entry-header:after | |
display: table | |
content: "" | |
/* Small headers */ | |
.archive-title, | |
.page-title, | |
.widget-title, | |
.entry-content th, | |
.comment-content th | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 2.181818182 | |
font-weight: bold | |
text-transform: uppercase | |
color: #636363 | |
/* Shared Post Format styling */ | |
article.format-quote footer.entry-meta, | |
article.format-link footer.entry-meta, | |
article.format-status footer.entry-meta | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 2.181818182 | |
/* Buttons */ | |
.menu-toggle, | |
input[type="submit"], | |
article.post-password-required input[type=submit], | |
li.bypostauthor cite span | |
padding: 6px 10px | |
padding: 0.428571429rem 0.714285714rem | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 1.428571429 | |
font-weight: normal | |
color: #7c7c7c | |
background-color: #e6e6e6 | |
background-repeat: repeat-x | |
background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6) | |
background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6) | |
background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6) | |
background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6) | |
background-image: linear-gradient(top, #f4f4f4, #e6e6e6) | |
border: 1px solid #d2d2d2 | |
border-radius: 3px | |
box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1) | |
.menu-toggle, | |
input[type="submit"], | |
article.post-password-required input[type=submit] | |
cursor: pointer | |
.menu-toggle:hover, | |
input[type="submit"]:hover, | |
article.post-password-required input[type=submit]:hover | |
color: #5e5e5e | |
background-color: #ebebeb | |
background-repeat: repeat-x | |
background-image: -moz-linear-gradient(top, #f9f9f9, #ebebeb) | |
background-image: -ms-linear-gradient(top, #f9f9f9, #ebebeb) | |
background-image: -webkit-linear-gradient(top, #f9f9f9, #ebebeb) | |
background-image: -o-linear-gradient(top, #f9f9f9, #ebebeb) | |
background-image: linear-gradient(top, #f9f9f9, #ebebeb) | |
.menu-toggle:active, | |
.menu-toggle.toggled-on, | |
input[type="submit"]:active, | |
article.post-password-required input[type=submit]:active, | |
input[type="submit"].toggled-on | |
color: #777 | |
background-color: #e1e1e1 | |
background-repeat: repeat-x | |
background-image: -moz-linear-gradient(top, #ebebeb, #e1e1e1) | |
background-image: -ms-linear-gradient(top, #ebebeb, #e1e1e1) | |
background-image: -webkit-linear-gradient(top, #ebebeb, #e1e1e1) | |
background-image: -o-linear-gradient(top, #ebebeb, #e1e1e1) | |
background-image: linear-gradient(top, #ebebeb, #e1e1e1) | |
box-shadow: inset 0 0 8px 2px #c6c6c6, 0 1px 0 0 #f4f4f4 | |
border: none | |
li.bypostauthor cite span | |
color: #fff | |
background-color: #21759b | |
background-image: none | |
border: 1px solid #1f6f93 | |
border-radius: 2px | |
box-shadow: none | |
padding: 0 | |
/* Form fields */ | |
input[type="text"], | |
input[type="password"], | |
input[type="email"], | |
input[type="url"], | |
textarea | |
padding: 6px | |
padding: 0.428571429rem | |
font-family: inherit | |
border: 1px solid #ccc | |
border-radius: 3px | |
/* Responsive images */ | |
.entry-content img, | |
.comment-content img, | |
.widget img | |
max-width: 100% | |
img[class*="align"], | |
img[class*="wp-image-"], | |
img[class*="attachment-"] | |
height: auto | |
img.size-full, | |
img.size-large, | |
img.header-image, | |
img.wp-post-image | |
max-width: 100% | |
height: auto | |
/* Make sure videos and embeds fit their containers */ | |
embed, | |
iframe, | |
object, | |
video | |
max-width: 100% | |
.entry-content .twitter-tweet-rendered | |
max-width: 100% !important | |
/* Images */ | |
.alignleft | |
float: left | |
.alignright | |
float: right | |
.aligncenter | |
display: block | |
margin-left: auto | |
margin-right: auto | |
.entry-content img, | |
.comment-content img, | |
.widget img, | |
img.header-image, | |
.author-avatar img, | |
img.wp-post-image | |
/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */ | |
border-radius: 3px | |
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) | |
.wp-caption | |
max-width: 100% | |
padding: 4px | |
.wp-caption .wp-caption-text, | |
.gallery-caption, | |
.entry-caption | |
font-style: italic | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
color: #777 | |
img.wp-smiley, | |
.rsswidget img | |
border: 0 | |
border-radius: 0 | |
box-shadow: none | |
margin-bottom: 0 | |
margin-top: 0 | |
padding: 0 | |
.entry-content dl.gallery-item | |
margin: 0 | |
.gallery-item a | |
display: block | |
width: 90% | |
.gallery-columns-1 .gallery-item a | |
max-width: 100% | |
width: auto | |
.gallery .gallery-icon img | |
height: auto | |
max-width: 90% | |
padding: 5% | |
.gallery-columns-1 .gallery-icon img | |
padding: 3% | |
/* Navigation */ | |
.site-content nav | |
clear: both | |
line-height: 2 | |
overflow: hidden | |
#nav-above | |
padding: 24px 0 | |
padding: 1.714285714rem 0 | |
#nav-above | |
display: none | |
.paged #nav-above | |
display: block | |
.nav-previous, | |
.previous-image | |
float: left | |
width: 50% | |
.nav-next, | |
.next-image | |
float: right | |
text-align: right | |
width: 50% | |
.nav-single + .comments-area, | |
#comment-nav-above | |
margin: 48px 0 | |
margin: 3.428571429rem 0 | |
/* Author profiles */ | |
.author .archive-header | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.author-info | |
border-top: 1px solid #ededed | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
padding-top: 24px | |
padding-top: 1.714285714rem | |
overflow: hidden | |
.author-description p | |
color: #777 | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
.author.archive .author-info | |
border-top: 0 | |
margin: 0 0 48px | |
margin: 0 0 3.428571429rem | |
.author.archive .author-avatar | |
margin-top: 0 | |
/* =Basic structure */ | |
/* Body, links, basics */ | |
html | |
font-size: 87.5% | |
body | |
font-size: 14px | |
font-size: 1rem | |
font-family: Helvetica, Arial, sans-serif | |
text-rendering: optimizeLegibility | |
color: #444 | |
body.custom-font-enabled | |
font-family: "Open Sans", Helvetica, Arial, sans-serif | |
a | |
outline: none | |
color: #21759b | |
a:hover | |
color: #0f3647 | |
/* Assistive text */ | |
.skip-link, | |
.screen-reader-text, | |
.assistive-text | |
position: absolute !important | |
clip: rect(1px, 1px, 1px, 1px) | |
/* Page structure */ | |
.site | |
padding: 0 24px | |
padding: 0 1.714285714rem | |
background-color: #fff | |
.site-content | |
margin: 24px 0 0 | |
margin: 1.714285714rem 0 0 | |
.widget-area | |
margin: 24px 0 0 | |
margin: 1.714285714rem 0 0 | |
/* Header */ | |
.site-header | |
padding: 24px 0 | |
padding: 1.714285714rem 0 | |
.site-header h1, | |
.site-header h2 | |
text-align: center | |
.site-header h1 a, | |
.site-header h2 a | |
color: #515151 | |
display: inline-block | |
text-decoration: none | |
.site-header h1 a:hover, | |
.site-header h2 a:hover | |
color: #21759b | |
.site-header h1 | |
font-size: 24px | |
font-size: 1.714285714rem | |
line-height: 2 | |
.site-header h2 | |
font-weight: normal | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #777 | |
.header-image | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
/* Navigation Menu */ | |
.main-navigation | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
text-align: center | |
.main-navigation li | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 1.42857143 | |
.main-navigation a | |
color: #5e5e5e | |
.main-navigation a:hover | |
color: #21759b | |
.main-navigation ul.nav-menu, | |
.main-navigation div.nav-menu > ul | |
display: none | |
.main-navigation ul.nav-menu.toggled-on, | |
.menu-toggle | |
display: inline-block | |
/* Banner */ | |
section[role="banner"] | |
margin-bottom: 48px | |
margin-bottom: 3.428571429rem | |
/* Sidebar */ | |
.widget-area .widget | |
word-wrap: break-word | |
-webkit-hyphens: auto | |
-moz-hyphens: auto | |
hyphens: auto | |
margin-bottom: 48px | |
margin-bottom: 3.428571429rem | |
.widget-area .widget h3 | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.widget-area .widget p, | |
.widget-area .widget li, | |
.widget-area .widget .textwidget | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
.widget-area .widget p | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.widget-area .textwidget ul | |
list-style: disc outside | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
.widget-area .textwidget li | |
margin-left: 36px | |
margin-left: 2.571428571rem | |
.widget-area .widget a | |
color: #777 | |
.widget-area .widget a:hover | |
color: #21759b | |
/* Footer */ | |
footer[role="contentinfo"] | |
border-top: 1px solid #ededed | |
clear: both | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
max-width: 960px | |
max-width: 68.571428571rem | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
margin-left: auto | |
margin-right: auto | |
padding: 24px 0 | |
padding: 1.714285714rem 0 | |
footer[role="contentinfo"] a | |
color: #686868 | |
footer[role="contentinfo"] a:hover | |
color: #21759b | |
/* =Main content */ | |
.entry-meta | |
clear: both | |
.entry-header | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.entry-header img.wp-post-image | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.entry-header .entry-title | |
font-size: 20px | |
font-size: 1.428571429rem | |
line-height: 1.2 | |
font-weight: normal | |
.entry-header .entry-title a | |
text-decoration: none | |
.entry-header .entry-format | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
font-weight: normal | |
.entry-header .comments-link | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #777 | |
.comments-link a, | |
.entry-meta a | |
color: #777 | |
.comments-link a:hover, | |
.entry-meta a:hover | |
color: #21759b | |
article.sticky .featured-post | |
border-top: 4px double #ededed | |
border-bottom: 4px double #ededed | |
color: #777 | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 3.692307692 | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
text-align: center | |
.entry-content, | |
.entry-summary | |
line-height: 1.714285714 | |
.entry-content h1, | |
.comment-content h1, | |
.entry-content h2, | |
.comment-content h2, | |
.entry-content h3, | |
.comment-content h3, | |
.entry-content h4, | |
.comment-content h4, | |
.entry-content h5, | |
.comment-content h5, | |
.entry-content h6, | |
.comment-content h6 | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
line-height: 1.714285714 | |
.entry-content h1, | |
.comment-content h1 | |
font-size: 21px | |
font-size: 1.5rem | |
line-height: 1.5 | |
.entry-content h2, | |
.comment-content h2 | |
font-size: 18px | |
font-size: 1.285714286rem | |
line-height: 1.6 | |
.entry-content h3, | |
.comment-content h3 | |
font-size: 16px | |
font-size: 1.142857143rem | |
line-height: 1.846153846 | |
.entry-content h4, | |
.comment-content h4 | |
font-size: 14px | |
font-size: 1rem | |
line-height: 1.846153846 | |
.entry-content h5, | |
.comment-content h5 | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
.entry-content h6, | |
.comment-content h6 | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 1.846153846 | |
.entry-content p, | |
.entry-summary p, | |
.comment-content p | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
line-height: 1.714285714 | |
.entry-content ol, | |
.comment-content ol, | |
.entry-content ul, | |
.comment-content ul | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
line-height: 1.714285714 | |
.entry-content ul ul, | |
.comment-content ul ul, | |
.entry-content ol ol, | |
.comment-content ol ol, | |
.entry-content ul ol, | |
.comment-content ul ol, | |
.entry-content ol ul, | |
.comment-content ol ul | |
margin-bottom: 0 | |
.entry-content ul, | |
.comment-content ul | |
list-style: disc outside | |
.entry-content ol, | |
.comment-content ol | |
list-style: decimal outside | |
.entry-content li, | |
.comment-content li | |
margin: 0 0 0 36px | |
margin: 0 0 0 2.571428571rem | |
.entry-content blockquote, | |
.comment-content blockquote | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
padding: 24px | |
padding: 1.714285714rem | |
font-style: italic | |
.entry-content blockquote p:last-child, | |
.comment-content blockquote p:last-child | |
margin-bottom: 0 | |
.entry-content code, | |
.comment-content code | |
font-family: Consolas, Monaco, Lucida Console, monospace | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
.entry-content pre, | |
.comment-content pre | |
border: 1px solid #ededed | |
color: #666 | |
font-family: Consolas, Monaco, Lucida Console, monospace | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 1.714285714 | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
overflow: auto | |
padding: 24px | |
padding: 1.714285714rem | |
.entry-content pre code, | |
.comment-content pre code | |
display: block | |
.entry-content abbr, | |
.comment-content abbr, | |
.entry-content dfn, | |
.comment-content dfn, | |
.entry-content acronym, | |
.comment-content acronym | |
border-bottom: 1px dotted #666 | |
cursor: help | |
.entry-content address, | |
.comment-content address | |
display: block | |
line-height: 1.714285714 | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
img.alignleft | |
margin: 12px 24px 12px 0 | |
margin: 0.857142857rem 1.714285714rem 0.857142857rem 0 | |
img.alignright | |
margin: 12px 0 12px 24px | |
margin: 0.857142857rem 0 0.857142857rem 1.714285714rem | |
img.aligncenter | |
margin-top: 12px | |
margin-top: 0.857142857rem | |
margin-bottom: 12px | |
margin-bottom: 0.857142857rem | |
.entry-content embed, | |
.entry-content iframe, | |
.entry-content object, | |
.entry-content video | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.entry-content dl, | |
.comment-content dl | |
margin: 0 24px | |
margin: 0 1.714285714rem | |
.entry-content dt, | |
.comment-content dt | |
font-weight: bold | |
line-height: 1.714285714 | |
.entry-content dd, | |
.comment-content dd | |
line-height: 1.714285714 | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.entry-content table, | |
.comment-content table | |
border-bottom: 1px solid #ededed | |
color: #777 | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
width: 100% | |
.entry-content table caption, | |
.comment-content table caption | |
font-size: 16px | |
font-size: 1.142857143rem | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
.entry-content td, | |
.comment-content td | |
border-top: 1px solid #ededed | |
padding: 6px 10px 6px 0 | |
.site-content article | |
padding-bottom: 24px | |
padding-bottom: 1.714285714rem | |
margin-bottom: 72px | |
margin-bottom: 5.142857143rem | |
border-bottom: 4px double #ededed | |
.page-links | |
clear: both | |
line-height: 1.714285714 | |
footer.entry-meta | |
margin-top: 24px | |
margin-top: 1.714285714rem | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #777 | |
.single-author .entry-meta .by-author | |
display: none | |
/* =Archives */ | |
.archive-header, | |
.page-header | |
margin-bottom: 48px | |
margin-bottom: 3.428571429rem | |
padding-bottom: 22px | |
padding-bottom: 1.571428571rem | |
border-bottom: 1px solid #ededed | |
.archive-meta | |
color: #777 | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
margin-top: 22px | |
margin-top: 1.571428571rem | |
/* =Single image attachment view */ | |
.article.attachment | |
overflow: hidden | |
.image-attachment div.attachment | |
text-align: center | |
.image-attachment div.attachment p | |
text-align: center | |
.image-attachment div.attachment img | |
display: block | |
height: auto | |
margin: 0 auto | |
max-width: 100% | |
.image-attachment .entry-caption | |
margin-top: 8px | |
margin-top: 0.571428571rem | |
/* =Aside post format */ | |
article.format-aside h1 | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
article.format-aside h1 a | |
text-decoration: none | |
color: #4d525a | |
article.format-aside h1 a:hover | |
color: #2e3542 | |
article.format-aside .aside | |
padding: 24px 24px 0 | |
padding: 1.714285714rem | |
background: #d2e0f9 | |
border-left: 22px solid #a8bfe8 | |
article.format-aside p | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #4a5466 | |
article.format-aside blockquote:last-child, | |
article.format-aside p:last-child | |
margin-bottom: 0 | |
/* =Post formats */ | |
/* Image posts */ | |
article.format-image footer h1 | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
font-weight: normal | |
article.format-image footer h2 | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 2.181818182 | |
article.format-image footer a h2 | |
font-weight: normal | |
/* Link posts */ | |
article.format-link header | |
padding: 0 10px | |
padding: 0 0.714285714rem | |
float: right | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 2.181818182 | |
font-weight: bold | |
font-style: italic | |
text-transform: uppercase | |
color: #848484 | |
background-color: #ebebeb | |
border-radius: 3px | |
article.format-link .entry-content | |
max-width: 80% | |
float: left | |
article.format-link .entry-content a | |
font-size: 22px | |
font-size: 1.571428571rem | |
line-height: 1.090909091 | |
text-decoration: none | |
/* Quote posts */ | |
article.format-quote .entry-content p | |
margin: 0 | |
padding-bottom: 24px | |
padding-bottom: 1.714285714rem | |
article.format-quote .entry-content blockquote | |
display: block | |
padding: 24px 24px 0 | |
padding: 1.714285714rem 1.714285714rem 0 | |
font-size: 15px | |
font-size: 1.071428571rem | |
line-height: 1.6 | |
font-style: normal | |
color: #6a6a6a | |
background: #efefef | |
/* Status posts */ | |
.format-status .entry-header | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.format-status .entry-header header | |
display: inline-block | |
.format-status .entry-header h1 | |
font-size: 15px | |
font-size: 1.071428571rem | |
font-weight: normal | |
line-height: 1.6 | |
margin: 0 | |
.format-status .entry-header h2 | |
font-size: 12px | |
font-size: 0.857142857rem | |
font-weight: normal | |
line-height: 2 | |
margin: 0 | |
.format-status .entry-header header a | |
color: #777 | |
.format-status .entry-header header a:hover | |
color: #21759b | |
.format-status .entry-header img | |
float: left | |
margin-right: 21px | |
margin-right: 1.5rem | |
/* =Comments */ | |
.comments-title | |
margin-bottom: 48px | |
margin-bottom: 3.428571429rem | |
font-size: 16px | |
font-size: 1.142857143rem | |
line-height: 1.5 | |
font-weight: normal | |
.comments-area article | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
.comments-area article header | |
margin: 0 0 48px | |
margin: 0 0 3.428571429rem | |
overflow: hidden | |
position: relative | |
.comments-area article header img | |
float: left | |
padding: 0 | |
line-height: 0 | |
.comments-area article header cite, | |
.comments-area article header time | |
display: block | |
margin-left: 85px | |
margin-left: 6.071428571rem | |
.comments-area article header cite | |
font-style: normal | |
font-size: 15px | |
font-size: 1.071428571rem | |
line-height: 1.42857143 | |
.comments-area article header time | |
line-height: 1.714285714 | |
text-decoration: none | |
font-size: 12px | |
font-size: 0.857142857rem | |
color: #5e5e5e | |
.comments-area article header a | |
text-decoration: none | |
color: #5e5e5e | |
.comments-area article header a:hover | |
color: #21759b | |
.comments-area article header cite a | |
color: #444 | |
.comments-area article header cite a:hover | |
text-decoration: underline | |
.comments-area article header h4 | |
position: absolute | |
top: 0 | |
right: 0 | |
padding: 6px 12px | |
padding: 0.428571429rem 0.857142857rem | |
font-size: 12px | |
font-size: 0.857142857rem | |
font-weight: normal | |
color: #fff | |
background-color: #0088d0 | |
background-repeat: repeat-x | |
background-image: -moz-linear-gradient(top, #009cee, #0088d0) | |
background-image: -ms-linear-gradient(top, #009cee, #0088d0) | |
background-image: -webkit-linear-gradient(top, #009cee, #0088d0) | |
background-image: -o-linear-gradient(top, #009cee, #0088d0) | |
background-image: linear-gradient(top, #009cee, #0088d0) | |
border-radius: 3px | |
border: 1px solid #007cbd | |
.comments-area li.bypostauthor cite span | |
position: absolute | |
margin-left: 5px | |
margin-left: 0.357142857rem | |
padding: 2px 5px | |
padding: 0.142857143rem 0.357142857rem | |
font-size: 10px | |
font-size: 0.714285714rem | |
a.comment-reply-link | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #686868 | |
a.comment-reply-link:hover | |
color: #21759b | |
.commentlist .pingback | |
line-height: 1.714285714 | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.commentlist .children | |
margin-left: 48px | |
margin-left: 3.428571429rem | |
/* Comment form */ | |
#respond | |
margin-top: 48px | |
margin-top: 3.428571429rem | |
#respond h3#reply-title | |
font-size: 16px | |
font-size: 1.142857143rem | |
line-height: 1.5 | |
#respond h3#reply-title #cancel-comment-reply-link | |
margin-left: 10px | |
margin-left: 0.714285714rem | |
font-weight: normal | |
font-size: 12px | |
font-size: 0.857142857rem | |
#respond form | |
margin: 24px 0 | |
margin: 1.714285714rem 0 | |
#respond form p | |
margin: 11px 0 | |
margin: 0.785714286rem 0 | |
#respond form p.logged-in-as | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
#respond form label | |
display: block | |
line-height: 1.714285714 | |
#respond form input[type="text"], | |
#respond form textarea | |
-moz-box-sizing: border-box | |
box-sizing: border-box | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 1.714285714 | |
padding: 10px | |
padding: 0.714285714rem | |
width: 100% | |
#respond form p.form-allowed-tags | |
margin: 0 | |
font-size: 12px | |
font-size: 0.857142857rem | |
line-height: 2 | |
color: #5e5e5e | |
.required | |
color: red | |
label ~ span.required | |
display: block | |
float: left | |
margin: -18px 0 0 -16px | |
margin: -1.285714286rem 0 0 -1.142857143rem | |
/* =Front page template */ | |
.entry-page-image | |
margin-bottom: 14px | |
margin-bottom: 1rem | |
.template-front-page .site-content article | |
border: 0 | |
margin-bottom: 0 | |
.template-front-page .widget-area | |
clear: both | |
float: none | |
width: auto | |
padding-top: 24px | |
padding-top: 1.714285714rem | |
border-top: 1px solid #ededed | |
.template-front-page .widget-area .widget li | |
margin: 8px 0 0 | |
margin: 0.571428571rem 0 0 | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.714285714 | |
list-style-type: square | |
list-style-position: inside | |
.template-front-page .widget-area .widget li a | |
color: #777 | |
.template-front-page .widget-area .widget li a:hover | |
color: #21759b | |
.template-front-page .widget-area .widget_text img | |
float: left | |
margin: 8px 24px 8px 0 | |
margin: 0.571428571rem 1.714285714rem 0.571428571rem 0 | |
/* =Widgets */ | |
.widget-area .widget ul ul | |
margin-left: 12px | |
margin-left: 0.857142857rem | |
.widget_rss li | |
margin: 12px 0 | |
margin: 0.857142857rem 0 | |
.widget_recent_entries .post-date, | |
.widget_rss .rss-date | |
color: #aaa | |
font-size: 11px | |
font-size: 0.785714286rem | |
margin-left: 12px | |
margin-left: 0.857142857rem | |
#wp-calendar | |
margin: 0 | |
width: 100% | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
color: #686868 | |
#wp-calendar th, | |
#wp-calendar td, | |
#wp-calendar caption | |
text-align: left | |
#wp-calendar #next | |
padding-right: 24px | |
padding-right: 1.714285714rem | |
text-align: right | |
.widget_search label | |
display: block | |
font-size: 13px | |
font-size: 0.928571429rem | |
line-height: 1.846153846 | |
.widget_twitter li | |
list-style-type: none | |
.widget_twitter .timesince | |
display: block | |
text-align: right | |
/* =Plugins */ | |
img#wpstats | |
display: block | |
margin: 0 auto 24px | |
margin: 0 auto 1.714285714rem | |
/* =Media queries */ | |
/* Minimum width of 600 pixels. */ | |
@media screen and (min-width: 600px) | |
.author-avatar | |
float: left | |
margin-top: 8px | |
margin-top: 0.571428571rem | |
.author-description | |
float: right | |
width: 80% | |
.site | |
margin: 0 auto | |
max-width: 960px | |
max-width: 68.571428571rem | |
overflow: hidden | |
.site-content | |
float: left | |
width: 65.104166667% | |
body.template-front-page .site-content, | |
body.single-attachment .site-content, | |
body.full-width .site-content | |
width: 100% | |
.widget-area | |
float: right | |
width: 26.041666667% | |
.site-header h1, | |
.site-header h2 | |
text-align: left | |
.site-header h1 | |
font-size: 26px | |
font-size: 1.857142857rem | |
line-height: 1.846153846 | |
.main-navigation ul.nav-menu, | |
.main-navigation div.nav-menu > ul | |
border-bottom: 1px solid #ededed | |
border-top: 1px solid #ededed | |
display: inline-block !important | |
text-align: left | |
width: 100% | |
.main-navigation ul | |
margin: 0 | |
text-indent: 0 | |
.main-navigation li a, | |
.main-navigation li | |
display: inline-block | |
text-decoration: none | |
.main-navigation li a | |
border-bottom: 0 | |
color: #6a6a6a | |
line-height: 3.692307692 | |
text-transform: uppercase | |
.main-navigation li a:hover | |
color: #000 | |
.main-navigation li | |
margin: 0 40px 0 0 | |
margin: 0 2.857142857rem 0 0 | |
position: relative | |
.main-navigation li ul | |
display: none | |
margin: 0 | |
padding: 0 | |
position: absolute | |
top: 100% | |
z-index: 1 | |
.main-navigation li ul ul | |
top: 0 | |
left: 100% | |
.main-navigation ul li:hover > ul | |
border-left: 0 | |
display: block | |
.main-navigation li ul li a | |
background: #efefef | |
border-bottom: 1px solid #ededed | |
display: block | |
font-size: 11px | |
font-size: 0.785714286rem | |
line-height: 2.181818182 | |
padding: 8px 10px | |
padding: 0.571428571rem 0.714285714rem | |
width: 180px | |
width: 12.85714286rem | |
.main-navigation li ul li a:hover | |
background: #e3e3e3 | |
color: #444 | |
.main-navigation .current-menu-item > a, | |
.main-navigation .current-menu-ancestor > a, | |
.main-navigation .current_page_item > a, | |
.main-navigation .current_page_ancestor > a | |
color: #636363 | |
font-weight: bold | |
.menu-toggle | |
display: none | |
.entry-header .entry-title | |
font-size: 22px | |
font-size: 1.571428571rem | |
#respond form input[type="text"] | |
width: 46.333333333% | |
#respond form textarea.blog-textarea | |
width: 79.666666667% | |
.template-front-page .site-content, | |
.template-front-page article | |
overflow: hidden | |
.template-front-page.has-post-thumbnail article | |
float: left | |
width: 47.916666667% | |
.entry-page-image | |
float: right | |
margin-bottom: 0 | |
width: 47.916666667% | |
.template-front-page .widget-area .widget, | |
.template-front-page.two-sidebars .widget-area .front-widgets | |
float: left | |
width: 51.875% | |
margin-bottom: 24px | |
margin-bottom: 1.714285714rem | |
.template-front-page .widget-area .widget:nth-child(odd) | |
clear: right | |
.template-front-page .widget-area .widget:nth-child(even), | |
.template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets | |
float: right | |
width: 39.0625% | |
margin: 0 0 24px | |
margin: 0 0 1.714285714rem | |
.template-front-page.two-sidebars .widget, | |
.template-front-page.two-sidebars .widget:nth-child(even) | |
float: none | |
width: auto | |
/* Minimum width of 960 pixels. */ | |
@media screen and (min-width: 960px) | |
body | |
background-color: #e6e6e6 | |
body .site | |
padding: 0 40px | |
padding: 0 2.857142857rem | |
margin-top: 48px | |
margin-top: 3.428571429rem | |
margin-bottom: 48px | |
margin-bottom: 3.428571429rem | |
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3) | |
body.custom-background-empty | |
background-color: #fff | |
body.custom-background-empty .site, | |
body.custom-background-white .site | |
padding: 0 | |
margin-top: 0 | |
margin-bottom: 0 | |
box-shadow: none | |
/* =Print */ | |
@media print | |
body | |
background: none !important | |
font-size: 10pt | |
footer a[rel=bookmark]:link:after, | |
footer a[rel=bookmark]:visited:after | |
content: " [" attr(href) "] " | |
a | |
text-decoration: none | |
.entry-content img, | |
.comment-content img, | |
.author-avatar img, | |
img.wp-post-image | |
border-radius: 0 | |
box-shadow: none | |
.site | |
clear: both !important | |
display: block !important | |
float: none !important | |
max-width: 100% | |
position: relative !important | |
.site-header | |
margin-bottom: 72px | |
margin-bottom: 5.142857143rem | |
text-align: left | |
.site-header h1 | |
font-size: 21pt | |
line-height: 1 | |
text-align: left | |
.site-header h2 | |
font-size: 10pt | |
text-align: left | |
.author-avatar, | |
#colophon, | |
#respond, | |
.commentlist .comment-edit-link, | |
.commentlist .reply, | |
.entry-header .comments-link, | |
.entry-meta .edit-link a, | |
.page-link, | |
.site-content nav, | |
.widget-area, | |
img.header-image, | |
.main-navigation | |
display: none | |
.wrapper | |
border-top: none | |
box-shadow: none | |
.site-content | |
float: left | |
margin: 0 | |
width: 100% | |
.site-content | |
margin: 0 | |
width: auto | |
.singular .entry-header .entry-meta | |
position: static | |
.singular .site-content, | |
.singular .entry-header, | |
.singular .entry-content, | |
.singular footer.entry-meta, | |
.singular .comments-title | |
margin: 0 | |
width: 100% | |
.entry-header .entry-title, | |
.entry-title, | |
.singular .entry-title | |
font-size: 21pt | |
footer.entry-meta, | |
footer.entry-meta a | |
color: #444 | |
font-size: 10pt | |
.author-description | |
float: none | |
width: auto | |
/* Comments */ | |
.commentlist > li.comment | |
background: none | |
position: relative | |
width: auto | |
.commentlist .avatar | |
height: 39px | |
left: 2.2em | |
top: 2.2em | |
width: 39px | |
.comments-area article header cite, | |
.comments-area article header time | |
margin-left: 50px | |
margin-left: 3.57142857rem | |
/* =IE 7 and 8 */ | |
.ie .skip-link, | |
.ie .screen-reader-text, | |
.ie .assistive-text | |
clip: rect(1px 1px 1px 1px) | |
.ie .site | |
margin: 48px auto | |
max-width: 960px | |
.ie .site-content | |
float: left | |
width: 65.104166667% | |
.ie .full-width .site-content | |
float: none | |
width: 100% | |
.ie .widget-area | |
float: right | |
width: 26.041666667% | |
.ie img.size-full, | |
.ie img.size-large, | |
.ie img.header-image, | |
.ie img.wp-post-image | |
width: auto |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I'm working on a child theme of TwentyTwelve, but I don't want to use standard CSS @import. Since I'm using Sass, I "sass-ified" the TwentyTwelve stylesheet for inclusion with my custom styles, so that it can be minified and so that I can save an http request. I preserved the line numbering, just in case the files needed to be compared, and removed a lot of the comments manually (Sass syntax is particular about comment style).