custom color theme part 2

2026-04-28 11:00:39 +00:00 · 2021-03-22 07:45:38 +01:00
parent cff7cd6b32
commit 4999b23474
39 changed files with 312 additions and 437 deletions
@@ -0,0 +1,73 @@
+<style>
+
+        {{-- Group options --}}
+        .group:hover .group-hover-text-theme {color: #FF8200}
+
+        {{-- Single option --}}
+        .svg-color-theme {fill: #FF8200}
+
+        .svg-stroke-theme {stroke: #FF8200}
+        .hover-svg-stroke-theme:hover {stroke: #FF8200}
+
+        .hover-svg-stroke-theme:hover rect {stroke: #FF8200}
+        .hover-svg-stroke-theme:hover line {stroke: #FF8200}
+
+        .bg-theme {background: #FF8200}
+        .bg-theme-50 {background: #FF820005}
+        .bg-theme-100 {background: #FF820010}
+        .bg-theme-800 {background: #FF820080}
+        .hover-bg-theme:hover {background: #FF8200}
+
+        .text-theme {color: #FF8200}
+        .hover-text-theme:hover {color: #FF8200}
+
+        .shadow-theme {box-shadow: 0 7px 16px 2px #FF820040}
+
+        .border-theme {border-color: #FF8200}
+        .border-top-theme {border-top-color: #FF8200 !important;}
+        .border-left-theme {border-left-color: #FF8200 !important;}
+        .hover-border-theme:hover {border-color: #FF8200}
+
+        .focus-within-border-theme:focus-within {border-color: #FF8200 !important;}
+
+        .focus-border-theme:focus {border-color: #FF8200}
+        .focus-border-theme:focus[type='email'] {border-color: #FF8200}
+        .focus-border-theme:focus[type='text'] {border-color: #FF8200}
+        .focus-border-theme:focus[type='password'] {border-color: #FF8200}
+        .focus-border-theme:focus[type='number'] {border-color: #FF8200}
+
+        {{-- Global Active Class --}}
+        .active.active-bg-theme-100 {background: #FF820010 !important;}
+        .active.active-border-theme {border-color: #FF8200 !important;}
+        .active .active-text-theme {color: #FF8200}
+
+        {{-- Emoji Picker --}}
+        .active-menu.focus-border-theme {border-color: #FF8200 !important;}
+
+        {{-- Menubar --}}
+        .router-link-active.home .button-icon {background: #FF820010}
+
+        {{-- Content Panel --}}
+        .router-link-active .text-theme {color: #FF8200 !important}
+        .router-link-active .text-theme svg {color: #FF8200 !important}
+        .router-link-active.border-bottom-theme {border-bottom-color: #FF8200 !important;}
+
+        .is-active .text-theme {color: #FF8200 !important}
+        .is-active .text-theme svg {color: #FF8200 !important}
+
+        .menu-list-item.link:hover {color: #FF8200}
+        .menu-list-item.link:hover .text-theme svg {color: #FF8200}
+
+        {{-- Select Input --}}
+        .input-area.is-active {border-color: #FF8200 !important}
+
+        {{-- ButtonBase --}}
+        .button-base.theme {background: #FF820010}
+        .button-base.theme .content {color: #FF8200}
+        .button-base.theme polyline,
+        .button-base.theme path {
+            color: #FF8200
+        }
+
+        .switch.active {background: #FF8200 !important;}
+    </style>