react-music-player/style.css at master · leopaul29/react-music-player · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
/* animation
* source: https://youtu.be/gWai7fYp9PY
*/
#header {
  color: white;
  margin-top: 25px;
}

h1 {
  font-family: "Inter", sans-serif;
  background-color: mix(#fff, #e91e63, 82%);
  color: mix(#fff, #e91e63, 85%);
  font-size: 98px;
  font-weight: 900;
  text-shadow: -0.0075em 0.0075em 0 mix(#fff, #e91e63, 94%),
    0.005em 0.005em 0 mix(#fff, #e91e63, 60%),
    0.01em 0.01em 0 mix(#fff, #e91e63, 62%),
    0.015em 0.015em mix(#fff, #e91e63, 64%),
    0.02em 0.02em 0 mix(#fff, #e91e63, 66%),
    0.025em 0.025em 0 mix(#fff, #e91e63, 68%),
    0.03em 0.03em 0 mix(#fff, #e91e63, 70%),
    0.035em 0.035em 0 mix(#fff, #e91e63, 72%);
}

#main {
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradient 15s ease infinite;

  height: 100vh;
  display: grid;
  place-items: center;
  grid-template-rows: auto 1fr auto auto;
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}