diff --git a/.gitignore b/.gitignore index 22e0cafc..1d2b92f2 100644 --- a/.gitignore +++ b/.gitignore @@ -6,4 +6,6 @@ plugins/*.so data build vendor -html/scss/.sass-cache \ No newline at end of file +html/scss/.sass-cache +dart-sass +.sass-cache \ No newline at end of file diff --git a/.travis/build.sh b/.travis/build.sh index b3ccfa82..31ef9003 100755 --- a/.travis/build.sh +++ b/.travis/build.sh @@ -3,6 +3,16 @@ APP="statup" REPO="hunterlong/statup" + +# INSTALLING SASS +SASS=1.7.1 +curl -OL https://github.com/sass/dart-sass/releases/download/$SASS/dart-sass-$SASS-linux-x64.tar.gz +tar -xvzf dart-sass-$SASS-linux-x64.tar.gz +chmod +x dart-sass/sass +mv dart-sass/sass /usr/local/bin/sass +# RENDERING CSS +sass html/scss/base.scss:html/css/base.css + printf "UPDATE core SET version='$VERSION';\n" >> sql/upgrade.sql rice embed-go diff --git a/html/css/base.css b/html/css/base.css index fd0c9bb5..733e73ae 100644 --- a/html/css/base.css +++ b/html/css/base.css @@ -1,3 +1,15 @@ +/* + Main Design + ================= + - Background + - Boxes + - Font Colors + - div widths +*/ +/* + Card Design + ================ +*/ HTML, BODY { background-color: #fcfcfc; } @@ -28,40 +40,16 @@ HTML, BODY { color: #d1ffca; font-size: 0.85rem; } -.failing_bg { - background-color: #ff4e4e !important; - font-weight: bold; } - .lg_number { font-size: 26pt; font-weight: bold; display: block; - color: #3e3e3e; } - -.text_perfect { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; } - -.text_good { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; } - -.text_ok { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; } - -.text_bad { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; } + color: #474747; } .stats_area { text-align: center; color: #a5a5a5; } -.offline_bg { - background-color: white !important; - padding-bottom: 70px !important; } - .lower_canvas { height: 55px; width: 100%; @@ -71,22 +59,6 @@ HTML, BODY { .lower_canvas SPAN { font-size: 1rem; } -.offline_lower_canvas { - position: absolute; - bottom: -120px; - height: 60px; - left: -25px; - width: 805px; - padding: 17px 10px; } - -.offline_lower_canvas SPAN { - font-weight: bold; - font-size: 0.85rem; } - -.offline_lower_canvas A { - background-color: #c51b1a; - border: 1px solid #bb1727; } - .footer { text-decoration: none; margin-top: 20px; } @@ -114,6 +86,9 @@ HTML, BODY { height: 3px; border-radius: 0; } +.card { + background-color: #fff; } + .card-body { overflow: hidden; } diff --git a/html/scss/base.scss b/html/scss/base.scss index 30d6fe51..9e280d12 100644 --- a/html/scss/base.scss +++ b/html/scss/base.scss @@ -1,7 +1,4 @@ -$background-color: #262626; -$max-width: 860px; -$card-background: #121212; -$card-stats-color: #dfdfdf; +@import 'variables'; HTML,BODY { @@ -41,52 +38,18 @@ HTML,BODY { font-size: 0.85rem; } -.failing_bg { - background-color: #ff4e4e !important; - font-weight: bold; -} - .lg_number { - font-size: 26pt; + font-size: $card-stats-size; font-weight: bold; display: block; color: $card-stats-color; } -.text_perfect { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_good { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_ok { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_bad { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - .stats_area { text-align: center; color: #a5a5a5; } -.offline_bg { - background-color: white !important; - padding-bottom: 70px !important; -} - -.online_list { - -} - .lower_canvas { height: 55px; width: 100%; @@ -98,25 +61,6 @@ HTML,BODY { font-size: 1rem; } -.offline_lower_canvas { - position: absolute; - bottom: -120px; - height: 60px; - left: -25px; - width: 805px; - padding: 17px 10px; -} - -.offline_lower_canvas SPAN { - font-weight: bold; - font-size: 0.85rem; -} - -.offline_lower_canvas A { - background-color: #c51b1a; - border: 1px solid #bb1727; -} - .footer { text-decoration: none; margin-top: 20px; diff --git a/html/scss/light-base.scss b/html/scss/light-base.scss deleted file mode 100644 index c4e7a6c4..00000000 --- a/html/scss/light-base.scss +++ /dev/null @@ -1,251 +0,0 @@ -$background-color: #fcfcfc; -$max-width: 860px; -$primary-color: #333; -$card-background: #fff; - - -HTML,BODY { - background-color: $background-color; -} - -.container { - padding-top: 20px; - padding-bottom: 20px; - max-width: $max-width; -} - -.online_list .badge { - margin-top: 0.2rem; -} - -.navbar { - margin-bottom: 30px; -} - -.btn-sm { - line-height: 1.3; - font-size: 0.75rem; -} - -.view_service_btn { - position: absolute; - bottom: -40px; - right: 40px; -} - -.service_lower_info { - position: absolute; - bottom: -40px; - left: 40px; - color: #d1ffca; - font-size: 0.85rem; -} - -.failing_bg { - background-color: #ff4e4e !important; - font-weight: bold; -} - -.lg_number { - font-size: 26pt; - font-weight: bold; - display: block; - color: #3e3e3e; -} - -.text_perfect { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_good { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_ok { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.text_bad { - color: #33b418; - text-shadow: 0px 1px 0 #0e6702; -} - -.stats_area { - text-align: center; - color: #a5a5a5; -} - -.offline_bg { - background-color: white !important; - padding-bottom: 70px !important; -} - -.online_list { - -} - -.lower_canvas { - height: 55px; - width: 100%; - background-color: #48d338; - padding: 17px 10px; -} - -.lower_canvas SPAN { - font-size: 1rem; -} - -.offline_lower_canvas { - position: absolute; - bottom: -120px; - height: 60px; - left: -25px; - width: 805px; - padding: 17px 10px; -} - -.offline_lower_canvas SPAN { - font-weight: bold; - font-size: 0.85rem; -} - -.offline_lower_canvas A { - background-color: #c51b1a; - border: 1px solid #bb1727; -} - -.footer { - text-decoration: none; - margin-top: 20px; -} - -.footer A { - color: #aaaaaa; - text-decoration: none; -} - -.footer A:HOVER { - color: #6d6d6d; -} - -.online_badge { - color: #fff; - background-color: #35b317; -} - -.offline_badge { - color: #fff; - background-color: #c51919; -} - -.progress { - margin-top: -20px; - margin-left: -20px; - margin-bottom: 15px; - width: calc(100% + 40px); - height: 3px; - border-radius: 0; -} - -.card-body { - overflow: hidden; -} - -.card-body H4 A { - color: #239e07; - text-decoration: none; -} - -.chart-container { - position: relative; - height: 170px; - width: 100%; -} - -.btn-primary { - background-color: white; - border: 1px solid #b9b9b9; - color: #353535; - height: 35px; - padding: 5px 15px; -} - -@media (max-width: 767px) { - - .sm-container { - margin-top: 40px !important; - padding: 0 !important; - } - - .list-group-item H5 { - font-size: 0.9rem; - } - - .container { - padding: 0 !important; - } - - .navbar { - margin-left: 0px; - margin-top: 0px; - width: 100%; - margin-bottom: 0; - } - - .card-body { - font-size: 6pt; - padding: 5px 5px; - } - - .lg_number { - font-size: 1.5rem; - } - - .stats_area { - margin-top: 35px !important; - margin-bottom: 35px !important; - } - - .stats_area .col-4 { - padding-left: 0; - padding-right: 0; - } - - .lower_canvas SPAN { - font-size: 0.9rem; - float: left; - } - - .btn-sm { - line-height: 0.9rem; - font-size: 0.65rem; - } - - .full-col-12 { - padding-left: 0px; - padding-right: 0px; - } - - .card { - border: 0; - border-radius: 0; - } - - .list-group-item { - border-top: 1px solid #e4e4e4; - border: 0px; - } - - .list-group-item:first-child { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .list-group-item:last-child { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } -} \ No newline at end of file diff --git a/html/scss/variables.scss b/html/scss/variables.scss new file mode 100644 index 00000000..08c366b3 --- /dev/null +++ b/html/scss/variables.scss @@ -0,0 +1,30 @@ +/* + Main Design + ================= + - Background + - Boxes + - Font Colors + - div widths +*/ + + +$background-color: #fcfcfc; +$max-width: 860px; +$online-color: #47d337; +$offline-color: #dd3545; + + + + + +/* + Card Design + ================ +*/ + + +$card-background: #fff; +$card-stats-color: #474747; +$card-stats-size: 26pt; + + diff --git a/html/tmpl/service.html b/html/tmpl/service.html index 997f3fd3..698d8a63 100644 --- a/html/tmpl/service.html +++ b/html/tmpl/service.html @@ -19,11 +19,17 @@
+ {{if .Online }} + ONLINE + {{ else }} + OFFLINE + {{end}} +

{{ .Name }} {{if .Online }} - ONLINE + ONLINE {{ else }} - OFFLINE + OFFLINE {{end}}