From a835088cc52040df2af7f779dc3318e760a3cc7b Mon Sep 17 00:00:00 2001 From: Kentai Radiquum Date: Tue, 26 Nov 2024 19:39:49 +0500 Subject: [PATCH] chore: make VK tile name similar on both of the tiles --- index.html | 8 ++-- static/tailwind.css | 96 ++++++++++++++++++++++----------------------- 2 files changed, 51 insertions(+), 53 deletions(-) diff --git a/index.html b/index.html index 697ef49..c8c984e 100644 --- a/index.html +++ b/index.html @@ -35,7 +35,7 @@
@@ -150,7 +150,7 @@

Music

-
+

I listen a lot of various music, but mainly listen to EDM \ Happy Hardcore \ Tech \ Rock \ Alternative. By artist like: S3RL, Camellia, t+pazolite, BTMH, Saint Motel, and more...

@@ -228,7 +228,7 @@

Contact

-
+

Feel free to reach out anytime! Ways to contact me via instant messengers are available in links section!

@@ -485,7 +485,7 @@
-

VK

+

VKontakte

radiquum

diff --git a/static/tailwind.css b/static/tailwind.css index c8b65e2..00d227d 100644 --- a/static/tailwind.css +++ b/static/tailwind.css @@ -698,6 +698,22 @@ video { margin-top: 0.25rem; } +.-ml-4 { + margin-left: -1rem; +} + +.-mt-8 { + margin-top: -2rem; +} + +.-mt-6 { + margin-top: -1.5rem; +} + +.-ml-2 { + margin-left: -0.5rem; +} + .block { display: block; } @@ -746,6 +762,11 @@ video { height: 100%; } +.h-fit { + height: -moz-fit-content; + height: fit-content; +} + .max-h-\[182px\] { max-height: 182px; } @@ -794,26 +815,16 @@ video { max-width: 50vw; } -.translate-y-\[var\(--transform-y\2c 0\)\] { - --tw-translate-y: var(--transform-y,0); - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); -} - -.translate-y-6 { - --tw-translate-y: 1.5rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); -} - -.-translate-y-6 { - --tw-translate-y: -1.5rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); -} - .-translate-y-full { --tw-translate-y: -100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } +.translate-y-\[var\(--transform-y\2c 0\)\] { + --tw-translate-y: var(--transform-y,0); + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + @keyframes bounce { 0%, 100% { transform: translateY(-25%); @@ -1000,11 +1011,6 @@ video { background-color: rgb(18 27 44 / var(--tw-bg-opacity)); } -.bg-bg-blue { - --tw-bg-opacity: 1; - background-color: rgb(146 207 245 / var(--tw-bg-opacity)); -} - .bg-bg-gray { --tw-bg-opacity: 1; background-color: rgb(38 38 38 / var(--tw-bg-opacity)); @@ -1020,6 +1026,11 @@ video { background-color: rgb(0 0 0 / var(--tw-bg-opacity)); } +.bg-blue-500 { + --tw-bg-opacity: 1; + background-color: rgb(59 130 246 / var(--tw-bg-opacity)); +} + .bg-green-500 { --tw-bg-opacity: 1; background-color: rgb(34 197 94 / var(--tw-bg-opacity)); @@ -1035,6 +1046,11 @@ video { background-color: rgb(234 88 12 / var(--tw-bg-opacity)); } +.bg-pink-600 { + --tw-bg-opacity: 1; + background-color: rgb(219 39 119 / var(--tw-bg-opacity)); +} + .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); @@ -1045,31 +1061,6 @@ video { background-color: rgb(234 179 8 / var(--tw-bg-opacity)); } -.bg-pink-600 { - --tw-bg-opacity: 1; - background-color: rgb(219 39 119 / var(--tw-bg-opacity)); -} - -.bg-blue-600 { - --tw-bg-opacity: 1; - background-color: rgb(37 99 235 / var(--tw-bg-opacity)); -} - -.bg-blue-500 { - --tw-bg-opacity: 1; - background-color: rgb(59 130 246 / var(--tw-bg-opacity)); -} - -.bg-blue-700 { - --tw-bg-opacity: 1; - background-color: rgb(29 78 216 / var(--tw-bg-opacity)); -} - -.bg-pink-500 { - --tw-bg-opacity: 1; - background-color: rgb(236 72 153 / var(--tw-bg-opacity)); -} - .bg-opacity-40 { --tw-bg-opacity: 0.4; } @@ -1172,6 +1163,11 @@ video { line-height: 1.75rem; } +.text-6xl { + font-size: 3.75rem; + line-height: 1; +} + .font-bold { font-weight: 700; } @@ -1207,10 +1203,6 @@ video { text-decoration-line: underline; } -.opacity-\[var\(--header-opacity\2c 0\)\] { - opacity: var(--header-opacity,0); -} - .brightness-50 { --tw-brightness: brightness(.5); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); @@ -1220,6 +1212,12 @@ video { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } +.backdrop-blur-lg { + --tw-backdrop-blur: blur(16px); + -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-\[border-color\] { transition-property: border-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);