Skip to content

Commit 515259a

Browse files
revert the tailwind class fixes and disabled the warnings in vscode
1 parent 510d876 commit 515259a

4 files changed

Lines changed: 27 additions & 26 deletions

File tree

.vscode/settings.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,5 +14,6 @@
1414
"ui:\\s*{([^)]*)\\s*}",
1515
"(?:'|\"|`)([^']*)(?:'|\"|`)"
1616
]
17-
]
17+
],
18+
"tailwindCSS.lint.suggestCanonicalClasses": "ignore"
1819
}

app/app.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,14 @@
77
<NuxtPage />
88
</NuxtLayout>
99
</main>
10-
<footer class="mt-auto p-6 bg-(--primary-100)" style="background-color: var(--primary-100)">
10+
<footer class="mt-auto p-6 bg-[var(--primary-100)]" style="background-color: var(--primary-100)">
1111
<div class="container mx-auto flex justify-between items-center">
1212
<div class="flex items-center space-x-4">
1313
<NuxtPicture src="images/blog-thumbnails/probablyjassin.webp" alt="Footer logo" class="h-10 w-10 rounded-full" />
14-
<p class="text-(--text-900)">© {{ new Date().getFullYear() }} <span class="whitespace-nowrap">Jässin</span></p>
14+
<p class="text-[var(--text-900)]">© {{ new Date().getFullYear() }} <span class="whitespace-nowrap">Jässin</span></p>
1515
</div>
1616
<div class="flex space-x-6">
17-
<a title="github" href="https://github.com/probablyjassin" class="text-(--text-900)r:text-[var(--secondary-400)] transition-colors">
17+
<a title="github" href="https://github.com/probablyjassin" class="text-[var(--text-900)] hover:text-[var(--secondary-400)] transition-colors">
1818
<Icon name="line-md:github" class="w-6 h-6" />
1919
</a>
2020
<a title="email" href="mailto:mail@jaess.in" class="text-(--text-900) hover:text-(--secondary-400) transition-colors">

app/assets/css/main.css

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
@layer base {
55
body {
6-
@apply bg-(--background-100) text-(--text-900)-sans leading-relaxed;
6+
@apply bg-[var(--background-100)] text-[var(--text-900)] font-sans leading-relaxed;
77
margin: 0;
88
padding: 0;
99
/* cursor: url("/wiicursor.png"), auto; */
@@ -15,7 +15,7 @@
1515

1616
header,
1717
footer {
18-
@apply bg-(--primary-500) text-(--text-50);
18+
@apply bg-[var(--primary-500)] text-[var(--text-50)];
1919
}
2020

2121
header {
@@ -32,7 +32,7 @@
3232
h4,
3333
h5,
3434
h6 {
35-
@apply text-(--text-900) font-bold;
35+
@apply text-[var(--text-900)] font-bold;
3636
}
3737

3838
h1 {
@@ -80,7 +80,7 @@
8080
}
8181

8282
blockquote {
83-
@apply border-l-4 border-(--primary-500) pl-4 italic mb-4;
83+
@apply border-l-4 border-[var(--primary-500)] pl-4 italic mb-4;
8484
}
8585

8686
ul {
@@ -100,7 +100,7 @@
100100
}
101101

102102
code:not(pre code) {
103-
@apply bg-(--background-200) text-(--text-800) px-1.5 py-0.5 rounded text-sm font-mono;
103+
@apply bg-[var(--background-200)] text-[var(--text-800)] px-1.5 py-0.5 rounded text-sm font-mono;
104104
}
105105

106106
pre:has(code) {
@@ -117,12 +117,12 @@
117117

118118
@media (prefers-color-scheme: dark) {
119119
pre {
120-
@apply bg-(--background-700) text-(--text-200);
120+
@apply bg-[var(--background-700)] text-[var(--text-200)];
121121
}
122122

123123
.copy-button {
124-
@apply bg-(--background-600) text-(--text-300)
125-
hover:bg-(--background-500) hover:text-(--text-100);
124+
@apply bg-[var(--background-600)] text-[var(--text-300)]
125+
hover:bg-[var(--background-500)] hover:text-[var(--text-100)];
126126
}
127127
}
128128

@@ -136,31 +136,31 @@
136136

137137
th,
138138
td {
139-
@apply border border-(--text-300);
139+
@apply border border-[var(--text-300)];
140140
}
141141

142142
th {
143-
@apply bg-(--primary-500) text-(--text-50);
143+
@apply bg-[var(--primary-500)] text-[var(--text-50)];
144144
}
145145

146146
hr {
147-
@apply border-t border-(--text-300) my-8;
147+
@apply border-t border-[var(--text-300)] my-8;
148148
}
149149

150150
.bg-primary {
151-
@apply bg-(--primary-500);
151+
@apply bg-[var(--primary-500)];
152152
}
153153

154154
.bg-secondary {
155-
@apply bg-(--secondary-500);
155+
@apply bg-[var(--secondary-500)];
156156
}
157157

158158
.text-primary {
159-
@apply text-(--primary-500);
159+
@apply text-[var(--primary-500)];
160160
}
161161

162162
.text-secondary {
163-
@apply text-(--secondary-500);
163+
@apply text-[var(--secondary-500)];
164164
}
165165
}
166166

app/pages/blog/[...slug].vue

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,14 @@
2222
<template #fallback>
2323
<div class="animate-pulse">
2424
<span class="flex items-center gap-1">
25-
<div class="h-2 bg-(--text-200) rounded w-16 mb-4"></div>
26-
<div class="h-1 bg-(--text-200) rounded w-1 mb-4"></div>
27-
<div class="h-2 bg-(--text-200) rounded w-16 mb-4"></div>
25+
<div class="h-2 bg-[var(--text-200)] rounded w-16 mb-4"></div>
26+
<div class="h-1 bg-[var(--text-200)] rounded w-1 mb-4"></div>
27+
<div class="h-2 bg-[var(--text-200)] rounded w-16 mb-4"></div>
2828
</span>
29-
<div class="h-10 bg-(--text-200) rounded w-1/3 mb-4"></div>
30-
<div class="h-2 bg-(--text-200) rounded w-1/2 mb-4" v-for="i in 2"></div>
31-
<div class="h-10 bg-(--text-200) rounded w-1/3 mb-4"></div>
32-
<div class="h-4 bg-(--text-200) rounded w-2/3 mb-2" v-for="i in 10"></div>
29+
<div class="h-10 bg-[var(--text-200)] rounded w-1/3 mb-4"></div>
30+
<div class="h-2 bg-[var(--text-200)] rounded w-1/2 mb-4" v-for="i in 2"></div>
31+
<div class="h-10 bg-[var(--text-200)] rounded w-1/3 mb-4"></div>
32+
<div class="h-4 bg-[var(--text-200)] rounded w-2/3 mb-2" v-for="i in 10"></div>
3333
</div>
3434
</template>
3535
</Suspense>

0 commit comments

Comments
 (0)