Button by doniaskima
#e8e8e8
1.btn-56, 2.btn-56 *, 3.btn-56 :after, 4.btn-56 :before, 5.btn-56:after, 6.btn-56:before { 7 border: 0 solid; 8 box-sizing: border-box; 9} 10 11.btn-56 { 12 -webkit-tap-highlight-color: transparent; 13 -webkit-appearance: button; 14 background-color: #000; 15 background-image: none; 16 color: #fff; 17 cursor: pointer; 18 font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 19 Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, 20 Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; 21 font-size: 100%; 22 line-height: 1.5; 23 margin: 0; 24 -webkit-mask-image: -webkit-radial-gradient(#000, #fff); 25 padding: 0; 26} 27 28.btn-56:disabled { 29 cursor: default; 30} 31 32.btn-56:-moz-focusring { 33 outline: auto; 34} 35 36.btn-56 svg { 37 display: block; 38 vertical-align: middle; 39} 40 41.btn-56 [hidden] { 42 display: none; 43} 44 45.btn-56 { 46 border: 1px solid; 47 border-radius: 999px; 48 box-sizing: border-box; 49 display: block; 50 font-weight: 900; 51 -webkit-mask-image: none; 52 overflow: hidden; 53 padding: 1.2rem 3rem; 54 position: relative; 55 text-transform: uppercase; 56} 57 58.btn-56:hover { 59 -webkit-animation: pulse 0.5s; 60 animation: pulse 0.5s; 61 box-shadow: 0 0 0 2em transparent; 62} 63 64@-webkit-keyframes pulse { 65 0% { 66 box-shadow: 0 0 0 0 #fff; 67 } 68} 69 70@keyframes pulse { 71 0% { 72 box-shadow: 0 0 0 0 #fff; 73 } 74} 75
441 views
441 views
MIT License