Adjust glass styles and theme
This commit is contained in:
@@ -1,37 +1,37 @@
|
||||
@import "tailwindcss";
|
||||
@plugin "daisyui";
|
||||
@plugin "daisyui/theme" {
|
||||
name: "acid";
|
||||
name: "winter";
|
||||
default: true;
|
||||
prefersdark: false;
|
||||
color-scheme: "light";
|
||||
--color-base-100: oklch(98% 0 0);
|
||||
--color-base-200: oklch(95% 0 0);
|
||||
--color-base-300: oklch(91% 0 0);
|
||||
--color-base-content: oklch(0% 0 0);
|
||||
--color-primary: oklch(71.9% 0.357 330.759);
|
||||
--color-primary-content: oklch(14.38% 0.071 330.759);
|
||||
--color-secondary: oklch(73.37% 0.224 48.25);
|
||||
--color-secondary-content: oklch(14.674% 0.044 48.25);
|
||||
--color-accent: oklch(92.78% 0.264 122.962);
|
||||
--color-accent-content: oklch(18.556% 0.052 122.962);
|
||||
--color-neutral: oklch(21.31% 0.128 278.68);
|
||||
--color-neutral-content: oklch(84.262% 0.025 278.68);
|
||||
--color-info: oklch(60.72% 0.227 252.05);
|
||||
--color-info-content: oklch(12.144% 0.045 252.05);
|
||||
--color-success: oklch(85.72% 0.266 158.53);
|
||||
--color-success-content: oklch(17.144% 0.053 158.53);
|
||||
--color-warning: oklch(91.01% 0.212 100.5);
|
||||
--color-warning-content: oklch(18.202% 0.042 100.5);
|
||||
--color-error: oklch(64.84% 0.293 29.349);
|
||||
--color-error-content: oklch(12.968% 0.058 29.349);
|
||||
--color-base-100: oklch(100% 0 0);
|
||||
--color-base-200: oklch(97.466% 0.011 259.822);
|
||||
--color-base-300: oklch(93.268% 0.016 262.751);
|
||||
--color-base-content: oklch(41.886% 0.053 255.824);
|
||||
--color-primary: oklch(56.86% 0.255 257.57);
|
||||
--color-primary-content: oklch(91.372% 0.051 257.57);
|
||||
--color-secondary: oklch(42.551% 0.161 282.339);
|
||||
--color-secondary-content: oklch(88.51% 0.032 282.339);
|
||||
--color-accent: oklch(59.939% 0.191 335.171);
|
||||
--color-accent-content: oklch(11.988% 0.038 335.171);
|
||||
--color-neutral: oklch(19.616% 0.063 257.651);
|
||||
--color-neutral-content: oklch(83.923% 0.012 257.651);
|
||||
--color-info: oklch(88.127% 0.085 214.515);
|
||||
--color-info-content: oklch(17.625% 0.017 214.515);
|
||||
--color-success: oklch(80.494% 0.077 197.823);
|
||||
--color-success-content: oklch(16.098% 0.015 197.823);
|
||||
--color-warning: oklch(89.172% 0.045 71.47);
|
||||
--color-warning-content: oklch(17.834% 0.009 71.47);
|
||||
--color-error: oklch(73.092% 0.11 20.076);
|
||||
--color-error-content: oklch(14.618% 0.022 20.076);
|
||||
--radius-selector: 2rem;
|
||||
--radius-field: 2rem;
|
||||
--radius-box: 2rem;
|
||||
--size-selector: 0.3125rem;
|
||||
--size-field: 0.3125rem;
|
||||
--border: 0.5px;
|
||||
--depth: 1;
|
||||
--depth: 0;
|
||||
--noise: 0;
|
||||
}
|
||||
|
||||
@@ -43,25 +43,28 @@ body,
|
||||
|
||||
body {
|
||||
font-family: "IBM Plex Sans", sans-serif;
|
||||
background: #f9f6ef;
|
||||
background: #f7f3ea;
|
||||
}
|
||||
|
||||
.glass-panel {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
backdrop-filter: blur(5px);
|
||||
-webkit-backdrop-filter: blur(5px);
|
||||
}
|
||||
|
||||
.glass-card {
|
||||
background: rgba(255, 255, 255, 0.55);
|
||||
border: 1px solid rgba(255, 255, 255, 0.8);
|
||||
box-shadow:
|
||||
0 24px 40px rgba(27, 32, 58, 0.12),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.75);
|
||||
backdrop-filter: blur(24px) saturate(140%);
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.glass-pane {
|
||||
background: rgba(255, 255, 255, 0.42);
|
||||
border: 1px solid rgba(255, 255, 255, 0.7);
|
||||
box-shadow:
|
||||
0 16px 28px rgba(27, 32, 58, 0.08),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.6);
|
||||
backdrop-filter: blur(16px) saturate(130%);
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border: 1px solid rgba(255, 255, 255, 0.25);
|
||||
backdrop-filter: blur(8px);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
@@ -112,12 +115,6 @@ body {
|
||||
50% { transform: scaleY(1.2); opacity: 1; }
|
||||
}
|
||||
|
||||
.bg-mesh {
|
||||
background-image:
|
||||
radial-gradient(1200px 600px at 10% -10%, rgba(67, 56, 118, 0.2), transparent 60%),
|
||||
radial-gradient(900px 500px at 90% 10%, rgba(230, 184, 92, 0.18), transparent 60%),
|
||||
linear-gradient(180deg, #f9f6ef 0%, #f2efe7 55%, #ebe8df 100%);
|
||||
}
|
||||
|
||||
.reorder-move {
|
||||
transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
|
||||
@@ -138,3 +135,13 @@ body {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px) scale(0.98);
|
||||
}
|
||||
|
||||
.gradient-canvas {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
filter: saturate(1.1);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user