diff --git a/css/styles.css b/css/styles.css index f837cbf..07ffc49 100644 --- a/css/styles.css +++ b/css/styles.css @@ -810,6 +810,9 @@ img { color: var(--text-color); font-size: 20px; transition: all 0.3s; + min-width: 40px; + min-height: 40px; + aspect-ratio: 1/1; } .footer-social a:hover { @@ -1091,6 +1094,31 @@ img { .info-section { padding: 20px 15px; } + + .footer-social { + gap: 10px; + } + + .footer-social a { + width: 35px; + height: 35px; + min-width: 35px; + min-height: 35px; + font-size: 18px; + margin: 0 5px; + } + + .mobile-social-icons { + gap: 10px; + } + + .mobile-social-icons a { + width: 35px; + height: 35px; + min-width: 35px; + min-height: 35px; + font-size: 18px; + } } @media (max-width: 400px) { @@ -1105,6 +1133,34 @@ img { .cc-license h4 { font-size: 14px; } + + .footer-social { + gap: 5px; + flex-wrap: wrap; + justify-content: center; + } + + .footer-social a { + width: 32px; + height: 32px; + min-width: 32px; + min-height: 32px; + font-size: 16px; + margin: 0 3px; + } + + .mobile-social-icons { + gap: 5px; + flex-wrap: wrap; + } + + .mobile-social-icons a { + width: 32px; + height: 32px; + min-width: 32px; + min-height: 32px; + font-size: 16px; + } } /* Styles pour le menu dropdown des réseaux sociaux */ @@ -1225,6 +1281,9 @@ i.icon-x, border-radius: 50%; background-color: #f5f5f5; transition: transform 0.2s, background-color 0.2s; + min-width: 40px; + min-height: 40px; + aspect-ratio: 1/1; } .mobile-social-icons a:hover {