From 08ba1b63e191a077a1634927dbc80dc727758dc9 Mon Sep 17 00:00:00 2001
From: asal sahami <asalsahami22@gmail.com>
Date: Mon, 9 Sep 2024 18:11:47 +0200
Subject: [PATCH] Adjust font size for mobile view in CSS
---
src/App/App.css | 9 +++++++--
src/App/LoadingScreen.css | 16 +++++++++++++++-
2 files changed, 22 insertions(+), 3 deletions(-)
diff --git a/src/App/App.css b/src/App/App.css
index 38686dd2..2eabbec6 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -648,7 +648,12 @@ svg{
}
}
/*For Smartphones*/
-@media screen and (max-width: 767px /*768*/){
+@media screen and (max-width: 768px ){
+ h1, h2, h3 {
+ font-size: 24px !important; /* Adjust according to your design */
+ line-height: 1.2 !important;
+ }
+
svg text{
font-size: 5vw;
stroke-width:1px;
@@ -682,7 +687,7 @@ svg{
}
}
/*Bigger than smartphones*/
-@media only screen and (min-width:992px/*768px*/) {
+@media only screen and (min-width:768px) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
diff --git a/src/App/LoadingScreen.css b/src/App/LoadingScreen.css
index 84b966be..760ec749 100644
--- a/src/App/LoadingScreen.css
+++ b/src/App/LoadingScreen.css
@@ -9,6 +9,7 @@
justify-content: center;
align-items: center;
z-index: 9999;
+ animation: fadeInOut 5s forwards;
}
.custom-animation {
@@ -24,4 +25,17 @@
50% {
transform: scale(1.2);
}
-}
\ No newline at end of file
+}
+
+@keyframes fadeInOut {
+ 0% {
+ opacity: 1;
+ }
+ 80% {
+ opacity: 1;
+ }
+ 100% {
+ opacity: 0;
+ }
+
+ }
\ No newline at end of file
--
GitLab