summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/styles/1080.scss0
-rw-r--r--src/styles/720.scss0
-rw-r--r--src/styles/app.scss33
-rw-r--r--src/styles/main.scss2
4 files changed, 31 insertions, 4 deletions
diff --git a/src/styles/1080.scss b/src/styles/1080.scss
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/styles/1080.scss
diff --git a/src/styles/720.scss b/src/styles/720.scss
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/styles/720.scss
diff --git a/src/styles/app.scss b/src/styles/app.scss
index 5e7fbd4..1cdeb22 100644
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -2,7 +2,34 @@ $colors: (
primary: #00ADDC,
font: #999999
);
+@media (max-device-width: 720px) and (orientation: portrait) {
+ $header_size: 145px;
-@import "main.scss";
-@import "portrait.scss";
-@import "landscape.scss"; \ No newline at end of file
+ @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";
+}
diff --git a/src/styles/main.scss b/src/styles/main.scss
index b190206..6861663 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -27,7 +27,7 @@ body {
font-size: 1.2rem;
font-family: Arial;
color: map-get($colors, font);
- margin: 5%;
+ margin: 0 5%;
.parent {
display: flex;