mirror of
https://github.com/danbee/danbarber.me
synced 2025-03-04 08:59:10 +00:00
Convert to SCSS.
This commit is contained in:
Dan Barber
parent
2651649a30
commit
ad78cb70d0
@ -1,15 +0,0 @@
|
||||
$background-color: white
|
||||
|
||||
$text-color: #333
|
||||
$text-color-light: lighten($text-color, 45%)
|
||||
$heading-color: #333
|
||||
$meta-text-color: lighten($text-color, 45%)
|
||||
$header-color: #518F00
|
||||
|
||||
$border-color: #ccc
|
||||
|
||||
$link-color: rgb(24, 99, 161)
|
||||
$link-color-hover: lighten($link-color, 10%)
|
||||
|
||||
$footer-link-color: lighten($text-color, 25%)
|
||||
$footer-link-color-hover: lighten($link-color, 10%)
|
||||
15
_assets/stylesheets/includes/colors.css.scss
Normal file
15
_assets/stylesheets/includes/colors.css.scss
Normal file
@ -0,0 +1,15 @@
|
||||
$background-color: white;
|
||||
|
||||
$text-color: #333;
|
||||
$text-color-light: lighten($text-color, 45%);
|
||||
$heading-color: #333;
|
||||
$meta-text-color: lighten($text-color, 45%);
|
||||
$header-color: #518F00;
|
||||
|
||||
$border-color: #ccc;
|
||||
|
||||
$link-color: rgb(24, 99, 161);
|
||||
$link-color-hover: lighten($link-color, 10%);
|
||||
|
||||
$footer-link-color: lighten($text-color, 25%);
|
||||
$footer-link-color-hover: lighten($link-color, 10%);
|
||||
@ -1,33 +0,0 @@
|
||||
@font-face
|
||||
font-family: 'icomoon'
|
||||
src: asset_url('icomoon.eot')
|
||||
src: asset_url('icomoon.eot?#iefix') format("embedded-opentype"), asset_url('icomoon.woff') format("woff"), asset_url('icomoon.ttf') format("truetype"), asset_url('icomoon.svg#icomoon') format('svg')
|
||||
font-weight: normal
|
||||
font-style: normal
|
||||
|
||||
[class^="icon-"]:before, [class*=" icon-"]:before
|
||||
font-family: 'icomoon'
|
||||
font-style: normal
|
||||
speak: none
|
||||
font-weight: normal
|
||||
-webkit-font-smoothing: antialiased
|
||||
|
||||
.icon-logomark:before
|
||||
content: "\e000"
|
||||
|
||||
.icon-twitter:before
|
||||
position: relative
|
||||
top: 0.1em
|
||||
content: "\e001"
|
||||
margin-right: 0.2em
|
||||
color: #05ADE7
|
||||
|
||||
.icon-github:before
|
||||
content: "\e002"
|
||||
|
||||
.icon-app-net:before
|
||||
position: relative
|
||||
top: 0.1em
|
||||
content: "\e003"
|
||||
margin-right: 0.2em
|
||||
color: #8A8E91
|
||||
40
_assets/stylesheets/includes/icons.css.scss
Normal file
40
_assets/stylesheets/includes/icons.css.scss
Normal file
@ -0,0 +1,40 @@
|
||||
@font-face {
|
||||
font-family: "icomoon";
|
||||
src: asset_url("icomoon.eot");
|
||||
src: asset_url("icomoon.eot?#iefix") format("embedded-opentype"), asset_url("icomoon.woff") format("woff"), asset_url("icomoon.ttf") format("truetype"), asset_url("icomoon.svg#icomoon") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
||||
[class^="icon-"]:before, [class*=" icon-"]:before {
|
||||
font-family: "icomoon";
|
||||
font-style: normal;
|
||||
speak: none;
|
||||
font-weight: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.icon-logomark:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.icon-twitter:before {
|
||||
position: relative;
|
||||
top: 0.1em;
|
||||
content: "";
|
||||
margin-right: 0.2em;
|
||||
color: #05ADE7;
|
||||
}
|
||||
|
||||
.icon-github:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.icon-app-net:before {
|
||||
position: relative;
|
||||
top: 0.1em;
|
||||
content: "";
|
||||
margin-right: 0.2em;
|
||||
color: #8A8E91;
|
||||
}
|
||||
@ -1,59 +0,0 @@
|
||||
$max-width: 800px !default
|
||||
$pad-min: 8.5% !default
|
||||
|
||||
header[role=banner]
|
||||
padding: 0.52em 0 0.42em
|
||||
h1
|
||||
font-size: 3.43em
|
||||
margin: 0
|
||||
a
|
||||
color: white
|
||||
line-height: 0
|
||||
text-decoration: none
|
||||
text-shadow: 0 0 10px rgba(0, 0, 0, 0.2)
|
||||
span
|
||||
width: 0
|
||||
font-size: 0
|
||||
overflow: hidden
|
||||
|
||||
article img
|
||||
max-width: 100%
|
||||
height: auto
|
||||
|
||||
article img.left
|
||||
float: left
|
||||
margin-right: 1em
|
||||
|
||||
article img.right
|
||||
float: right
|
||||
margin-left: 1em
|
||||
|
||||
#content, .container, footer
|
||||
padding: 0 $pad-min
|
||||
margin: 0 auto
|
||||
max-width: $max-width
|
||||
|
||||
nav[role=navigation]
|
||||
font-size: 1em
|
||||
|
||||
@media only screen and (min-width: 450px)
|
||||
body
|
||||
font-size: 110%
|
||||
header[role=banner] h1 img
|
||||
height: 50px
|
||||
|
||||
@media only screen and (min-width: 650px)
|
||||
body
|
||||
font-size: 125%
|
||||
header[role=banner] h1 img
|
||||
height: 60px
|
||||
|
||||
@media only screen and (min-width: 768px)
|
||||
body
|
||||
font-size: 135%
|
||||
header[role=banner] h1 img
|
||||
height: 80px
|
||||
|
||||
@media only screen and (min-width: 892px)
|
||||
body
|
||||
font-size: 145%
|
||||
79
_assets/stylesheets/includes/layout.css.scss
Normal file
79
_assets/stylesheets/includes/layout.css.scss
Normal file
@ -0,0 +1,79 @@
|
||||
$max-width: 800px !default;
|
||||
$pad-min: 8.5% !default;
|
||||
|
||||
header[role=banner] {
|
||||
padding: 0.52em 0 0.42em;
|
||||
h1 {
|
||||
font-size: 3.43em;
|
||||
margin: 0;
|
||||
a {
|
||||
color: white;
|
||||
line-height: 0;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
||||
span {
|
||||
width: 0;
|
||||
font-size: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
article img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
article img.left {
|
||||
float: left;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
article img.right {
|
||||
float: right;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
#content, .container, footer {
|
||||
padding: 0 $pad-min;
|
||||
margin: 0 auto;
|
||||
max-width: $max-width;
|
||||
}
|
||||
|
||||
nav[role=navigation] {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 450px) {
|
||||
body {
|
||||
font-size: 110%;
|
||||
}
|
||||
header[role=banner] h1 img {
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 650px) {
|
||||
body {
|
||||
font-size: 125%;
|
||||
}
|
||||
header[role=banner] h1 img {
|
||||
height: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
body {
|
||||
font-size: 135%;
|
||||
}
|
||||
header[role=banner] h1 img {
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 892px) {
|
||||
body {
|
||||
font-size: 145%;
|
||||
}
|
||||
}
|
||||
@ -1,4 +0,0 @@
|
||||
body
|
||||
margin: 0
|
||||
font-size: 100%
|
||||
-webkit-text-size-adjust: 100%
|
||||
5
_assets/stylesheets/includes/main.css.scss
Normal file
5
_assets/stylesheets/includes/main.css.scss
Normal file
@ -0,0 +1,5 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-size: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
@ -1,115 +0,0 @@
|
||||
// This File is imported last, and will override other styles in the cascade
|
||||
// Add styles here to make changes without digging in too much
|
||||
html
|
||||
background: $background-color
|
||||
|
||||
body
|
||||
font-weight: 300
|
||||
|
||||
body > div > div
|
||||
border: none
|
||||
|
||||
body > header
|
||||
border-color: $header-color
|
||||
+background(linear-gradient(top, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, 0.15) 100%))
|
||||
background-color: $header-color
|
||||
border-width: 0 0 1px
|
||||
border-style: solid
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), inset 0 -1px 0px rgba(255, 255, 255, 0.4)
|
||||
padding-top: 0.8em
|
||||
padding-bottom: 0.9em
|
||||
h1 a
|
||||
//display: inline-block
|
||||
margin-top: 0
|
||||
font-weight: 700
|
||||
//line-height: 0
|
||||
|
||||
a
|
||||
+transition(color 0.25s 0s ease)
|
||||
color: $link-color
|
||||
&:hover
|
||||
color: $link-color-hover
|
||||
|
||||
header nav
|
||||
display: inline
|
||||
position: relative
|
||||
ul
|
||||
list-style: none
|
||||
float: right
|
||||
display: block
|
||||
margin: 0
|
||||
padding: 0
|
||||
border: 0
|
||||
li
|
||||
padding-left: 1.25em
|
||||
float: left
|
||||
padding-top: .15em
|
||||
a
|
||||
+transition(text-shadow 0.25s 0s ease)
|
||||
text-shadow: 0 0 8px rgba(0, 0, 0, 0.2)
|
||||
color: white
|
||||
text-decoration: none
|
||||
&:hover, &:focus
|
||||
color: white
|
||||
text-shadow: 0 0 5px rgba(255, 255, 255, 0.6)
|
||||
|
||||
article > header
|
||||
text-align: left
|
||||
|
||||
article > header h1, #content .blog-index article h1
|
||||
font-size: 1.5em
|
||||
|
||||
body > nav
|
||||
border: none
|
||||
|
||||
body > nav a
|
||||
text-shadow: none
|
||||
display: inline
|
||||
|
||||
@media only screen and (max-width: 400px)
|
||||
header
|
||||
text-align: center
|
||||
header nav
|
||||
display: none
|
||||
|
||||
blockquote
|
||||
font-size: 1em
|
||||
border: none
|
||||
|
||||
#content div.pagination, #content div.navigation
|
||||
text-align: center
|
||||
font-size: .95em
|
||||
height: 1.5em
|
||||
position: relative
|
||||
padding:
|
||||
top: 1.5em
|
||||
bottom: 1.5em
|
||||
&:after
|
||||
display: block
|
||||
content: ""
|
||||
clear: both
|
||||
a
|
||||
text-decoration: none
|
||||
color: $text-color-light
|
||||
&:hover
|
||||
color: $link-color-hover
|
||||
&[href*=archive]
|
||||
&:before, &:after
|
||||
content: '\2014'
|
||||
padding: 0 .3em
|
||||
|
||||
#content div.navigation
|
||||
a
|
||||
&.prev
|
||||
float: left
|
||||
&.next
|
||||
float: right
|
||||
|
||||
#content div.pagination
|
||||
a
|
||||
&.prev
|
||||
position: absolute
|
||||
left: 0
|
||||
&.next
|
||||
position: absolute
|
||||
right: 0
|
||||
151
_assets/stylesheets/includes/styles.css.scss
Normal file
151
_assets/stylesheets/includes/styles.css.scss
Normal file
@ -0,0 +1,151 @@
|
||||
// This File is imported last, and will override other styles in the cascade
|
||||
// Add styles here to make changes without digging in too much
|
||||
html {
|
||||
background: $background-color;
|
||||
}
|
||||
|
||||
body {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
body > div > div {
|
||||
border: none;
|
||||
}
|
||||
|
||||
body > header {
|
||||
border-color: $header-color;
|
||||
@include background(linear-gradient(top, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, 0.15) 100%));
|
||||
background-color: $header-color;
|
||||
border-width: 0 0 1px;
|
||||
border-style: solid;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), inset 0 -1px 0px rgba(255, 255, 255, 0.4);
|
||||
padding-top: 0.8em;
|
||||
padding-bottom: 0.9em;
|
||||
h1 a {
|
||||
//display: inline-block
|
||||
margin-top: 0;
|
||||
font-weight: 700;
|
||||
//line-height: 0
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
@include transition(color 0.25s 0s ease);
|
||||
color: $link-color;
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
header nav {
|
||||
display: inline;
|
||||
position: relative;
|
||||
ul {
|
||||
list-style: none;
|
||||
float: right;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
li {
|
||||
padding-left: 1.25em;
|
||||
float: left;
|
||||
}
|
||||
padding-top: 0.15em;
|
||||
}
|
||||
a {
|
||||
@include transition(text-shadow 0.25s 0s ease);
|
||||
text-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
&:hover, &:focus {
|
||||
color: white;
|
||||
text-shadow: 0 0 5px rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
article > header {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
article > header h1, #content .blog-index article h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
body > nav {
|
||||
border: none;
|
||||
}
|
||||
|
||||
body > nav a {
|
||||
text-shadow: none;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 400px) {
|
||||
header {
|
||||
text-align: center;
|
||||
}
|
||||
header nav {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-size: 1em;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#content div.pagination, #content div.navigation {
|
||||
text-align: center;
|
||||
font-size: 0.95em;
|
||||
height: 1.5em;
|
||||
position: relative;
|
||||
padding: {
|
||||
top: 1.5em;
|
||||
bottom: 1.5em;
|
||||
};
|
||||
&:after {
|
||||
display: block;
|
||||
content: "";
|
||||
clear: both;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: $text-color-light;
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
&[href*=archive] {
|
||||
&:before, &:after {
|
||||
content: "—";
|
||||
padding: 0 0.3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#content div.navigation {
|
||||
a {
|
||||
&.prev {
|
||||
float: left;
|
||||
}
|
||||
&.next {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#content div.pagination {
|
||||
a {
|
||||
&.prev {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
&.next {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,300 +0,0 @@
|
||||
// $blockquote: $type-border !default
|
||||
$sans: "adelle", sans-serif !default
|
||||
$serif: "rooney-web", Georgia, Times, "Times New Roman", serif !default
|
||||
$mono: "source-code-pro", monospace !default
|
||||
$heading-font-family: "adelle", sans-serif !default
|
||||
$header-title-font-family: $heading-font-family !default
|
||||
$header-subtitle-font-family: $heading-font-family !default
|
||||
|
||||
/*
|
||||
*Type-A-File "Field Report" designed by Russ Maschmeyer, aka StrangeNative.
|
||||
*http://www.strangenative.com
|
||||
*@strangenative
|
||||
*
|
||||
*Creative Commons License by Attribution.
|
||||
*Feel free to take it, adapt it, & use it on both commercial and non-commercial projects.
|
||||
*Though I'd like a smidgeon of credit, so just leave this bit in here. K?
|
||||
|
||||
/*Pick Your Fonts
|
||||
body, h5, h6, .run-in, dt
|
||||
font-family: $serif
|
||||
|
||||
h1, h2, h3, h4, .pullquote, .sidenote h1, aside h1, .pullquote, .drop-cap, cite
|
||||
font-family: $heading-font-family
|
||||
|
||||
/*Nav Fonts
|
||||
nav[role=navigation]
|
||||
font-family: $sans
|
||||
|
||||
/*Size & Vertical Rhythm
|
||||
body
|
||||
font-size: 100%
|
||||
font-size: 16px
|
||||
line-height: 1.5em
|
||||
|
||||
/*Color
|
||||
body
|
||||
color: $text-color
|
||||
|
||||
/*HTML Standard Elements
|
||||
h1
|
||||
font-size: 2.5em
|
||||
line-height: 1.333em
|
||||
margin: .97em 0 0em
|
||||
|
||||
h2
|
||||
font-size: 1.75em
|
||||
line-height: 1.1em
|
||||
margin: 2em 0 .5em
|
||||
|
||||
h1 + img, h2 + img
|
||||
margin-top: 1em
|
||||
|
||||
h3
|
||||
font-size: 1.125em
|
||||
|
||||
h4
|
||||
font-size: 1em
|
||||
|
||||
h1, h2, h3
|
||||
font-weight: 500
|
||||
text-rendering: optimizelegibility
|
||||
|
||||
h4, h5, h6
|
||||
font-weight: 700
|
||||
text-rendering: optimizelegibility
|
||||
|
||||
article h1
|
||||
font-size: 1.5em
|
||||
|
||||
strong
|
||||
font-weight: 700
|
||||
|
||||
small
|
||||
display: block
|
||||
font-size: .75em
|
||||
letter-spacing: .05em
|
||||
margin: 2.2em 0 -0.2em
|
||||
font-style: italic
|
||||
line-height: 1.75em
|
||||
|
||||
p, ul, ol, form
|
||||
margin: 1.5em 0 1em
|
||||
|
||||
h3
|
||||
margin-top: 1.5em
|
||||
|
||||
ul
|
||||
list-style-position: outside
|
||||
list-style-type: disc
|
||||
line-height: 1.5
|
||||
padding-left: 0
|
||||
|
||||
li
|
||||
margin-bottom: .75em
|
||||
|
||||
ol
|
||||
list-style-position: outside
|
||||
list-style-type: decimal
|
||||
|
||||
blockquote
|
||||
font-style: italic
|
||||
line-height: 1.6em
|
||||
margin-left: 0
|
||||
margin-right: 0
|
||||
|
||||
blockquote:before
|
||||
font-family: Georgia, serif
|
||||
content: "“"
|
||||
font-size: 2.75em
|
||||
text-indent: -0.6em
|
||||
margin-top: .1em
|
||||
float: left
|
||||
opacity: .3
|
||||
|
||||
cite
|
||||
display: block
|
||||
text-transform: uppercase
|
||||
letter-spacing: .2em
|
||||
margin-top: 1.5em
|
||||
margin-left: 1em
|
||||
font-weight: 900
|
||||
font-style: normal
|
||||
font-size: .8em
|
||||
|
||||
cite:before
|
||||
content: "— "
|
||||
margin-left: -3.4em
|
||||
margin-right: .9em
|
||||
opacity: .3
|
||||
|
||||
pre,code,tt
|
||||
font-family: $mono
|
||||
font-weight: 500
|
||||
|
||||
code
|
||||
border: 1px solid #ddd
|
||||
border-radius: 0.25em
|
||||
display: inline-block
|
||||
font-size: 0.75em
|
||||
line-height: 1.5em
|
||||
padding: 0 0.3em
|
||||
|
||||
.highlight
|
||||
margin: 1.5em 0
|
||||
overflow: auto
|
||||
padding: 0.5em 0.75em
|
||||
border-radius: 0.25em
|
||||
pre
|
||||
margin: 0
|
||||
code
|
||||
border: none
|
||||
|
||||
dl
|
||||
margin: 1.75em 0 1.75em
|
||||
|
||||
dt
|
||||
font-style: italic
|
||||
margin-top: 1.25em
|
||||
font-size: 1.13em
|
||||
font-weight: 700
|
||||
border-bottom: 1px solid #999
|
||||
background: #DDD
|
||||
|
||||
dd
|
||||
font-style: italic
|
||||
font-size: .85em
|
||||
margin-top: 1em
|
||||
line-height: 1.6em
|
||||
|
||||
abbr
|
||||
text-transform: uppercase
|
||||
font-size: .9em
|
||||
letter-spacing: .1em
|
||||
border-bottom: 1px dotted $text-color-light
|
||||
|
||||
p
|
||||
margin-bottom: 0
|
||||
hyphenate: auto
|
||||
hyphenate-before: 2
|
||||
hyphenate-after: 3
|
||||
hyphenate-lines: 3
|
||||
orphans: 4
|
||||
|
||||
p span.pullquote
|
||||
text-indent: 0
|
||||
|
||||
/*Compositional Elements
|
||||
.kicker
|
||||
font-size: 1.25em
|
||||
line-height: 1.693em
|
||||
/*font-style:italic;
|
||||
margin: -0.35em 0 -0.35em
|
||||
|
||||
.kicker, .pullquote
|
||||
font-weight: 100
|
||||
|
||||
.run-in
|
||||
font-style: italic
|
||||
font-weight: bold
|
||||
|
||||
.superscript
|
||||
font-family: arial, sans-serif
|
||||
vertical-align: super
|
||||
font-size: 75%
|
||||
margin-right: .4em
|
||||
text-transform: lowercase
|
||||
font-variant: small-caps
|
||||
letter-spacing: .1em
|
||||
line-height: 0
|
||||
|
||||
.subscript
|
||||
font-family: arial, sans-serif
|
||||
vertical-align: sub
|
||||
font-size: 75%
|
||||
margin-right: .4em
|
||||
text-transform: lowercase
|
||||
font-variant: small-caps
|
||||
letter-spacing: .1em
|
||||
line-height: 0em
|
||||
|
||||
a.superscript, a.subscript
|
||||
text-decoration: none
|
||||
|
||||
aside, .sidenote
|
||||
font-size: .83em
|
||||
font-style: italic
|
||||
margin-top: 1.25em
|
||||
|
||||
aside h1, .sidenote h1
|
||||
text-transform: uppercase
|
||||
font-size: 1em
|
||||
line-height: 1.5em
|
||||
font-style: normal
|
||||
font-weight: 900
|
||||
|
||||
aside p, .sidenote p
|
||||
line-height: 1.7em
|
||||
margin: 1.3em 0
|
||||
font-style: normal
|
||||
|
||||
aside ul, aside ol, .sidenote ul, .sidenote ol
|
||||
margin-top: 1.3em
|
||||
line-height: 1.7em
|
||||
|
||||
aside ul li, aside ol li, .sidenote ul li, .sidenote ol li
|
||||
margin-bottom: 1.3em
|
||||
|
||||
.pullquote
|
||||
font-style: italic
|
||||
letter-spacing: .05em
|
||||
margin: .5em .7em .3em 0em
|
||||
padding-top: .15em
|
||||
line-height: 1.7em
|
||||
display: block
|
||||
float: left
|
||||
font-size: 1.6em
|
||||
width: 55%
|
||||
|
||||
.pullquote:before
|
||||
font-family: Georgia, serif
|
||||
content: "“"
|
||||
font-size: 2em
|
||||
text-indent: -0.8em
|
||||
margin-top: .05em
|
||||
float: left
|
||||
opacity: .3
|
||||
|
||||
.footnotes
|
||||
border-top: 1px solid #999
|
||||
font-size: .75em
|
||||
margin-top: 3.5em
|
||||
|
||||
.footnotes li
|
||||
margin: 1.5em 0 1.5em
|
||||
word-spacing: .1em
|
||||
line-height: 1.75em
|
||||
|
||||
.caption
|
||||
font-size: .8em
|
||||
font-style: italic
|
||||
margin: 0.6em 0 -0.2em
|
||||
|
||||
.kicker .run-in
|
||||
text-transform: uppercase
|
||||
font-style: normal
|
||||
letter-spacing: .25em
|
||||
font-size: .9em
|
||||
|
||||
.drop-cap
|
||||
display: block
|
||||
font-style: normal
|
||||
font-size: 5.1em
|
||||
float: left
|
||||
margin: .13em .1em 0 0
|
||||
line-height: .67em
|
||||
font-weight: 100
|
||||
|
||||
/*Tweaks
|
||||
.kern
|
||||
letter-spacing: -0.1em
|
||||
353
_assets/stylesheets/includes/typography.css.scss
Normal file
353
_assets/stylesheets/includes/typography.css.scss
Normal file
@ -0,0 +1,353 @@
|
||||
// $blockquote: $type-border !default
|
||||
$sans: "adelle", sans-serif !default;
|
||||
$serif: "rooney-web", Georgia, Times, "Times New Roman", serif !default;
|
||||
$mono: "source-code-pro", monospace !default;
|
||||
$heading-font-family: "adelle", sans-serif !default;
|
||||
$header-title-font-family: $heading-font-family !default;
|
||||
$header-subtitle-font-family: $heading-font-family !default;
|
||||
|
||||
/*Type-A-File "Field Report" designed by Russ Maschmeyer, aka StrangeNative.
|
||||
*http://www.strangenative.com
|
||||
*@strangenative
|
||||
*
|
||||
*Creative Commons License by Attribution.
|
||||
*Feel free to take it, adapt it, & use it on both commercial and non-commercial projects.
|
||||
*Though I'd like a smidgeon of credit, so just leave this bit in here. K? */
|
||||
|
||||
/*Pick Your Fonts */
|
||||
body, h5, h6, .run-in, dt {
|
||||
font-family: $serif;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, .pullquote, .sidenote h1, aside h1, .pullquote, .drop-cap, cite {
|
||||
font-family: $heading-font-family;
|
||||
}
|
||||
|
||||
/*Nav Fonts */
|
||||
nav[role=navigation] {
|
||||
font-family: $sans;
|
||||
}
|
||||
|
||||
/*Size & Vertical Rhythm */
|
||||
body {
|
||||
font-size: 100%;
|
||||
font-size: 16px;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
/*Color */
|
||||
body {
|
||||
color: $text-color;
|
||||
}
|
||||
|
||||
/*HTML Standard Elements */
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
line-height: 1.333em;
|
||||
margin: 0.97em 0 0em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.75em;
|
||||
line-height: 1.1em;
|
||||
margin: 2em 0 0.5em;
|
||||
}
|
||||
|
||||
h1 + img, h2 + img {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.125em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-weight: 500;
|
||||
text-rendering: optimizelegibility;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-weight: 700;
|
||||
text-rendering: optimizelegibility;
|
||||
}
|
||||
|
||||
article h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
small {
|
||||
display: block;
|
||||
font-size: 0.75em;
|
||||
letter-spacing: 0.05em;
|
||||
margin: 2.2em 0 -0.2em;
|
||||
font-style: italic;
|
||||
line-height: 1.75em;
|
||||
}
|
||||
|
||||
p, ul, ol, form {
|
||||
margin: 1.5em 0 1em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-position: outside;
|
||||
list-style-type: disc;
|
||||
line-height: 1.5;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-position: outside;
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-style: italic;
|
||||
line-height: 1.6em;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
blockquote:before {
|
||||
font-family: Georgia, serif;
|
||||
content: "“";
|
||||
font-size: 2.75em;
|
||||
text-indent: -0.6em;
|
||||
margin-top: 0.1em;
|
||||
float: left;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
cite {
|
||||
display: block;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.2em;
|
||||
margin-top: 1.5em;
|
||||
margin-left: 1em;
|
||||
font-weight: 900;
|
||||
font-style: normal;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
cite:before {
|
||||
content: "— ";
|
||||
margin-left: -3.4em;
|
||||
margin-right: 0.9em;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
pre, code, tt {
|
||||
font-family: $mono;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
code {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 0.25em;
|
||||
display: inline-block;
|
||||
font-size: 0.75em;
|
||||
line-height: 1.5em;
|
||||
padding: 0 0.3em;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
margin: 1.5em 0;
|
||||
overflow: auto;
|
||||
padding: 0.5em 0.75em;
|
||||
border-radius: 0.25em;
|
||||
pre {
|
||||
margin: 0;
|
||||
}
|
||||
code {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
dl {
|
||||
margin: 1.75em 0 1.75em;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-style: italic;
|
||||
margin-top: 1.25em;
|
||||
font-size: 1.13em;
|
||||
font-weight: 700;
|
||||
border-bottom: 1px solid #999;
|
||||
background: #DDD;
|
||||
}
|
||||
|
||||
dd {
|
||||
font-style: italic;
|
||||
font-size: 0.85em;
|
||||
margin-top: 1em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
abbr {
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9em;
|
||||
letter-spacing: 0.1em;
|
||||
border-bottom: 1px dotted $text-color-light;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
hyphenate: auto;
|
||||
hyphenate-before: 2;
|
||||
hyphenate-after: 3;
|
||||
hyphenate-lines: 3;
|
||||
orphans: 4;
|
||||
}
|
||||
|
||||
p span.pullquote {
|
||||
text-indent: 0;
|
||||
}
|
||||
|
||||
/*Compositional Elements */
|
||||
.kicker {
|
||||
font-size: 1.25em;
|
||||
line-height: 1.693em;
|
||||
/*font-style:italic; */
|
||||
margin: (-0.35em) 0 -0.35em;
|
||||
}
|
||||
|
||||
.kicker, .pullquote {
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
.run-in {
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.superscript {
|
||||
font-family: arial, sans-serif;
|
||||
vertical-align: super;
|
||||
font-size: 75%;
|
||||
margin-right: 0.4em;
|
||||
text-transform: lowercase;
|
||||
font-variant: small-caps;
|
||||
letter-spacing: 0.1em;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.subscript {
|
||||
font-family: arial, sans-serif;
|
||||
vertical-align: sub;
|
||||
font-size: 75%;
|
||||
margin-right: 0.4em;
|
||||
text-transform: lowercase;
|
||||
font-variant: small-caps;
|
||||
letter-spacing: 0.1em;
|
||||
line-height: 0em;
|
||||
}
|
||||
|
||||
a.superscript, a.subscript {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
aside, .sidenote {
|
||||
font-size: 0.83em;
|
||||
font-style: italic;
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
aside h1, .sidenote h1 {
|
||||
text-transform: uppercase;
|
||||
font-size: 1em;
|
||||
line-height: 1.5em;
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
aside p, .sidenote p {
|
||||
line-height: 1.7em;
|
||||
margin: 1.3em 0;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
aside ul, aside ol, .sidenote ul, .sidenote ol {
|
||||
margin-top: 1.3em;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
||||
aside ul li, aside ol li, .sidenote ul li, .sidenote ol li {
|
||||
margin-bottom: 1.3em;
|
||||
}
|
||||
|
||||
.pullquote {
|
||||
font-style: italic;
|
||||
letter-spacing: 0.05em;
|
||||
margin: 0.5em 0.7em 0.3em 0em;
|
||||
padding-top: 0.15em;
|
||||
line-height: 1.7em;
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 1.6em;
|
||||
width: 55%;
|
||||
}
|
||||
|
||||
.pullquote:before {
|
||||
font-family: Georgia, serif;
|
||||
content: "“";
|
||||
font-size: 2em;
|
||||
text-indent: -0.8em;
|
||||
margin-top: 0.05em;
|
||||
float: left;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.footnotes {
|
||||
border-top: 1px solid #999;
|
||||
font-size: 0.75em;
|
||||
margin-top: 3.5em;
|
||||
}
|
||||
|
||||
.footnotes li {
|
||||
margin: 1.5em 0 1.5em;
|
||||
word-spacing: 0.1em;
|
||||
line-height: 1.75em;
|
||||
}
|
||||
|
||||
.caption {
|
||||
font-size: 0.8em;
|
||||
font-style: italic;
|
||||
margin: 0.6em 0 -0.2em;
|
||||
}
|
||||
|
||||
.kicker .run-in {
|
||||
text-transform: uppercase;
|
||||
font-style: normal;
|
||||
letter-spacing: 0.25em;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.drop-cap {
|
||||
display: block;
|
||||
font-style: normal;
|
||||
font-size: 5.1em;
|
||||
float: left;
|
||||
margin: 0.13em 0.1em 0 0;
|
||||
line-height: 0.67em;
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
/*Tweaks */
|
||||
.kern {
|
||||
letter-spacing: -0.1em;
|
||||
}
|
||||
@ -1,8 +0,0 @@
|
||||
.video-container
|
||||
position: relative
|
||||
width: 100%
|
||||
height: 0
|
||||
iframe
|
||||
position: absolute
|
||||
width: 100%
|
||||
height: 100%
|
||||
10
_assets/stylesheets/includes/video.css.scss
Normal file
10
_assets/stylesheets/includes/video.css.scss
Normal file
@ -0,0 +1,10 @@
|
||||
.video-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
iframe {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
58
_assets/stylesheets/lib/solarized.css.scss
Normal file
58
_assets/stylesheets/lib/solarized.css.scss
Normal file
@ -0,0 +1,58 @@
|
||||
$base03: #002b36 !default;
|
||||
|
||||
//darkest blue
|
||||
$base02: #073642 !default;
|
||||
|
||||
//dark blue
|
||||
$base01: #586e75 !default;
|
||||
|
||||
//darkest gray
|
||||
$base00: #657b83 !default;
|
||||
|
||||
//dark gray
|
||||
$base0: #839496 !default;
|
||||
|
||||
//medium gray
|
||||
$base1: #93a1a1 !default;
|
||||
|
||||
//medium light gray
|
||||
$base2: #eee8d5 !default;
|
||||
|
||||
//cream
|
||||
$base3: #fdf6e3 !default;
|
||||
|
||||
//white
|
||||
$solar-yellow: #b58900 !default;
|
||||
$solar-orange: #cb4b16 !default;
|
||||
$solar-red: #dc322f !default;
|
||||
$solar-magenta: #d33682 !default;
|
||||
$solar-violet: #6c71c4 !default;
|
||||
$solar-blue: #268bd2 !default;
|
||||
$solar-cyan: #2aa198 !default;
|
||||
$solar-green: #859900 !default;
|
||||
|
||||
$solarized: dark !default;
|
||||
|
||||
@if $solarized == light {
|
||||
$_base03: $base03;
|
||||
$_base02: $base02;
|
||||
$_base01: $base01;
|
||||
$_base00: $base00;
|
||||
$_base0: $base0;
|
||||
$_base1: $base1;
|
||||
$_base2: $base2;
|
||||
$_base3: $base3;
|
||||
$base03: $_base3;
|
||||
$base02: $_base2;
|
||||
$base01: $_base1;
|
||||
$base00: $_base0;
|
||||
$base0: $_base00;
|
||||
$base1: $_base01;
|
||||
$base2: $_base02;
|
||||
$base3: $_base03;
|
||||
}
|
||||
|
||||
/* non highlighted code colors */
|
||||
$pre-bg: $base03 !default;
|
||||
$pre-border: darken($base02, 5) !default;
|
||||
$pre-color: $base1 !default;
|
||||
@ -1,83 +0,0 @@
|
||||
#archive
|
||||
#content > div
|
||||
&, > article
|
||||
padding-top: 0
|
||||
|
||||
#blog-archives
|
||||
padding-top: 1em
|
||||
article
|
||||
padding: 0 0 1em
|
||||
position: relative
|
||||
&:last-child
|
||||
border: none
|
||||
footer
|
||||
padding: 0
|
||||
margin: 0
|
||||
h1
|
||||
margin-top: 0
|
||||
color: $text-color
|
||||
margin-bottom: .3em
|
||||
h2
|
||||
display: none
|
||||
h1
|
||||
font-size: 1.5em
|
||||
a
|
||||
color: inherit
|
||||
text-decoration: none
|
||||
&:hover
|
||||
color: $link-color-hover
|
||||
text-decoration: underline
|
||||
font-weight: normal
|
||||
display: inline-block
|
||||
a.category, time
|
||||
color: $text-color-light
|
||||
color: $text-color-light
|
||||
.entry-content
|
||||
display: none
|
||||
time
|
||||
font-size: .9em
|
||||
line-height: 1.2em
|
||||
.month, .day
|
||||
display: inline-block
|
||||
.month
|
||||
text-transform: uppercase
|
||||
p
|
||||
margin-bottom: 1em
|
||||
&, .entry-content
|
||||
a
|
||||
color: inherit
|
||||
&:hover
|
||||
color: $link-color-hover
|
||||
a:hover
|
||||
color: $link-color-hover
|
||||
@media only screen and (min-width: 550px)
|
||||
article
|
||||
margin-left: 5em
|
||||
h2
|
||||
margin-top: 0
|
||||
margin-bottom: .3em
|
||||
font-weight: normal
|
||||
display: inline-block
|
||||
position: relative
|
||||
top: -1px
|
||||
float: left
|
||||
time
|
||||
position: absolute
|
||||
text-align: right
|
||||
left: 0em
|
||||
top: 0.3em
|
||||
.year
|
||||
display: none
|
||||
article
|
||||
padding:
|
||||
left: 4.5em
|
||||
bottom: .7em
|
||||
a.category
|
||||
line-height: 1.1em
|
||||
|
||||
#content > .category
|
||||
article
|
||||
margin-left: 0
|
||||
padding-left: 6.8em
|
||||
.year
|
||||
display: inline
|
||||
116
_assets/stylesheets/parts/archive.css.scss
Normal file
116
_assets/stylesheets/parts/archive.css.scss
Normal file
@ -0,0 +1,116 @@
|
||||
#archive {
|
||||
#content > div {
|
||||
&, > article {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#blog-archives {
|
||||
padding-top: 1em;
|
||||
article {
|
||||
padding: 0 0 1em;
|
||||
position: relative;
|
||||
&:last-child {
|
||||
border: none;
|
||||
}
|
||||
footer {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
color: $text-color;
|
||||
margin-bottom: 0.3em;
|
||||
}
|
||||
h2 {
|
||||
display: none;
|
||||
}
|
||||
h1 {
|
||||
font-size: 1.5em;
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
a.category, time {
|
||||
color: $text-color-light;
|
||||
}
|
||||
color: $text-color-light;
|
||||
.entry-content {
|
||||
display: none;
|
||||
}
|
||||
time {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.2em;
|
||||
.month, .day {
|
||||
display: inline-block;
|
||||
}
|
||||
.month {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
p {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
&, .entry-content {
|
||||
a {
|
||||
color: inherit;
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
a:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
@media only screen and (min-width: 550px) {
|
||||
article {
|
||||
margin-left: 5em;
|
||||
}
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.3em;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
float: left;
|
||||
}
|
||||
time {
|
||||
position: absolute;
|
||||
text-align: right;
|
||||
left: 0em;
|
||||
top: 0.3em;
|
||||
}
|
||||
.year {
|
||||
display: none;
|
||||
}
|
||||
article {
|
||||
padding: {
|
||||
left: 4.5em;
|
||||
bottom: 0.7em;
|
||||
};
|
||||
}
|
||||
a.category {
|
||||
line-height: 1.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#content > .category {
|
||||
article {
|
||||
margin-left: 0;
|
||||
padding-left: 6.8em;
|
||||
}
|
||||
.year {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
@ -1,34 +0,0 @@
|
||||
body > footer
|
||||
text-align: center
|
||||
font-size: .8em
|
||||
position: relative
|
||||
padding-top: 1em
|
||||
padding-bottom: 1em
|
||||
margin-bottom: 3em
|
||||
border-radius-bottom: .4em
|
||||
z-index: 1
|
||||
a
|
||||
color: $footer-link-color
|
||||
&:hover
|
||||
color: $footer-link-color-hover
|
||||
&:visited
|
||||
color: $footer-link-color
|
||||
text-decoration: none
|
||||
p:last-child
|
||||
margin-bottom: 0
|
||||
|
||||
fieldset
|
||||
border: 0
|
||||
input[type=search]
|
||||
-webkit-appearance: none
|
||||
font-family: $serif
|
||||
font-size: 1em
|
||||
color: $text-color
|
||||
border-radius: 1em
|
||||
border:
|
||||
width: 1px
|
||||
style: solid
|
||||
color: #999 #bbb #bbb #999
|
||||
&:focus
|
||||
outline: none
|
||||
box-shadow: 0 0 5px $link-color
|
||||
39
_assets/stylesheets/parts/footer.css.scss
Normal file
39
_assets/stylesheets/parts/footer.css.scss
Normal file
@ -0,0 +1,39 @@
|
||||
body > footer {
|
||||
text-align: center;
|
||||
font-size: 0.8em;
|
||||
position: relative;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
margin-bottom: 3em;
|
||||
border-radius-bottom: 0.4em;
|
||||
z-index: 1;
|
||||
|
||||
a {
|
||||
color: $footer-link-color;
|
||||
&:hover { color: $footer-link-color-hover; }
|
||||
&:visited { color: $footer-link-color; }
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
p:last-child { margin-bottom: 0; }
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
input[type=search] {
|
||||
-webkit-appearance: none;
|
||||
font-family: $serif;
|
||||
font-size: 1em;
|
||||
color: $text-color;
|
||||
border-radius: 1em;
|
||||
border: {
|
||||
width: 1px;
|
||||
style: solid;
|
||||
color: #999 #bbb #bbb #999;
|
||||
};
|
||||
&:focus {
|
||||
outline: none;
|
||||
box-shadow: 0 0 5px $link-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,75 +0,0 @@
|
||||
article
|
||||
border-bottom: 1px dashed $border-color
|
||||
padding-bottom: 0
|
||||
margin-bottom: 1em
|
||||
|
||||
.entry-content
|
||||
margin-bottom: 2em
|
||||
|
||||
header
|
||||
position: relative
|
||||
margin-top: 2em
|
||||
padding-top: 0.6em
|
||||
|
||||
.meta
|
||||
text-transform: uppercase
|
||||
color: $meta-text-color
|
||||
font-size: 0.8em
|
||||
letter-spacing: 0.1em
|
||||
width: 100%
|
||||
text-rendering: optimizelegibility
|
||||
position: absolute
|
||||
top: 0
|
||||
margin-top: 0
|
||||
|
||||
header a
|
||||
color: $heading-color
|
||||
text-decoration: none
|
||||
&:hover, &:focus
|
||||
color: $link-color-hover
|
||||
|
||||
figure
|
||||
margin: 1.5em 0 0 0
|
||||
|
||||
figcaption
|
||||
font-size: 0.7em
|
||||
font-style: italic
|
||||
text-align: right
|
||||
opacity: 0.6
|
||||
|
||||
img, video, .flash-video
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15)
|
||||
padding: 0.5em
|
||||
margin: -0.5em
|
||||
|
||||
> footer
|
||||
padding-left: 0
|
||||
padding-right: 0
|
||||
p.meta
|
||||
margin-bottom: .8em
|
||||
font-size: .85em
|
||||
clear: both
|
||||
overflow: hidden
|
||||
.byline + time:before, time + time:before, .comments:before, .byline ~ .categories:before
|
||||
@extend .separator
|
||||
|
||||
footer
|
||||
a[rel=full-article]
|
||||
background: darken($background-color, 8)
|
||||
border-radius: 2px
|
||||
display: inline-block
|
||||
padding: .4em .8em
|
||||
margin-right: .5em
|
||||
margin-bottom: 1.5em
|
||||
text-decoration: none
|
||||
color: mix($text-color, $text-color-light)
|
||||
+transition(background-color 0.5s)
|
||||
&:hover
|
||||
background: $link-color-hover
|
||||
text-shadow: none
|
||||
color: $background-color
|
||||
|
||||
.separator
|
||||
content: "\2022 "
|
||||
padding: 0 .4em 0 .2em
|
||||
display: inline-block
|
||||
82
_assets/stylesheets/parts/post.css.scss
Normal file
82
_assets/stylesheets/parts/post.css.scss
Normal file
@ -0,0 +1,82 @@
|
||||
article {
|
||||
border-bottom: 1px dashed $border-color;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 1em;
|
||||
.entry-content {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
header {
|
||||
position: relative;
|
||||
margin-top: 2em;
|
||||
padding-top: 0.6em;
|
||||
.meta {
|
||||
text-transform: uppercase;
|
||||
color: $meta-text-color;
|
||||
font-size: 0.8em;
|
||||
letter-spacing: 0.1em;
|
||||
width: 100%;
|
||||
text-rendering: optimizelegibility;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
header a {
|
||||
color: $heading-color;
|
||||
text-decoration: none;
|
||||
&:hover, &:focus {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
}
|
||||
figure {
|
||||
margin: 1.5em 0 0 0;
|
||||
figcaption {
|
||||
font-size: 0.7em;
|
||||
font-style: italic;
|
||||
text-align: right;
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
img, video, .flash-video {
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
|
||||
padding: 0.5em;
|
||||
margin: -0.5em;
|
||||
}
|
||||
> footer {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
p.meta {
|
||||
margin-bottom: 0.8em;
|
||||
font-size: 0.85em;
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
}
|
||||
.byline + time:before, time + time:before, .comments:before, .byline ~ .categories:before {
|
||||
@extend .separator;
|
||||
}
|
||||
}
|
||||
footer {
|
||||
a[rel=full-article] {
|
||||
background: darken($background-color, 8);
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
padding: 0.4em 0.8em;
|
||||
margin-right: 0.5em;
|
||||
margin-bottom: 1.5em;
|
||||
text-decoration: none;
|
||||
color: mix($text-color, $text-color-light);
|
||||
@include transition(background-color 0.5s);
|
||||
&:hover {
|
||||
background: $link-color-hover;
|
||||
text-shadow: none;
|
||||
color: $background-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.separator {
|
||||
content: "•";
|
||||
padding: 0 0.4em 0 0.2em;
|
||||
display: inline-block;
|
||||
}
|
||||
@ -1,14 +0,0 @@
|
||||
@import 'bourbon'
|
||||
|
||||
@import 'includes/main.css.sass'
|
||||
@import 'includes/colors.css.sass'
|
||||
@import 'includes/typography.css.sass'
|
||||
@import 'includes/icons.css.sass'
|
||||
@import 'includes/layout.css.sass'
|
||||
@import 'includes/styles.css.sass'
|
||||
@import 'includes/video.css.sass'
|
||||
@import 'lib/solarized-dark.css.scss'
|
||||
|
||||
@import 'parts/post.css.sass'
|
||||
@import 'parts/archive.css.sass'
|
||||
@import 'parts/footer.css.sass'
|
||||
14
_assets/stylesheets/styles.css.scss
Normal file
14
_assets/stylesheets/styles.css.scss
Normal file
@ -0,0 +1,14 @@
|
||||
@import "bourbon";
|
||||
|
||||
@import "includes/main.css.scss";
|
||||
@import "includes/colors.css.scss";
|
||||
@import "includes/typography.css.scss";
|
||||
@import "includes/icons.css.scss";
|
||||
@import "includes/layout.css.scss";
|
||||
@import "includes/styles.css.scss";
|
||||
@import "includes/video.css.scss";
|
||||
@import "lib/solarized-dark.css.scss";
|
||||
|
||||
@import "parts/post.css.scss";
|
||||
@import "parts/archive.css.scss";
|
||||
@import "parts/footer.css.scss";
|
||||
Loading…
Reference in New Issue
Block a user