style(page5): add css var.

uiwjs · Apr 25, 2023 · 1aa77e5 · 1aa77e5
1 parent 163aa53
commit 1aa77e5
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/pages/page5/README.md b/pages/page5/README.md
@@ -151,6 +151,7 @@ const css = {
   '--login-btn-focus': '#3648c6',
   '--login-btn-hover': '#3648c6',
   '--login-btn-active': '#5b6ef4',
+  '--login-footer': '#ffffff99',
 };
 
 const Demo = () => <Login style={{ height: 380, ...css }} />;
@@ -174,6 +175,7 @@ Use css variables to override default color values
   --login-btn-focus: #f24353;
   --login-btn-hover: #f24353;
   --login-btn-active: #d82a3b;
+  --login-footer: #ffffff99;
 }
 ```
 
@@ -208,6 +210,7 @@ Custom CSS style overrides
   --login-btn-focus: #f24353;
   --login-btn-hover: #f24353;
   --login-btn-active: #d82a3b;
+  --login-footer: #ffffff99;
 }
 [data-color-mode*='light'] .login-page5 {
   --login-bg: #f45b69;
@@ -222,6 +225,7 @@ Custom CSS style overrides
   --login-btn-focus: #f24353;
   --login-btn-hover: #f24353;
   --login-btn-active: #d82a3b;
+  --login-footer: #ffffff99;
 }
 ```
 

diff --git a/pages/page5/src/index.css b/pages/page5/src/index.css
@@ -11,6 +11,7 @@
   --login-btn-focus: #f24353;
   --login-btn-hover: #f24353;
   --login-btn-active: #d82a3b;
+  --login-footer: #ffffff99;
 }
 [data-color-mode*='light'] .login-page5 {
   --login-bg: #f45b69;
@@ -25,6 +26,7 @@
   --login-btn-focus: #f24353;
   --login-btn-hover: #f24353;
   --login-btn-active: #d82a3b;
+  --login-footer: #ffffff99;
 }
 
 .login-page5 {
@@ -163,9 +165,10 @@
   box-shadow: 0 0 3px 0 var(--login-btn-focus);
 }
 .login-page5 > footer a {
-  color: rgba(255, 255, 255, 0.6);
+  --login-footer: #ffffff99;
+  color: var(--login-footer);
 }
 .login-page5 > footer {
-  color: rgba(255, 255, 255, 0.6);
+  color: var(--login-footer);
   padding-top: 2rem;
 }