Skip to content

Commit eae792a

Browse files
bre97-webbre97-web
committed
chore: update test
1 parent 5e2ca0a commit eae792a

File tree

5 files changed

+64
-47
lines changed

5 files changed

+64
-47
lines changed

‎test/index.html

+49-28
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,32 @@
11
<!DOCTYPE html>
22
<html lang="en">
3+
34
<head>
45
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta
7+
name="viewport"
8+
content="width=device-width, initial-scale=1.0"
9+
>
610
<title>Document</title>
711
<style>
812
@keyframes move {
913
10% {
1014
left: 0;
1115
}
16+
1217
45% {
1318
left: calc(100% - 96px);
1419
}
20+
1521
55% {
1622
left: calc(100% - 96px);
1723
}
24+
1825
90% {
1926
left: 0;
2027
}
2128
}
29+
2230
.move {
2331
animation-name: move;
2432
animation-duration: 5000ms;
@@ -31,6 +39,7 @@
3139
position: relative;
3240
z-index: 0;
3341
}
42+
3443
#container::before {
3544
content: '';
3645
z-index: -1;
@@ -43,6 +52,7 @@
4352
background-color: azure;
4453
filter: blur(64px);
4554
}
55+
4656
#container::after {
4757
content: '';
4858
z-index: -1;
@@ -57,30 +67,34 @@
5767
}
5868
</style>
5969
</head>
70+
6071
<body>
6172

62-
<div id="container" class="max-w-6xl px-4 md:px-16 lg:px-32 xl:mx-auto flex flex-col justify-center [&>h1]:headline-large [&>h1+*]:border [&>h1+*]:border-outline [&>h1+*]:shape-medium [&>h1+*]:bg-surface-container-lowest [&>h1]:mt-16 [&>h1]:mb-8 [&>h1+*]:p-4 [&>h1+*]:overflow-auto py-32">
73+
<div
74+
id="container"
75+
class="max-w-6xl px-4 md:px-16 lg:px-32 xl:mx-auto flex flex-col justify-center [&>h1]:headline-large [&>h1+*]:border [&>h1+*]:border-outline [&>h1+*]:shape-medium [&>h1+*]:bg-surface-container-lowest [&>h1]:mt-16 [&>h1]:mb-8 [&>h1+*]:p-4 [&>h1+*]:overflow-auto py-32"
76+
>
6377
<p class="title-medium text-on-surface-variant">
6478
tailwindcss-material-tokens
6579
</p>
6680

6781
<h1>Typography</h1>
6882
<section class="[&>p]:text-on-surface">
69-
<p class="display-large">display-large</p>
70-
<p class="display-medium">display-medium</p>
71-
<p class="display-small">display-small</p>
72-
<p class="headline-large">headline-large</p>
73-
<p class="headline-medium">headline-medium</p>
74-
<p class="headline-small">headline-small</p>
75-
<p class="title-large">title-large</p>
76-
<p class="title-medium">title-medium</p>
77-
<p class="title-small">title-small</p>
78-
<p class="body-large">body-large</p>
79-
<p class="body-medium">body-medium</p>
80-
<p class="body-small">body-small</p>
81-
<p class="label-large">label-large</p>
82-
<p class="label-medium">label-medium</p>
83-
<p class="label-small">label-small</p>
83+
<p class="text-display-large">display-large</p>
84+
<p class="text-display-medium">display-medium</p>
85+
<p class="text-display-small">display-small</p>
86+
<p class="text-headline-large">headline-large</p>
87+
<p class="text-headline-medium">headline-medium</p>
88+
<p class="text-headline-small">headline-small</p>
89+
<p class="text-title-large">title-large</p>
90+
<p class="text-title-medium">title-medium</p>
91+
<p class="text-title-small">title-small</p>
92+
<p class="text-body-large">body-large</p>
93+
<p class="text-body-medium">body-medium</p>
94+
<p class="text-body-small">body-small</p>
95+
<p class="text-label-large">label-large</p>
96+
<p class="text-label-medium">label-medium</p>
97+
<p class="text-label-small">label-small</p>
8498
</section>
8599

86100
<h1>Elevation</h1>
@@ -94,7 +108,8 @@ <h1>Elevation</h1>
94108
</div>
95109

