diff options
| -rw-r--r-- | src/images/horizontal_background_720.png | bin | 0 -> 557151 bytes | |||
| -rw-r--r-- | src/images/vertical_background_720.png | bin | 0 -> 516530 bytes | |||
| -rw-r--r-- | src/styles/1080.scss | 3 | ||||
| -rw-r--r-- | src/styles/720.scss | 3 | ||||
| -rw-r--r-- | src/styles/app.scss | 34 | ||||
| -rw-r--r-- | src/styles/main.scss | 9 |
6 files changed, 40 insertions, 9 deletions
diff --git a/src/images/horizontal_background_720.png b/src/images/horizontal_background_720.png Binary files differnew file mode 100644 index 0000000..3bef6ce --- /dev/null +++ b/src/images/horizontal_background_720.png diff --git a/src/images/vertical_background_720.png b/src/images/vertical_background_720.png Binary files differnew file mode 100644 index 0000000..f25adbf --- /dev/null +++ b/src/images/vertical_background_720.png diff --git a/src/styles/1080.scss b/src/styles/1080.scss new file mode 100644 index 0000000..6f81af5 --- /dev/null +++ b/src/styles/1080.scss @@ -0,0 +1,3 @@ +body { + font-size: 1.2rem; +}
\ No newline at end of file diff --git a/src/styles/720.scss b/src/styles/720.scss new file mode 100644 index 0000000..8e6d5ee --- /dev/null +++ b/src/styles/720.scss @@ -0,0 +1,3 @@ +body { + font-size: 0.8rem; +}
\ No newline at end of file diff --git a/src/styles/app.scss b/src/styles/app.scss index 74edfcc..955a9b6 100644 --- a/src/styles/app.scss +++ b/src/styles/app.scss @@ -5,10 +5,36 @@ $colors: ( button: #313131, background: #363636 ); +@media (max-device-width: 720px) and (orientation: portrait) { + $header_size: 145px; -$header_size: 218px; + @import "main.scss"; + @import "portrait.scss"; + @import "720.scss"; +} + +@media (max-device-width: 1280px) and (orientation: landscape) { + $header_size: 145px; + + @import "main.scss"; + @import "landscape.scss"; + @import "720.scss"; +} + +@media (min-device-width: 1080px) and (orientation: portrait) { + $header_size: 218px; + + @import "main.scss"; + @import "portrait.scss"; + @import "1080.scss"; +} + +@media (min-device-width: 1920px) and (orientation: landscape) { + $header_size: 218px; + + @import "main.scss"; + @import "landscape.scss"; + @import "1080.scss"; +} -@import "main.scss"; -@import "portrait.scss"; -@import "landscape.scss"; @import "style.css";
\ No newline at end of file diff --git a/src/styles/main.scss b/src/styles/main.scss index 1da7565..b3f56e1 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -9,7 +9,6 @@ html { } body { - font-size: 1.2rem; font-family: Arial; color: map-get($colors, font); margin: 0; @@ -37,7 +36,7 @@ body { width: 100%; height: $header_size*0.70; line-height: $header_size*0.70; - font-size: 90px; + font-size: 6em; } .label { @@ -62,7 +61,7 @@ body { } .hour { - font-size: 40px; + font-size: 2em; border-bottom: 1px solid map-get($colors, grey); width: 80%; margin: 0 10% 10px 10%; @@ -70,7 +69,7 @@ body { } .wheater { - font-size: 30px; + font-size: 1.5em; letter-spacing: 2px; } } @@ -79,7 +78,7 @@ body { display: flex; justify-content: space-around; text-align: center; - font-size: 42px; + font-size: 2em; color: map-get($colors, grey); .powered { |
