perspectiva/index.css at main · githubinf/perspectiva · 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
47
48
49
50
51
52
53
54
55
56
57
58
59
@import "tailwindcss";

@theme {
  --color-primary: #174532;
  --color-secondary: #4db380;
  --color-tech-dark: #1f513a;
  --color-white-editorial: #ffffff;
  --color-grey-soft: #dae7df;
  --color-text: #1b1b1b;
  --color-accent: #f4b925;
}

@layer base {
  body {
    @apply font-sans text-[#1b1b1b] bg-white m-0 p-0;
  }

  h1, h2, h3, .serif {
    font-family: 'Libre+Baskerville', serif;
  }
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }

  .custom-scrollbar::-webkit-scrollbar {
    width: 6px;
  }
  .custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(23, 69, 50, 0.05);
  }
  .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(23, 69, 50, 0.2);
    border-radius: 10px;
  }
  .custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(23, 69, 50, 0.4);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 1s ease-out forwards;
}

.animate-slide-up {
  animation: slideUp 0.8s ease-out forwards;
}