From 3e3910bfe13f4031486ad66f5f7535ecefef2295 Mon Sep 17 00:00:00 2001 From: thislight Date: Wed, 30 Oct 2024 23:59:15 +0800 Subject: [PATCH] material/theme: use color with alpha for shadow --- src/material/theme.css | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/src/material/theme.css b/src/material/theme.css index 1228ffd..f1ed6ed 100644 --- a/src/material/theme.css +++ b/src/material/theme.css @@ -82,25 +82,27 @@ --tutu-color-error-on-surface: #d32f2f; --tutu-color-inactive-on-surface: #757575; - --tutu-shadow-e1: 0px 1px 2px 0px #9e9e9e; + --tutu-color-shadow: rgba(0, 0, 0, 0.15); + + --tutu-shadow-e1: 0px 1px 2px 0px var(--tutu-color-shadow); /* Switch */ - --tutu-shadow-e2: 0px 2px 4px 0px #9e9e9e; + --tutu-shadow-e2: 0px 2px 4px 0px var(--tutu-color-shadow); /* (Resting) cards, raised button, quick entry / search bar */ - --tutu-shadow-e3: 0px 3px 6px 0px #9e9e9e; + --tutu-shadow-e3: 0px 3px 6px 0px var(--tutu-color-shadow); /* Refresh indicator, quick entry / search bar (scrolled) */ - --tutu-shadow-e4: 0px 4px 8px 0px #9e9e9e; + --tutu-shadow-e4: 0px 4px 8px 0px var(--tutu-color-shadow); /* App bar */ - --tutu-shadow-e6: 0px 6px 12px 0px #9e9e9e; + --tutu-shadow-e6: 0px 6px 12px 0px var(--tutu-color-shadow); /* Snack bar, FAB (resting) */ - --tutu-shadow-e8: 0px 8px 16px 0px #9e9e9e; + --tutu-shadow-e8: 0px 8px 16px 0px var(--tutu-color-shadow); /* Menu, (picked-up) cards, (pressed) raise button */ - --tutu-shadow-e9: 0px 9px 18px 0px #9e9e9e; + --tutu-shadow-e9: 0px 9px 18px 0px var(--tutu-color-shadow); /* Submenu (+1dp for each submenu) */ - --tutu-shadow-e12: 0px 12px 24px 0px #9e9e9e; + --tutu-shadow-e12: 0px 12px 24px 0px var(--tutu-color-shadow); /* (pressed) FAB */ - --tutu-shadow-e16: 0px 16px 32px 0px #9e9e9e; + --tutu-shadow-e16: 0px 16px 32px 0px var(--tutu-color-shadow); /* Nav drawer, right drawer, modal bottom sheet */ - --tutu-shadow-e24: 0px 24px 48px 0px #9e9e9e; + --tutu-shadow-e24: 0px 24px 48px 0px var(--tutu-color-shadow); /* Dialog, picker */ --tutu-anim-curve-std: cubic-bezier(0.4, 0, 0.2, 1);