Card by Lmickk2
This card was created for Open-Source CSS Odyssey
#212121
1.card { 2 border-radius: 1em; 3 padding: 2em; 4 color: white; 5 box-shadow: inset 3px 3px 10px black; 6} 7 8.heading { 9 font-weight: bold; 10} 11 12.item { 13 margin-top: 1em; 14 text-align: center; 15} 16 17.item span { 18 display: block; 19} 20 21.item--create svg:hover { 22 filter: drop-shadow(0px 0px 3px #ffffff); 23 font-weight: bold; 24} 25 26.item--post svg:hover { 27 filter: drop-shadow(0px 0px 3px #ff09f3); 28} 29 30.item--inspire svg:hover { 31 filter: drop-shadow(0px 0px 3px #efff0a); 32} 33 34button { 35 margin: auto; 36 display: block; 37 margin-top: 2em; 38 padding: 0.8em; 39 border-radius: 0.5em; 40 border: none; 41 background: transparent; 42 box-shadow: inset 2px 2px 5px black; 43 color: white; 44 transition: background 0.4s; 45 font-weight: 600; 46} 47 48button:hover { 49 animation: bg-change 5s infinite; 50 box-shadow: inset 3px 3px 4px black; 51 background: linear-gradient(0deg, rgb(97, 4, 55), rgb(148, 31, 128), rgb(40, 10, 88)); 52 background-size: 400% 400%; 53} 54 55@keyframes bg-change { 56 0% { 57 background-position: 50% 0% 58 } 59 60 50% { 61 background-position: 50% 100% 62 } 63 64 100% { 65 background-position: 50% 0% 66 } 67}
480 views
480 views
MIT License