small edits

awang1245 · Mar 8, 2024 · cd2feba · cd2feba
1 parent 1ceeb8a
commit cd2feba
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 8 deletions.
diff --git a/index.html b/index.html
@@ -117,7 +117,7 @@ <h1>The premier after-school enrichment program for K-12</h1>
         <section class="program-section">
           <div class="section-content">
             <div class="sidebar-content">
-              <h2>Programs</h2>
+              <h2 class="programs-header">Programs</h2>
               <div class="program-scroll">
                 <ul>
                   <li><button class="clicked">Language Arts</button></li>
@@ -133,7 +133,7 @@ <h2>Programs</h2>
             </div>
             <div class="program-content">
               <div class="program-intro">
-                <h1>Language Arts</h1>
+                <h2>Language Arts</h2>
                 <div class="description">
                   Through Beestar's ELA program, students will be provided with
                   a comprehensive and structured approach to developing language
@@ -447,6 +447,6 @@ <h4>Announcements & News for Week 7: February 25 to March 02</h4>
         </footer>
       </main>
     </div>
-    <script type="application/javascript" src="/main.js"></script>
+    <script type="module" src="/main.js"></script>
   </body>
 </html>
diff --git a/style.css b/style.css
@@ -398,6 +398,7 @@ section {
 }
 
 .grades {
+  width: 100%;
   display: flex;
   flex-flow: column nowrap;
   align-items: center;
@@ -892,7 +893,7 @@ footer {
 
   .sidebar-content {
     width: 100%;
-    padding: 16px 36px;
+    padding: 4px 36px 8px;
     background-color: var(--light-yellow);
     gap: 0;
 
@@ -1007,6 +1008,10 @@ footer {
       height: 40px;
     }
   }
+
+  .programs-header {
+    display: none;
+  }
 }
 
 @media (max-width: 600px) {
@@ -1025,15 +1030,30 @@ footer {
     font-size: 14px;
   }
 
+  .logo-buttons {
+    padding: 0 24px;
+  }
+
+  .logo-buttons {
+    .buttons {
+      gap: 24px;
+    }
+  }
+
   .welcome-section-mobile {
     .intro-content {
       flex-flow: column nowrap;
       align-items: start;
-      gap: 8px;
+      gap: 0;
     }
 
     .tablet-button {
       border-radius: 10px;
+      padding: 6px 16px 4px 20px;
+
+      img {
+        width: 16px;
+      }
     }
 
     .beestar-intro {
@@ -1042,16 +1062,18 @@ footer {
   }
 
   .sidebar-content {
-    padding: 12px 36px 10px;
+    width: 100%;
+    padding: 2px 24px 6px;
     button {
       font-size: 12px;
       width: fit-content;
-      padding: 14px 28px 12px 28px;
+      padding: 14px 26px 12px;
       border-radius: 14px;
     }
   }
 
   .program-content {
+    padding: 16px 24px;
     gap: 16px;
     .description {
       font-size: 10px;
@@ -1108,13 +1130,26 @@ footer {
     display: none;
   }
 
+  .right-content {
+    .description {
+      max-height: 44px;
+      font-weight: 400;
+      text-overflow: ellipsis;
+      overflow: hidden;
+    }
+  }
+
   .single-col {
     display: flex;
     flex-flow: column nowrap;
     align-items: center;
     gap: 16px;
     flex: 1;
-    padding: 24px 36px;
+    padding: 24px 24px;
+  }
+
+  .programs-header {
+    display: none;
   }
 }