veryroundbird.house
1@tailwind base;
2@tailwind components;
3@tailwind utilities;
4@layer base {
5 @font-face {
6 font-family: "iA Writer Quattro S";
7 src: url("/static/fonts/iAWriterQuattroS-Regular.ttf")
8 format("truetype");
9 font-weight: normal;
10 font-style: normal;
11 font-display: swap;
12 font-feature-settings:
13 "calt" 1,
14 "kern" 1;
15 }
16 @font-face {
17 font-family: "iA Writer Quattro S";
18 src: url("/static/fonts/iAWriterQuattroS-Bold.ttf") format("truetype");
19 font-weight: bold;
20 font-style: normal;
21 font-display: swap;
22 font-feature-settings:
23 "calt" 1,
24 "kern" 1;
25 }
26 @font-face {
27 font-family: "iA Writer Quattro S";
28 src: url("/static/fonts/iAWriterQuattroS-Italic.ttf") format("truetype");
29 font-weight: normal;
30 font-style: italic;
31 font-display: swap;
32 font-feature-settings:
33 "calt" 1,
34 "kern" 1;
35 }
36 @font-face {
37 font-family: "iA Writer Quattro S";
38 src: url("/static/fonts/iAWriterQuattroS-BoldItalic.ttf")
39 format("truetype");
40 font-weight: bold;
41 font-style: italic;
42 font-display: swap;
43 font-feature-settings:
44 "calt" 1,
45 "kern" 1;
46 }
47
48 @font-face {
49 font-family: "iA Writer Mono S";
50 src: url("/static/fonts/iAWriterMonoS-Regular.ttf") format("truetype");
51 font-weight: normal;
52 font-style: normal;
53 font-display: swap;
54 font-feature-settings:
55 "calt" 1,
56 "kern" 1;
57 }
58 @font-face {
59 font-family: "iA Writer Mono S";
60 src: url("/static/fonts/iAWriterMonoS-Bold.ttf") format("truetype");
61 font-weight: bold;
62 font-style: normal;
63 font-display: swap;
64 font-feature-settings:
65 "calt" 1,
66 "kern" 1;
67 }
68 @font-face {
69 font-family: "iA Writer Mono S";
70 src: url("/static/fonts/iAWriterMonoS-Italic.ttf") format("truetype");
71 font-weight: normal;
72 font-style: italic;
73 font-display: swap;
74 font-feature-settings:
75 "calt" 1,
76 "kern" 1;
77 }
78 @font-face {
79 font-family: "iA Writer Mono S";
80 src: url("/static/fonts/iAWriterMonoS-BoldItalic.ttf")
81 format("truetype");
82 font-weight: bold;
83 font-style: italic;
84 font-display: swap;
85 font-feature-settings:
86 "calt" 1,
87 "kern" 1;
88 }
89
90 @font-face {
91 font-family: "Inter";
92 font-style: normal;
93 font-weight: 400;
94 font-display: swap;
95 font-feature-settings:
96 "calt" 1,
97 "kern" 1;
98 }
99 h1 {
100 @apply text-2xl;
101 @apply font-sans;
102 @apply text-black;
103 @apply py-4;
104 }
105
106 ::selection {
107 @apply bg-yellow-400;
108 @apply text-black;
109 @apply bg-opacity-30;
110 }
111
112 html {
113 letter-spacing: -0.01em;
114 word-spacing: -0.07em;
115 }
116
117 @layer base {
118 a {
119 @apply no-underline text-black hover:underline hover:text-gray-800;
120 }
121
122 label {
123 @apply block text-sm text-black;
124 }
125 input {
126 @apply bg-white border border-black rounded-sm focus:ring-black p-2;
127 }
128 textarea {
129 @apply bg-white border border-black rounded-sm focus:ring-black p-2;
130 }
131 details summary::-webkit-details-marker {
132 display: none;
133 }
134 }
135
136 @layer components {
137 .btn {
138 @apply relative z-10 inline-flex min-h-[30px] cursor-pointer items-center
139 justify-center bg-transparent px-2 pb-[0.2rem] text-base
140 text-gray-900 before:absolute before:inset-0 before:-z-10
141 before:block before:rounded-sm before:border before:border-gray-200
142 before:bg-white before:drop-shadow-sm
143 before:content-[''] hover:before:border-gray-300
144 hover:before:bg-gray-50
145 hover:before:shadow-[0_2px_2px_0_rgba(20,20,96,0.1),inset_0_-2px_0_0_#f5f5f5]
146 focus:outline-none focus-visible:before:outline
147 focus-visible:before:outline-4 focus-visible:before:outline-gray-500
148 active:before:shadow-[inset_0_2px_2px_0_rgba(20,20,96,0.1)];
149 }
150 }
151 @layer utilities {
152 .error {
153 @apply py-1 text-red-400;
154 }
155 .success {
156 @apply py-1 text-black;
157 }
158 }
159}