diff options
Diffstat (limited to '')
| -rw-r--r-- | assets/less/coderay.less | 133 | ||||
| -rw-r--r-- | assets/less/elements.less | 92 | ||||
| -rw-r--r-- | assets/less/font-awesome.less | 1471 | ||||
| -rw-r--r-- | assets/less/forms.less | 232 | ||||
| -rw-r--r-- | assets/less/grid.less | 47 | ||||
| -rw-r--r-- | assets/less/main.less | 29 | ||||
| -rw-r--r-- | assets/less/mixins.less | 305 | ||||
| -rw-r--r-- | assets/less/page.less | 431 | ||||
| -rw-r--r-- | assets/less/pygments.less | 71 | ||||
| -rw-r--r-- | assets/less/reset.less | 223 | ||||
| -rw-r--r-- | assets/less/site.less | 66 | ||||
| -rw-r--r-- | assets/less/typography.less | 84 | ||||
| -rw-r--r-- | assets/less/variables.less | 31 |
13 files changed, 3215 insertions, 0 deletions
diff --git a/assets/less/coderay.less b/assets/less/coderay.less new file mode 100644 index 0000000..db52c9a --- /dev/null +++ b/assets/less/coderay.less @@ -0,0 +1,133 @@ +.CodeRay { + background-color: #efefef; + font-family: @code-font; + font-size: 80%; + color: #333332; + margin-bottom: 1.5em; +} + +.CodeRay pre { + margin: 0px; + padding: 1em; +} + +div.CodeRay { } +span.CodeRay { white-space: pre; border: 0px; padding: 2px } + +table.CodeRay { border-collapse: collapse; width: 100%; padding: 2px } +table.CodeRay td { + padding: 1em 0.5em; + vertical-align: top; +} + +.CodeRay .line-numbers, .CodeRay .no { + background-color: #ECECEC; + color: #AAA; + text-align: right; +} + +.CodeRay .line-numbers a { + color: #AAA; +} + +.CodeRay .line-numbers tt { font-weight: bold } +.CodeRay .line-numbers .highlighted { color: red } +.CodeRay .line { display: block; float: left; width: 100%; } +.CodeRay span.line-numbers { padding: 0 24px 0 4px } +.CodeRay .code { width: 100% } + +ol.CodeRay { font-size: 10pt } +ol.CodeRay li { white-space: pre } + +.CodeRay .code pre { overflow: auto } +.CodeRay .debug { color:white ! important; background:blue ! important; } + +.CodeRay .annotation { color:#007 } +.CodeRay .attribute-name { color:#f08 } +.CodeRay .attribute-value { color:#700 } +.CodeRay .binary { color:#509; font-weight:bold } +.CodeRay .comment { color:#998; font-style: italic;} +.CodeRay .char { color:#04D } +.CodeRay .char .content { color:#04D } +.CodeRay .char .delimiter { color:#039 } +.CodeRay .class { color:#458; font-weight:bold } +.CodeRay .complex { color:#A08; font-weight:bold } +.CodeRay .constant { color:teal; } +.CodeRay .color { color:#0A0 } +.CodeRay .class-variable { color:#369 } +.CodeRay .decorator { color:#B0B; } +.CodeRay .definition { color:#099; font-weight:bold } +.CodeRay .directive { color:#088; font-weight:bold } +.CodeRay .delimiter { color:black } +.CodeRay .doc { color:#970 } +.CodeRay .doctype { color:#34b } +.CodeRay .doc-string { color:#D42; font-weight:bold } +.CodeRay .escape { color:#666; font-weight:bold } +.CodeRay .entity { color:#800; font-weight:bold } +.CodeRay .error { color:#F00; background-color:#FAA } +.CodeRay .exception { color:#C00; font-weight:bold } +.CodeRay .filename { color:#099; } +.CodeRay .function { color:#900; font-weight:bold } +.CodeRay .global-variable { color:teal; font-weight:bold } +.CodeRay .hex { color:#058; font-weight:bold } +.CodeRay .integer { color:#099; } +.CodeRay .include { color:#B44; font-weight:bold } +.CodeRay .inline { color: black } +.CodeRay .inline .inline { background: #ccc } +.CodeRay .inline .inline .inline { background: #bbb } +.CodeRay .inline .inline-delimiter { color: #D14; } +.CodeRay .inline-delimiter { color: #D14; } +.CodeRay .important { color:#f00; } +.CodeRay .interpreted { color:#B2B; font-weight:bold } +.CodeRay .instance-variable { color:teal } +.CodeRay .label { color:#970; font-weight:bold } +.CodeRay .local-variable { color:#963 } +.CodeRay .octal { color:#40E; font-weight:bold } +.CodeRay .operator { } +.CodeRay .predefined-constant { font-weight:bold } +.CodeRay .predefined { color:#369; font-weight:bold } +.CodeRay .preprocessor { color:#579; } +.CodeRay .pseudo-class { color:#00C; font-weight:bold } +.CodeRay .predefined-type { color:#074; font-weight:bold } +.CodeRay .reserved, .keyword { color:#000; font-weight:bold } + +.CodeRay .key { color: #808; } +.CodeRay .key .delimiter { color: #606; } +.CodeRay .key .char { color: #80f; } +.CodeRay .value { color: #088; } + +.CodeRay .regexp { background-color:#fff0ff } +.CodeRay .regexp .content { color:#808 } +.CodeRay .regexp .delimiter { color:#404 } +.CodeRay .regexp .modifier { color:#C2C } +.CodeRay .regexp .function { color:#404; font-weight: bold } + +.CodeRay .string { color: #D20; } +.CodeRay .string .string { } +.CodeRay .string .string .string { background-color:#ffd0d0 } +.CodeRay .string .content { color: #D14; } +.CodeRay .string .char { color: #D14; } +.CodeRay .string .delimiter { color: #D14; } + +.CodeRay .shell { color:#D14 } +.CodeRay .shell .content { } +.CodeRay .shell .delimiter { color:#D14 } + +.CodeRay .symbol { color:#990073 } +.CodeRay .symbol .content { color:#A60 } +.CodeRay .symbol .delimiter { color:#630 } + +.CodeRay .tag { color:#070 } +.CodeRay .tag-special { color:#D70; font-weight:bold } +.CodeRay .type { color:#339; font-weight:bold } +.CodeRay .variable { color:#036 } + +.CodeRay .insert { background: #afa; } +.CodeRay .delete { background: #faa; } +.CodeRay .change { color: #aaf; background: #007; } +.CodeRay .head { color: #f8f; background: #505 } + +.CodeRay .insert .insert { color: #080; font-weight:bold } +.CodeRay .delete .delete { color: #800; font-weight:bold } +.CodeRay .change .change { color: #66f; } +.CodeRay .head .head { color: #f4f; }
\ No newline at end of file diff --git a/assets/less/elements.less b/assets/less/elements.less new file mode 100644 index 0000000..42a7e01 --- /dev/null +++ b/assets/less/elements.less @@ -0,0 +1,92 @@ +hr { + display: block; + margin: 1em 0; + padding: 0; + height: 1px; + border: 0; + border-top: 1px solid #ccc; + border-bottom: 1px solid #fff; +} + +// Figures and images +// -------------------------------------------------- + +figure { + margin: 0; + padding-top: 10px; + padding-bottom: 10px; + &.half { + @media @large { + a { + width: 310px; + float: left; + &:nth-child(odd) { + margin-right: 10px; + } + &:nth-child(even) { + margin-left: 10px; + } + } + figcaption { + clear: left; + } + } + } + &.third { + @media @large { + a { + width: 200px; + float: left; + margin-right: 10px; + margin-left: 10px; + &:first-child { + margin-left: 0; + } + &:nth-child(3) { + margin-right: 0; + } + } + figcaption { + clear: left; + } + } + } +} +img { + max-width: 100%; + height: auto; + border-width: 0; + vertical-align: middle; + -ms-interpolation-mode: bicubic; +} +svg:not(:root) { + overflow: hidden; +} + +// Buttons +// -------------------------------------------------- +.btn { + display: inline-block; + margin-bottom: 20px; + padding: 8px 20px; + .font-rem(14); + background-color: @black; + color: @white; + border: 2px solid @black !important; + .rounded(20px); + &:visited { + color: @white; + } + &:hover { + background-color: @white; + color: @black; + } +} + +// Well +// -------------------------------------------------- +.well { + padding: 20px; + border: 1px solid @comp-color; + .rounded(4px); +}
\ No newline at end of file diff --git a/assets/less/font-awesome.less b/assets/less/font-awesome.less new file mode 100644 index 0000000..18f042d --- /dev/null +++ b/assets/less/font-awesome.less @@ -0,0 +1,1471 @@ +/*! + * Font Awesome 3.2.0 + * the iconic font designed for Bootstrap + * ------------------------------------------------------------------------------ + * The full suite of pictographic icons, examples, and documentation can be + * found at http://fontawesome.io. Stay up to date on Twitter at + * http://twitter.com/fontawesome. + * + * License + * ------------------------------------------------------------------------------ + * - The Font Awesome font is licensed under SIL OFL 1.1 - + * http://scripts.sil.org/OFL + * - Font Awesome CSS, LESS, and SASS files are licensed under MIT License - + * http://opensource.org/licenses/mit-license.html + * - Font Awesome documentation licensed under CC BY 3.0 - + * http://creativecommons.org/licenses/by/3.0/ + * - Attribution is no longer required in Font Awesome 3.0, but much appreciated: + * "Font Awesome by Dave Gandy - http://fontawesome.io" + * + * Author - Dave Gandy + * ------------------------------------------------------------------------------ + * Email: dave@fontawesome.io + * Twitter: http://twitter.com/byscuits + * Work: Lead Product Designer @ Kyruus - http://kyruus.com + */ +/* FONT PATH + * -------------------------- */ +@font-face { + font-family: 'FontAwesome'; + src: url('//netdna.bootstrapcdn.com/font-awesome/3.2.0/font/fontawesome-webfont.eot?v=3.2.0'); + src: url('//netdna.bootstrapcdn.com/font-awesome/3.2.0/font/fontawesome-webfont.eot?#iefix&v=3.2.0') format('embedded-opentype'), url('//netdna.bootstrapcdn.com/font-awesome/3.2.0/font/fontawesome-webfont.woff?v=3.2.0') format('woff'), url('//netdna.bootstrapcdn.com/font-awesome/3.2.0/font/fontawesome-webfont.ttf?v=3.2.0') format('truetype'), url('//netdna.bootstrapcdn.com/font-awesome/3.2.0/font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.0') format('svg'); + font-weight: normal; + font-style: normal; +} +/* FONT AWESOME CORE + * -------------------------- */ +[class^="icon-"], +[class*=" icon-"] { + font-family: FontAwesome; + font-weight: normal; + font-style: normal; + text-decoration: inherit; + -webkit-font-smoothing: antialiased; + *margin-right: .3em; +} +[class^="icon-"]:before, +[class*=" icon-"]:before { + text-decoration: inherit; + display: inline-block; + cursor: default; + speak: none; +} +/* makes the font 33% larger relative to the icon container */ +.icon-large:before { + vertical-align: -10%; + font-size: 1.3333333333333333em; +} +/* makes sure icons active on rollover in links */ +a [class^="icon-"], +a [class*=" icon-"] { + display: inline; +} +/* increased font size for icon-large */ +[class^="icon-"].icon-fixed-width, +[class*=" icon-"].icon-fixed-width { + display: inline-block; + width: 1.1428571428571428em; + text-align: right; + padding-right: 0.2857142857142857em; +} +[class^="icon-"].icon-fixed-width.icon-large, +[class*=" icon-"].icon-fixed-width.icon-large { + width: 1.4285714285714286em; +} +.icons-ul { + margin-left: 2.142857142857143em; + list-style-type: none; +} +.icons-ul > li { + position: relative; +} +.icons-ul .icon-li { + position: absolute; + left: -2.142857142857143em; + width: 2.142857142857143em; + text-align: center; + line-height: inherit; +} +[class^="icon-"].hide, +[class*=" icon-"].hide { + display: none; +} +.icon-muted { + color: #eeeeee; +} +.icon-light { + color: #ffffff; +} +.icon-dark { + color: #333333; +} +.icon-border { + border: solid 1px #eeeeee; + padding: .2em .25em .15em; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} +.icon-2x { + font-size: 2em; +} +.icon-2x.icon-border { + border-width: 2px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; +} +.icon-3x { + font-size: 3em; +} +.icon-3x.icon-border { + border-width: 3px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +.icon-4x { + font-size: 4em; +} +.icon-4x.icon-border { + border-width: 4px; + -webkit-border-radius: 6px; + -moz-border-radius: 6px; + border-radius: 6px; +} +.icon-5x { + font-size: 5em; +} +.icon-5x.icon-border { + border-width: 5px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.pull-right { + float: right; +} +.pull-left { + float: left; +} +[class^="icon-"].pull-left, +[class*=" icon-"].pull-left { + margin-right: .3em; +} +[class^="icon-"].pull-right, +[class*=" icon-"].pull-right { + margin-left: .3em; +} +/* BOOTSTRAP SPECIFIC CLASSES + * -------------------------- */ +/* Bootstrap 2.0 sprites.less reset */ +[class^="icon-"], +[class*=" icon-"] { + display: inline; + width: auto; + height: auto; + line-height: normal; + vertical-align: baseline; + background-image: none; + background-position: 0% 0%; + background-repeat: repeat; + margin-top: 0; +} +/* more sprites.less reset */ +.icon-white, +.nav-pills > .active > a > [class^="icon-"], +.nav-pills > .active > a > [class*=" icon-"], +.nav-list > .active > a > [class^="icon-"], +.nav-list > .active > a > [class*=" icon-"], +.navbar-inverse .nav > .active > a > [class^="icon-"], +.navbar-inverse .nav > .active > a > [class*=" icon-"], +.dropdown-menu > li > a:hover > [class^="icon-"], +.dropdown-menu > li > a:hover > [class*=" icon-"], +.dropdown-menu > .active > a > [class^="icon-"], +.dropdown-menu > .active > a > [class*=" icon-"], +.dropdown-submenu:hover > a > [class^="icon-"], +.dropdown-submenu:hover > a > [class*=" icon-"] { + background-image: none; +} +/* keeps Bootstrap styles with and without icons the same */ +.btn [class^="icon-"].icon-large, +.nav [class^="icon-"].icon-large, +.btn [class*=" icon-"].icon-large, +.nav [class*=" icon-"].icon-large { + line-height: .9em; +} +.btn [class^="icon-"].icon-spin, +.nav [class^="icon-"].icon-spin, +.btn [class*=" icon-"].icon-spin, +.nav [class*=" icon-"].icon-spin { + display: inline-block; +} +.nav-tabs [class^="icon-"], +.nav-pills [class^="icon-"], +.nav-tabs [class*=" icon-"], +.nav-pills [class*=" icon-"], +.nav-tabs [class^="icon-"].icon-large, +.nav-pills [class^="icon-"].icon-large, +.nav-tabs [class*=" icon-"].icon-large, +.nav-pills [class*=" icon-"].icon-large { + line-height: .9em; +} +.btn [class^="icon-"].pull-left.icon-2x, +.btn [class*=" icon-"].pull-left.icon-2x, +.btn [class^="icon-"].pull-right.icon-2x, +.btn [class*=" icon-"].pull-right.icon-2x { + margin-top: .18em; +} +.btn [class^="icon-"].icon-spin.icon-large, +.btn [class*=" icon-"].icon-spin.icon-large { + line-height: .8em; +} +.btn.btn-small [class^="icon-"].pull-left.icon-2x, +.btn.btn-small [class*=" icon-"].pull-left.icon-2x, +.btn.btn-small [class^="icon-"].pull-right.icon-2x, +.btn.btn-small [class*=" icon-"].pull-right.icon-2x { + margin-top: .25em; +} +.btn.btn-large [class^="icon-"], +.btn.btn-large [class*=" icon-"] { + margin-top: 0; +} +.btn.btn-large [class^="icon-"].pull-left.icon-2x, +.btn.btn-large [class*=" icon-"].pull-left.icon-2x, +.btn.btn-large [class^="icon-"].pull-right.icon-2x, +.btn.btn-large [class*=" icon-"].pull-right.icon-2x { + margin-top: .05em; +} +.btn.btn-large [class^="icon-"].pull-left.icon-2x, +.btn.btn-large [class*=" icon-"].pull-left.icon-2x { + margin-right: .2em; +} +.btn.btn-large [class^="icon-"].pull-right.icon-2x, +.btn.btn-large [class*=" icon-"].pull-right.icon-2x { + margin-left: .2em; +} +/* EXTRAS + * -------------------------- */ +/* Stacked and layered icon */ +.icon-stack { + position: relative; + display: inline-block; + width: 2em; + height: 2em; + line-height: 2em; + vertical-align: -35%; +} +.icon-stack [class^="icon-"], +.icon-stack [class*=" icon-"] { + display: block; + text-align: center; + position: absolute; + width: 100%; + height: 100%; + font-size: 1em; + line-height: inherit; + *line-height: 2em; +} +.icon-stack .icon-stack-base { + font-size: 2em; + *line-height: 1em; +} +/* Animated rotating icon */ +.icon-spin { + display: inline-block; + -moz-animation: spin 2s infinite linear; + -o-animation: spin 2s infinite linear; + -webkit-animation: spin 2s infinite linear; + animation: spin 2s infinite linear; +} +a .icon-spin { + display: inline-block; + text-decoration: none; +} +@-moz-keyframes spin { + 0% { + -moz-transform: rotate(0deg); + } + 100% { + -moz-transform: rotate(359deg); + } +} +@-webkit-keyframes spin { + 0% { + -webkit-transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(359deg); + } +} +@-o-keyframes spin { + 0% { + -o-transform: rotate(0deg); + } + 100% { + -o-transform: rotate(359deg); + } +} +@-ms-keyframes spin { + 0% { + -ms-transform: rotate(0deg); + } + 100% { + -ms-transform: rotate(359deg); + } +} +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(359deg); + } +} +/* Icon rotations and mirroring */ +.icon-rotate-90:before { + -webkit-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -ms-transform: rotate(90deg); + -o-transform: rotate(90deg); + transform: rotate(90deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); +} +.icon-rotate-180:before { + -webkit-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -ms-transform: rotate(180deg); + -o-transform: rotate(180deg); + transform: rotate(180deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); +} +.icon-rotate-270:before { + -webkit-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -ms-transform: rotate(270deg); + -o-transform: rotate(270deg); + transform: rotate(270deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); +} +.icon-flip-horizontal:before { + -webkit-transform: scale(-1, 1); + -moz-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + -o-transform: scale(-1, 1); + transform: scale(-1, 1); +} +.icon-flip-vertical:before { + -webkit-transform: scale(1, -1); + -moz-transform: scale(1, -1); + -ms-transform: scale(1, -1); + -o-transform: scale(1, -1); + transform: scale(1, -1); +} +/* ensure rotation occurs inside anchor tags */ +a .icon-rotate-90:before, +a .icon-rotate-180:before, +a .icon-rotate-270:before, +a .icon-flip-horizontal:before, +a .icon-flip-vertical:before { + display: inline-block; +} +/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen + readers do not read off random characters that represent icons */ +.icon-glass:before { + content: "\f000"; +} +.icon-music:before { + content: "\f001"; +} +.icon-search:before { + content: "\f002"; +} +.icon-envelope-alt:before { + content: "\f003"; +} +.icon-heart:before { + content: "\f004"; +} +.icon-star:before { + content: "\f005"; +} +.icon-star-empty:before { + content: "\f006"; +} +.icon-user:before { + content: "\f007"; +} +.icon-film:before { + content: "\f008"; +} +.icon-th-large:before { + content: "\f009"; +} +.icon-th:before { + content: "\f00a"; +} +.icon-th-list:before { + content: "\f00b"; +} +.icon-ok:before { + content: "\f00c"; +} +.icon-remove:before { + content: "\f00d"; +} +.icon-zoom-in:before { + content: "\f00e"; +} +.icon-zoom-out:before { + content: "\f010"; +} +.icon-power-off:before, +.icon-off:before { + content: "\f011"; +} +.icon-signal:before { + content: "\f012"; +} +.icon-cog:before { + content: "\f013"; +} +.icon-trash:before { + content: "\f014"; +} +.icon-home:before { + content: "\f015"; +} +.icon-file-alt:before { + content: "\f016"; +} +.icon-time:before { + content: "\f017"; +} +.icon-road:before { + content: "\f018"; +} +.icon-download-alt:before { + content: "\f019"; +} +.icon-download:before { + content: "\f01a"; +} +.icon-upload:before { + content: "\f01b"; +} +.icon-inbox:before { + content: "\f01c"; +} +.icon-play-circle:before { + content: "\f01d"; +} +.icon-rotate-right:before, +.icon-repeat:before { + content: "\f01e"; +} +.icon-refresh:before { + content: "\f021"; +} +.icon-list-alt:before { + content: "\f022"; +} +.icon-lock:before { + content: "\f023"; +} +.icon-flag:before { + content: "\f024"; +} +.icon-headphones:before { + content: "\f025"; +} +.icon-volume-off:before { + content: "\f026"; +} +.icon-volume-down:before { + content: "\f027"; +} +.icon-volume-up:before { + content: "\f028"; +} +.icon-qrcode:before { + content: "\f029"; +} +.icon-barcode:before { + content: "\f02a"; +} +.icon-tag:before { + content: "\f02b"; +} +.icon-tags:before { + content: "\f02c"; +} +.icon-book:before { + content: "\f02d"; +} +.icon-bookmark:before { + content: "\f02e"; +} +.icon-print:before { + content: "\f02f"; +} +.icon-camera:before { + content: "\f030"; +} +.icon-font:before { + content: "\f031"; +} +.icon-bold:before { + content: "\f032"; +} +.icon-italic:before { + content: "\f033"; +} +.icon-text-height:before { + content: "\f034"; +} +.icon-text-width:before { + content: "\f035"; +} +.icon-align-left:before { + content: "\f036"; +} +.icon-align-center:before { + content: "\f037"; +} +.icon-align-right:before { + content: "\f038"; +} +.icon-align-justify:before { + content: "\f039"; +} +.icon-list:before { + content: "\f03a"; +} +.icon-indent-left:before { + content: "\f03b"; +} +.icon-indent-right:before { + content: "\f03c"; +} +.icon-facetime-video:before { + content: "\f03d"; +} +.icon-picture:before { + content: "\f03e"; +} +.icon-pencil:before { + content: "\f040"; +} +.icon-map-marker:before { + content: "\f041"; +} +.icon-adjust:before { + content: "\f042"; +} +.icon-tint:before { + content: "\f043"; +} +.icon-edit:before { + content: "\f044"; +} +.icon-share:before { + content: "\f045"; +} +.icon-check:before { + content: "\f046"; +} +.icon-move:before { + content: "\f047"; +} +.icon-step-backward:before { + content: "\f048"; +} +.icon-fast-backward:before { + content: "\f049"; +} +.icon-backward:before { + content: "\f04a"; +} +.icon-play:before { + content: "\f04b"; +} +.icon-pause:before { + content: "\f04c"; +} +.icon-stop:before { + content: "\f04d"; +} +.icon-forward:before { + content: "\f04e"; +} +.icon-fast-forward:before { + content: "\f050"; +} +.icon-step-forward:before { + content: "\f051"; +} +.icon-eject:before { + content: "\f052"; +} +.icon-chevron-left:before { + content: "\f053"; +} +.icon-chevron-right:before { + content: "\f054"; +} +.icon-plus-sign:before { + content: "\f055"; +} +.icon-minus-sign:before { + content: "\f056"; +} +.icon-remove-sign:before { + content: "\f057"; +} +.icon-ok-sign:before { + content: "\f058"; +} +.icon-question-sign:before { + content: "\f059"; +} +.icon-info-sign:before { + content: "\f05a"; +} +.icon-screenshot:before { + content: "\f05b"; +} +.icon-remove-circle:before { + content: "\f05c"; +} +.icon-ok-circle:before { + content: "\f05d"; +} +.icon-ban-circle:before { + content: "\f05e"; +} +.icon-arrow-left:before { + content: "\f060"; +} +.icon-arrow-right:before { + content: "\f061"; +} +.icon-arrow-up:before { + content: "\f062"; +} +.icon-arrow-down:before { + content: "\f063"; +} +.icon-mail-forward:before, +.icon-share-alt:before { + content: "\f064"; +} +.icon-resize-full:before { + content: "\f065"; +} +.icon-resize-small:before { + content: "\f066"; +} +.icon-plus:before { + content: "\f067"; +} +.icon-minus:before { + content: "\f068"; +} +.icon-asterisk:before { + content: "\f069"; +} +.icon-exclamation-sign:before { + content: "\f06a"; +} +.icon-gift:before { + content: "\f06b"; +} +.icon-leaf:before { + content: "\f06c"; +} +.icon-fire:before { + content: "\f06d"; +} +.icon-eye-open:before { + content: "\f06e"; +} +.icon-eye-close:before { + content: "\f070"; +} +.icon-warning-sign:before { + content: "\f071"; +} +.icon-plane:before { + content: "\f072"; +} +.icon-calendar:before { + content: "\f073"; +} +.icon-random:before { + content: "\f074"; +} +.icon-comment:before { + content: "\f075"; +} +.icon-magnet:before { + content: "\f076"; +} +.icon-chevron-up:before { + content: "\f077"; +} +.icon-chevron-down:before { + content: "\f078"; +} +.icon-retweet:before { + content: "\f079"; +} +.icon-shopping-cart:before { + content: "\f07a"; +} +.icon-folder-close:before { + content: "\f07b"; +} +.icon-folder-open:before { + content: "\f07c"; +} +.icon-resize-vertical:before { + content: "\f07d"; +} +.icon-resize-horizontal:before { + content: "\f07e"; +} +.icon-bar-chart:before { + content: "\f080"; +} +.icon-twitter-sign:before { + content: "\f081"; +} +.icon-facebook-sign:before { + content: "\f082"; +} +.icon-camera-retro:before { + content: "\f083"; +} +.icon-key:before { + content: "\f084"; +} +.icon-cogs:before { + content: "\f085"; +} +.icon-comments:before { + content: "\f086"; +} +.icon-thumbs-up-alt:before { + content: "\f087"; +} +.icon-thumbs-down-alt:before { + content: "\f088"; +} +.icon-star-half:before { + content: "\f089"; +} +.icon-heart-empty:before { + content: "\f08a"; +} +.icon-signout:before { + content: "\f08b"; +} +.icon-linkedin-sign:before { + content: "\f08c"; +} +.icon-pushpin:before { + content: "\f08d"; +} +.icon-external-link:before { + content: "\f08e"; +} +.icon-signin:before { + content: "\f090"; +} +.icon-trophy:before { + content: "\f091"; +} +.icon-github-sign:before { + content: "\f092"; +} +.icon-upload-alt:before { + content: "\f093"; +} +.icon-lemon:before { + content: "\f094"; +} +.icon-phone:before { + content: "\f095"; +} +.icon-unchecked:before, +.icon-check-empty:before { + content: "\f096"; +} +.icon-bookmark-empty:before { + content: "\f097"; +} +.icon-phone-sign:before { + content: "\f098"; +} +.icon-twitter:before { + content: "\f099"; +} +.icon-facebook:before { + content: "\f09a"; +} +.icon-github:before { + content: "\f09b"; +} +.icon-unlock:before { + content: "\f09c"; +} +.icon-credit-card:before { + content: "\f09d"; +} +.icon-rss:before { + content: "\f09e"; +} +.icon-hdd:before { + content: "\f0a0"; +} +.icon-bullhorn:before { + content: "\f0a1"; +} +.icon-bell:before { + content: "\f0a2"; +} +.icon-certificate:before { + content: "\f0a3"; +} +.icon-hand-right:before { + content: "\f0a4"; +} +.icon-hand-left:before { + content: "\f0a5"; +} +.icon-hand-up:before { + content: "\f0a6"; +} +.icon-hand-down:before { + content: "\f0a7"; +} +.icon-circle-arrow-left:before { + content: "\f0a8"; +} +.icon-circle-arrow-right:before { + content: "\f0a9"; +} +.icon-circle-arrow-up:before { + content: "\f0aa"; +} +.icon-circle-arrow-down:before { + content: "\f0ab"; +} +.icon-globe:before { + content: "\f0ac"; +} +.icon-wrench:before { + content: "\f0ad"; +} +.icon-tasks:before { + content: "\f0ae"; +} +.icon-filter:before { + content: "\f0b0"; +} +.icon-briefcase:before { + content: "\f0b1"; +} +.icon-fullscreen:before { + content: "\f0b2"; +} +.icon-group:before { + content: "\f0c0"; +} +.icon-link:before { + content: "\f0c1"; +} +.icon-cloud:before { + content: "\f0c2"; +} +.icon-beaker:before { + content: "\f0c3"; +} +.icon-cut:before { + content: "\f0c4"; +} +.icon-copy:before { + content: "\f0c5"; +} +.icon-paperclip:before, +.icon-paper-clip:before { + content: "\f0c6"; +} +.icon-save:before { + content: "\f0c7"; +} +.icon-sign-blank:before { + content: "\f0c8"; +} +.icon-reorder:before { + content: "\f0c9"; +} +.icon-list-ul:before { + content: "\f0ca"; +} +.icon-list-ol:before { + content: "\f0cb"; +} +.icon-strikethrough:before { + content: "\f0cc"; +} +.icon-underline:before { + content: "\f0cd"; +} +.icon-table:before { + content: "\f0ce"; +} +.icon-magic:before { + content: "\f0d0"; +} +.icon-truck:before { + content: "\f0d1"; +} +.icon-pinterest:before { + content: "\f0d2"; +} +.icon-pinterest-sign:before { + content: "\f0d3"; +} +.icon-google-plus-sign:before { + content: "\f0d4"; +} +.icon-google-plus:before { + content: "\f0d5"; +} +.icon-money:before { + content: "\f0d6"; +} +.icon-caret-down:before { + content: "\f0d7"; +} +.icon-caret-up:before { + content: "\f0d8"; +} +.icon-caret-left:before { + content: "\f0d9"; +} +.icon-caret-right:before { + content: "\f0da"; +} +.icon-columns:before { + content: "\f0db"; +} +.icon-sort:before { + content: "\f0dc"; +} +.icon-sort-down:before { + content: "\f0dd"; +} +.icon-sort-up:before { + content: "\f0de"; +} +.icon-envelope:before { + content: "\f0e0"; +} +.icon-linkedin:before { + content: "\f0e1"; +} +.icon-rotate-left:before, +.icon-undo:before { + content: "\f0e2"; +} +.icon-legal:before { + content: "\f0e3"; +} +.icon-dashboard:before { + content: "\f0e4"; +} +.icon-comment-alt:before { + content: "\f0e5"; +} +.icon-comments-alt:before { + content: "\f0e6"; +} +.icon-bolt:before { + content: "\f0e7"; +} +.icon-sitemap:before { + content: "\f0e8"; +} +.icon-umbrella:before { + content: "\f0e9"; +} +.icon-paste:before { + content: "\f0ea"; +} +.icon-lightbulb:before { + content: "\f0eb"; +} +.icon-exchange:before { + content: "\f0ec"; +} +.icon-cloud-download:before { + content: "\f0ed"; +} +.icon-cloud-upload:before { + content: "\f0ee"; +} +.icon-user-md:before { + content: "\f0f0"; +} +.icon-stethoscope:before { + content: "\f0f1"; +} +.icon-suitcase:before { + content: "\f0f2"; +} +.icon-bell-alt:before { + content: "\f0f3"; +} +.icon-coffee:before { + content: "\f0f4"; +} +.icon-food:before { + content: "\f0f5"; +} +.icon-file-text-alt:before { + content: "\f0f6"; +} +.icon-building:before { + content: "\f0f7"; +} +.icon-hospital:before { + content: "\f0f8"; +} +.icon-ambulance:before { + content: "\f0f9"; +} +.icon-medkit:before { + content: "\f0fa"; +} +.icon-fighter-jet:before { + content: "\f0fb"; +} +.icon-beer:before { + content: "\f0fc"; +} +.icon-h-sign:before { + content: "\f0fd"; +} +.icon-plus-sign-alt:before { + content: "\f0fe"; +} +.icon-double-angle-left:before { + content: "\f100"; +} +.icon-double-angle-right:before { + content: "\f101"; +} +.icon-double-angle-up:before { + content: "\f102"; +} +.icon-double-angle-down:before { + content: "\f103"; +} +.icon-angle-left:before { + content: "\f104"; +} +.icon-angle-right:before { + content: "\f105"; +} +.icon-angle-up:before { + content: "\f106"; +} +.icon-angle-down:before { + content: "\f107"; +} +.icon-desktop:before { + content: "\f108"; +} +.icon-laptop:before { + content: "\f109"; +} +.icon-tablet:before { + content: "\f10a"; +} +.icon-mobile-phone:before { + content: "\f10b"; +} +.icon-circle-blank:before { + content: "\f10c"; +} +.icon-quote-left:before { + content: "\f10d"; +} +.icon-quote-right:before { + content: "\f10e"; +} +.icon-spinner:before { + content: "\f110"; +} +.icon-circle:before { + content: "\f111"; +} +.icon-mail-reply:before, +.icon-reply:before { + content: "\f112"; +} +.icon-github-alt:before { + content: "\f113"; +} +.icon-folder-close-alt:before { + content: "\f114"; +} +.icon-folder-open-alt:before { + content: "\f115"; +} +.icon-expand-alt:before { + content: "\f116"; +} +.icon-collapse-alt:before { + content: "\f117"; +} +.icon-smile:before { + content: "\f118"; +} +.icon-frown:before { + content: "\f119"; +} +.icon-meh:before { + content: "\f11a"; +} +.icon-gamepad:before { + content: "\f11b"; +} +.icon-keyboard:before { + content: "\f11c"; +} +.icon-flag-alt:before { + content: "\f11d"; +} +.icon-flag-checkered:before { + content: "\f11e"; +} +.icon-terminal:before { + content: "\f120"; +} +.icon-code:before { + content: "\f121"; +} +.icon-reply-all:before { + content: "\f122"; +} +.icon-mail-reply-all:before { + content: "\f122"; +} +.icon-star-half-full:before, +.icon-star-half-empty:before { + content: "\f123"; +} +.icon-location-arrow:before { + content: "\f124"; +} +.icon-crop:before { + content: "\f125"; +} +.icon-code-fork:before { + content: "\f126"; +} +.icon-unlink:before { + content: "\f127"; +} +.icon-question:before { + content: "\f128"; +} +.icon-info:before { + content: "\f129"; +} +.icon-exclamation:before { + content: "\f12a"; +} +.icon-superscript:before { + content: "\f12b"; +} +.icon-subscript:before { + content: "\f12c"; +} +.icon-eraser:before { + content: "\f12d"; +} +.icon-puzzle-piece:before { + content: "\f12e"; +} +.icon-microphone:before { + content: "\f130"; +} +.icon-microphone-off:before { + content: "\f131"; +} +.icon-shield:before { + content: "\f132"; +} +.icon-calendar-empty:before { + content: "\f133"; +} +.icon-fire-extinguisher:before { + content: "\f134"; +} +.icon-rocket:before { + content: "\f135"; +} +.icon-maxcdn:before { + content: "\f136"; +} +.icon-chevron-sign-left:before { + content: "\f137"; +} +.icon-chevron-sign-right:before { + content: "\f138"; +} +.icon-chevron-sign-up:before { + content: "\f139"; +} +.icon-chevron-sign-down:before { + content: "\f13a"; +} +.icon-html5:before { + content: "\f13b"; +} +.icon-css3:before { + content: "\f13c"; +} +.icon-anchor:before { + content: "\f13d"; +} +.icon-unlock-alt:before { + content: "\f13e"; +} +.icon-bullseye:before { + content: "\f140"; +} +.icon-ellipsis-horizontal:before { + content: "\f141"; +} +.icon-ellipsis-vertical:before { + content: "\f142"; +} +.icon-rss-sign:before { + content: "\f143"; +} +.icon-play-sign:before { + content: "\f144"; +} +.icon-ticket:before { + content: "\f145"; +} +.icon-minus-sign-alt:before { + content: "\f146"; +} +.icon-check-minus:before { + content: "\f147"; +} +.icon-level-up:before { + content: "\f148"; +} +.icon-level-down:before { + content: "\f149"; +} +.icon-check-sign:before { + content: "\f14a"; +} +.icon-edit-sign:before { + content: "\f14b"; +} +.icon-external-link-sign:before { + content: "\f14c"; +} +.icon-share-sign:before { + content: "\f14d"; +} +.icon-compass:before { + content: "\f14e"; +} +.icon-collapse:before { + content: "\f150"; +} +.icon-collapse-top:before { + content: "\f151"; +} +.icon-expand:before { + content: "\f152"; +} +.icon-euro:before, +.icon-eur:before { + content: "\f153"; +} +.icon-gbp:before { + content: "\f154"; +} +.icon-dollar:before, +.icon-usd:before { + content: "\f155"; +} +.icon-rupee:before, +.icon-inr:before { + content: "\f156"; +} +.icon-yen:before, +.icon-jpy:before { + content: "\f157"; +} +.icon-renminbi:before, +.icon-cny:before { + content: "\f158"; +} +.icon-won:before, +.icon-krw:before { + content: "\f159"; +} +.icon-bitcoin:before, +.icon-btc:before { + content: "\f15a"; +} +.icon-file:before { + content: "\f15b"; +} +.icon-file-text:before { + content: "\f15c"; +} +.icon-sort-by-alphabet:before { + content: "\f15d"; +} +.icon-sort-by-alphabet-alt:before { + content: "\f15e"; +} +.icon-sort-by-attributes:before { + content: "\f160"; +} +.icon-sort-by-attributes-alt:before { + content: "\f161"; +} +.icon-sort-by-order:before { + content: "\f162"; +} +.icon-sort-by-order-alt:before { + content: "\f163"; +} +.icon-thumbs-up:before { + content: "\f164"; +} +.icon-thumbs-down:before { + content: "\f165"; +} +.icon-youtube-sign:before { + content: "\f166"; +} +.icon-youtube:before { + content: "\f167"; +} +.icon-xing:before { + content: "\f168"; +} +.icon-xing-sign:before { + content: "\f169"; +} +.icon-youtube-play:before { + content: "\f16a"; +} +.icon-dropbox:before { + content: "\f16b"; +} +.icon-stackexchange:before { + content: "\f16c"; +} +.icon-instagram:before { + content: "\f16d"; +} +.icon-flickr:before { + content: "\f16e"; +} +.icon-adn:before { + content: "\f170"; +} +.icon-bitbucket:before { + content: "\f171"; +} +.icon-bitbucket-sign:before { + content: "\f172"; +} +.icon-tumblr:before { + content: "\f173"; +} +.icon-tumblr-sign:before { + content: "\f174"; +} +.icon-long-arrow-down:before { + content: "\f175"; +} +.icon-long-arrow-up:before { + content: "\f176"; +} +.icon-long-arrow-left:before { + content: "\f177"; +} +.icon-long-arrow-right:before { + content: "\f178"; +} +.icon-apple:before { + content: "\f179"; +} +.icon-windows:before { + content: "\f17a"; +} +.icon-android:before { + content: "\f17b"; +} +.icon-linux:before { + content: "\f17c"; +} +.icon-dribble:before { + content: "\f17d"; +} +.icon-skype:before { + content: "\f17e"; +} +.icon-foursquare:before { + content: "\f180"; +} +.icon-trello:before { + content: "\f181"; +} +.icon-female:before { + content: "\f182"; +} +.icon-male:before { + content: "\f183"; +} +.icon-gittip:before { + content: "\f184"; +} +.icon-sun:before { + content: "\f185"; +} +.icon-moon:before { + content: "\f186"; +} +.icon-archive:before { + content: "\f187"; +} +.icon-bug:before { + content: "\f188"; +} +.icon-vk:before { + content: "\f189"; +} +.icon-weibo:before { + content: "\f18a"; +} +.icon-renren:before { + content: "\f18b"; +} diff --git a/assets/less/forms.less b/assets/less/forms.less new file mode 100644 index 0000000..2630547 --- /dev/null +++ b/assets/less/forms.less @@ -0,0 +1,232 @@ +form { + margin: 0 0 5px 0; + fieldset { + margin-bottom: 5px; + padding: 0; + border-width: 0; + } + legend { + display: block; + width: 100%; + margin-bottom: 5px * 2; + *margin-left: -7px; + padding: 0; + color: @text-color; + border: 0; + border-bottom: 1px solid lighten(@black, 80); + white-space: normal; + } + p { + margin-bottom: 5px / 2; + } + ul { + list-style-type: none; + margin: 0 0 5px 0; + padding: 0; + } + br { + display: none; + } +} +label, +input, +button, +select, +textarea { + vertical-align: baseline; + *vertical-align: middle; +} +input, +button, +select, +textarea { + font-family: @base-font; + .box-sizing(border-box); +} +label { + display: block; + margin-bottom: 10px / 8; + font-weight: bold; + color: @text-color; + cursor: pointer; + input, + textarea, + select { + display: block; + } +} +input, +textarea, +select { + display: inline-block; + width: 100%; + padding: 4px; + margin-bottom: 5px / 4; + background-color: @white; + border: 1px solid lighten(@black, 80); + color: @text-color; + &:hover { + border-color: lighten(@accent-color, 50); + } +} +.input-mini { + width: 60px; +} +.input-small { + width: 90px; +} +input[type="image"], +input[type="checkbox"], +input[type="radio"] { + width: auto; + height: auto; + padding: 0; + margin: 3px 0; + *margin-top: 0; + line-height: normal; + cursor: pointer; + .rounded(0); + border: 0 \9; +} +input[type="checkbox"], +input[type="radio"] { + .box-sizing(border-box); + padding: 0; + *width: 13px; + *height: 13px; +} +input[type="image"] { + border: 0; + .box-shadow(none); +} +input[type="file"] { + width: auto; + padding: initial; + line-height: initial; + border: initial; + background-color: transparent; + background-color: initial; + .box-shadow(none); +} +input[type="button"], +input[type="reset"], +input[type="submit"] { + width : auto; + height : auto; + cursor : pointer; + *overflow : visible; +} +select, +input[type="file"] { + *margin-top : 4px; +} +select { + width : auto; + background-color : @white; +} +select[multiple], +select[size] { + height : auto; +} +textarea { + .resize(vertical); + height : auto; + overflow : auto; + vertical-align : top; +} +input[type="hidden"] { + display : none; +} +.radio, +.checkbox { + padding-left : 18px; + font-weight : normal; +} +.radio input[type="radio"], +.checkbox input[type="checkbox"] { + float : left; + margin-left : -18px; +} +.radio.inline, +.checkbox.inline { + display : inline-block; + padding-top : 5px; + margin-bottom : 0; + vertical-align : middle; +} +.radio.inline + .radio.inline, +.checkbox.inline + .checkbox.inline { + margin-left : 10px; +} + +// disabled +// -------------------------------------------------- + +input[disabled], +select[disabled], +textarea[disabled], +input[readonly], +select[readonly], +textarea[readonly] { + .opacity(.5); + cursor : not-allowed; +} + +// focus and active +// -------------------------------------------------- + +input:focus, +textarea:focus { + border-color : @accent-color; + outline : 0; + outline : thin dotted \9; +} +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus, +select:focus { + .box-shadow(none); +} + +// help text +// -------------------------------------------------- + +.help-block, +.help-inline { + color : lighten(@black, 50); +} +.help-block { + display : block; + margin-bottom : 1em; + line-height : 1em; +} +.help-inline { + display : inline-block; + vertical-align : middle; + padding-left : 5px; +} + +// .form-inline +// -------------------------------------------------- + +.form-inline input, +.form-inline textarea, +.form-inline select { + display : inline-block; + margin-bottom : 0; +} +.form-inline label { + display : inline-block; +} +.form-inline .radio, +.form-inline .checkbox, +.form-inline .radio { + padding-left : 0; + margin-bottom : 0; + vertical-align : middle; +} +.form-inline .radio input[type="radio"], +.form-inline .checkbox input[type="checkbox"] { + float : left; + margin-left : 0; + margin-right : 3px; }
\ No newline at end of file diff --git a/assets/less/grid.less b/assets/less/grid.less new file mode 100644 index 0000000..ed5ef3e --- /dev/null +++ b/assets/less/grid.less @@ -0,0 +1,47 @@ +// Defining number of columns in the grid. +// Common Values would be 12, 16 or 24 +@width: 100%; +@def_grid: 12; +@margin: 0; + +.container(){ + margin:0 auto; + width:@width; +} + +// Works out the width of elements based +// on total number of columns and width +// number of columns being displayed. +// Removes 20px for margins +.grid(@grid:@def_grid,@cols:'',@float:left,@display:inline){ + display:@display; + float:@float; + width:(100%/@grid * @cols) - (@margin * 2); +} + +// Allows for padding before element +.prefix(@grid:@def_grid,@cols:''){ + margin-left:(100%/@grid * @cols); +} +// Allows for padding after element +.suffix(@grid:@def_grid,@cols:''){ + margin-right:(100%/@grid * @cols); +} +// Removes left margin +.first(){ + margin-left:0; +} +// Removes right margin +.last(){ + margin-right:0; +} + +.push(@grid:@def_grid,@move:'') { + position:relative; + left:(100%/@grid * @move); +} + +.pull(@grid:@def_grid,@move:''){ + position:relative; + left:(100%/@grid * @move) * -1; +}
\ No newline at end of file diff --git a/assets/less/main.less b/assets/less/main.less new file mode 100644 index 0000000..e859a30 --- /dev/null +++ b/assets/less/main.less @@ -0,0 +1,29 @@ +// =========================================================== +// So Simple Theme +// By: Michael Rose +// =========================================================== + +// ROOT ======================================================= +// CSS Reset ================================================== +@import "reset.less"; +// Variables and mixins ======================================= +@import "variables.less"; +// Site wide styles (html, body, global classes) ============== +@import "site.less"; +// TYPOGRAPHY ================================================= +@import "typography.less"; +// Pygments Syntax highlighting =============================== +@import "pygments.less"; +// MIXINS ===================================================== +@import "mixins.less"; +@import "grid.less"; +// ELEMENTS =================================================== +// Figures, images, social media, other elements ============== +@import "elements.less"; +// Font Awesome webfont icons ================================= +@import "font-awesome.less"; +// Standard form controls ===================================== +@import "forms.less"; +// LAYOUT ===================================================== +// Page level layout styles =================================== +@import "page.less";
\ No newline at end of file diff --git a/assets/less/mixins.less b/assets/less/mixins.less new file mode 100644 index 0000000..a408b7d --- /dev/null +++ b/assets/less/mixins.less @@ -0,0 +1,305 @@ +// UTILITY MIXINS +// -------------------------------------------------- + +// Clearfix +// -------------------- +// For clearing floats like a boss h5bp.com/q +.clearfix { + *zoom: 1; + &:before, + &:after { + display: table; + content: ""; + // Fixes Opera/contenteditable bug: + // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952 + line-height: 0; + } + &:after { + clear: both; + } +} + +// Webkit-style focus +// -------------------- +.tab-focus() { + // Default + outline: thin dotted #333; + // Webkit + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} + +// Center-align a block level element +// ---------------------------------- +.center-block() { + display: block; + margin-left: auto; + margin-right: auto; +} + +// TYPOGRAPHY +// -------------------------------------------------- + +// Full-fat vertical rhythm +// ------------------------ +.font-size(@size) { + font-size: 0px + @size; + font-size: 0rem + @size / @doc-font-size; + line-height: 0 + round(@doc-line-height / @size*10000) / 10000; + margin-bottom: 0px + @doc-line-height; + margin-bottom: 0rem + (@doc-line-height / @doc-font-size); +} + +// Just the REMs +// ------------- +.font-rem(@size) { + font-size: 0px + @size; + font-size: 0rem + @size / @doc-font-size; +} + +// Just font-size and line-height +// ------------------------------ +.font(@size) { + font-size: 0px + @size; + font-size: 0rem + @size / @doc-font-size; + line-height: 0 + round(@doc-line-height / @size*10000) / 10000; +} + +.text-overflow() { +overflow: hidden; +text-overflow: ellipsis; +white-space: nowrap; } + +// GRADIENTS +// -------------------------------------------------- + +.horizontal(@startColor : @white, @endColor : @lightergrey) { +background-color: @endColor; +background-image : -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ +background-image : -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+ +background-image : -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+ +background-image : -ms-linear-gradient(left, @startColor, @endColor); // IE10 +background-image : -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 +background-image : linear-gradient(left, @startColor, @endColor); // W3C +background-repeat : repeat-x; } + +.vertical(@startColor : @white, @endColor: @lightergrey) { +background-image : -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ +background-image : -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ +background-color : @endColor; +background-image : -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ +background-image : -ms-linear-gradient(top, @startColor, @endColor); // IE10 +background-image : -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 +background-image : linear-gradient(top, @startColor, @endColor); // W3C +background-repeat : repeat-x; } + +.directional(@startColor : @white, @endColor : @lightergrey, @deg : 45deg) { +background-color : @endColor; +background-image : -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+ +background-image : -ms-linear-gradient(@deg, @startColor, @endColor); // IE10 +background-image : -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+ +background-image : -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10 +background-image : linear-gradient(@deg, @startColor, @endColor); // W3C +background-repeat : repeat-x; } + +// .bordered(COLOR, COLOR, COLOR, COLOR); +.bordered(@top-color: #eee, @right-color: #eee, @bottom-color: #eee, @left-color: #eee) { +border-top : solid 1px @top-color; +border-left : solid 1px @left-color; +border-right : solid 1px @right-color; +border-bottom : solid 1px @bottom-color; } + +// ROUND CORNERS +// -------------------------------------------------- + +// .rounded(VALUE); +.rounded(@radius:4px) { +-webkit-border-radius : @radius; +-moz-border-radius : @radius; +border-radius : @radius; } + +// .border-radius(VALUE,VALUE,VALUE,VALUE); +.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) { +-webkit-border-top-right-radius : @topright; +-webkit-border-bottom-right-radius : @bottomright; +-webkit-border-bottom-left-radius : @bottomleft; +-webkit-border-top-left-radius : @topleft; +-moz-border-radius-topright : @topright; +-moz-border-radius-bottomright : @bottomright; +-moz-border-radius-bottomleft : @bottomleft; +-moz-border-radius-topleft : @topleft; +border-top-right-radius : @topright; +border-bottom-right-radius : @bottomright; +border-bottom-left-radius : @bottomleft; +border-top-left-radius : @topleft; +-webkit-background-clip : padding-box; +-moz-background-clip : padding; +background-clip : padding-box; } + +// .box-shadow(HORIZONTAL VERTICAL BLUR COLOR)) +.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) { +-webkit-box-shadow : @shadow; +-moz-box-shadow : @shadow; +box-shadow : @shadow; } + +// .drop-shadow(HORIZONTAL, VERTICAL, BLUR, ALPHA); +.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) { +-webkit-box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); +-moz-box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); +box-shadow : @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); } + +// .text-shadow(); +.text-shadow(@shadow: 0 2px 3px rgba(0,0,0,.25)) { +text-shadow : @shadow; } + +// .opacity(VALUE); +.opacity(@opacity : .5) { +-webkit-opacity : @opacity; +-moz-opacity : @opacity; +opacity : @opacity; } + +// TRANSFORMATIONS +// -------------------------------------------------- + +// .rotate(VALUEdeg); +.rotate(@deg) { +-webkit-transform : rotate(@deg); +-moz-transform : rotate(@deg); +-ms-transform : rotate(@deg); +-o-transform : rotate(@deg); +transform : rotate(@deg); } + +// .scale(VALUE); +.scale(@ratio) { +-webkit-transform : scale(@ratio); +-moz-transform : scale(@ratio); +-ms-transform : scale(@ratio); +-o-transform : scale(@ratio); +transform : scale(@ratio); } + +// .skew(VALUE, VALUE); +.skew(@x: 0, @y: 0) { +-webkit-transform : skew(@x, @y); +-moz-transform : skew(@x, @y); +-ms-transform : skew(@x, @y); +-o-transform : skew(@x, @y); +transform : skew(@x, @y); } + +// .transition(PROPERTY DURATION DELAY(OPTIONAL) TIMING-FINCTION); +.transition(@transition) { +-webkit-transition : @transition; +-moz-transition : @transition; +-ms-transition : @transition; +-o-transition : @transition; +transition : @transition; } + +// .translate(VALUE, VALUE) +.translate(@x: 0, @y: 0) { +-webkit-transform : translate(@x, @y); +-moz-transform : translate(@x, @y); +-ms-transform : translate(@x, @y); +-o-transform : translate(@x, @y); +transform : translate(@x, @y); } + +.translate3d(@x: 0, @y: 0, @z: 0) { +-webkit-transform : translate(@x, @y, @z); +-moz-transform : translate(@x, @y, @z); +-ms-transform : translate(@x, @y, @z); +-o-transform : translate(@x, @y, @z); +transform : translate(@x, @y, @z); } + +.animation(@name, @duration: 300ms, @delay: 0, @ease: ease) { + -webkit-animation: @name @duration @delay @ease; + -moz-animation: @name @duration @delay @ease; + -ms-animation: @name @duration @delay @ease; +} + +// BACKGROUND +// -------------------------------------------------- + +// .background-alpha(VALUE VALUE); +.background-alpha(@color: @white, @alpha: 1) { +background-color : hsla(hue(@color), saturation(@color), lightness(@color), @alpha); } + +// .background-size(VALUE VALUE); +.background-size(@size){ +-webkit-background-size : @size; +-moz-background-size : @size; +-o-background-size : @size; +background-size : @size; } + +// .background-clip(VALUE); (border-box, padding-box, content-box) +.background-clip(@clip) { +-webkit-background-clip : @clip; +-moz-background-clip : @clip; +background-clip : @clip; } + +// .box-sizing(VALUE); (border-box, padding-box, content-box) +.box-sizing(@boxsize: border-box) { +-webkit-box-sizing : @boxsize; +-moz-box-sizing : @boxsize; +-ms-box-sizing : @boxsize; +box-sizing : @boxsize; } + +// For image replacement +.hide-text() { +text-indent : 100%; +white-space : nowrap; +overflow : hidden; } + +// Hide from visual and speaking browsers +.hidden() { +display : none !important; +visibility : hidden; } +.hidden { + display: none; + visibility: hidden; +} + +// Hide but maintain layout +.invisible() { +visibility : hidden; } + +// .resize(VALUE) (none, both, horizontal, vertical, inherit) +.resize(@direction: both) { +resize : @direction; +overflow : auto; } + +// .userselect(VALUE) (all, element, none, text) +.user-select(@select) { +-webkit-user-select : @select; +-moz-user-select : @select; +-o-user-select : @select; +user-select : @select; } + +// Hidden but available to speaking browsers +.visuallyhidden() { +overflow : hidden; +position : absolute; +clip : rect(0 0 0 0); +height : 1px; +width : 1px; +margin : -1px; +padding : 0; +border : 0; } + +// Make visuallyhidden focusable with a keyboard +.visuallyhidden.focusable:active, +.visuallyhidden.focusable:focus { +position : static; +clip : auto; +height : auto; +width : auto; +margin : 0; +overflow: visible; } + +// MEDIA QUERIES +// -------------------------------------------------- + +@small: ~"only screen and (min-width: 30em)"; +@medium: ~"only screen and (min-width: 48em)"; +@large: ~"only screen and (min-width: 62.5em)"; +@highdensity: ~"only screen and (-webkit-min-device-pixel-ratio: 1.5)", + ~"only screen and (-o-min-device-pixel-ratio: 3/2)", + ~"only screen and (min-resolution: 144dpi)", + ~"only screen and (min-resolution: 1.5dppx)";
\ No newline at end of file diff --git a/assets/less/page.less b/assets/less/page.less new file mode 100644 index 0000000..ee50314 --- /dev/null +++ b/assets/less/page.less @@ -0,0 +1,431 @@ +body { + margin: 0; + padding: 0; + width: 100%; + background-color: @white; + border-top: 5px solid @black; + @media @medium { + .font-rem(20); + } +} + +// Top Navigation +// -------------------------------------------------- +.navigation-wrapper { + text-align: center; + .clearfix(); + ul { + display: inline-block; + vertical-align: top; + margin: 0 0 50px; + padding: 4px 20px; + background-color: @black; + .rounded(0 0 10px 10px); + .clearfix(); + } + li { + display: block; + float: left; + list-style: none; + text-align: center; + .font-rem(14); + text-transform: uppercase; + color: @white; + } + a { + display: block; + padding: 6px 10px; + color: @white; + border: 1px solid @black; + .rounded(4px); + &:hover { + border: 1px solid @white; + border-bottom: 1px solid lighten(@black,50); + border: 1px solid fade(@white,50); + } + } +} +// Responsive nav toggle stuff +#site-nav { + z-index: 9999; + display: none; + @media @medium { + -webkit-animation-duration: 1s; + -moz-animation-duration: 1s; + -o-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-delay: .05s; + -moz-animation-delay: .05s; + -o-animation-delay: .05s; + animation-delay: .05s; + } + &.closed { + + @media @medium { + display: block; + } + } + &.opened { + display: block; + max-height: 100%; + li { + float: none; + } + } +} +.no-js #site-nav { + display: block; +} +#nav-toggle { + display: block; + vertical-align: top; + margin: 0; + padding: 4px 20px; + background-color: @black; + .rounded(0 0 4px 4px); + @media @medium { + display: none; + } +} + +// Masthead +// -------------------------------------------------- +.masthead { + margin-top: 40px; + .clearfix(); + @media @medium { + margin-top: 0; + } + .wrap { + text-align: center; + max-width: 27.5em; + padding-right: 20px; + padding-left: 20px; + @media @medium { + max-width: 45.5em; + padding-right: 60px; + padding-left: 60px; + } + @media @large { + max-width: 60em; + } + } +} +.site-logo { + img { + width: 100px; + height: 100px; + -webkit-animation-duration: 1s; + -moz-animation-duration: 1s; + -o-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-delay: .05s; + -moz-animation-delay: .05s; + -o-animation-delay: .05s; + animation-delay: .05s; + .rounded(100px); + @media @medium { + width: 150px; + height: 150px; + .rounded(150px); + } + @media @large { + width: 200px; + height: 200px; + .rounded(200px); + } + } +} +.site-title { + margin-bottom: 0; + -webkit-animation-duration: 1s; + -moz-animation-duration: 1s; + -o-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-delay: .75s; + -moz-animation-delay: .75s; + -o-animation-delay: .75s; + animation-delay: .75s; + a { color: @black; } +} +.site-description { + margin-top: 0; + font-family: @alt-font; + .font-rem(16); + font-weight: 400; + font-style: italic; + -webkit-animation-duration: 1s; + -moz-animation-duration: 1s; + -o-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-delay: 1s; + -moz-animation-delay: 1s; + -o-animation-delay: 1s; + animation-delay: 1s; + @media @medium { + .font-rem(20); + } +} + +// Main +// -------------------------------------------------- +#main { + .clearfix(); +} +.hentry { + .clearfix(); + border-bottom: 1px solid lighten(@black,80); + border-bottom: 1px solid fade(@black,10); +} +.entry-feature-image { + margin: 40px 0; + width: 100%; +} +.entry-header { + max-width: 640px; + width: 100%; + margin-right: auto; + margin-left: auto; + @media @large { + max-width: 100%; + margin-right: 0; + margin-left: 0; + } +} +.entry-tags { + display: block; + margin-top: 2em; + text-transform: uppercase; + .font-rem(16); + font-weight: 600; + a { color: @text-color; } +} +span + .entry-title { + margin-top: 0; +} +.entry-title { + font-family: @alt-font; + font-style: italic; + .font-rem(36); + font-weight: 700; + line-height: 1; + letter-spacing: -3px; + a { color: @black; } + @media @medium { + max-width: 600px; + .font-rem(52); + } + @media @large { + max-width: 800px; + .font-rem(68); + } +} +.entry-wrapper { + margin: 0 auto 3em; + max-width: 440px; + padding-right: 20px; + padding-left: 20px; + .clearfix(); + @media @medium { + max-width: 760px; + padding-right: 60px; + padding-left: 60px; + } + @media @large { + max-width: 960px; + } +} +.entry-meta { + max-width: 640px; + width: 100%; + margin-right: auto; + margin-bottom: 30px; + margin-left: auto; + display: block; + text-transform: uppercase; + .font-rem(14); + a { color: @text-color; } + @media @large { + float: left; + width: 140px; + margin: 0 40px 40px 0; + padding: 0; + } + & > span { + padding: 0 20px 10px 0; + display: inline-block; + @media @large { + display: block; + padding: 8px 0; + border-bottom: 1px solid lighten(@black,80); + border-bottom: 1px solid fade(@black,10); + } + } +} +.author-photo { + display: none; + @media @large { + display: block; + width: 150px; + height: 150px; + margin-bottom: 10px; + .rounded(150px); + .clearfix(); + } +} +.entry-content { + max-width: 640px; + width: 100%; + margin-right: auto; + margin-left: auto; + p:first-child { + margin-top: 0; + } + @media @large { + float: left; + } + p > a, + li > a { + border-bottom: 1px dotted lighten(@link-color, 50); + &:hover { + border-bottom-style: solid; + } + } +} +.post-list { + li > a { + border-bottom-width: 0; + } +} +// Disqus Comments +#disqus_thread { + margin-top: 2em; +} +// Pagination +.pagination { + text-align: center; +} +// Page layout +#home, +#page { + .entry-title { + text-align: center; + max-width: 100%; + } + .entry-content { + @media @large { + float: none; + } + } +} +// Post index layout +.post-list { + margin: 0; + padding: 0; + list-style-type: none; + li { + padding: 8px 0; + border-bottom: 1px solid lighten(@black,80); + border-bottom: 1px solid fade(@black,10); + .clearfix(); + } + a > span { + float: right; + } + .entry-date { + .font-rem(14); + text-transform: uppercase; + display: none; + @media @medium { + display: inline; + } + } +} +// Tag index +.tag-box { + list-style: none; + margin: 0; + padding: 4px 0; + overflow: hidden; + .clearfix(); + &.inline li { + float: left; + .font-rem(14); + line-height: 2.5; + } + a { + padding: 4px 6px; + margin: 2px; + background-color: lighten(@black, 90); + .rounded(4px); + text-decoration: none; + span { + vertical-align: super; + .font-rem(10); + } + } +} + +// Footer +// -------------------------------------------------- +.footer-wrapper { + .clearfix(); + margin: 2em auto; + text-align: center; + font-family: @alt-font; + .font-rem(14); + font-style: italic; + color: lighten(@text-color,20); + a { + color: lighten(@text-color,20); + } +} + +// Social Icons +// -------------------------------------------------- +.social-icons { + margin: 1em 0 2em; + a { + padding: 4px 8px; + &:hover { color:@black; } + } +} + +// Chrome Frame +// -------------------------------------------------- +.upgrade { + padding: 10px; + text-align: center; +} + +// Google Search +// -------------------------------------------------- +#goog-fixurl { + ul { + list-style: none; + margin-left: 0; + padding-left: 0; + li { + list-style-type: none; + } + } +} +#goog-wm-qt { + width: auto; + margin-right: 10px; +} +#goog-wm-sb { + display: inline-block; + padding: 8px 20px; + background-color: @black; + color: @white; + border: 2px solid @black !important; + .rounded(20px); + &:visited { + color: @white; + } + &:hover { + background-color: @white; + color: @black; + } +}
\ No newline at end of file diff --git a/assets/less/pygments.less b/assets/less/pygments.less new file mode 100644 index 0000000..d4f3a32 --- /dev/null +++ b/assets/less/pygments.less @@ -0,0 +1,71 @@ +.highlight { + overflow-x: auto; + .font (12); + border: 1px solid darken(@body-color, 5); + pre { + position: relative; + margin: 0; + padding: 1em; + } +} +.hll { background-color: #ffffcc } +.c { color: #999988; font-style: italic } /* Comment */ +.err { color: #a61717; background-color: #e3d2d2 } /* Error */ +.k { color: #000000; font-weight: bold } /* Keyword */ +.o { color: #000000; font-weight: bold } /* Operator */ +.cm { color: #999988; font-style: italic } /* Comment.Multiline */ +.cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */ +.c1 { color: #999988; font-style: italic } /* Comment.Single */ +.cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */ +.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */ +.ge { color: #000000; font-style: italic } /* Generic.Emph */ +.gr { color: #aa0000 } /* Generic.Error */ +.gh { color: #999999 } /* Generic.Heading */ +.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */ +.go { color: #888888 } /* Generic.Output */ +.gp { color: #555555 } /* Generic.Prompt */ +.gs { font-weight: bold } /* Generic.Strong */ +.gu { color: #aaaaaa } /* Generic.Subheading */ +.gt { color: #aa0000 } /* Generic.Traceback */ +.kc { color: #000000; font-weight: bold } /* Keyword.Constant */ +.kd { color: #000000; font-weight: bold } /* Keyword.Declaration */ +.kn { color: #000000; font-weight: bold } /* Keyword.Namespace */ +.kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */ +.kr { color: #000000; font-weight: bold } /* Keyword.Reserved */ +.kt { color: #445588; font-weight: bold } /* Keyword.Type */ +.m { color: #009999 } /* Literal.Number */ +.s { color: #d01040 } /* Literal.String */ +.na { color: #008080 } /* Name.Attribute */ +.nb { color: #0086B3 } /* Name.Builtin */ +.nc { color: #445588; font-weight: bold } /* Name.Class */ +.no { color: #008080 } /* Name.Constant */ +.nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */ +.ni { color: #800080 } /* Name.Entity */ +.ne { color: #990000; font-weight: bold } /* Name.Exception */ +.nf { color: #990000; font-weight: bold } /* Name.Function */ +.nl { color: #990000; font-weight: bold } /* Name.Label */ +.nn { color: #555555 } /* Name.Namespace */ +.nt { color: #000080 } /* Name.Tag */ +.nv { color: #008080 } /* Name.Variable */ +.ow { color: #000000; font-weight: bold } /* Operator.Word */ +.w { color: #bbbbbb } /* Text.Whitespace */ +.mf { color: #009999 } /* Literal.Number.Float */ +.mh { color: #009999 } /* Literal.Number.Hex */ +.mi { color: #009999 } /* Literal.Number.Integer */ +.mo { color: #009999 } /* Literal.Number.Oct */ +.sb { color: #d01040 } /* Literal.String.Backtick */ +.sc { color: #d01040 } /* Literal.String.Char */ +.sd { color: #d01040 } /* Literal.String.Doc */ +.s2 { color: #d01040 } /* Literal.String.Double */ +.se { color: #d01040 } /* Literal.String.Escape */ +.sh { color: #d01040 } /* Literal.String.Heredoc */ +.si { color: #d01040 } /* Literal.String.Interpol */ +.sx { color: #d01040 } /* Literal.String.Other */ +.sr { color: #009926 } /* Literal.String.Regex */ +.s1 { color: #d01040 } /* Literal.String.Single */ +.ss { color: #990073 } /* Literal.String.Symbol */ +.bp { color: #999999 } /* Name.Builtin.Pseudo */ +.vc { color: #008080 } /* Name.Variable.Class */ +.vg { color: #008080 } /* Name.Variable.Global */ +.vi { color: #008080 } /* Name.Variable.Instance */ +.il { color: #009999 } /* Literal.Number.Integer.Long */
\ No newline at end of file diff --git a/assets/less/reset.less b/assets/less/reset.less new file mode 100644 index 0000000..4c1e0c8 --- /dev/null +++ b/assets/less/reset.less @@ -0,0 +1,223 @@ +// +// Reset CSS +// Adapted from http://github.com/necolas/normalize.css +// -------------------------------------------------- + + +// Display in IE6-9 and FF3 +// ------------------------- + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section { + display: block; +} + +// Display block in IE6-9 and FF3 +// ------------------------- + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +// Prevents modern browsers from displaying 'audio' without controls +// ------------------------- + +audio:not([controls]) { + display: none; +} + +// Base settings +// ------------------------- + +html { + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +// Focus states +a:focus { + .tab-focus(); +} +// Hover & Active +a:hover, +a:active { + outline: 0; +} + +// Prevents sub and sup affecting line-height in all browsers +// ------------------------- + +sub, +sup { + position: relative; + font-size: 75%; + line-height: 0; + vertical-align: baseline; +} +sup { + top: -0.5em; +} +sub { + bottom: -0.25em; +} + +// Blockquote +// ------------------------- + +blockquote { + margin: 0; +} + +// Img border in a's and image quality +// ------------------------- + +img { + /* Responsive images (ensure images don't scale beyond their parents) */ + max-width: 100%; /* Part 1: Set a maxium relative to the parent */ + width: auto\9; /* IE7-8 need help adjusting responsive images */ + height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */ + + vertical-align: middle; + border: 0; + -ms-interpolation-mode: bicubic; +} + +// Prevent max-width from affecting Google Maps +#map_canvas img, +.google-maps img { + max-width: none; +} + +// Forms +// ------------------------- + +// Font size in all browsers, margin changes, misc consistency +button, +input, +select, +textarea { + margin: 0; + font-size: 100%; + vertical-align: middle; +} +button, +input { + *overflow: visible; // Inner spacing ie IE6/7 + line-height: normal; // FF3/4 have !important on line-height in UA stylesheet +} +button::-moz-focus-inner, +input::-moz-focus-inner { // Inner padding and border oddities in FF3/4 + padding: 0; + border: 0; +} +button, +html input[type="button"], // Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; // Corrects inability to style clickable `input` types in iOS. + cursor: pointer; // Improves usability and consistency of cursor style between image-type `input` and others. +} +label, +select, +button, +input[type="button"], +input[type="reset"], +input[type="submit"], +input[type="radio"], +input[type="checkbox"] { + cursor: pointer; // Improves usability and consistency of cursor style between image-type `input` and others. +} +input[type="search"] { // Appearance in Safari/Chrome + .box-sizing(content-box); + -webkit-appearance: textfield; +} +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5 +} +textarea { + overflow: auto; // Remove vertical scrollbar in IE6-9 + vertical-align: top; // Readability and alignment cross-browser +} + + +// Printing +// ------------------------- +// Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css + +@media print { + + * { + text-shadow: none !important; + color: #000 !important; // Black prints faster: h5bp.com/s + background: transparent !important; + box-shadow: none !important; + } + + a, + a:visited { + text-decoration: underline; + } + + a[href]:after { + content: " (" attr(href) ")"; + } + + abbr[title]:after { + content: " (" attr(title) ")"; + } + + // Don't show links for images, or javascript/internal links + .ir a:after, + a[href^="javascript:"]:after, + a[href^="#"]:after { + content: ""; + } + + pre, + blockquote { + border: 1px solid #999; + page-break-inside: avoid; + } + + thead { + display: table-header-group; // h5bp.com/t + } + + tr, + img { + page-break-inside: avoid; + } + + img { + max-width: 100% !important; + } + + @page { + margin: 0.5cm; + } + + p, + h2, + h3 { + orphans: 3; + widows: 3; + } + + h2, + h3 { + page-break-after: avoid; + } +}
\ No newline at end of file diff --git a/assets/less/site.less b/assets/less/site.less new file mode 100644 index 0000000..b81e95e --- /dev/null +++ b/assets/less/site.less @@ -0,0 +1,66 @@ +// Selection +// -------------------------------------------------- + +::-moz-selection { + background-color: lighten(@base-color, 65%); + color: @base-color; + text-shadow: none; +} +::selection { + background-color: lighten(@base-color, 65%); + color: @base-color; + text-shadow: none; +} + +// Webkit Custom Scrollbar +// -------------------------------------------------- +::-webkit-scrollbar { + width: 12px; + height: 12px; +} +/* Track */ +::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 6px fade(@black,30); + -webkit-border-radius: 10px; + border-radius: 10px; +} +/* Handle */ +::-webkit-scrollbar-thumb { + -webkit-border-radius: 10px; + border-radius: 10px; + background: rgba(0,0,0,0.5); +} +::-webkit-scrollbar-thumb:window-inactive { + background: rgba(0,0,0,0.2); +} + +// Global Classes +// -------------------------------------------------- + +.wrap { + margin: 0 auto; +} +.all-caps { + text-transform: uppercase; +} +.pull-left { + float: left; +} +.pull-right { + float:right; +} +.unstyled-list { + list-style: none; + margin-left: 0; + padding-left: 0; + li { + list-style-type: none; + } +} + +// Global Transition +// --------------------------------------------------- + +b, i, strong, em, blockquote, p, q, span, figure, img, h1, h2, header, input, a { + .transition(all .2s ease); +}
\ No newline at end of file diff --git a/assets/less/typography.less b/assets/less/typography.less new file mode 100644 index 0000000..9031b88 --- /dev/null +++ b/assets/less/typography.less @@ -0,0 +1,84 @@ +// Body +// -------------------------------------------------- +body { + font-family: @base-font; +} + +// Headings +// -------------------------------------------------- +h1, h2, h3, h4, h5, h6 { + font-family: @heading-font; +} + +// Links +// -------------------------------------------------- +a { + text-decoration: none; + color: @link-color; + &:visited { + color: lighten(@link-color, 20); + } + &:hover { + color: darken(@link-color, 20); + } + &:focus { + outline: thin dotted; + color: darken(@link-color, 20); + } + &:hover, + &:active { + outline: 0; + } +} + +// Figures +// -------------------------------------------------- +figcaption { + padding-top: 10px; + .font(14); + line-height: 1.3; + color: lighten(@text-color, 10); +} + +// Note text +// -------------------------------------------------- +.notice { + margin-top: 1.5em; + padding: .5em 1em; + text-indent: 0; + .font-rem(16); + background-color: lighten(@black, 95); + border: 1px solid lighten(@black, 90); + .rounded(4px); +} +// Blockquotes +// -------------------------------------------------- +blockquote { + font-family: @alt-font; + font-style: italic; + .font-size(24); + padding-left: 20px; + border-left: 8px solid @black; +} + +// Footnotes +// -------------------------------------------------- +.footnotes { + .font(14); + font-family: @base-font; +} + +// Code +// -------------------------------------------------- +tt, code, kbd, samp, pre { + font-family: @code-font; +} +p code { + .font-rem(16); + white-space: nowrap; + margin: 0 2px; + padding: 0 5px; + border: 1px solid lighten(@black, 90); + background-color: lighten(@black, 95); + .rounded(3px); +}
\ No newline at end of file diff --git a/assets/less/variables.less b/assets/less/variables.less new file mode 100644 index 0000000..36f61c5 --- /dev/null +++ b/assets/less/variables.less @@ -0,0 +1,31 @@ +// Typography +// -------------------------------------------------- + +@base-font: 'source-sans-pro', sans-serif; +@heading-font: @base-font; +@caption-font: @base-font; +@code-font: 'source-code-pro', monospace; +@alt-font: 'volkorn', serif; + +@doc-font-size: 16; +@doc-line-height: 24; + + +// set-up the body font-size / line-height +body { + margin-top: 0px + @doc-line-height; + font-size: 0px + @doc-font-size; +} + +// Colors +// -------------------------------------------------- + +@body-color : #ebebeb; +@text-color : #333; +@base-color : #343434; +@comp-color : spin(@base-color, 180); +@border-color : @base-color; +@white : #fff; +@black : #000; +@accent-color : @black; +@link-color : #343434;
\ No newline at end of file |