🎨 Improved layoutGenerator function

FlexiBoii · Feb 8, 2022 · e32578e · e32578e
1 parent fa9be44
commit e32578e
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 6 deletions.
diff --git a/app.css b/app.css
@@ -205,14 +205,24 @@ body {
   color: var(--fg);
 }
 
-.linksBlockLeft {
+.linksBlock {
   grid-row: 3 / span 2;
+  grid-column: 1 / span 4;
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  grid-template-rows: repeat(2, 1fr);
+  grid-gap: 30px;
+}
+
+.linksBlockLeft {
+  grid-row: 1 / span 2;
   grid-column: 1 / span 2;
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   grid-template-rows: repeat(2, 1fr);
   grid-gap: 30px;
   padding: 20px;
+
 }
 
 .button {
@@ -260,13 +270,14 @@ body {
 }
 
 .linksBlockRight {
-  grid-row: 3 / span 2;
+  grid-row: 1 / span 2;
   grid-column: 3 / span 2;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   grid-template-rows: repeat(2, 1fr);
   grid-gap: 30px;
   padding: 0.3rem;
+
 }
 
 .list {

diff --git a/assets/js/layout.js b/assets/js/layout.js
@@ -10,8 +10,7 @@ const generateLayout = () => {
         </div>
 
         <div class="linksBlockRight" id="linksBlockRight">
-            <div class="card list list__1" id="list_1"></div>
-            <div class="card list list__2" id="list_2"></div>
+           
         </div>
     `;
   let listLayout = `

diff --git a/index.html b/index.html
@@ -78,8 +78,8 @@
     <script src="assets/js/greeting.js"></script>
     <script src="assets/js/weather.js"></script>
 
-    <script src="assets/js/buttons.js"></script>
-    <script src="assets/js/lists.js"></script>
+    <!-- <script src="assets/js/buttons.js"></script>
+    <script src="assets/js/lists.js"></script> -->
 
     <!-- Icons -->
     <script>