edits

AQuadic · Sep 9, 2024 · 439b323 · 439b323
1 parent 8f5a78f
commit 439b323
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 21 deletions.
diff --git a/home.css b/home.css
@@ -9,7 +9,6 @@
     display: grid;
     grid-template-columns: auto auto;
     gap: 40px;
-    max-width: 1200px;
 }
 
 .content {
@@ -80,8 +79,7 @@
 }
 
 .sign_image {
-    /* width:718.89px ;
-    height:830.28px ; */
+    margin-left:-100px;
     margin-top:151px;
 }
 
@@ -93,6 +91,7 @@
     border-radius: 10px;
     width: 100%;
     margin-top: 20px;
+    cursor: pointer;
 }
 
 @media (max-width: 1024px) {
@@ -103,18 +102,16 @@
 
     .sign_image {
         margin-top: 50px;
+        margin-left:0;
     }
+
 }
 
 @media (max-width: 768px) {
     .home_page {
         padding: 10px;
     }
 
-    .content {
-        flex-direction: column;
-    }
-
     .content h2 {
         font-size: 24px;
         text-align: center;
@@ -127,14 +124,16 @@
     .input-container label {
         font-size: 20px;
     }
+
 }
 
 @media (max-width: 580px) {
     .content h2 {
         font-size: 20.79px;
     }
+
     .header_image img {
-        width: 100%;
+        width: 125%;
         height: auto;
     }
 

diff --git a/styles.css b/styles.css
@@ -28,7 +28,7 @@ body {
 }
 
 .deal-wheel {
-  --size: clamp(250px, 70vmin, 700px);
+  --size: clamp(190px, 70vmin, 700px);
   --lg-hs: 0 3%;
   --lg-stop: 50%;
   --lg: linear-gradient(
@@ -48,7 +48,7 @@ body {
   font-size: calc(var(--size) / 21);
   line-height: 1;
   text-transform: lowercase;
-  overflow: hidden;
+  /* overflow: hidden; */
 }
 
 .deal-wheel > * {
@@ -70,8 +70,9 @@ body {
   transform: rotate(calc(var(--rotate, 25) * 1deg));
   border-radius: 50%;
   box-shadow: inset 0 0 0 calc(var(--size) / 40) hsl(0deg 0% 0% / 0.06);
-  margin-top:60px;
-  margin-right:100px
+  /* margin-top:60px; */
+  margin-right:100px;
+  margin-bottom:50px
 }
 
 .spinner * {
@@ -288,11 +289,6 @@ body {
   margin-top:-20px
 }
 
-@media (max-width: 768px) {
-  .first_page {
-    grid-template-columns: 1fr;
-      }
-}
 
 .header-logo .content {
   display:flex;
@@ -302,7 +298,7 @@ body {
 
 .content h2 {
   position: relative;
-  font-size: 31.79px;
+  font-size: 26px;
   font-weight: 400;
   font-family: Shrikhand;
   text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
@@ -311,16 +307,16 @@ body {
 .header-logo p {
   position: relative;
     left: 12%;
-    margin-top: -59px;
+    margin-top: -36px;
 }
 
 .logo-container img {
     width:50px;
     height:50px;
     z-index: 2;
     position: absolute;
-    left: 46%;
-    top:57%;
+    left: 45%;
+    top:48%;
     transform:translate(-50% , -50%);
 }
 @media (max-width: 600px) {
@@ -333,3 +329,40 @@ body {
   }
 }
 
+
+@media (max-width: 768px) {
+  .first_page {
+    grid-template-columns: 1fr;
+  }
+
+  .container {
+    height:350px;
+  }
+
+
+  .power-indicator {
+    position: relative;
+    top: 50%;
+    left: -20px;
+    width: 300px;
+    height: 40px;
+    transform: none;
+    margin-top: -40px;
+  }
+
+  .power-indicator input[type="range"] {
+    writing-mode: horizontal-tb;
+    width: 70%;
+    height: 40px;
+  }
+
+  .power-indicator input[type="range"]::-webkit-slider-thumb {
+    margin-left: 0;
+    margin-top: 10px;
+    transform:rotate(90deg)
+  }
+  .logo-container img {
+    left: 39%;
+    top:46%
+}
+}