From 0b90b7fb3cae2a69b80cd7375a5e118d89b21d22 Mon Sep 17 00:00:00 2001 From: Roman Makarov Date: Sun, 8 Sep 2024 17:41:01 +0300 Subject: [PATCH] Update mobile css --- css/main.css | 25 ++++++++++++++++++++----- css/main.css.map | 2 +- css/main.scss | 35 ++++++++++++++++++++++++++++++----- 3 files changed, 51 insertions(+), 11 deletions(-) diff --git a/css/main.css b/css/main.css index 5e6e41c..63195be 100644 --- a/css/main.css +++ b/css/main.css @@ -132,8 +132,7 @@ body .main { flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; - width: 700px; - padding-left: 50px; + width: 42vw; } body .main #summary-section { color: white; @@ -173,9 +172,8 @@ body .main #summary-section li:before { } body .main #summary-section .links { display: flex; - justify-content: space-between; + justify-content: left; padding-bottom: 10px; - padding-right: 150px; } body .main #summary-section .links img { width: 42px; @@ -294,7 +292,24 @@ img { height: 30px; } -@media only screen and (max-width: 500px) { +@media only screen and (max-width: 800px) { + #summary-section .name-surname { + font-size: 2.5em !important; + } + #summary-section ul { + font-size: 1em !important; + } + #summary-section .links img { + width: 30px !important; + height: 30px !important; + } + .main { + width: 100vw !important; + padding: 0 50px; + margin: 0; + padding-right: 0; + background-color: gray; + } .date { float: none !important; } diff --git a/css/main.css.map b/css/main.css.map index 5152cb6..82ca0c5 100644 --- a/css/main.css.map +++ b/css/main.css.map @@ -1 +1 @@ -{"version":3,"sources":["main.css","main.scss"],"names":[],"mappings":"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","file":"main.css"} \ No newline at end of file +{"version":3,"sources":["main.css","main.scss"],"names":[],"mappings":"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","file":"main.css"} \ No newline at end of file diff --git a/css/main.scss b/css/main.scss index d21e0fe..d7a05c4 100644 --- a/css/main.scss +++ b/css/main.scss @@ -172,8 +172,8 @@ body { flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; - width: 700px; - padding-left: 50px; + width: 42vw; + // padding-left: 50px; #summary-section { color: $main-color; @@ -216,9 +216,9 @@ body { .links { display: flex; - justify-content: space-between; + justify-content: left; padding-bottom: 10px; - padding-right: 150px; + // padding-right: 150px; img { width: 42px; height: 42px; @@ -363,7 +363,32 @@ img { height: 30px; } -@media only screen and (max-width: 500px) { +@media only screen and (max-width: 800px) { + + #summary-section { + .name-surname { + font-size: 2.5em !important; + } + ul { + font-size: 1em !important; + } + .links { + img { + width: 30px !important; + height: 30px !important; + } + } + + } + + + .main { + width: 100vw !important; + padding: 0 50px; + margin: 0; + padding-right: 0; + background-color: gray; + } .date { float: none !important; }