etkr4k/bedolaga-cabinet
1
0
Fork 0
mirror of https://github.com/chillpadclub/bedolaga-cabinet.git synced 2026-07-28 17:43:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(tooling): biome 2.3+ — нативный tailwind-парсер и lineEnding auto

Browse Source 
По фичам Biome v2.3: css.parser.tailwindDirectives снимает исключение
CSS из Biome (globals.css снова под формат-контролем; линт CSS выключен
override-ом — tailwind-функции theme() и пр. правила пока не знают),
lineEnding auto повторяет поведение prettier endOfLine: auto (CRLF в
Windows-чекаутах, LF на CI). Однократный формат-дифф globals.css
45+/45- — расхождения CSS-форматтера Biome с Prettier.
This commit is contained in:
kewldan
2026-07-12 00:28:42 +03:00
parent cf3837163e
commit c03182e6cf
2 changed files with 61 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
biome.json
View File

@@ -1,14 +1,14 @@
{ {
"$schema": "https://biomejs.dev/schemas/2.5.3/schema.json", "$schema": "https://biomejs.dev/schemas/2.5.3/schema.json",
"files": { "files": {
"includes": ["**", "!dist", "!node_modules", "!public", "!package-lock.json", "!**/*.css"] "includes": ["**", "!dist", "!node_modules", "!public", "!package-lock.json"]
}, },
"formatter": { "formatter": {
"enabled": true, "enabled": true,
"indentStyle": "space", "indentStyle": "space",
"indentWidth": 2, "indentWidth": 2,
"lineWidth": 100, "lineWidth": 100,
"lineEnding": "lf" "lineEnding": "auto"
}, },
"javascript": { "javascript": {
"formatter": { "formatter": {
@@ -48,5 +48,18 @@
"assist": { "assist": {
"enabled": false "enabled": false
}, },
"plugins": ["./biome-plugins/telegram-webview-guards.grit"] "plugins": ["./biome-plugins/telegram-webview-guards.grit"],
"css": {
"parser": {
"tailwindDirectives": true
}
},
"overrides": [
{
"includes": ["**/*.css"],
"linter": {
"enabled": false
}
}
]
} }

90
src/styles/globals.css
View File

@@ -8,15 +8,15 @@
of the font stacks fixes every flag everywhere without touching any markup of the font stacks fixes every flag everywhere without touching any markup
and without affecting any other text. Root fix, not a per-component wrap. */ and without affecting any other text. Root fix, not a per-component wrap. */
@font-face { @font-face {
font-family: 'Twemoji Country Flags'; font-family: "Twemoji Country Flags";
unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E007F; unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E007F;
src: url('/fonts/TwemojiCountryFlags.woff2') format('woff2'); src: url("/fonts/TwemojiCountryFlags.woff2") format("woff2");
font-display: swap; font-display: swap;
} }
/* Animated gradient border — @property enables CSS-only angle animation */ /* Animated gradient border — @property enables CSS-only angle animation */
@property --border-angle { @property --border-angle {
syntax: '<angle>'; syntax: "<angle>";
initial-value: 0deg; initial-value: 0deg;
inherits: false; inherits: false;
} }
@@ -28,13 +28,13 @@
background: background:
linear-gradient(var(--_bg), var(--_bg)) padding-box, linear-gradient(var(--_bg), var(--_bg)) padding-box,
conic-gradient( conic-gradient(
from var(--border-angle), from var(--border-angle),
var(--_accent) 0%, var(--_accent) 0%,
transparent 25%, transparent 25%,
transparent 75%, transparent 75%,
var(--_accent) 100% var(--_accent) 100%
) )
border-box; border-box;
animation: border-rotate var(--border-duration, 3s) linear infinite; animation: border-rotate var(--border-duration, 3s) linear infinite;
} }
@@ -295,7 +295,7 @@
/* Global Noise Texture — no mix-blend-mode to avoid fullscreen GPU compositing */ /* Global Noise Texture — no mix-blend-mode to avoid fullscreen GPU compositing */
body::before { body::before {
content: ''; content: "";
position: fixed; position: fixed;
inset: 0; inset: 0;
z-index: -1; z-index: -1;
@@ -450,7 +450,7 @@ img.twemoji {
/* CSS Spotlight Effect via pseudo-element */ /* CSS Spotlight Effect via pseudo-element */
.bento-card-hover::after { .bento-card-hover::after {
content: ''; content: "";
position: absolute; position: absolute;
inset: 0; inset: 0;
background: radial-gradient(circle at top, rgba(255, 255, 255, 0.06), transparent 60%); background: radial-gradient(circle at top, rgba(255, 255, 255, 0.06), transparent 60%);
@@ -625,7 +625,7 @@ img.twemoji {
/* Remove tap highlight and focus outline on mobile */ /* Remove tap highlight and focus outline on mobile */
button, button,
a, a,
[role='button'] { [role="button"] {
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
outline: none; outline: none;
} }
@@ -633,13 +633,13 @@ img.twemoji {
/* Only show focus ring for keyboard navigation */ /* Only show focus ring for keyboard navigation */
button:focus-visible, button:focus-visible,
a:focus-visible, a:focus-visible,
[role='button']:focus-visible { [role="button"]:focus-visible {
@apply ring-2 ring-accent-500/50 ring-offset-2 ring-offset-dark-900; @apply ring-2 ring-accent-500/50 ring-offset-2 ring-offset-dark-900;
} }
.light button:focus-visible, .light button:focus-visible,
.light a:focus-visible, .light a:focus-visible,
.light [role='button']:focus-visible { .light [role="button"]:focus-visible {
@apply ring-offset-champagne-100; @apply ring-offset-champagne-100;
} }
@@ -1181,11 +1181,11 @@ img.twemoji {
/* Glow effects */ /* Glow effects */
.glow-accent { .glow-accent {
box-shadow: 0 0 20px theme('colors.accent.500 / 30%'); box-shadow: 0 0 20px theme("colors.accent.500 / 30%");
} }
.glow-success { .glow-success {
box-shadow: 0 0 20px theme('colors.success.500 / 30%'); box-shadow: 0 0 20px theme("colors.success.500 / 30%");
} }
/* Blur backdrop */ /* Blur backdrop */
@@ -1229,9 +1229,9 @@ img.twemoji {
.shimmer { .shimmer {
background: linear-gradient( background: linear-gradient(
90deg, 90deg,
theme('colors.dark.800') 0%, theme("colors.dark.800") 0%,
theme('colors.dark.700') 50%, theme("colors.dark.700") 50%,
theme('colors.dark.800') 100% theme("colors.dark.800") 100%
); );
background-size: 200% 100%; background-size: 200% 100%;
animation: shimmer 1.5s infinite; animation: shimmer 1.5s infinite;
@@ -1240,9 +1240,9 @@ img.twemoji {
.light .shimmer { .light .shimmer {
background: linear-gradient( background: linear-gradient(
90deg, 90deg,
theme('colors.champagne.200') 0%, theme("colors.champagne.200") 0%,
theme('colors.champagne.300') 50%, theme("colors.champagne.300") 50%,
theme('colors.champagne.200') 100% theme("colors.champagne.200") 100%
); );
} }
@@ -1256,7 +1256,7 @@ img.twemoji {
} }
/* Color picker range input styling */ /* Color picker range input styling */
input[type='range'] { input[type="range"] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
height: 12px; height: 12px;
@@ -1267,13 +1267,13 @@ input[type='range'] {
/* Desktop: smaller track */ /* Desktop: smaller track */
@media (min-width: 640px) { @media (min-width: 640px) {
input[type='range'] { input[type="range"] {
height: 8px; height: 8px;
border-radius: 4px; border-radius: 4px;
} }
} }
input[type='range']::-webkit-slider-thumb { input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
width: 24px; width: 24px;
@@ -1290,26 +1290,26 @@ input[type='range']::-webkit-slider-thumb {
box-shadow 0.15s ease; box-shadow 0.15s ease;
} }
input[type='range']::-webkit-slider-thumb:hover { input[type="range"]::-webkit-slider-thumb:hover {
transform: scale(1.1); transform: scale(1.1);
box-shadow: box-shadow:
0 3px 8px rgba(0, 0, 0, 0.4), 0 3px 8px rgba(0, 0, 0, 0.4),
0 0 0 2px rgba(255, 255, 255, 0.2); 0 0 0 2px rgba(255, 255, 255, 0.2);
} }
input[type='range']::-webkit-slider-thumb:active { input[type="range"]::-webkit-slider-thumb:active {
transform: scale(0.95); transform: scale(0.95);
} }
/* Desktop: smaller thumb */ /* Desktop: smaller thumb */
@media (min-width: 640px) { @media (min-width: 640px) {
input[type='range']::-webkit-slider-thumb { input[type="range"]::-webkit-slider-thumb {
width: 18px; width: 18px;
height: 18px; height: 18px;
} }
} }
input[type='range']::-moz-range-thumb { input[type="range"]::-moz-range-thumb {
width: 24px; width: 24px;
height: 24px; height: 24px;
border-radius: 50%; border-radius: 50%;
@@ -1324,7 +1324,7 @@ input[type='range']::-moz-range-thumb {
box-shadow 0.15s ease; box-shadow 0.15s ease;
} }
input[type='range']::-moz-range-thumb:hover { input[type="range"]::-moz-range-thumb:hover {
transform: scale(1.1); transform: scale(1.1);
box-shadow: box-shadow:
0 3px 8px rgba(0, 0, 0, 0.4), 0 3px 8px rgba(0, 0, 0, 0.4),
@@ -1333,25 +1333,25 @@ input[type='range']::-moz-range-thumb:hover {
/* Desktop: smaller thumb */ /* Desktop: smaller thumb */
@media (min-width: 640px) { @media (min-width: 640px) {
input[type='range']::-moz-range-thumb { input[type="range"]::-moz-range-thumb {
width: 18px; width: 18px;
height: 18px; height: 18px;
} }
} }
/* Hide number input spinners for cleaner look */ /* Hide number input spinners for cleaner look */
input[type='number']::-webkit-inner-spin-button, input[type="number"]::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button { input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
margin: 0; margin: 0;
} }
input[type='number'] { input[type="number"] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }
/* Custom checkbox styling - more visible */ /* Custom checkbox styling - more visible */
input[type='checkbox'] { input[type="checkbox"] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
width: 1.25rem; width: 1.25rem;
@@ -1367,13 +1367,13 @@ input[type='checkbox'] {
flex-shrink: 0; flex-shrink: 0;
} }
input[type='checkbox']:checked { input[type="checkbox"]:checked {
background-color: rgb(var(--color-accent-500)); background-color: rgb(var(--color-accent-500));
border-color: rgb(var(--color-accent-500)); border-color: rgb(var(--color-accent-500));
} }
input[type='checkbox']:checked::after { input[type="checkbox"]:checked::after {
content: ''; content: "";
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 45%; top: 45%;
@@ -1384,12 +1384,12 @@ input[type='checkbox']:checked::after {
transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg);
} }
input[type='checkbox']:focus { input[type="checkbox"]:focus {
outline: none; outline: none;
box-shadow: 0 0 0 2px rgba(var(--color-accent-500), 0.3); box-shadow: 0 0 0 2px rgba(var(--color-accent-500), 0.3);
} }
input[type='checkbox']:hover:not(:checked) { input[type="checkbox"]:hover:not(:checked) {
border-color: rgb(var(--color-dark-500)); border-color: rgb(var(--color-dark-500));
background-color: rgb(var(--color-dark-600)); background-color: rgb(var(--color-dark-600));
} }
@@ -1477,17 +1477,17 @@ input[type='checkbox']:hover:not(:checked) {
background-color: rgb(var(--color-dark-700)); background-color: rgb(var(--color-dark-700));
} }
.light input[type='checkbox'] { .light input[type="checkbox"] {
border-color: rgb(var(--color-champagne-400)); border-color: rgb(var(--color-champagne-400));
background-color: rgb(var(--color-champagne-100)); background-color: rgb(var(--color-champagne-100));
} }
.light input[type='checkbox']:checked { .light input[type="checkbox"]:checked {
background-color: rgb(var(--color-accent-500)); background-color: rgb(var(--color-accent-500));
border-color: rgb(var(--color-accent-500)); border-color: rgb(var(--color-accent-500));
} }
.light input[type='checkbox']:hover:not(:checked) { .light input[type="checkbox"]:hover:not(:checked) {
border-color: rgb(var(--color-champagne-500)); border-color: rgb(var(--color-champagne-500));
background-color: rgb(var(--color-champagne-200)); background-color: rgb(var(--color-champagne-200));
} }
@@ -1523,7 +1523,7 @@ input[type='checkbox']:hover:not(:checked) {
} }
.onboarding-tooltip::before { .onboarding-tooltip::before {
content: ''; content: "";
@apply absolute h-3 w-3 border-l border-t border-accent-500/30 bg-dark-900; @apply absolute h-3 w-3 border-l border-t border-accent-500/30 bg-dark-900;
transform: rotate(45deg); transform: rotate(45deg);
} }