Step 1 in converting to a Backbone-based website
This commit is contained in:
Andrew Miner
Vendored
+219
@@ -0,0 +1,219 @@
|
||||
/*
|
||||
Crafting Guide - main.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
/*
|
||||
Crafting Guide - mixins.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video, xmp {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 100%;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box; }
|
||||
|
||||
html, body {
|
||||
height: 100%; }
|
||||
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
display: block; }
|
||||
|
||||
b, strong {
|
||||
font-weight: bold; }
|
||||
|
||||
img {
|
||||
color: transparent;
|
||||
vertical-align: middle;
|
||||
-ms-interpolation-mode: bicubic; }
|
||||
|
||||
ol, ul {
|
||||
list-style: none; }
|
||||
|
||||
li {
|
||||
display: list-item; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
th, td, caption {
|
||||
font-weight: normal;
|
||||
vertical-align: top;
|
||||
text-align: left; }
|
||||
|
||||
q {
|
||||
quotes: none; }
|
||||
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none; }
|
||||
|
||||
sub, sup, small {
|
||||
font-size: 75%; }
|
||||
|
||||
sub, sup {
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline; }
|
||||
|
||||
sub {
|
||||
bottom: -0.25em; }
|
||||
|
||||
sup {
|
||||
top: -0.5em; }
|
||||
|
||||
svg {
|
||||
overflow: hidden; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'PressStart';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("/fonts/press_start.ttf") format("truetype"); }
|
||||
body {
|
||||
background: #AAC9FF url("/images/ice.png");
|
||||
font-size: 10px; }
|
||||
|
||||
h1 {
|
||||
margin-bottom: 1em; }
|
||||
h1 * {
|
||||
display: inline; }
|
||||
h1 img {
|
||||
position: relative;
|
||||
height: 10em;
|
||||
width: 10em;
|
||||
margin-right: 1em;
|
||||
vertical-align: bottom; }
|
||||
h1 p {
|
||||
font-family: PressStart;
|
||||
font-size: 3em;
|
||||
position: relative;
|
||||
top: -0.5em; }
|
||||
|
||||
h2 {
|
||||
margin-bottom: 1em; }
|
||||
h2 * {
|
||||
display: inline; }
|
||||
h2 img {
|
||||
position: relative;
|
||||
height: 7.5em;
|
||||
width: 7.5em;
|
||||
margin-right: 1em;
|
||||
vertical-align: bottom; }
|
||||
h2 p {
|
||||
font-family: PressStart;
|
||||
font-size: 2em;
|
||||
position: relative;
|
||||
top: -0.25em; }
|
||||
|
||||
.centered {
|
||||
text-align: center; }
|
||||
|
||||
.content {
|
||||
background: rgba(230, 230, 230, 0.9);
|
||||
box-shadow: 10px 10px 20px #666;
|
||||
margin: 2em auto;
|
||||
max-width: 96em;
|
||||
position: relative;
|
||||
width: 100%; }
|
||||
|
||||
.view__footer {
|
||||
background: #3D1D09;
|
||||
color: white;
|
||||
margin-top: 2em; }
|
||||
.view__footer a {
|
||||
color: white; }
|
||||
.view__footer .divider {
|
||||
position: relative;
|
||||
height: 3.2em;
|
||||
width: 100%;
|
||||
clear: both; }
|
||||
.view__footer .divider.top {
|
||||
background: #906647 url("/images/grass_side.png"); }
|
||||
.view__footer .left, .view__footer .center, .view__footer .right {
|
||||
position: relative;
|
||||
width: 33%;
|
||||
float: left;
|
||||
padding: 2em; }
|
||||
.view__footer .left p, .view__footer .center p, .view__footer .right p {
|
||||
font-family: sans-serif;
|
||||
font-size: 1.25em;
|
||||
padding-bottom: 1.0em; }
|
||||
.view__footer .left p:last-child, .view__footer .center p:last-child, .view__footer .right p:last-child {
|
||||
padding-bottom: 0; }
|
||||
.view__footer .left h2, .view__footer .center h2, .view__footer .right h2 {
|
||||
padding-bottom: 1.0em; }
|
||||
.view__footer .left h2 p, .view__footer .center h2 p, .view__footer .right h2 p {
|
||||
font-family: PressStart;
|
||||
font-size: 1.5em; }
|
||||
.view__footer .divider.bottom {
|
||||
background: #0A0A0A url("/images/bedrock.png"); }
|
||||
|
||||
.view__header {
|
||||
background: #D9D9D9 url("/images/stone_brick_light.png");
|
||||
position: relative;
|
||||
height: 10em;
|
||||
margin: 5em 0 2em 0; }
|
||||
.view__header h1 {
|
||||
position: relative;
|
||||
top: -3em;
|
||||
left: -3em; }
|
||||
.view__header .divider {
|
||||
background: #7A7A7A url("/images/stone_brick.png");
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 3.2em;
|
||||
width: 100%; }
|
||||
|
||||
/*
|
||||
Crafting Guide - templates/index.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
/*
|
||||
Crafting Guide - recipe_books.scss
|
||||
|
||||
Copyright (c) 2014 by Redwood Labs
|
||||
All rights reserved.
|
||||
*/
|
||||
.view__recipe_catalog {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: 0 2em; }
|
||||
.view__recipe_catalog button {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
-moz-transform: translateY(-50%);
|
||||
-o-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
position: absolute;
|
||||
right: 1em; }
|
||||
.view__recipe_catalog input {
|
||||
border: 0;
|
||||
width: 90%; }
|
||||
.view__recipe_catalog table {
|
||||
background: white;
|
||||
margin: 0 auto;
|
||||
width: 98%; }
|
||||
.view__recipe_catalog table td {
|
||||
height: 3em;
|
||||
padding: 0 1em;
|
||||
position: relative;
|
||||
vertical-align: middle; }
|
||||
.view__recipe_catalog table td:nth-child(1) {
|
||||
width: 30%; }
|
||||
.view__recipe_catalog table td:nth-child(2) {
|
||||
width: 70%;
|
||||
border-left: 0.1em solid #D9D9D9; }
|
||||
|
||||
/*# sourceMappingURL=main.css.map */
|
||||
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"mappings": ";;;;;;;;;;;;AAAA,0hBAAmc;EAC/b,MAAM,EAAE,CAAC;EACT,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACV,SAAS,EAAE,IAAI;ECIjB,eAAe,EDHO,UAAU;ECIhC,kBAAkB,EDJI,UAAU;ECKhC,UAAU,EDLY,UAAU;;AAGlC,UAAU;EACN,MAAM,EAAE,IAAI;;AAGhB,uFAA8E;EAC1E,OAAO,EAAE,KAAK;;AAGlB,SAAS;EACL,WAAW,EAAE,IAAI;;AAGrB,GAAI;EACA,KAAK,EAAE,WAAW;EAClB,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,OAAO;;AAGnC,MAAM;EACF,UAAU,EAAE,IAAI;;AAGpB,EAAG;EACC,OAAO,EAAE,SAAS;;AAGtB,KAAM;EACF,eAAe,EAAE,QAAQ;EACzB,cAAc,EAAE,CAAC;;AAGrB,eAAc;EACV,WAAW,EAAE,MAAM;EACnB,cAAc,EAAE,GAAG;EACnB,UAAU,EAAE,IAAI;;AAGpB,CAAE;EACE,MAAM,EAAE,IAAI;;AAGhB,iBAAiB;EACb,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,IAAI;;AAGjB,eAAc;EACV,SAAS,EAAE,GAAG;;AAGlB,QAAQ;EACJ,WAAW,EAAE,CAAC;EACd,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,QAAQ;;AAG5B,GAAI;EACA,MAAM,EAAE,OAAO;;AAGnB,GAAI;EACA,GAAG,EAAE,MAAM;;AAGf,GAAI;EACA,QAAQ,EAAE,MAAM;;AElDpB,UAKC;EAJC,WAAW,EAAE,YAAY;EACzB,UAAU,EAAE,MAAM;EAClB,WAAW,EAAE,GAAG;EAChB,GAAG,EAAE,gDAAgD;AAKvD,IAAK;EACD,UAAU,EAAE,8BAAwC;EACpD,SAAS,EAAE,IAAI;;AAGnB,EAAG;EACC,aAAa,EAAE,GAAG;EAElB,IAAE;IAAE,OAAO,EAAE,MAAM;EAEnB,MAAI;IACA,QAAQ,EAAE,QAAQ;IAAE,MAAM,EAAE,IAAI;IAAE,KAAK,EAAE,IAAI;IAC7C,YAAY,EAAE,GAAG;IACjB,cAAc,EAAE,MAAM;EAG1B,IAAE;IACE,WAAW,EAAE,UAAU;IACvB,SAAS,EAAE,GAAG;IACd,QAAQ,EAAE,QAAQ;IAAE,GAAG,EAAE,MAAM;;AAIvC,EAAG;EACC,aAAa,EAAE,GAAG;EAElB,IAAE;IAAE,OAAO,EAAE,MAAM;EAEnB,MAAI;IACA,QAAQ,EAAE,QAAQ;IAAE,MAAM,EAAE,KAAK;IAAE,KAAK,EAAE,KAAK;IAC/C,YAAY,EAAE,GAAG;IACjB,cAAc,EAAE,MAAM;EAG1B,IAAE;IACE,WAAW,EAAE,UAAU;IACvB,SAAS,EAAE,GAAG;IACd,QAAQ,EAAE,QAAQ;IAAE,GAAG,EAAE,OAAO;;AAIxC,SAAU;EACN,UAAU,EAAE,MAAM;;AAGtB,QAAS;EACL,UAAU,EAhEE,wBAAyB;EAiErC,UAAU,EAAE,mBAAmB;EAC/B,MAAM,EAAE,QAAQ;EAChB,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;;AAKf,aAAc;EACV,UAAU,EAxEC,OAAO;EAyElB,KAAK,EAxEW,KAAK;EAyErB,UAAU,EAAE,GAAG;EAEf,eAAE;IACE,KAAK,EA5EO,KAAK;EA+ErB,sBAAS;IACL,QAAQ,EAAE,QAAQ;IAAE,MAAM,EAAE,KAAK;IAAE,KAAK,EAAE,IAAI;IAC9C,KAAK,EAAE,IAAI;EAGf,0BAAa;IACT,UAAU,EAAE,qCAAyC;EAGzD,gEAAwB;IACpB,QAAQ,EAAE,QAAQ;IAAE,KAAK,EAAE,GAAG;IAC9B,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,GAAG;IAEZ,sEAAE;MACE,WAAW,EAAE,UAAU;MACvB,SAAS,EAAE,MAAM;MACjB,cAAc,EAAE,KAAK;MAErB,uGAAa;QACT,cAAc,EAAE,CAAC;IAIzB,yEAAG;MACC,cAAc,EAAE,KAAK;MAErB,+EAAE;QACE,WAAW,EAAE,UAAU;QACvB,SAAS,EAAE,KAAK;EAK5B,6BAAgB;IACZ,UAAU,EAAE,kCAAyC;;AAI7D,aAAc;EACV,UAAU,EAAE,4CAAuD;EACnE,QAAQ,EAAE,QAAQ;EAAE,MAAM,EAAE,IAAI;EAChC,MAAM,EAAE,WAAW;EAEnB,gBAAG;IAAE,QAAQ,EAAE,QAAQ;IAAE,GAAG,EAAE,IAAI;IAAE,IAAI,EAAE,IAAI;EAE9C,sBAAS;IACL,UAAU,EAAE,sCAAgD;IAC5D,QAAQ,EAAE,QAAQ;IAAE,MAAM,EAAE,CAAC;IAAE,MAAM,EAAE,KAAK;IAAE,KAAK,EAAE,IAAI;;;;;;;;;;;;;;AC1IjE,qBAAsB;EAClB,QAAQ,EAAE,QAAQ;EAAE,KAAK,EAAE,IAAI;EAC/B,OAAO,EAAE,KAAK;EAEd,4BAAO;IFGP,QAAQ,EAAE,QAAQ;IAClB,GAAG,EAAE,GAAG;IAKR,cAAc,EAAE,gBAAW;IAC3B,YAAY,EAAE,gBAAW;IACzB,aAAa,EAAE,gBAAW;IAC1B,iBAAiB,EAAE,gBAAW;IAC9B,SAAS,EAAE,gBAAW;IEXlB,QAAQ,EAAE,QAAQ;IAAE,KAAK,EAAE,GAAG;EAGlC,2BAAM;IAAE,MAAM,EAAE,CAAC;IAAE,KAAK,EAAE,GAAG;EAE7B,2BAAM;IACF,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,GAAG;IAEV,8BAAG;MAAE,MAAM,EAAE,GAAG;MAAE,OAAO,EAAE,KAAK;MAAE,QAAQ,EAAE,QAAQ;MAAE,cAAc,EAAE,MAAM;IAC5E,2CAAgB;MAAE,KAAK,EAAE,GAAG;IAC5B,2CAAgB;MAAE,KAAK,EAAE,GAAG;MAAE,WAAW,EAAE,mBAA8B",
|
||||
"sources": ["../../src/css/reset.scss","../../src/css/mixins.scss","../../src/css/main.scss","../../src/css/templates/recipe_catalog.scss"],
|
||||
"names": [],
|
||||
"file": "main.css"
|
||||
}
|
||||
Vendored
+270
@@ -0,0 +1,270 @@
|
||||
@charset "utf-8";
|
||||
|
||||
body {
|
||||
margin:0;
|
||||
}
|
||||
|
||||
#mocha {
|
||||
font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
margin: 60px 50px;
|
||||
}
|
||||
|
||||
#mocha ul,
|
||||
#mocha li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#mocha ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#mocha h1,
|
||||
#mocha h2 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#mocha h1 {
|
||||
margin-top: 15px;
|
||||
font-size: 1em;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
#mocha h1 a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#mocha h1 a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#mocha .suite .suite h1 {
|
||||
margin-top: 0;
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
#mocha .hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mocha h2 {
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#mocha .suite {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
#mocha .test {
|
||||
margin-left: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#mocha .test.pending:hover h2::after {
|
||||
content: '(pending)';
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
|
||||
#mocha .test.pass.medium .duration {
|
||||
background: #c09853;
|
||||
}
|
||||
|
||||
#mocha .test.pass.slow .duration {
|
||||
background: #b94a48;
|
||||
}
|
||||
|
||||
#mocha .test.pass::before {
|
||||
content: '✓';
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
color: #00d6b2;
|
||||
}
|
||||
|
||||
#mocha .test.pass .duration {
|
||||
font-size: 9px;
|
||||
margin-left: 5px;
|
||||
padding: 2px 5px;
|
||||
color: #fff;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
|
||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-ms-border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
#mocha .test.pass.fast .duration {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mocha .test.pending {
|
||||
color: #0b97c4;
|
||||
}
|
||||
|
||||
#mocha .test.pending::before {
|
||||
content: '◦';
|
||||
color: #0b97c4;
|
||||
}
|
||||
|
||||
#mocha .test.fail {
|
||||
color: #c00;
|
||||
}
|
||||
|
||||
#mocha .test.fail pre {
|
||||
color: black;
|
||||
}
|
||||
|
||||
#mocha .test.fail::before {
|
||||
content: '✖';
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
color: #c00;
|
||||
}
|
||||
|
||||
#mocha .test pre.error {
|
||||
color: #c00;
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* (1): approximate for browsers not supporting calc
|
||||
* (2): 42 = 2*15 + 2*10 + 2*1 (padding + margin + border)
|
||||
* ^^ seriously
|
||||
*/
|
||||
#mocha .test pre {
|
||||
display: block;
|
||||
float: left;
|
||||
clear: left;
|
||||
font: 12px/1.5 monaco, monospace;
|
||||
margin: 5px;
|
||||
padding: 15px;
|
||||
border: 1px solid #eee;
|
||||
max-width: 85%; /*(1)*/
|
||||
max-width: calc(100% - 42px); /*(2)*/
|
||||
word-wrap: break-word;
|
||||
border-bottom-color: #ddd;
|
||||
-webkit-border-radius: 3px;
|
||||
-webkit-box-shadow: 0 1px 3px #eee;
|
||||
-moz-border-radius: 3px;
|
||||
-moz-box-shadow: 0 1px 3px #eee;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#mocha .test h2 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#mocha .test a.replay {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 0;
|
||||
text-decoration: none;
|
||||
vertical-align: middle;
|
||||
display: block;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
text-align: center;
|
||||
background: #eee;
|
||||
font-size: 15px;
|
||||
-moz-border-radius: 15px;
|
||||
border-radius: 15px;
|
||||
-webkit-transition: opacity 200ms;
|
||||
-moz-transition: opacity 200ms;
|
||||
transition: opacity 200ms;
|
||||
opacity: 0.3;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
#mocha .test:hover a.replay {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#mocha-report.pass .test.fail {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mocha-report.fail .test.pass {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mocha-report.pending .test.pass,
|
||||
#mocha-report.pending .test.fail {
|
||||
display: none;
|
||||
}
|
||||
#mocha-report.pending .test.pass.pending {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#mocha-error {
|
||||
color: #c00;
|
||||
font-size: 1.5em;
|
||||
font-weight: 100;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
#mocha-stats {
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
font-size: 12px;
|
||||
margin: 0;
|
||||
color: #888;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#mocha-stats .progress {
|
||||
float: right;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#mocha-stats em {
|
||||
color: black;
|
||||
}
|
||||
|
||||
#mocha-stats a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#mocha-stats a:hover {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#mocha-stats li {
|
||||
display: inline-block;
|
||||
margin: 0 5px;
|
||||
list-style: none;
|
||||
padding-top: 11px;
|
||||
}
|
||||
|
||||
#mocha-stats canvas {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
#mocha code .comment { color: #ddd; }
|
||||
#mocha code .init { color: #2f6fad; }
|
||||
#mocha code .string { color: #5890ad; }
|
||||
#mocha code .keyword { color: #8a6343; }
|
||||
#mocha code .number { color: #2f6fad; }
|
||||
|
||||
@media screen and (max-device-width: 480px) {
|
||||
#mocha {
|
||||
margin: 60px 0px;
|
||||
}
|
||||
|
||||
#mocha #stats {
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user