sass/uchu/core/_root.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

:root {
  --background-color: var(--uchu-gray-1);
  --base-grid-color1: oklch(var(--uchu-blue-3-raw) / 30%);
  --base-grid-color2: oklch(var(--uchu-purple-3-raw) / 30%);
  --baseline: calc(var(--line-height) / 2);
  --block-spacing-bottom: var(--line-height);
  --block-spacing-top: 0;
  --column-gap: calc(var(--line-height) * 2);
  --display-scale: 1;
  --font-mono: null;
  --font-sans: null;
  --font-serif: null;
  --font-size: 12px;
  --foreground-color: oklch(var(--uchu-yin-raw) / 80%);
  --h1-size: 2.8rem;
  --h2-size: 2.2rem;
  --h3-size: 1.4rem;
  --h4-size: 1.1rem;
  --hr-thickness: 2px;
  --line-height: calc(var(--font-size) * 1.5);
  --pixel: 1px;
  --row-gap: var(--line-height);

  @media only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
    --display-scale: 2;
    --pixel: 0.5px;
  }

  @media only screen and (min-device-pixel-ratio: 2.5), only screen and (min-resolution: 2.5dppx) {
    --display-scale: 3;
    --pixel: 0.34px;
  }

  @media only screen and (min-device-pixel-ratio: 3.5), only screen and (min-resolution: 3.5dppx) {
    --display-scale: 4;
    --pixel: 0.25px;
  }
}