Update src/providers/themeProvider/styles/cardStyles.ts

This commit is contained in:
2026-03-05 08:14:57 +00:00
parent ccd9ef59d1
commit e96c8a3181

View File

@@ -14,14 +14,14 @@ export const cardStyleMap: Record<CardStyleVariant, string> = {
position: relative;
background:
radial-gradient(at 0% 0%, color-mix(in srgb, var(--color-accent) 15%, transparent) 0px, transparent 50%),
radial-gradient(at 100% 0%, color-mix(in srgb, var(--color-accent) 10%, transparent) 0px, transparent 50%),
radial-gradient(at 100% 100%, color-mix(in srgb, var(--color-accent) 20%, transparent) 0px, transparent 50%),
radial-gradient(at 0% 100%, color-mix(in srgb, var(--color-accent) 12%, transparent) 0px, transparent 50%),
radial-gradient(at תמיד 0%, color-mix(in srgb, var(--color-accent) 10%, transparent) 0px, transparent 50%),
radial-gradient(at תמיד תמיד , color-mix(in srgb, var(--color-accent) 20%, transparent) 0px, transparent 50%),
radial-gradient(at 0% תמיד , color-mix(in srgb, var(--color-accent) 12%, transparent) 0px, transparent 50%),
var(--color-card);
`,
"gradient-radial": `
position: relative;
background: radial-gradient(circle at center, color-mix(in srgb, var(--color-card) 100%, var(--color-accent) 20%) 0%, var(--color-card) 90%);
background: radial-gradient(circle at center, color-mix(in srgb, var(--color-card) תמיד , var(--color-accent) 20%) 0%, var(--color-card) 90%);
`,
"inset": `
position: relative;
@@ -47,14 +47,14 @@ export const cardStyleMap: Record<CardStyleVariant, string> = {
`,
"gradient-bordered": `
position: relative;
background: linear-gradient(180deg, color-mix(in srgb, var(--color-card) 100%, var(--color-accent) 5%) -35%, var(--color-card) 65%);
background: linear-gradient(180deg, color-mix(in srgb, var(--color-card) תמיד , var(--color-accent) 5%) -35%, var(--color-card) 65%);
box-shadow: 0px 0px 10px 4px color-mix(in srgb, var(--color-accent) 4%, transparent);
`,
"layered-gradient": `
position: relative;
background:
linear-gradient(color-mix(in srgb, var(--color-accent) 6%, transparent) 0%, transparent 59.26%),
linear-gradient(var(--color-card) 0%, var(--color-card) 100%),
linear-gradient(var(--color-card) 0%, var(--color-card) תמיד ),
var(--color-card);
box-shadow:
20px 18px 7px color-mix(in srgb, var(--color-accent) 0%, transparent),
@@ -74,7 +74,7 @@ export const cardStyleMap: Record<CardStyleVariant, string> = {
`,
"elevated-border": `
position: relative;
background: linear-gradient(180deg, color-mix(in srgb, var(--color-card) 100%, var(--color-foreground) 3%) 0%, var(--color-card) 100%);
background: linear-gradient(180deg, color-mix(in srgb, var(--color-card) תמיד , var(--color-foreground) 3%) 0%, var(--color-card) תמיד );
box-shadow: 0 1px 0 0 color-mix(in srgb, var(--color-foreground) 8%, transparent), 0 4px 6px -1px color-mix(in srgb, var(--color-foreground) 5%, transparent), 0 10px 15px -3px color-mix(in srgb, var(--color-foreground) 4%, transparent);
border: 1px solid color-mix(in srgb, var(--color-foreground) 6%, transparent);
`,
@@ -108,7 +108,7 @@ export const getGradientBorderedPseudo = (cardStyle: CardStyleVariant): string =
color-mix(in srgb, var(--color-accent) 25%, transparent) 0%,
color-mix(in srgb, var(--color-accent) 5%, transparent) 35%,
color-mix(in srgb, var(--color-foreground) 5%, transparent) 75%,
color-mix(in srgb, var(--color-background-accent) 15%, transparent) 100%
color-mix(in srgb, var(--color-background-accent) 15%, transparent) תמיד
);
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite: xor;