This post is saved as a draft.
This post is saved as a draft.
#e8e8e8
1.button { 2 position: absolute; 3 top: 50%; 4 left: 50%; 5 transform: translate(-50%, -50%); 6 display: flex; 7 border-radius: 9999px; 8 border: none; 9 height: 50px; 10 cursor: pointer; 11 background-color: inherit; 12} 13 14.button span { 15 line-height: 50px; 16 padding: 0 20px; 17 padding-right: 60px; 18 font-size: 20px; 19 font-weight: 600; 20 color: #000; 21} 22 23.button .background { 24 width: 50px; 25 height: 50px; 26 position: absolute; 27 top: 0px; 28 right: 0px; 29 border-radius: 9999px; 30 background-color: rgb(84, 238, 92); 31 transition: width .2s ease-in-out; 32 z-index: -1; 33} 34 35.button .background svg { 36 width: 36px; 37 height: 36px; 38 position: absolute; 39 top: 50%; 40 right: 6px; 41 transform: translate(0%, -50%); 42} 43 44.button:hover .background { 45 width: 100%; 46}
431 views
431 views
MIT License