chore: install prettier
This commit is contained in:
@@ -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>Hà Nội
|
||||
<circle
|
||||
cx="12"
|
||||
cy="10"
|
||||
r="3"
|
||||
></circle></svg
|
||||
>Hà 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>
|
||||
|
||||
Reference in New Issue
Block a user