chore: install prettier

This commit is contained in:
Viet An
2026-05-04 15:22:27 +07:00
parent 93d29ca7d8
commit bd58e2b847
267 changed files with 22950 additions and 13581 deletions

View File

@@ -3,7 +3,47 @@
class="relative w-full has-background-blue-95 rounded-lg is-clipped"
style="height: 360px"
>
<div class="absolute inset-0 w-full h-full opacity-20"><div class="absolute w-full border-t border-gray-300" style="top: 20%;"></div><div class="absolute w-full border-t border-gray-300" style="top: 40%;"></div><div class="absolute w-full border-t border-gray-300" style="top: 60%;"></div><div class="absolute w-full border-t border-gray-300" style="top: 80%;"></div><div class="absolute w-full border-t border-gray-300" style="top: 100%;"></div><div class="absolute h-full border-l border-gray-300" style="left: 20%;"></div><div class="absolute h-full border-l border-gray-300" style="left: 40%;"></div><div class="absolute h-full border-l border-gray-300" style="left: 60%;"></div><div class="absolute h-full border-l border-gray-300" style="left: 80%;"></div><div class="absolute h-full border-l border-gray-300" style="left: 100%;"></div>
<div class="absolute inset-0 w-full h-full opacity-20">
<div
class="absolute w-full border-t border-gray-300"
style="top: 20%"
></div>
<div
class="absolute w-full border-t border-gray-300"
style="top: 40%"
></div>
<div
class="absolute w-full border-t border-gray-300"
style="top: 60%"
></div>
<div
class="absolute w-full border-t border-gray-300"
style="top: 80%"
></div>
<div
class="absolute w-full border-t border-gray-300"
style="top: 100%"
></div>
<div
class="absolute h-full border-l border-gray-300"
style="left: 20%"
></div>
<div
class="absolute h-full border-l border-gray-300"
style="left: 40%"
></div>
<div
class="absolute h-full border-l border-gray-300"
style="left: 60%"
></div>
<div
class="absolute h-full border-l border-gray-300"
style="left: 80%"
></div>
<div
class="absolute h-full border-l border-gray-300"
style="left: 100%"
></div>
</div>
<div>
<div
@@ -25,7 +65,11 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle>
<circle
cx="12"
cy="10"
r="3"
></circle>
</svg>
</div>
<div
@@ -47,7 +91,11 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle>
<circle
cx="12"
cy="10"
r="3"
></circle>
</svg>
</div>
<div
@@ -69,7 +117,11 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle>
<circle
cx="12"
cy="10"
r="3"
></circle>
</svg>
</div>
<div
@@ -91,7 +143,11 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle>
<circle
cx="12"
cy="10"
r="3"
></circle>
</svg>
</div>
<div
@@ -113,7 +169,11 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle>
<circle
cx="12"
cy="10"
r="3"
></circle>
</svg>
</div>
<div
@@ -139,9 +199,7 @@
<polygon points="3 11 22 2 13 21 11 13 3 11"></polygon>
</svg>
</div>
<div
class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"
></div>
<div class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"></div>
</div>
</div>
<div
@@ -167,9 +225,7 @@
<polygon points="3 11 22 2 13 21 11 13 3 11"></polygon>
</svg>
</div>
<div
class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"
></div>
<div class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"></div>
</div>
</div>
<div
@@ -220,9 +276,7 @@
<polygon points="3 11 22 2 13 21 11 13 3 11"></polygon>
</svg>
</div>
<div
class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"
></div>
<div class="absolute -inset-1 rounded-full has-background-blue-60 animate-ping opacity-40"></div>
</div>
</div>
<div
@@ -244,7 +298,12 @@
<path
d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"
></path>
<circle cx="12" cy="10" r="3"></circle></svg> Nội
<circle
cx="12"
cy="10"
r="3"
></circle></svg
> Nội
</div>
</div>
</div>
@@ -314,7 +373,7 @@
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
}
.animate-ping {
animation: ping 1s cubic-bezier(0,0,0.2,1) infinite;
animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes ping {
0% {
@@ -339,67 +398,67 @@
@keyframes move-random-1 {
0% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
33% {
transform: translateX(30px) translateY(24px)
transform: translateX(30px) translateY(24px);
}
66% {
transform: translateX(60px) translateY(12px)
transform: translateX(60px) translateY(12px);
}
100% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
}
@keyframes move-random-2 {
0% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
23% {
transform: translateX(-20px) translateY(-36px)
transform: translateX(-20px) translateY(-36px);
}
46% {
transform: translateX(0) translateY(22px)
transform: translateX(0) translateY(22px);
}
75% {
transform: translateX(30px) translateY(-12px)
transform: translateX(30px) translateY(-12px);
}
100% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
}
@keyframes move-random-3 {
0% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
10% {
transform: translateX(-30px) translateY(-15px)
transform: translateX(-30px) translateY(-15px);
}
30% {
transform: translateX(-10px) translateY(26px)
transform: translateX(-10px) translateY(26px);
}
50% {
transform: translateX(48px) translateY(-28px)
transform: translateX(48px) translateY(-28px);
}
80% {
transform: translateX(17px) translateY(10px)
transform: translateX(17px) translateY(10px);
}
100% {
transform: translateX(0) translateY(0)
transform: translateX(0) translateY(0);
}
}
.border-2 {
@@ -442,13 +501,20 @@
opacity: 40%;
}
.shadow {
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
--tw-shadow:
0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow:
var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
var(--tw-shadow);
}
.backdrop-blur {
--tw-backdrop-blur: blur(8px);
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,)
var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,)
var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,)
var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,)
var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}
.transition-all {
transition-property: all;
@@ -474,4 +540,4 @@
.border-gray-300 {
border-color: var(--bulma-grey-85);
}
</style>
</style>