X-Git-Url: https://git.r.bdr.sh/rbdr/r.bdr.sh/blobdiff_plain/8d331b40473381aeb5bc541190ba3d0d000332a3..2ab6e0ccf616497e5239ad7319617e07b73504a5:/jekyll/css/application.css?ds=sidebyside diff --git a/jekyll/css/application.css b/jekyll/css/application.css index e12ef24..24f5ca2 100644 --- a/jekyll/css/application.css +++ b/jekyll/css/application.css @@ -1,121 +1,324 @@ -body {background-image: url(/img/bg.png)} -a.logo {display: block; margin: 6.4616em auto 0; auto; width: 540px; height: 60px; background-image: url(/img/logo.png)} +body {background-color: #fff} +a.logo {display: block; margin: 1.538em auto 0; max-width: 60em; background-size: 100% 100%; height: 6.667em; background-image: url(/img/unlimited-pizza-animated-logo.gif)} a.logo span {display:none} -em {color: #7a8793} +em {color:#99a3a4} nav ul{ list-style: none; - margin: 0 auto 6.4616em; - text-align: center; + margin: 1.536em auto; + max-width: 60em; + justify-content: space-between; + display: flex; } nav ul li{ display: inline; - font-family: 'Open Sans condensed', sans-serif; + font-family: 'Oswald', sans-serif; text-transform: uppercase; - font-weight: 300; - font-size: 2em; - margin: 0.5em + font-weight: 400; + font-size: 2.769em; + margin: 0.555em 0; } nav ul li a{ - color: #03090f; + color: #54575a; text-decoration: none; } nav ul li a:hover, nav ul li a:active, nav ul li a:focus { - color: #009edb; + color: #74777a; text-decoration: none; } -.posttags{ - font-family: 'Signika Negative', sans-serif; - background-color: #fff; - margin: 1em 0; - color: #03090f; -} - -.posttags .span1, -.posttags .span2, -.posttags .span3{ - margin-left: 0; - margin-right: 0; - padding: 0.6154em 0.7692em; +.main-container { + margin: 3.077em 0; } -.posttags .span1{width: 110px} -.posttags .span2{width: 140px} -.posttags .span3{width: 260px} - .postcontainer{ margin: 2em 0; font-family: 'Signika', sans-serif; - letter-spacing: 0.05em; + letter-spacing: 0.03em; font-weight: 300; color: #03090f; } -.postcontainer h1{ - font-family: 'Open Sans Condensed', sans-serif; +.postcontainer h1, +.postcontainer h2, +.postcontainer h3 { + font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 300; - font-size: 2.77em; } -aside h3{ - font-family: 'Open Sans Condensed', sans-serif; - font-weight: 300; - font-size: 1.85em; - margin: 1.0833em 0; +.postcontainer h1{ + color: #d30058; + margin: 0.666em 1.333em 0; + font-size: 3.692em; + line-height: 1.0833em; } -aside ul{ - margin-left: 0; - list-style: none; +.postcontainer h2 { + color:#99a3a4; + font-size: 1.692em; } -aside li{ - display: block; - margin: 0; - background-color: #fff; - color: #03090f; - height: 2.9167em; +.postcontainer h3{ + color:#99a3a4; + font-size: 1.384em; } -aside li.alt{ - color: #333; - background-color: #fafafa; +.postcontainer.blue h1 {color: #0081cb} +.postcontainer.green h1 {color: #43da30} +.postcontainer.grey h1 {color: #9e978e} +.postcontainer.yellow h1 {color: #ffda00} +.postcontainer.orange h1 {color: #fd3839} +.postcontainer.red h1 {color: #f32240} +.postcontainer.cyan h1 {color: #74d0eb} +.postcontainer.purple h1 {color: #400098} + +.post-meta { + margin: 0.714em 4.643em 4.285em; + font-size: 1.077em; +} + +.post-meta > div { + display: inline-block; + font-size: 1.077em; } -aside li a, -aside li a:visited, -aside li a:hover, -aside li a:active{ color: #03090f; padding: 0.7692em; line-height: 2.9167em } +.post-meta .post-date{width: 5.714em} +.post-date a {color:#99a3a4} +.post-tags a {color:#d30058; text-decoration: underline} -aside li.alt a, -aside li.alt a:visited, -aside li.alt a:hover, -aside li.alt a:active{ color: #333 } +.postcontainer.blue .post-tags a {color: #0081cb} +.postcontainer.green .post-tags a {color: #43da30} +.postcontainer.grey .post-tags a {color: #9e978e} +.postcontainer.yellow .post-tags a {color: #e4c50d} +.postcontainer.orange .post-tags a {color: #fd3839} +.postcontainer.red .post-tags a {color: #f32240} +.postcontainer.cyan .post-tags a {color: #74d0eb} +.postcontainer.purple .post-tags a {color: #400098} -aside .counter{ display: block; float: right; font-weight: bold; width: 2.9167em; height: 2.9167em; text-align: center; background-color: #00af4c; color: #fff; line-height: 2.9167em} -aside li.alt .counter { background-color: #009edb} +.post-image {max-height: 36.923em; background-color: #d30058; margin-top: 3.077em; background-size: auto 100%; overflow: hidden} +.postcontainer.blue .post-image {background-color: #0081cb} +.postcontainer.green .post-image {background-color: #43da30} +.postcontainer.grey .post-image {background-color: #9e978e} +.postcontainer.yellow .post-image {background-color: #ffda00} +.postcontainer.orange .post-image {background-color: #fd3839} +.postcontainer.red .post-image {background-color: #f32240} +.postcontainer.cyan .post-image {background-color: #74d0eb} +.postcontainer.purple .post-image {background-color: #400098} + +.postcontent {margin: 1.538em 4.923em; + max-width: 64.615em; +} + +.related p, .related li, .postcontent p, .postcontent li{ - font-size: 1.1em; - line-height: 1.4615em; - padding: 8px 0; + font-size: 1.307em; + line-height: 1.6em; + padding: 5px 0; + color: #54575a; + font-family: "Lato", sans-serif; } -.postcontent em{ - color: #666; - font-family: 'PT Sans', sans-serif; +.related p, .postcontent p { + padding: 10px 0; } +.postcontent a {color: #d30058} +.blue .postcontent a {color: #0081cb} +.green .postcontent a {color: #43da30} +.grey .postcontent a {color: #9e978e} +.yellow .postcontent a {color: #e4c50d} +.orange .postcontent a {color: #fd3839} +.red .postcontent a {color: #f32240} +.cyan .postcontent a {color: #74d0eb} +.purple .postcontent a {color: #400098} + .postcontent strong{ font-weight: 400; } +.postcontent iframe{ + display: block; +} + +.go-to-top {color:#99a3a4; margin: 1.538em 3.077em; display: block} + .main-container section, .main-container aside{ text-align: left} + +/* List pages */ + +.related {margin: 0 3.077em} +.related ul {margin: 0 1.538em} +.related a {color: #d30058} + +.related a.blue {color: #0081cb} +.related a.python, +.related a.green {color: #43da30} +.related a.etc, +.related a.grey {color: #9e978e} +.related a.javascript, +.related a.yellow {color: #e4c50d} +.related a.orange {color: #fd3839} +.related a.ruby, +.related a.red {color: #f32240} +.related a.cyan {color: #74d0eb} +.related a.purple {color: #400098} + +.related h1{ + font-family: 'Oswald', sans-serif; + text-transform: uppercase; + font-weight: 300; + padding-bottom: 0.666em; + color:#99a3a4; +} + +/* Paginator */ + +.paginator {font-size: 1.077em; margin: 2.857em; font-family: "Lato", sans-serif} +.paginator a{color:#99a3a4} + +.postcontent pre code {font-size: 1.333em; line-height: 1.5em} +code {overflow-wrap: normal} + +/* Guestbook */ +.guestbook-feed, .guestbook-form ul { + list-style: none; +} + +.guestbook-form li { + display: block; +} + +.guestbook-form .guestbook-label { + width: 8.571em; + float: left; + text-align: right; + padding: 0.5em 1.071em; + text-transform: uppercase; +} + +.guestbook-form .guestbook-control { + float: left; +} + +.guestbook-form .guestbook-control-group { + clear: both; +} + +.guestbook-form .comment-control { + width: 42.857em; + height: 10em; +} + +.guestbook-content, .guestbook-form { + clear: both; + padding: 2.142em 0; +} + +.guestbook-feed .guestbook-post { + display: block; + border-bottom: 0.071em solid #99a3a4; + padding: 1.071em; +} + +.guestbook-post .author { + font-weight: bold; +} + +/* + * The Recorder CSS + */ +.pepperoni-widget { + justify-content: space-between; + display: flex; +} + +.pepperoni-widget .record-button { + display: flex; + font-size: 1.538461em; + padding: 1em; + margin: 1em; + height: 1em; + background-color: #f1f1f1; + cursor: pointer; + transition: background-color 0.2s ease, color 0.2s ease; +} + +.record-info { + margin: 1em 0; +} + +.pepperoni-widget .record-button.recording { + background-color: #00cc12; + color: white; + padding: 1em 1.1em 1em 0.68em; +} + +.pepperoni-widget .record-button:hover { + text-decoration: none; + background-color: #fafafa; +} + +.pepperoni-widget .record-button.recording:hover { + background-color: #d30058; + color: #f1f1f1; +} + +.pepperoni-widget .record-progress { + justify-content: space-between; + display: flex; + margin: 0.5em 0.76em; +} + +.record-progress-bar-container { + background-color: #f1f1f1; + height: 2em; + width: 15.385em; + margin-right: 0.76em; +} + +.record-progress-bar { + height: 2em; + background-color: #d30058; + width: 0; +} + +.record-clear { + margin-top: 0.1em; + text-transform: uppercase; + font-size: 1em; + width: 4em; + cursor: pointer; +} + +.record-clear:hover { + text-decoration: none; +} + +.record-preview { + margin: 0.76em; + width: 15.385em; + height: 2em; +} + +.guestbook-submit { + border-radius: 0; + border: 0; + background-color: #d30058; + font-family: 'Oswald', sans-serif; + color: #fff; + padding: 1em; + margin-left: 15em; +} + +.filter-switches label { + display: inline; + margin-right: 2em; +}