From e6f7c10f9407a3bd7aee43b34b83a86b902c1940 Mon Sep 17 00:00:00 2001
From: alokify <alokshah951@gmail.com>
Date: Thu, 7 Nov 2024 03:34:20 +0530
Subject: [PATCH] Fixed Responsiveness for 480px devices

---
 index.html |  4 ++--
 style.css  | 24 ++++++++++++++++++------
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 519f59df..ff0a45f3 100644
--- a/index.html
+++ b/index.html
@@ -208,9 +208,9 @@
                     <h3>KDE Plasma</h3>
                     <p>Simple by default, powerful when needed. Plasma is made to stay out of the way when you want to focus on your work, but it's there and ready when you need its power.</p>
                     <p>Discover the ease of use, fine-tuned with the same attention to detail that makes Plasma shine. A streamlined interface that stays out of your way lets you focus on your work.</p>
-                    <p>Author: https://x.com/LinuxScoop/status/1432903154484449283/photo/1</p>
+                    <p>Author: <a href="https://x.com/LinuxScoop/status/1432903154484449283/photo/1">X Post</a></p>
                 </div>
-                <img src="/assets/snigdhaos-plasma.jpeg?height=300&width=500" alt="KDE Plasma Desktop" class="desktop-image">
+                <img src="/assets/snigdhaos-plasma.jpeg" alt="KDE Plasma Desktop" class="desktop-image">
             </div>
         </div>
     </section>
diff --git a/style.css b/style.css
index e8623cf8..51e4b5af 100644
--- a/style.css
+++ b/style.css
@@ -22,11 +22,10 @@ body {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 1rem 5%;
     position: fixed;
     width: 100%;
     top: 0;
-    background-color: rgba(26, 31, 44, 0.95);
+    background-color: rgba(26, 31, 44, 0.70);
     z-index: 1000;
 }
 
@@ -52,7 +51,7 @@ body {
     display: flex;
     align-items: center;
     padding: 0 5%;
-    background-image: url(/assets/background.jpg); 
+    background-image: url(/assets/background.jpg);
     position: relative;
     overflow: hidden;
     background-position: bottom;
@@ -255,7 +254,7 @@ body {
 }
 
 .desktop-environments {
-    padding: 5rem 5%;
+    padding: 10px;
 }
 
 .desktop-grid {
@@ -277,7 +276,7 @@ body {
 
 .desktop-image {
     width: 100%;
-    height: auto;
+    height: 100%;
     border-radius: 8px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
 }
@@ -339,6 +338,8 @@ body {
     .platform-grid {
         grid-template-columns: 1fr;
     }
+    
+    
 }
 .footer {
 background-color: #000;
@@ -515,7 +516,9 @@ margin-top: 2rem;
 .footer-content {
     grid-template-columns: 1fr;
 }
-
+nav.navbar{
+    width: 100%;
+}
 .footer-section {
     text-align: center;
 }
@@ -523,4 +526,13 @@ margin-top: 2rem;
 .with-icon {
     justify-content: center;
 }
+.desktop-card{
+    width: 460px;
+    text-align: left;
 }
+.desktop-card p {
+    text-align: left;
+    
+}
+}
+}
\ No newline at end of file