Button by Kemboi-Dun
#e8e8e8
1.button { 2 text-decoration: none; 3 padding: 14px 24px; 4 color: #121212; 5 border: 1px solid #181818; 6 overflow: hidden; 7 position: relative; 8 transition: color .5s .25s; 9 border-radius: 2px; 10 background: transparent; 11} 12 13.button::before, 14.button::after { 15 content: ''; 16 position: absolute; 17 top: 0; 18 width: 50%; 19 height: 100%; 20 background-color: #181818; 21 z-index: -1; 22 transform: scaleX(0); 23 transition: transform .5s cubic-bezier(.785, .135, .15, .86); 24} 25 26.button::before { 27 left: 0; 28 transform-origin: left; 29} 30 31.button::after { 32 right: 0; 33 transform-origin: right; 34} 35 36.button:hover::before, 37.button:hover::after { 38 transform: scaleX(1); 39} 40 41.button:hover { 42 color: #f8f8f8; 43 transition-delay: .5s; 44}
754 views
754 views
MIT License