Card by aadium
#e8e8e8
1.social-buttons { 2 display: flex; 3 justify-content: center; 4 align-items: center; 5 background-color: #f2f2f2; 6 box-shadow: 0px 0px 15px #00000027; 7 padding: 15px 10px; 8 border-radius: 5em; 9} 10 11.social-button { 12 display: flex; 13 justify-content: center; 14 align-items: center; 15 width: 50px; 16 height: 50px; 17 border-radius: 50%; 18 margin: 0 10px; 19 background-color: #fff; 20 box-shadow: 0px 0px 4px #00000027; 21 transition: 0.3s; 22} 23 24.social-button:hover { 25 background-color: #f2f2f2; 26 box-shadow: 0px 0px 6px 3px #00000027; 27} 28 29.social-buttons svg { 30 transition: 0.3s; 31 height: 20px; 32} 33 34.facebook { 35 background-color: #3b5998; 36} 37 38.facebook svg { 39 fill: #f2f2f2; 40} 41 42.facebook:hover svg { 43 fill: #3b5998; 44} 45 46.github { 47 background-color: #333; 48} 49 50.github svg { 51 width: 25px; 52 height: 25px; 53 fill: #f2f2f2; 54} 55 56.github:hover svg { 57 fill: #333; 58} 59 60.linkedin { 61 background-color: #0077b5; 62} 63 64.linkedin svg { 65 fill: #f2f2f2; 66} 67 68.linkedin:hover svg { 69 fill: #0077b5; 70} 71 72.instagram { 73 background-color: #c13584; 74} 75 76.instagram svg { 77 fill: #f2f2f2; 78} 79 80.instagram:hover svg { 81 fill: #c13584; 82} 83
3.7K views
3.7K views
MIT License