#e8e8e8
1.level-up { 2 font-family: 'Montserrat', sans-serif; 3 font-size: 25px; 4 font-weight: bold; 5 color: #ffffff; 6 background-color: #ff5733; 7 padding: 20px; 8 border-radius: 10px; 9 box-shadow: 0px 5px 10px rgba(0,0,0,0.2); 10 text-align: center; 11 transition: all 0.3s ease; 12} 13 14.text { 15 position: relative; 16 display: inline-block; 17 animation: bounce 1s infinite; 18} 19 20.level-up:hover { 21 background-color: #ffffff; 22 color: #ff5733; 23 transform: scale(1.1); 24} 25 26.level-up:hover .text { 27 animation: none; 28} 29 30@keyframes bounce { 31 0% { 32 transform: translateY(0); 33 } 34 35 50% { 36 transform: translateY(-10px); 37 } 38 39 100% { 40 transform: translateY(0); 41 } 42} 43 44.level-up:hover::before { 45 content: ""; 46 display: block; 47 width: 10px; 48 height: 10px; 49 background-color: #ff5733; 50 border-radius: 50%; 51 position: absolute; 52 top: -20px; 53 left: calc(50% - 5px); 54 animation: bounce 0.5s infinite; 55} 56
436 views
436 views
Comments
MIT License