Merge pull request #1053 from despot-codA/fix

add hover effect on social-media icons
akshitagupta15june · Aug 25, 2023 · 37d4213 · 37d4213
2 parents 5aa48b5 + fa4dbd6
commit 37d4213
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 9 deletions.
diff --git a/blog.html b/blog.html
@@ -172,8 +172,8 @@ <h3 class="text-2xl ">Subscribe to our newsletter</h3>
       <!-- Social icons  -->
       <div class=" flex-1 flex flex-col items-center justify-center ">
         <div class="text-2xl">Follow us on</div>
-        <div class="flex mt-2 flex-row space-x-3 my-0">
-          <div>
+        <div class="flex mt-2 flex-row space-x-3 my-0 ">
+          <div class="hover:scale-110 transition-all">
             <a href="#" class=" w-5 ml-3">
               <!-- Facebook icon -->
               <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" class="fill-white" viewBox="0 0 20 20">
@@ -182,7 +182,7 @@ <h3 class="text-2xl ">Subscribe to our newsletter</h3>
               </svg>
             </a>
           </div>
-          <div>
+          <div class="hover:scale-110 transition-all">
             <a href="#" class=" w-10 ml-3 mr-3">
               <!-- Instagram icon -->
               <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" class="fill-white" viewBox="0 0 20 20">
@@ -191,7 +191,7 @@ <h3 class="text-2xl ">Subscribe to our newsletter</h3>
               </svg>
             </a>
           </div>
-          <div>
+          <div class="hover:scale-110 transition-all">
             <a href="https://github.com/akshitagupta15june/PetMe" target="_blank" class="w-10 ml-3 mr-3">
               <!-- Github icon -->
               <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" class="fill-white" viewBox="0 0 20 20">

diff --git a/index.html b/index.html
@@ -850,10 +850,10 @@ <h3 class="text-2xl">Subscribe to our newsletter</h3>
 
 				<!-- Social icons  -->
 				<div class="flex-1 flex flex-col items-center justify-center">
-					<div class="text-2xl">Follow us on</div>
+					<div class="text-2xl">Follow us on </div>
 					<div class="flex mt-2 flex-row space-x-3 my-0">
-						<div>
-							<a href="#" class="w-5 ml-3">
+						<div class="hover:scale-110 transition-all">
+							<a href="#" class="w-5 ml-3 ">
 								<!-- Facebook icon -->
 								<svg
 									xmlns="http://www.w3.org/2000/svg"
@@ -868,7 +868,7 @@ <h3 class="text-2xl">Subscribe to our newsletter</h3>
 								</svg>
 							</a>
 						</div>
-						<div>
+						<div class="hover:scale-110 transition-all">
 							<a href="#" class="w-10 ml-3 mr-3">
 								<!-- Instagram icon -->
 								<svg
@@ -884,7 +884,7 @@ <h3 class="text-2xl">Subscribe to our newsletter</h3>
 								</svg>
 							</a>
 						</div>
-						<div>
+						<div class="hover:scale-110 transition-all">
 							<a
 								href="https://github.com/akshitagupta15june/PetMe"
 								target="_blank"

diff --git a/style.css b/style.css
@@ -222,4 +222,7 @@
     color: white;
   }
 
+  #facebook {
+
+  }