From 332f8f8d2f5ee0ac850347185ed56f6dfabc27dd Mon Sep 17 00:00:00 2001 From: Matt Walsh Date: Wed, 3 Aug 2022 16:32:13 -0500 Subject: [PATCH] better handling of css on "blue box" screens --- server/styles/compiled.css | 13 ++++++++++--- server/styles/compiled.css.map | 2 +- server/styles/scss/_current-weather.scss | 5 ++--- server/styles/scss/_weatherdisplay.scss | 11 ++++++++++- views/index.ejs | 2 +- views/partials/current-weather.ejs | 2 +- 6 files changed, 25 insertions(+), 10 deletions(-) diff --git a/server/styles/compiled.css b/server/styles/compiled.css index 5c40808..8887988 100644 --- a/server/styles/compiled.css +++ b/server/styles/compiled.css @@ -74,11 +74,19 @@ .weather-display .header .date-time.date { padding-top: 22px; } +.weather-display .main { + position: relative; +} .weather-display .main.has-scroll { width: 640px; height: 310px; overflow: hidden; } +.weather-display .main.has-box { + margin-left: 64px; + margin-right: 64px; + width: calc(100% - 128px); +} .weather-display .scroll { width: 640px; height: 80px; @@ -177,18 +185,17 @@ text-shadow: 3px 3px 0 black, -1.5px -1.5px 0 black, 0 -1.5px 0 black, 1.5px -1.5px 0 black, 1.5px 0 0 black, 1.5px 1.5px 0 black, 0 1.5px 0 black, -1.5px 1.5px 0 black, -1.5px 0 0 black; } #current-weather-html.weather-display .main .col.left { - left: 65px; font-family: "Star4000 Extended"; font-size: 24pt; } #current-weather-html.weather-display .main .col.right { - right: 65px; + right: 0px; font-family: "Star4000 Large"; font-size: 20px; font-weight: bold; } #current-weather-html.weather-display .main .col.right .row { - margin-bottom: 16px; + margin-bottom: 12px; } #current-weather-html.weather-display .main .col.right .row .label, #current-weather-html.weather-display .main .col.right .row .value { diff --git a/server/styles/compiled.css.map b/server/styles/compiled.css.map index 5569fd0..facf221 100644 --- a/server/styles/compiled.css.map +++ b/server/styles/compiled.css.map @@ -1 +1 @@ -{"version":3,"sources":["scss/_weatherdisplay.scss","compiled.css","scss/_colors.scss","scss/_utils.scss","scss/_hourly.scss","scss/_current-weather.scss"],"names":[],"mappings":"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","file":"compiled.css"} \ No newline at end of file +{"version":3,"sources":["scss/_weatherdisplay.scss","compiled.css","scss/_colors.scss","scss/_utils.scss","scss/_hourly.scss","scss/_current-weather.scss"],"names":[],"mappings":"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","file":"compiled.css"} \ No newline at end of file diff --git a/server/styles/scss/_current-weather.scss b/server/styles/scss/_current-weather.scss index f23e3ce..326d45f 100644 --- a/server/styles/scss/_current-weather.scss +++ b/server/styles/scss/_current-weather.scss @@ -14,20 +14,19 @@ @include u.text-shadow(); &.left { - left: 65px; font-family: 'Star4000 Extended'; font-size: 24pt; } &.right { - right: 65px; + right: 0px; font-family: 'Star4000 Large'; font-size: 20px; font-weight: bold; .row { - margin-bottom: 16px; + margin-bottom: 12px; .label, .value { diff --git a/server/styles/scss/_weatherdisplay.scss b/server/styles/scss/_weatherdisplay.scss index 38121e5..cbb9d7f 100644 --- a/server/styles/scss/_weatherdisplay.scss +++ b/server/styles/scss/_weatherdisplay.scss @@ -51,13 +51,14 @@ } } - + .logo { top: 30px; left: 50px; position: absolute; z-index: 10; } + .noaa-logo { position: absolute; top: 39px; @@ -86,11 +87,19 @@ } .main { + position: relative; + &.has-scroll { width: 640px; height: 310px; overflow: hidden; } + + &.has-box { + margin-left: 64px; + margin-right: 64px; + width: calc(100% - 128px); + } } diff --git a/views/index.ejs b/views/index.ejs index 378839e..a5a7792 100644 --- a/views/index.ejs +++ b/views/index.ejs @@ -100,7 +100,7 @@
<%- include('partials/hourly.ejs') %>
-
+
<%- include('partials/current-weather.ejs') %>
diff --git a/views/partials/current-weather.ejs b/views/partials/current-weather.ejs index a15cd2f..ee585ce 100644 --- a/views/partials/current-weather.ejs +++ b/views/partials/current-weather.ejs @@ -1,5 +1,5 @@ <%- include('header.ejs', {titleDual:{ top: 'Current' , bottom: 'Conditions' }, noaaLogo: true}) %> -
+