source/_assets/sass/_blog.scss


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
60

#main-sidebar-container {
  display: grid;
  grid-template-columns: 100%;
  grid-template-areas: "main" "sidebar";
}

#main-sidebar-container article {
  @apply bg-gray-800;
  grid-area: main;
}

#main-sidebar-container aside {
  grid-area: sidebar;
}

@media (min-width: 1024px) {
  #main-sidebar-container {
    grid-template-columns: 20rem calc(100% - 20rem);
    grid-template-areas: "sidebar main";
    min-height: 100vh;
  }

  #main-sidebar-container aside {
    width: 20rem;
  }
}

#main-sidebar-container {
  article {
      h2 {
        @apply text-2xl;
        @apply font-bold;
        @apply my-4;
      }

      h3 {
        @apply text-xl;
        @apply font-bold;
        @apply my-4;
      }

      a {
        @apply text-green-600;
      }

      ol,
      ul {
        @apply .list-inside;
      }

      ol {
          @apply .list-decimal;
      }

      ul {
        @apply .list-disc;
      }
  }
}