julien.rbrt.fr
forked from
tangled.org/core
Monorepo for Tangled — https://tangled.org
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 ::selection {
100 @apply bg-yellow-400 text-black bg-opacity-30 dark:bg-yellow-600 dark:bg-opacity-50 dark:text-white;
101 }
102
103 @layer base {
104 html {
105 letter-spacing: -0.01em;
106 word-spacing: -0.07em;
107 font-size: 14px;
108 }
109 a {
110 @apply no-underline text-black hover:underline hover:text-gray-800 dark:text-white dark:hover:text-gray-300;
111 }
112
113 label {
114 @apply block mb-2 text-gray-900 text-sm font-bold py-2 uppercase dark:text-gray-100;
115 }
116 input {
117 @apply bg-white border border-gray-400 rounded-sm focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
118 }
119 textarea {
120 @apply bg-white border border-gray-400 rounded-sm focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
121 }
122 details summary::-webkit-details-marker {
123 display: none;
124 }
125 }
126
127 @layer components {
128 .btn {
129 @apply relative z-10 inline-flex min-h-[30px] cursor-pointer items-center
130 justify-center bg-transparent px-2 pb-[0.2rem] text-base
131 text-gray-900 before:absolute before:inset-0 before:-z-10
132 before:block before:rounded before:border before:border-gray-200
133 before:bg-white before:drop-shadow-sm
134 before:content-[''] hover:before:border-gray-300
135 hover:before:bg-gray-50
136 hover:before:shadow-[0_2px_2px_0_rgba(20,20,96,0.1),inset_0_-2px_0_0_#f5f5f5]
137 focus:outline-none focus-visible:before:outline
138 focus-visible:before:outline-4 focus-visible:before:outline-gray-500
139 active:before:shadow-[inset_0_2px_2px_0_rgba(20,20,96,0.1)]
140 disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:before:border-gray-200
141 disabled:hover:before:bg-white disabled:hover:before:shadow-none
142 dark:text-gray-100 dark:before:bg-gray-800 dark:before:border-gray-700
143 dark:hover:before:border-gray-600 dark:hover:before:bg-gray-700
144 dark:hover:before:shadow-[0_2px_2px_0_rgba(0,0,0,0.2),inset_0_-2px_0_0_#2d3748]
145 dark:focus-visible:before:outline-gray-400
146 dark:active:before:shadow-[inset_0_2px_2px_0_rgba(0,0,0,0.3)]
147 dark:disabled:hover:before:bg-gray-800 dark:disabled:hover:before:border-gray-700;
148 }
149 }
150 @layer utilities {
151 .error {
152 @apply py-1 text-red-400 dark:text-red-300;
153 }
154 .success {
155 @apply py-1 text-gray-900 dark:text-gray-100;
156 }
157 }
158}