diff --git a/misc/theme-flexcolor/Makefile b/misc/theme-flexcolor/Makefile index 4ff210b34..6498db4ce 100644 --- a/misc/theme-flexcolor/Makefile +++ b/misc/theme-flexcolor/Makefile @@ -1,5 +1,5 @@ PLUGIN_NAME= theme-flexcolor -PLUGIN_VERSION= 1.0 +PLUGIN_VERSION= 1.1 PLUGIN_COMMENT= Theme with 3 different color schemes: black as default, light and dark-light PLUGIN_MAINTAINER= iengels@web.de PLUGIN_NO_ABI= yes diff --git a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/black/default_scheme.css b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/black/default_scheme.css index 2ee93ae03..03b33f8f5 100644 --- a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/black/default_scheme.css +++ b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/black/default_scheme.css @@ -18,7 +18,7 @@ --stdborderprimary: #336CDF; /* standard border with accent*/ --stdborderinverse: #000000; /* standard border with accent*/ --stdborder50bright: #A1A1A1; /* standard border with accent*/ - --badgeback: #E6E6E6; /* badge background & progress-bar & blockquote*/ + --badgeback: #1F62C1; /* badge background & progress-bar & blockquote*/ --progressbar: #D4D4D4; /* progress-bar*/ --token: #AF3604; /* background token */ --highlighted: #FFFFFF; /* highlighted element */ @@ -57,7 +57,7 @@ --txtboxbackhover: #000000; --txtboxbackactive: #000000; --txtboxbackdisabled: #000000; - --txtboxbacktoken: #E65C00; + --txtboxbacktoken: #1F62C1; --txtboxbackdel: #FF5252; /* only tokenize, pending delete */ --txtboxbackdismiss: #F2F7FD; /* only tokenize, dismiss */ /* border */ @@ -87,6 +87,8 @@ /* special characters */ --link: #FA6121; /* OPNsense text login and links */ --linkhover: #E04605; /* OPNsense text login and links hover */ + --colorcheckbox: #388E3C; /* background color checkbox */ + --colorradio: #FF3333; /* background color radio button */ /* accents */ --primary: #336CDF; /* primary accent */ --primaryhover: #608DE6; /* primary accent hover */ @@ -97,7 +99,27 @@ --warning: #D66E12; /* warning accent */ --warninghover: #ED862B; /* warning accent hover */ --danger: #FF5252; /* danger accent */ - --dangerhover: #BE2326FF8585; /* danger accent hover */ + --dangerhover: #E64949; /* danger accent hover */ + /* alert messages */ + /* alert*/ + --alertback: #000000; + --alertborder: transparent; + /* alert success */ + --alertsuccessfore: #E6E6E6; + --alertsuccessback: #000000; + --alertsuccessborder: #36D93E; + /* alert info */ + --alertinfofore: #E6E6E6; + --alertinfoback: #000000; + --alertinfoborder: #369DD9; + /* alert warning */ + --alertwarningfore: #E6E6E6; + --alertwarningback: #000000; + --alertwarningborder: #D98236; + /* alert danger */ + --alertdangerfore: #E6E6E6; + --alertdangerback: #000000; + --alertdangerborder: #D93636; /* buttons (complete (independent) */ /* unselected */ --btnfore: #E6E6E6; /* textcolor */ diff --git a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/darklight/default_scheme.css b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/darklight/default_scheme.css index 5522478e3..7ff804840 100644 --- a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/darklight/default_scheme.css +++ b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/darklight/default_scheme.css @@ -18,7 +18,7 @@ --stdborderprimary: #FA6121; /* standard border with accent*/ --stdborderinverse: #647D9B; /* standard border with accent*/ --stdborder50bright: #A2B1C3; /* standard border with accent*/ - --badgeback: #FFC59E; /* badge background & progress-bar & blockquote*/ + --badgeback: #AD7A7A; /* badge background & progress-bar & blockquote*/ --progressbar: #181E25; /* progress-bar*/ --token: #FA6121; /* background token */ --highlighted: #FFFFFF; /* highlighted element */ @@ -57,7 +57,7 @@ --txtboxbackhover: #F2F7FD; --txtboxbackactive: #F2F7FD; --txtboxbackdisabled: #181E25; - --txtboxbacktoken: #FFC59E; + --txtboxbacktoken: #AD7A7A; --txtboxbackdel: #DB393D; /* only tokenize, pending delete */ --txtboxbackdismiss: #F2F7FD; /* only tokenize, dismiss */ /* border */ @@ -87,6 +87,8 @@ /* special characters */ --link: #FA6121; /* OPNsense text login and links */ --linkhover: #E04605; /* OPNsense text login and links hover */ + --colorcheckbox: #39E63C; /* background color checkbox */ + --colorradio: #0089D0; /* background color radio button */ /* accents */ --primary: #FA6121; /* primary accent */ --primaryhover: #E04605; /* primary accent hover */ @@ -98,6 +100,26 @@ --warninghover: #B87A00; /* warning accent hover */ --danger: #DB393D; /* danger accent */ --dangerhover: #BE2326; /* danger accent hover */ + /* alert messages */ + /* alert*/ + --alertback: #181E25; + --alertborder: transparent; + /* alert success */ + --alertsuccessfore: #00E604; + --alertsuccessback: #181E25; + --alertsuccessborder: #F2F7FD; + /* alert info */ + --alertinfofore: #0099E6; + --alertinfoback: #181E25; + --alertinfoborder: #F2F7FD; + /* alert warning */ + --alertwarningfore: #E69900; + --alertwarningback: #181E25; + --alertwarningborder: #F2F7FD; + /* alert danger */ + --alertdangerfore: #E60004; + --alertdangerback: #181E25; + --alertdangerborder: #F2F7FD; /* buttons (complete (independent) */ /* unselected */ --btnfore: #181E25; /* textcolor */ diff --git a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/light/default_scheme.css b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/light/default_scheme.css index 8d6de04f7..d4ad8b34e 100644 --- a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/light/default_scheme.css +++ b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/color_schemes/light/default_scheme.css @@ -18,7 +18,7 @@ --stdborderprimary: #336CDF; /* standard border with accent*/ --stdborderinverse: #131313; /* standard border with accent*/ --stdborder50bright: #A1A1A1; /* standard border with accent*/ - --badgeback: #FFC59E; /* badge background & progress-bar & blockquote*/ + --badgeback: #8DA6BD; /* badge background & progress-bar & blockquote*/ --progressbar: #131313; /* progress-bar*/ --token: #71ADF4; /* background token */ --highlighted: #131313; /* highlighted element */ @@ -57,7 +57,7 @@ --txtboxbackhover: #F5F5F5; --txtboxbackactive: #F5F5F5; --txtboxbackdisabled: #F5F5F5; - --txtboxbacktoken: #71ADF4; + --txtboxbacktoken: #8DA6BD; --txtboxbackdel: #FC2529; /* only tokenize, pending delete */ --txtboxbackdismiss: #F5F5F5; /* only tokenize, dismiss */ /* border */ @@ -87,6 +87,8 @@ /* special characters */ --link: #FA6121; /* OPNsense text login and links */ --linkhover: #E04605; /* OPNsense text login and links hover */ + --colorcheckbox: #28A839; /* background color checkbox */ + --colorradio: #1066CC; /* background color radio button */ /* accents */ --primary: #1066CC; /* primary accent */ --primaryhover: #0C4E9C; /* primary accent hover */ @@ -98,6 +100,26 @@ --warninghover: #D97B03; /* warning accent hover */ --danger: #FC2529; /* danger accent */ --dangerhover: #EC0308; /* danger accent hover */ + /* alert messages */ + /* alert*/ + --alertback: #F5F5F5; + --alertborder: transparent; + /* alert success */ + --alertsuccessfore: #000000; + --alertsuccessback: #D4FAD9; + --alertsuccessborder: #28A839; + /* alert info */ + --alertinfofore: #000000; + --alertinfoback: #D4F1FA; + --alertinfoborder: #10A6D8; + /* alert warning */ + --alertwarningfore: #000000; + --alertwarningback: #F2E3CE; + --alertwarningborder: #FC9510; + /* alert danger */ + --alertdangerfore: #000000; + --alertdangerback: #F2CECE; + --alertdangerborder: #FC2529; /* buttons (complete (independent) */ /* unselected */ --btnfore: #454545; /* textcolor */ diff --git a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/css/main.css.shadow b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/css/main.css.shadow index 6c2eaad9c..2a13a6df9 100644 --- a/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/css/main.css.shadow +++ b/misc/theme-flexcolor/src/opnsense/www/themes/flexcolor/build/css/main.css.shadow @@ -119,10 +119,14 @@ input::-moz-focus-inner { padding: 0; } input { line-height: normal; } -input[type=checkbox], +input[type=checkbox] { + box-sizing: border-box; + padding: 0; + accent-color: var(--colorcheckbox); } input[type=radio] { box-sizing: border-box; - padding: 0; } + padding: 0; + accent-color: var(--colorradio); } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; } @@ -3996,14 +4000,11 @@ a.thumbnail:focus, a.thumbnail.active { border-color: var(--primary); } .alert { - background-color: var(--pback); - color: var(--pfore); padding: 15px; + background-color: var(--alertback); margin-bottom: 20px; - border: 2px solid transparent; - border-radius: 3px; - -webkit-box-shadow: inset 0 1px 0 var(--boxshadow), 0 1px 0 var(--boxshadow); - box-shadow: inset 0 1px 0 var(--boxshadow), 0 1px 0 var(--boxshadow); } + border: 2px solid var(--alertborder); + border-radius: 3px; } .alert h4 { margin-top: 0; color: inherit; } @@ -4024,25 +4025,33 @@ a.thumbnail.active { right: -21px; color: inherit; } .alert-success { - border-color: var(--success); } + color: var(--alertsuccessfore); + background-color: var(--alertsuccessback); + border-color: var(--alertsuccessborder); } .alert-success hr { border-top-color: var(--pfore); } .alert-success .alert-link { color: var(--primary); } .alert-info { - border-color: var(--info); } + color: var(--alertinfofore); + background-color: var(--alertinfoback); + border-color: var(--alertinfoborder); } .alert-info hr { border-top-color: var(--pfore); } .alert-info .alert-link { color: var(--info); } .alert-warning { - border-color: var(--warning); } + color: var(--alertwarningfore); + background-color: var(--alertwarningback); + border-color: var(--alertwarningborder); } .alert-warning hr { border-top-color: var(--pfore); } .alert-warning .alert-link { color: var(--primary); } .alert-danger { - border-color: var(--danger); } + color: var(--alertdangerfore); + background-color: var(--alertdangerback); + border-color: var(--alertdangerborder); } .alert-danger hr { border-top-color: var(--pfore); } .alert-danger .alert-link {