yutube and instagram

axum_server/styles/input.css

@@ -179,6 +179,17 @@ article a {
   transition-delay: 75ms;
 }
 
+.social-card-youtube:hover {
+  @apply rounded-none;
+  transform: scale(1.02);
+  transition-delay: 100ms;
+}
+
+.social-card-instagram:hover {
+  filter: brightness(84%);
+  transition-delay: 100ms;
+}
+
 .social-card-tiktok {
   position: relative;
 

axum_server/styles/output.css

@@ -1777,6 +1777,17 @@ article a:visited {
   transition-delay: 75ms;
 }
 
+.social-card-youtube:hover {
+  border-radius: 0px;
+  transform: scale(1.02);
+  transition-delay: 100ms;
+}
+
+.social-card-instagram:hover {
+  filter: brightness(84%);
+  transition-delay: 100ms;
+}
+
 .social-card-tiktok {
   position: relative;
   &:hover {

axum_server/templates/sections/social.html

@@ -5,10 +5,10 @@
 
 {% call sc::social_card_start("tiktok", "https://www.tiktok.com/@michalvankodev","Highlights can be found on <em>TikTok</em>", "images/social/tiktok_wo.png", "social-card-tiktok") %}
 
-{% call sc::social_card_start("youtube", "https://www.youtube.com/@michalvankodev", "Videos and vlogs posted on <em>YouTube</em>", "images/social/youtube_wo.png", "") %}
+{% call sc::social_card_start("youtube", "https://www.youtube.com/@michalvankodev", "Videos and vlogs posted on <em>YouTube</em>", "images/social/youtube_wo.png", "social-card-youtube") %}
 
 <div class="lg:hidden xl:block">
-{% call sc::social_card_start("instagram", "https://www.instagram.com/michalvankodev/", "Photos and stories shared on <em>Instagram</em>", "images/social/instagram_plain.png", "") %}
+{% call sc::social_card_start("instagram", "https://www.instagram.com/michalvankodev/", "Photos and stories shared on <em>Instagram</em>", "images/social/instagram_plain.png", "social-card-instagram") %}
 </div>
 
 </section>