Ku6epXBOCTuK/easy-png-tools2
1
0
Fork 0
mirror of https://github.com/Ku6epXBOCTuK/easy-png-tools.git synced 2026-09-15 05:56:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: fix lint css vars rules

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-09-08 07:02:54 +05:00
parent 5a4fbe7ac6
commit 2d24f51fd5
32 changed files with 270 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/routes/preview/+layout.svelte
+3 -14
View File
@@ -32,7 +32,6 @@
});
let crumb = $derived(toCrumb(page.url.pathname));
let status = $derived(toStatus(page.url.pathname));
const CRUMB: Record<string, string> = {
"/preview/list-tools": "CATALOG",
@@ -40,12 +39,6 @@
"/preview/tools/remove-background-png": "BACKGROUND REMOVER",
};
const STATUS: Record<string, string> = {
"/preview/list-tools": "LOCAL MODE / READY",
"/preview/tools/linear-gradient-png": "LIVE PREVIEW",
"/preview/tools/remove-background-png": "AUTO PROCESSING",
};
function toCrumb(path: string): string {
return (
"/ " +
@@ -54,10 +47,6 @@
"PREVIEW")
);
}
function toStatus(path: string): string {
return STATUS[path] ?? "AUTO PIPELINE";
}
</script>
<main class="preview-root" data-theme={theme}>
@@ -70,9 +59,9 @@
main {
background-color: var(--color-background);
background-image:
linear-gradient(var(--background-muted) 1px, #0000 1px),
linear-gradient(90deg, var(--background-muted) 1px, #0000 1px);
background-size: 32px 32px;
linear-gradient(var(--color-background-muted) 1px, #0000 1px),
linear-gradient(90deg, var(--color-background-muted) 1px, #0000 1px);
background-size: var(--space-xxxl) var(--space-xxxl);
min-height: 100vh;
}
</style>
web/src/routes/preview/+page.svelte
+15 -15
View File
@@ -60,40 +60,40 @@
<style>
.workspace {
max-width: 880px;
max-width: var(--size-content-max);
margin: 0 auto;
padding: 2.5rem 1.25rem 4rem;
padding: var(--space-page-top) var(--space-xl) var(--space-page-bottom);
display: flex;
flex-direction: column;
gap: 1.5rem;
gap: var(--space-xxl);
}
.ws-head {
display: flex;
flex-direction: column;
gap: 0.5rem;
gap: var(--space-m);
}
.ws-eyebrow {
font-family: var(--font-mono);
font-size: 12px;
letter-spacing: 0.18em;
color: var(--muted);
font-size: var(--font-size-s);
letter-spacing: var(--space-text-2xl);
color: var(--color-text-muted);
}
.ws-title {
margin: 0;
font-size: 2rem;
font-size: var(--font-size-2xl);
font-weight: 700;
color: var(--foreground);
color: var(--color-text);
}
.ws-lede {
margin: 0;
max-width: 56ch;
color: var(--muted);
font-size: 0.95rem;
color: var(--color-text-muted);
font-size: var(--font-size-l);
}
.ws-search {
display: flex;
gap: 0.5rem;
padding: 0.75rem 1rem;
gap: var(--space-m);
padding: var(--space-l) var(--space-xl);
align-items: center;
}
.ws-field {
@@ -102,7 +102,7 @@
.ws-results {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 0.75rem;
padding: 0.5rem 1rem 1rem;
gap: var(--space-l);
padding: var(--space-m) var(--space-xl);
}
</style>
web/src/routes/preview/kit/+page.svelte
+11 -9
View File
@@ -192,10 +192,12 @@
.showcase {
max-width: none;
margin: 0 auto;
padding: 2.5rem clamp(24px, 4vw, 72px) 4rem;
padding: var(--space-page-top)
clamp(var(--space-xxl), 4vw, var(--space-page-bottom))
var(--space-page-bottom);
display: flex;
flex-direction: column;
gap: 1.25rem;
gap: var(--space-xl);
}
.showcase-head {
display: flex;
@@ -204,9 +206,9 @@
}
.showcase-eyebrow {
font-family: var(--font-mono);
font-size: 12px;
letter-spacing: 0.18em;
color: var(--muted);
font-size: var(--font-size-s);
letter-spacing: var(--space-text-2xl);
color: var(--color-text-muted);
}
.stack {
display: flex;
@@ -215,13 +217,13 @@
.tool-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 0.75rem;
padding: 0.75rem 1rem;
gap: var(--space-l);
padding: var(--space-l) var(--space-xl);
}
.preview-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.75rem;
padding: 0.75rem 1rem;
gap: var(--space-l);
padding: var(--space-l) var(--space-xl);
}
</style>
web/src/routes/preview/list-tools/+page.svelte
+11 -9
View File
@@ -49,25 +49,27 @@
<style>
.catalog-page {
padding: 60px clamp(24px, 4vw, 72px) 72px;
padding: var(--space-page-top)
clamp(var(--space-xxl), 4vw, var(--space-page-bottom))
var(--space-page-bottom);
}
.catalog-groups {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 56px 28px;
gap: var(--space-page-top) var(--space-xxl);
}
.catalog-footer {
display: flex;
gap: 1.5rem;
gap: var(--space-xxl);
flex-wrap: wrap;
margin-top: 56px;
padding-top: 24px;
border-top: 1px solid var(--line);
margin-top: var(--space-page-top);
padding-top: var(--space-xxl);
border-top: 1px solid var(--color-border);
font: 10px var(--font-mono);
letter-spacing: 0.08em;
color: var(--muted);
letter-spacing: var(--space-text-l);
color: var(--color-text-muted);
}
@media (max-width: 800px) {
@media (--bp-tablet) {
.catalog-groups {
grid-template-columns: 1fr;
}
web/src/routes/preview/tools/[id]/+page.svelte
+4 -2
View File
@@ -31,8 +31,10 @@
<style>
.notfound {
max-width: 1680px;
max-width: var(--size-content-max-wide);
margin: 0 auto;
padding: 48px clamp(24px, 4vw, 72px) 72px;
padding: var(--space-page-top)
clamp(var(--space-xxl), 4vw, var(--space-page-bottom))
var(--space-page-bottom);
}
</style>