Merge pull request #549 from ANKeshri/fix/alignment-of-devops-arsenal

Fix/alignment of devops arsenal
mdazfar2 · Jun 20, 2024 · d0e99ad · d0e99ad
2 parents d6f9c76 + 80c96ed
commit d0e99ad
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 11 deletions.
diff --git a/website2.0/b1.png b/website2.0/b1.png
diff --git a/website2.0/index.html b/website2.0/index.html
@@ -258,10 +258,10 @@
     }
 
     .icons {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      gap: 100px;
+      width: 88%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
     }
 
     .icons img {
@@ -510,21 +510,23 @@ <h2>Community-Driven Development</h2>
       </div>
       <div class="banner">
           <h1 style="text-align: center;" data-aos="fade-up">DevOps Arsenal</h1>
+          <div class="icn">     
           <div class="icons" >
-            <img src="b1.png" alt="Cloud Icon" />
-            <img src="b2.png" alt="Monitor Icon" />
-            <img src="b3.png" alt="Pipeline Icon" />
-            <img src="b4.png" alt="DevOps Icon" />
-            <img src="b5.png" alt="Container Icon" />
-            <img src="b6.png" alt="Tools Icon" />
+           <div><img src="b1.png" alt="Cloud Icon" /></div> 
+           <div> <img src="b2.png" alt="Monitor Icon" /></div>
+            <div><img src="b3.png" alt="Pipeline Icon" /></div>
+            <div><img src="b4.png" alt="DevOps Icon" /></div>
+            <div><img src="b5.png" alt="Container Icon" /></div>
+            <div><img src="b6.png" alt="Tools Icon" /></div>
           </div>
+        </div> 
         </div>
       <div style="width: 100vw;margin-bottom: 70px;margin-top: 50px;">
           <div class="newsletter" style="border-radius: 20px;display: flex;height: 221px;width: 90%;;margin: auto;background-color: #ef8336;box-shadow:0px 0px 15px rgb(110, 46, 3) ;">
              <div style="width:40%;display: flex;justify-content: center;align-items: center;">
 
                  <img style="height: 85px;" src="HelpOps-H Fevicon.png" alt="Logo" data-tilt/>
-                 <h3 style="font-size: 44px;font-weight: 400;">HelpOps-Hub</h3>
+                 <h3 style="font-size: 44px;font-weight: 400;">elpOps-Hub</h3>
              </div>
              <div style="width: 60%;display: flex;justify-content: center;align-items: center;">
                   <div style="width: 70%;display: flex;flex-direction: column;position: relative;bottom: 20px;" >

diff --git a/website2.0/styles.css b/website2.0/styles.css
@@ -936,4 +936,10 @@ opacity: 0px;
   transform: translateX(10px);
   background: transparent;
   border: 2px solid white;
+}
+.icn{
+  width: 100vw;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }