app/tailwind.css at main · maragudk/app · 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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
@import "tailwindcss";
@source "../glue/html/**/*.go";
@source "/go/pkg/mod/maragu.dev/glue*/html/**/*.go";

/*
100	Thin (Hairline)
200	Extra Light (Ultra Light)
300	Light
350 Book
400	Normal (Regular)
500	Medium
600	Semi Bold (Demi Bold)
700	Bold
800	Extra Bold (Ultra Bold)
900	Black (Heavy)
950	Extra Black (Ultra Black)
*/

/*
Breakpoints:
- pre-sm: phones
- md: tablets
- lg: sideways tablets
- xl: laptops and desktops
*/

@font-face {
  font-family: "Monaspace Argon";
  font-weight: 100 900;
  font-display: swap;
  src: url("Monaspace Argon Var.woff2") format("woff2");
}

@font-face {
  font-family: "Monaspace Krypton";
  font-weight: 100 900;
  font-display: swap;
  src: url("Monaspace Krypton Var.woff2") format("woff2");
}

@font-face {
  font-family: "Monaspace Neon";
  font-weight: 100 900;
  font-display: swap;
  src: url("Monaspace Neon Var.woff2") format("woff2");
}

@font-face {
  font-family: "Monaspace Radon";
  font-weight: 100 900;
  font-display: swap;
  src: url("Monaspace Radon Var.woff2") format("woff2");
}

@font-face {
  font-family: "Monaspace Xenon";
  font-weight: 100 900;
  font-display: swap;
  src: url("Monaspace Xenon Var.woff2") format("woff2");
}

@theme {
  --font-mono:
    "Monaspace Argon", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;
  --font-mono--font-feature-settings: "liga" 1, "calt" 1;
}

@theme inline {
  --color-primary-50: var(--color-indigo-50);
  --color-primary-100: var(--color-indigo-100);
  --color-primary-200: var(--color-indigo-200);
  --color-primary-300: var(--color-indigo-300);
  --color-primary-400: var(--color-indigo-400);
  --color-primary-500: var(--color-indigo-500);
  --color-primary-600: var(--color-indigo-600);
  --color-primary-700: var(--color-indigo-700);
  --color-primary-800: var(--color-indigo-800);
  --color-primary-900: var(--color-indigo-900);
  --color-primary-950: var(--color-indigo-950);
}