diff options
Diffstat (limited to 'crumbs/static/css')
-rw-r--r-- | crumbs/static/css/crumbs.css | 183 | ||||
-rwxr-xr-x | crumbs/static/css/nest.css | 519 |
2 files changed, 702 insertions, 0 deletions
diff --git a/crumbs/static/css/crumbs.css b/crumbs/static/css/crumbs.css index 1e54df8..4ea7262 100644 --- a/crumbs/static/css/crumbs.css +++ b/crumbs/static/css/crumbs.css @@ -1,3 +1,4 @@ +<<<<<<< HEAD /************************************** BASIC DEFINITIONS @@ -214,4 +215,186 @@ code { padding: 3px 3px; } font-size: 16px; line-height: 16px; text-align: right; +======= +/* + * This is my CSS y'all! It probably sucks 💩 + */ + +/* Responsive */ +@media (min-width: 768px) { + .container { width: 760px; } +} +@media (min-width: 992px) { + .container { + width: 985px; + } +} +@media (min-width: 1200px) { + .container { + width: 1195px; + } +} + +/* The body is basically the base */ +body { + font-family: Roboto; + font-style: normal; + font-variant: normal; + font-size: 26px; + font-weight: 300; + color: #BEBEBE; + background-color: #242424; + margin: 0px; + /*line-height: 32px;*/ + -webkit-font-smoothing:antialiased; + text-rendering: optimizeLegibility; +} + +/* Describes the header container */ +.header { + height: 75px; + line-height: 75px; + background-color: #393939; + width: 100%; + margin-top: 15px; +} + +/* Probably a temporary hack */ +.header p { + margin-left: 25px; +} + +.header .nav { + float: right; +} + +.header .nav a { + margin-left: 20px; + text-transform: uppercase; + transition: all 0.2s ease-out; +} + +/* Mostly used on the front page */ +/*.highlight { + font-family: Inconsolata; +} +*/ +.title-text { + font-family: Inconsolata; + font-size: 32px; + line-height: 38px; +} + +.title-text h1 { font-size: 64px; } + +/* Implements a blinking cursor */ +.blink { + -webkit-animation: 1s blink step-end infinite; + -moz-animation: 1s blink step-end infinite; + -ms-animation: 1s blink step-end infinite; + -o-animation: 1s blink step-end infinite; + animation: 1s blink step-end infinite; +} + +/************************* + +COLOUR TILE THINGY + +**************************/ + +.colours { + width: 1350px; + height: 90px; + padding-top: 75px; + margin: 0 auto; + display: flex; +} + +.colour { + display: flex; + flex-direction: column; + height: 90px; + width: 90px; +} + +#colour1 { background-color: #3c3c3c; } +#colour2 { background-color: #525252; } +#colour3 { background-color: #74736a; } +#colour4 { background-color: #9f9e93; } +#colour5 { background-color: #d2cfc7; } +#colour6 { background-color: #e7e5df; } +#colour7 { background-color: #f1f0ec; } +#colour8 { background-color: #ef787b; } +#colour9 { background-color: #f6915f; } +#colour10 { background-color: #fdcb71; } +#colour11 { background-color: #99cb9b; } +#colour12 { background-color: #6ccaca; } +#colour13 { background-color: #6997c8; } +#colour14 { background-color: #ca98c9; } +#colour15 { background-color: #ce7b59; } + +/************************* + +BLINKING ANIMATIONS FOR DIFFERENT BROWSERS + +**************************/ + +@keyframes "blink" { + from, to { + color: transparent; + } + 50% { + color: #BEBEBE; + } +} + +@-moz-keyframes blink { + from, to { + color: transparent; + } + 50% { + color: #BEBEBE; + } +} + +@-webkit-keyframes "blink" { + from, to { + color: transparent; + } + 50% { + color: #BEBEBE; + } +} + +@-ms-keyframes "blink" { + from, to { + color: transparent; + } + 50% { + color: #BEBEBE; + } +} + +@-o-keyframes "blink" { + from, to { + color: transparent; + } + 50% { + color: #BEBEBE; + } +} + +/*.header-nav .nav{ + float:right; +} +.header-nav .nav a { + font-weight:300; + font-size: 18px; + color:#fff; + text-decoration:none; + padding:8px; + margin-left:20px; + text-transform: uppercase; + transition: all 0.2s ease-out; +>>>>>>> 6386c12fc0e606829d2b5bfea31d647852f2b491 } diff --git a/crumbs/static/css/nest.css b/crumbs/static/css/nest.css new file mode 100755 index 0000000..e565824 --- /dev/null +++ b/crumbs/static/css/nest.css @@ -0,0 +1,519 @@ +/*! + * Yo Mama v1.0.0 + * Copyright 2017 Katharina Fey + * Licensed under Yo Mama v2.0 + */ + +/* Responsive */ +@media (min-width: 768px) { + .container { + width: 760px; + } +} +@media (min-width: 992px) { + .container { + width: 985px; + } +} +@media (min-width: 1200px) { + .container { + width: 1195px; + } +} + +/* Default styling */ +body { + font-family: Roboto; + font-style: normal; + font-variant: normal; + font-size: 22px; + font-weight: 200; + color: #414141; + background-color: #222222; + background-image: none; + line-height: 26px; + -webkit-font-smoothing:antialiased; + text-rendering: optimizeLegibility; +} + +div.cat { + box-shadow: 10px 10px 5px #888888; +} + +div.orange { + background-color: orange !important; + padding-left: 5px; + padding-right: 5px; + border: 5px; + border-style: groove; + border-color: black; +} + +div.imgbar { + background-color: #e6e6e6; +} + +/* Links */ +/* eb2344*/ +/* 009bff*/ +/* CE2323 */ +a, a:visited { + color: #eb2344; + text-decoration: none; + transition: all 0.2s ease-out; +} +a:hover, a:active{ + text-decoration:none; + color:#eb2344; +/* opacity: 0.8; */ +} + +a.navigate{ + background-color: rgba(0,0,0,0.5); + font-size: 12px; + padding-left: 4px; + padding-right: 4px; + min-width: 100px; + text-align: center; + text-transform: uppercase; + font-weight: 600; + color:#fff; + text-decoration: none; +} +a.navigate:hover{ + opacity: 0.8; +} + +a.more{ + font-size: 12px; + margin-top: 30px; +} + +/* Syntax Highlighting */ + +pre, code { + background: #ECECEC; <!-- #f8f7fa --> + padding: 15px; <!-- 34 --> + font-size: 16px; + line-height: 24px; + font-family: Consolas, monaco, monospace; + border-radius: 0px; + color: #4b505a; + margin: 34px 0; + font-weight: 700; +} + +code { padding: 3px 3px; } + +.linenos pre{ + border:none; + margin-top:20px; + margin-bottom:20px; + padding-top:20px; + padding-bottom:20px; + padding-left:20px; + padding-right:0px; + background: #BBBBBB <!--#333-->; + font-size:14px; + font-weight:400; + font-family:Consolas,monaco,monospace; + color:#fff +} + +.highlight pre { + border:none; + margin-top: 20px; + margin-bottom: 20px; + padding-top: 20px; + padding-bottom: 20px; + padding-left: 40px; + padding-right: 40px; + background:#333; + font-size: 14px; + font-weight: 400; + font-family: Consolas, monaco, monospace; + color: #fff; +} + +/* Titles */ + +h1, h2, h3, h4, h5, h6 { + font-family: Quicksand; + font-style: normal; + font-variant: normal; + font-weight: 300; +} + +h1 { + font-size: 32px; + line-height: 1.285714285714286em; + font-weight: 600; + letter-spacing: 2px; + border:none; +} + +h2 { + font-size: 28px; + line-height: 1.285714285714286em; + font-weight: 600; + margin-top: 40px; + margin-bottom: 40px; +} + +h3 { + font-size: 24px; + line-height: 1.285714285714286em; + font-weight: 600; + margin-top: 30px; + margin-bottom: 30px; +} + +h4 { + font-size: 20px; + line-height: 1.285714285714286em; + font-weight: 600; + margin-top: 30px; + margin-bottom: 30px; + text-transform: uppercase; +} + +h5 { + font-size: 18px; + line-height: 1.285714285714286em; + font-weight: 600; + margin-top: 40px; + margin-bottom: 40px; +} + + +/* Navbar */ + +.header-nav{ + height:100px; + line-height:100px; + color:#fff; + font-size:12px; + font-weight:600; +} +.header-nav .nav { + float:right; +} +.header-nav .nav a { + font-weight: 300; + font-size: 18px; + color:#fff; + text-decoration:none; + padding:8px; + margin-left:20px; + text-transform: uppercase; + transition: all 0.2s ease-out; +} + +.naughty {} + +.header-nav .nav a:hover{ + color:#fff; + font-weight:400; + opacity: 1; + background-color: rgba(0,0,0,0.1); +} +.header-nav .nav .active{ + /*color:#fff;*/ + color:#fff; + font-weight:600; + background-color: rgba(0,0,0,0.2); +} +.header-logo { + font-size:15px; + font-weight:600; + text-transform: uppercase; +} +.header-logo a { + color: #fff; + text-decoration: none; +} + +/* Header */ + +.header-container { + padding: 0; + min-height: 350px; + /* max-height: 300px; NOTE: This might cause horrible anal leakage */ +} +.header-wrapper{ + padding-left: 40px; + padding-right: 40px; +} +.header-content { + text-align: center; + padding: 25px 0 55px 0; +} +.header-title { + font-size: 64px; + color: #fff; + font-weight: 700; +} +.header-date { + margin-top: 15px; + font-size: 12px; + color: #fff; + opacity: 0.8; + +} +.header-date a { + color: #fff; + text-decoration: underline; +} +.header-underline { /* NOTE: This is one value I want to tweak */ + display: inline-block; + margin-top: 10px; + margin-bottom: 15px; + width: 50px; + border-bottom: 3px solid #E65C00; +} +.header-subtitle { + font-size: 14px; + line-height: 24px; + color: #fff; + font-weight: 300; + text-align: justify; +} +.header-subtitle-homepage { + text-align: center; + font-style: italic; +} +.header-tags { + font-size: 11px; + color: #fff; + font-style: italic; +} +.header-tags a { + color: #fff; +} + +/* Content */ + +.content{ + background-color: #fff; + padding-top: 40px; + padding-bottom: 40px; + padding-left: 40px; + padding-right: 40px; + border-left: 1px solid rgba(0,0,0,0.1); + border-right: 1px solid rgba(0,0,0,0.1); +} + +.content img.dual{ + border: 5px; + display: block; + width: 45%; + height: auto; + margin-left: 15px; + margin-right: 15px; + margin-top: 15px; + margin-bottom: 15px; +} + +.content img.triple{ + border: 0; + display: block; + width: 33.33333333%; + height: auto; + margin-left: auto; + margin-right: auto; + margin-top: 45px; + margin-bottom: 45px; +} + +.content img { + border: 0; + display: block; + width: 100%; + height: auto; + margin-left: auto; + margin-right: auto; + margin-top: 45px; + margin-bottom: 45px; +} + +.content img.padded { + border: 25; + display: block; + width: 350px; + height: auto; + margin-left: 45px; + margin-right: 45px; + margin-top: 45px; + margin-bottom: 45px; +} + +.content.highlight pre { + padding-left: -40px; + padding-right: -40px; +} + +.content dt{ + font-size: 12px; + font-weight: 400; + line-height: 24px; +} + +/* Navigation */ + +.navigation{ + margin-top: 40px; + margin-bottom: 40px; + padding: 0; +} +.navigation2{ + margin-top: 40px; + margin-bottom: 40px; +} + +/* Menu */ +.menu{ + font-size: 14px; +} +.menu h4{ + margin-top: 0px; + margin-bottom: 5px; +} +.menu a{ + color: #fff; + padding:0px; + background-color: #eb2344; + padding-left: 3px; + padding-right: 3px; + padding-top: 2px; + padding-bottom: 2px; + opacity: 0.6; +} + +.color_shit { + background-color: #252525; +} + +pre.col { + background: #242424; <!-- #f8f7fa --> + padding: 15px; <!-- 34 --> + font-size: 16px; + line-height: 24px; + font-family: Consolas, monaco, monospace; + border-radius: 0px; + color: #FEFEFE; + margin: 34px 0; + font-weight: 700; +} +p +re.highlight { + background: #242424; <!-- #f8f7fa --> + padding: 15px; <!-- 34 --> + font-size: 16px; + line-height: 24px; + font-family: Consolas, monaco, monospace; + border-radius: 0px; + color: #ffa435; + margin: 34px 0; + font-weight: 700; +} + + +/* Article */ +.article-container{ + margin-top: 40px; +} +.article { + font-size: 14px; + line-height: 24px; + margin-bottom: 20px; + padding-top: 20px; + padding-bottom: 20px; + border-bottom: 1px solid rgba(0,0,0,0.1); + border-top: 1px solid rgba(0,0,0,0.1); +} +.article h2{ + margin-top: 0px; + margin-bottom: 5px; +} +.article h2 a{ + color: #4b505a; + text-decoration: None; +} +.article .date{ + font-size: 12px; + margin-bottom: 10px; + opacity: 0.9; +} + +/* Archives */ +.archive-container{ + margin-top: 40px; + margin-bottom: 40px; +} +.archive { + font-size: 14px; + line-height: 24px; + padding-top: 20px; + padding-bottom: 40px; + border-bottom: 1px solid rgba(0,0,0,0.1); + border-top: 1px solid rgba(0,0,0,0.1); +} +.archive h2{ + margin-top: 15px; + margin-bottom: 20px; +} +.archive h2 a{ + color: #4b505a; + text-decoration: None; +} +.archive dt{ + font-size: 12px; + font-weight: 400; + line-height: 24px; +} + + +/* Styling */ + +blockquote{ + font-size: 15px; + opacity: 0.65; +} +/* Comments */ +.comments{ + margin-top: 40px; +} + +/* Spaces */ +.mr5 { margin-right: 5px;} +.mr20 { margin-right: 20px;} + +/* Gradients */ +.gradient { + /*box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);*/ +} + +/* Footer */ + +.footer{ + background-color: #333; + font-size: 14px; + font-weight: 300; + text-align: left; + color: #fff; +} + +.footer-title { + text-transform: uppercase; + margin-bottom: 3px; + font-weight: 600; + font-size: 12px; +} +.footer-container{ + padding-top: 20px; + padding-bottom: 20px; +} +.footer a{ + color: #fff; +} + |