#e8e8e8
1button { 2 background: #fff; 3 border: none; 4 padding: 10px 20px; 5 display: inline-block; 6 font-size: 15px; 7 font-weight: 600; 8 width: 120px; 9 text-transform: uppercase; 10 cursor: pointer; 11 transform: skew(-21deg); 12} 13 14span { 15 display: inline-block; 16 transform: skew(21deg); 17} 18 19button::before { 20 content: ''; 21 position: absolute; 22 top: 0; 23 bottom: 0; 24 right: 100%; 25 left: 0; 26 background: rgb(20, 20, 20); 27 opacity: 0; 28 z-index: -1; 29 transition: all 0.5s; 30} 31 32button:hover { 33 color: #fff; 34} 35 36button:hover::before { 37 left: 0; 38 right: 0; 39 opacity: 1; 40}
8.7K views
8.7K views
Comments
MIT License