pixies

1@use "@/common/styles/colors" as *
2
3.footer
4  margin-top: 4rem
5  padding: 2rem 6rem
6  border-top: 1px solid $border-color
7
8.footer-content
9  display: flex
10  align-items: center
11  justify-content: space-between
12
13.footer-left p
14  font-size: 0.875rem
15  color: $text-muted
16
17.footer-links
18  display: flex
19  align-items: center
20  gap: 2rem
21
22  a
23    font-size: 0.875rem
24    color: $text-secondary
25    transition: color 0.2s
26
27    &:hover
28      color: $text
29
30.footer-right .github-link
31  display: flex
32  align-items: center
33  justify-content: center
34  width: 2.25rem
35  height: 2.25rem
36  background: $background-lighter
37  border: 1px solid $border-color
38  border-radius: 8px
39  color: $text-secondary
40  transition: all 0.2s
41
42  &:hover
43    color: $text
44    border-color: $border-hover
45
46  svg
47    font-size: 1rem
48
49@media (max-width: 900px)
50  .footer
51    padding: 2rem
52
53  .footer-content
54    flex-direction: column
55    gap: 1.5rem
56
57  .footer-links
58    flex-wrap: wrap
59    justify-content: center
60    gap: 1.5rem
61
62@media (max-width: 640px)
63  .footer
64    padding: 1.5rem
65
66  .footer-links
67    gap: 1rem
68
69    a
70      font-size: 0.8125rem