assets/scss/input.css


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

@tailwind base;
@tailwind components;
@tailwind utilities;

.baskerville {
  font-family: baskerville, serif;
}

blockquote::before {
  font-family: "Font Awesome 6 Free";
  color: #79c753;
  content: "\f10d";
  font-weight: 900;
  font-size: 2rem;
  position: absolute;
  left: 10px;
  top: -15px;
}

@layer base {
  blockquote {
    @apply border-l-4 p-6 pb-1 mx-8 relative border-lime-500 baskerville;
  }
  blockquote p:last-of-type {
    @apply text-center uppercase mt-4 tracking-wide;
  }
  h1 {
    @apply text-5xl font-bold my-4;
  }
  h2 {
    @apply text-4xl font-bold my-4;
  }
  h3 {
    @apply text-3xl font-bold my-4;
  }
  h4 {
    @apply text-2xl font-bold my-4;
  }
}

@layer components {
  #hero {
    text-shadow: 2px 2px 3px black;
  }
  .main-content p {
    @apply my-4 text-xl;
  }
}