From 78ac601d95866a30dda2256c330f468e8008cd52 Mon Sep 17 00:00:00 2001 From: Matt Rude Date: Fri, 2 Feb 2018 04:21:50 -0600 Subject: Add SASS Support --- _config.yml | 1 + _data/clienttypes.yml | 3 + _sass/site.scss | 180 +++++++++++++++++++++++++++++++++++++++++++++ assets/css/main.css | 107 --------------------------- assets/css/main.scss | 6 ++ creating-account.html | 118 ++++++++++++++++++++++++++++- register_web/register.html | 6 +- 7 files changed, 307 insertions(+), 114 deletions(-) create mode 100644 _sass/site.scss delete mode 100644 assets/css/main.css create mode 100644 assets/css/main.scss diff --git a/_config.yml b/_config.yml index a3ac6b3..dd76079 100644 --- a/_config.yml +++ b/_config.yml @@ -8,6 +8,7 @@ baseurl: "soderparr.com" destination: "/var/www/im.soderparr.com" prosody-version: "0.10" register-web: 1 +color: "#9FCF6C" owner_name: "Matt Rude" owner_pgpkey: "0xc4909ee495b0761f" diff --git a/_data/clienttypes.yml b/_data/clienttypes.yml index a21750c..e657ed5 100644 --- a/_data/clienttypes.yml +++ b/_data/clienttypes.yml @@ -1,8 +1,11 @@ - name: Mobile slug: mobile + index: download-1 - name: Destop/Laptop slug: desktop + index: download-2 #- name: Server # slug: server +# index: download-3 diff --git a/_sass/site.scss b/_sass/site.scss new file mode 100644 index 0000000..cdf494d --- /dev/null +++ b/_sass/site.scss @@ -0,0 +1,180 @@ +$site-color: #9FCF6C; +$site-color: #c3950d; + +html { + position: relative; + min-height: 100%; +} + +body { + position: relative; +} + +a { + color: darken($site-color, 10%); +} + +a:hover { + color: darken($site-color, 30%); + text-decoration: underline; +} + +.wrapper { + margin-bottom: 120px; +} + +.jumbotron { + background-color: adjust-color($site-color, $blue: 5); +} + +#register-window { + .card { + border-color: $site-color; + margin-left: 25px; + min-height: unset; + margin-bottom: unset; + } + .panel-heading { + background-color: $site-color; + border-color: transparent; + color: darken($site-color, 60%); + } +} + +.footer { + position: absolute; + bottom: 0; + width: 100%; + background-color: $site-color; + a { + color: #fff; + } + a:hover { + color: darken($site-color, 40%); + text-decoration: underline; + } +} + +.btn-success { + color: #fff; + background-color: darken($site-color, 20%); + border-color: darken($site-color, 25%); +} + +.alert-warning { + color: darken($site-color, 30%); + background-color: lighten($site-color, 20%); + border-color: lighten($site-color, 15%); + a { + color: darken($site-color, 40%); + } +} + +.index-section { + padding: 100px 0 40px; +} + +.index-section-last { + padding: 100px 0 70px; +} + +.list-inline { + display: inline; +} + +.site-title { + text-align: right; +} + +.site-title h1 { + font-size: 4em; +} + +.feature-section { + padding-bottom: 40px; +} + +#accordion .card { + min-height: unset; + margin-bottom: unset; +} + +#creating-account { + .jumbotron { + background-color: lighten($site-color, 20%); + } + #nav-body { + background-color: lighten($site-color, 20%)!important; + a { + color: darken($site-color, 20%); + } + } + .nav-pills .nav-link.active, .nav-pills .show>.nav-link { + background-color: darken($site-color, 30%); + color: #fff; + } +} + +.card { + min-height: 600px; + margin-bottom: 25px; +} +.card-img-top { + width: 100px; + margin: 30px auto 0; +} + +.contact-list { + font-size:2em; + text-align: center; + padding: unset; +} + +td.PASSED { + background-color: green; + color: white; +} +td.FAILED { + background-color: red; + color: white; +} + +.h1, .h2, .h3, h1, h2, h3 { +/* padding-top: 60px; */ +} + +#definitions h2 { + padding-top: 60px; +} + +.nav-item a { + padding: 0 10px; + color: #fff; +} + +@media (max-width: 990px) { + .contact-list { + font-size: 1.7em; + } + .client-mobile h4 { + font-size: 1rem; + } +} + +@media (max-width: 768px) { + .pull-right, .pull-left { + text-align: center; + } + .site-title { + display: none; + } + .client-mobile h4 { + font-size: 1.3rem; + } +} + +@media (min-width: 992px) { + .container { + max-width: 960px; + } +} diff --git a/assets/css/main.css b/assets/css/main.css deleted file mode 100644 index a176b97..0000000 --- a/assets/css/main.css +++ /dev/null @@ -1,107 +0,0 @@ -html { - position: relative; - min-height: 100%; -} - -body { - position: relative; -} - -.wrapper { - margin-bottom: 120px; -} - -.footer { - position: absolute; - bottom: 0; - width: 100%; - background-color: #f5f5f5; -} - -.index-section { - padding: 100px 0 40px; -} - -.index-section-last { - padding: 100px 0 70px; -} - -.list-inline { - display: inline; -} - -.site-title { - text-align: right; -} - -.site-title h1 { - font-size: 4em; -} - -.feature-section { - padding-bottom: 40px; -} - -.card { - min-height: 600px; - margin-bottom: 25px; -} -.card-img-top { - width: 100px; - margin: 30px auto 0; -} - -.contact-list { - font-size:2em; - text-align: center; - padding: unset; -} - -td.PASSED { - background-color: green; - color: white; -} -td.FAILED { - background-color: red; - color: white; -} - -.h1, .h2, .h3, h1, h2, h3 { -/* padding-top: 60px; */ -} - -#definitions h2 { - padding-top: 60px; -} - -.nav-item a { - padding: 0 10px; - color: #fff; -} - -@media (max-width: 990px) { - .contact-list { - font-size: 1.7em; - } - .client-mobile h4 { - font-size: 1rem; - } -} - -@media (max-width: 768px) { - .pull-right, .pull-left { - text-align: center; - } - .site-title { - display: none; - } - .client-mobile h4 { - font-size: 1.3rem; - } -} - -@media (min-width: 992px) { - .container { - max-width: 960px; - } -} diff --git a/assets/css/main.scss b/assets/css/main.scss new file mode 100644 index 0000000..6d1d94c --- /dev/null +++ b/assets/css/main.scss @@ -0,0 +1,6 @@ +--- +# this ensures Jekyll reads the file to be transformed into CSS later +# only Main files contain this front matter, not partials. +--- + +@import "site"; diff --git a/creating-account.html b/creating-account.html index 376a6f5..7f2e0b0 100644 --- a/creating-account.html +++ b/creating-account.html @@ -4,13 +4,24 @@ title: Creating a New Account permalink: /creating-a-new-account/ --- -
+
-
-