1button {
2  position: relative;
3  overflow: hidden;
4  padding: 1rem 2.5rem 1rem 2.5rem;
5  border: 0;
6  border-radius: 2rem;
7  font-size: 18px;
8  font-weight: 500;
9  background: transparent;
10  color: #1d1d1d;
11}
12
13button:hover {
14  cursor: wait;
15}
16
17button > p {
18  position: relative;
19  z-index: 3;
20}
21
22button::before,
23button::after {
24  content: "";
25  position: absolute;
26  top: 0;
27  left: -100%;
28  width: 300%;
29  height: 100%;
30  opacity: 0;
31}
32
33button::before {
34  background: #79efff repeating-linear-gradient(50deg, transparent, transparent 10px, #71e0ef 10px, #71e0ef 20px);
35}
36
37button::after {
38  z-index: 2;
39  background: linear-gradient(#79efff 30%, transparent 100%);
40}
41
42button.loading::before,
43button.loading::after {
44  opacity: 1;
45}
46
47@keyframes loading_49100 {
48  0% {
49    translate: 25px 0;
50  }
51
52  100% {
53    translate: -30px 0;
54  }
55}
56
57button.loading::before {
58  animation: loading_49100 0.6s infinite linear;
59}