96110
<h1>Shape</h1>
97-
<div class="flex gap-10 items-stretch [&>div>span]:w-10 [&>div>span]:h-10 [&>div>span]:inline-block [&>div>span]:bg-primary">
111+
<div
112+
class="flex gap-10 items-stretch [&>div>span]:w-10 [&>div>span]:h-10 [&>div>span]:inline-block [&>div>span]:bg-primary">
98113
<div>
99114
<span class="shape-none"></span>
100115
</div>
@@ -155,7 +170,8 @@ <h1>Shape</h1>
155170
</div>
156171

157172
<h1>Color</h1>
158-
<div class="flex flex-col gap-4 [&>div]:flex [&>div>span]:label-large [&>div>span]:min-w-20 [&>div>span]:h-10 [&>div>span]:inline-flex [&>div>span]:items-center [&>div>span]:justify-center">
173+
<div
174+
class="flex flex-col gap-4 [&>div]:flex [&>div>span]:label-large [&>div>span]:min-w-20 [&>div>span]:h-10 [&>div>span]:inline-flex [&>div>span]:items-center [&>div>span]:justify-center">
159175
<div>
160176
<span class="bg-primary text-on-primary">P</span>
161177
<span class="bg-secondary text-on-secondary">S</span>
@@ -210,29 +226,34 @@ <h1>Color</h1>
210226
</div>
211227

212228
<h1>Motion</h1>
213-
<div class="grid grid-cols-1 md:grid-cols-2 [&>span]:w-24 [&>span]:h-10 overflow-clip relative [&>p]:grid md:[&>p]:place-content-center [&>p]:place-items-stretch">
229+
<div
230+
class="grid grid-cols-1 md:grid-cols-2 [&>span]:w-24 [&>span]:h-10 overflow-clip relative [&>p]:grid md:[&>p]:place-content-center [&>p]:place-items-stretch">
214231
<p>Emphasized</p>
215-
<span class="bg-primary-fixed-dim move motion-easing-emphasized">
232+
<span class="bg-primary-fixed-dim move animation-easing-emphasized">
216233
</span>
217234
<p>Emphasized Decelerate</p>
218-
<span class="bg-secondary-fixed-dim move motion-easing-emphasized-decelerate">
235+
<span class="bg-secondary-fixed-dim move animation-easing-emphasized-decelerate">
219236
</span>
220237
<p>Emphasized Accelerate</p>
221-
<span class="bg-tertiary-fixed-dim move motion-easing-emphasized-accelerate">
238+
<span class="bg-tertiary-fixed-dim move animation-easing-emphasized-accelerate">
222239
</span>
223240
<p>Standard</p>
224-
<span class="bg-primary-fixed-dim move motion-easing-standard">
241+
<span class="bg-primary-fixed-dim move animation-easing-standard">
225242
</span>
226243
<p>Standard Decelerate</p>
227-
<span class="bg-secondary-fixed-dim move motion-easing-standard-decelerate">
244+
<span class="bg-secondary-fixed-dim move animation-easing-standard-decelerate">
228245
</span>
229246
<p>Standard Accelerate</p>
230-
<span class="bg-tertiary-fixed-dim move motion-easing-standard-accelerate">
247+
<span class="bg-tertiary-fixed-dim move animation-easing-standard-accelerate">
231248
</span>
232249
</div>
233250
</div>
234251

235252

236-
<script type="module" src="./index.js"></script>
253+
<script
254+
type="module"
255+
src="./index.ts"
256+
></script>
237257
</body>
238-
</html>
258+
259+
</html>

‎test/index.js renamed to ‎test/index.ts

File renamed without changes.

‎test/tailwind.config.js

-19
This file was deleted.

‎test/tailwind.config.ts

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
// import { provideAll } from '../src/index'
2+
import { provideAll } from '../build/index'
3+
4+
const all = provideAll()
5+
6+
/** @type {import('tailwindcss').Config} */
7+
export default {
8+
content: [
9+
'./index.html'
10+
],
11+
plugins: [
12+
...all.allPlugins()
13+
],
14+
}
15+

‎test/vite.config.js renamed to ‎test/vite.config.ts

File renamed without changes.

0 commit comments

Comments
 (0)