diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css index 7a5c43a86..2a34fb40f 100644 --- a/public/themes/arya-blue/theme.css +++ b/public/themes/arya-blue/theme.css @@ -440,6 +440,7 @@ border-color: #64B5F6; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #383838; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #383838; +} .p-editor-container .p-editor-toolbar { border: 1px solid #383838; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #383838; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #383838; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css index 20100a210..7613edbaa 100644 --- a/public/themes/arya-green/theme.css +++ b/public/themes/arya-green/theme.css @@ -440,6 +440,7 @@ border-color: #81C784; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #383838; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #383838; +} .p-editor-container .p-editor-toolbar { border: 1px solid #383838; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #383838; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #383838; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css index 937954ac1..9252b3e99 100644 --- a/public/themes/arya-orange/theme.css +++ b/public/themes/arya-orange/theme.css @@ -440,6 +440,7 @@ border-color: #FFD54F; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #383838; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #383838; +} .p-editor-container .p-editor-toolbar { border: 1px solid #383838; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #383838; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #383838; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css index 8b8711c25..4eb834e40 100644 --- a/public/themes/arya-purple/theme.css +++ b/public/themes/arya-purple/theme.css @@ -440,6 +440,7 @@ border-color: #BA68C8; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #383838; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #383838; +} .p-editor-container .p-editor-toolbar { border: 1px solid #383838; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #121212; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #383838; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #383838; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #383838; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css index f5db5f110..732ec9bca 100644 --- a/public/themes/bootstrap4-dark-blue/theme.css +++ b/public/themes/bootstrap4-dark-blue/theme.css @@ -440,6 +440,7 @@ border-color: #8dd0ff; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #20262e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #3f4b5b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #3f4b5b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #3f4b5b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #3f4b5b; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #20262e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #3f4b5b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #3f4b5b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #3f4b5b; +} .p-password-panel { padding: 1.25rem; diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css index 5be45a856..5bcd2c536 100644 --- a/public/themes/bootstrap4-dark-purple/theme.css +++ b/public/themes/bootstrap4-dark-purple/theme.css @@ -440,6 +440,7 @@ border-color: #c298d8; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #20262e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #3f4b5b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #3f4b5b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #3f4b5b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #3f4b5b; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #20262e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #3f4b5b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #3f4b5b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #3f4b5b; +} .p-password-panel { padding: 1.25rem; diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css index 2a1512fb3..9301d4f57 100644 --- a/public/themes/bootstrap4-light-blue/theme.css +++ b/public/themes/bootstrap4-light-blue/theme.css @@ -440,6 +440,7 @@ border-color: #007bff; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 4px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(0, 0, 0, 0.03); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(0, 0, 0, 0.03); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(0, 0, 0, 0.03); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(0, 0, 0, 0.125); @@ -826,7 +833,7 @@ color: #6c757d; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 4px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(0, 0, 0, 0.03); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(0, 0, 0, 0.03); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(0, 0, 0, 0.03); +} .p-password-panel { padding: 1.25rem; diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css index b01d228ad..b7b1e3140 100644 --- a/public/themes/bootstrap4-light-purple/theme.css +++ b/public/themes/bootstrap4-light-purple/theme.css @@ -440,6 +440,7 @@ border-color: #883cae; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 4px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(0, 0, 0, 0.03); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(0, 0, 0, 0.03); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(0, 0, 0, 0.03); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(0, 0, 0, 0.125); @@ -826,7 +833,7 @@ color: #6c757d; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 4px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(0, 0, 0, 0.03); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(0, 0, 0, 0.03); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(0, 0, 0, 0.03); +} .p-password-panel { padding: 1.25rem; diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css index 869820d12..422db0f68 100644 --- a/public/themes/luna-amber/theme.css +++ b/public/themes/luna-amber/theme.css @@ -440,6 +440,7 @@ border-color: #FFE082; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #4b4b4b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #191919; @@ -826,7 +833,7 @@ color: #9b9b9b; } .p-multiselect .p-multiselect-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #4b4b4b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/luna-blue/theme.css b/public/themes/luna-blue/theme.css index 5524d1d31..94e40ed5c 100644 --- a/public/themes/luna-blue/theme.css +++ b/public/themes/luna-blue/theme.css @@ -440,6 +440,7 @@ border-color: #81D4FA; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #4b4b4b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #191919; @@ -826,7 +833,7 @@ color: #9b9b9b; } .p-multiselect .p-multiselect-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #4b4b4b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css index a958cbdf7..507e3a1bc 100644 --- a/public/themes/luna-green/theme.css +++ b/public/themes/luna-green/theme.css @@ -440,6 +440,7 @@ border-color: #C5E1A5; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #4b4b4b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #191919; @@ -826,7 +833,7 @@ color: #9b9b9b; } .p-multiselect .p-multiselect-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #4b4b4b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css index 5269f4cd4..d0e8a2c45 100644 --- a/public/themes/luna-pink/theme.css +++ b/public/themes/luna-pink/theme.css @@ -440,6 +440,7 @@ border-color: #F48FB1; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #4b4b4b; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-editor-container .p-editor-toolbar { border: 1px solid #191919; @@ -826,7 +833,7 @@ color: #9b9b9b; } .p-multiselect .p-multiselect-trigger { - background: #191919; + background: transparent; color: #dedede; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #4b4b4b; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #4b4b4b; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #4b4b4b; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css index dfa1aa1b3..39a09cd3a 100644 --- a/public/themes/md-dark-deeppurple/theme.css +++ b/public/themes/md-dark-deeppurple/theme.css @@ -460,6 +460,7 @@ border-color: #CE93D8; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 2rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(255, 255, 255, 0.12); @@ -846,7 +853,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-password-panel { padding: 1rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css index 585874f9e..46786120b 100644 --- a/public/themes/md-dark-indigo/theme.css +++ b/public/themes/md-dark-indigo/theme.css @@ -460,6 +460,7 @@ border-color: #9FA8DA; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 2rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(255, 255, 255, 0.12); @@ -846,7 +853,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-password-panel { padding: 1rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css index 4be23fdc4..fdfc3da63 100644 --- a/public/themes/md-light-deeppurple/theme.css +++ b/public/themes/md-light-deeppurple/theme.css @@ -460,6 +460,7 @@ border-color: #673AB7; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 2rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f5f5f5; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-editor-container .p-editor-toolbar { border: 1px solid #e0e0e0; @@ -846,7 +853,7 @@ color: rgba(0, 0, 0, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f5f5f5; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-password-panel { padding: 1rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css index 9e4bb2c66..55aec53c9 100644 --- a/public/themes/md-light-indigo/theme.css +++ b/public/themes/md-light-indigo/theme.css @@ -460,6 +460,7 @@ border-color: #3F51B5; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 2rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f5f5f5; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-editor-container .p-editor-toolbar { border: 1px solid #e0e0e0; @@ -846,7 +853,7 @@ color: rgba(0, 0, 0, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f5f5f5; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-password-panel { padding: 1rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css index 435de5d03..f1cbff673 100644 --- a/public/themes/mdc-dark-deeppurple/theme.css +++ b/public/themes/mdc-dark-deeppurple/theme.css @@ -460,6 +460,7 @@ border-color: #673AB7; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(255, 255, 255, 0.12); @@ -846,7 +853,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-password-panel { padding: 0.75rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css index ce4ffd35d..9f89b3107 100644 --- a/public/themes/mdc-dark-indigo/theme.css +++ b/public/themes/mdc-dark-indigo/theme.css @@ -460,6 +460,7 @@ border-color: #3F51B5; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-editor-container .p-editor-toolbar { border: 1px solid rgba(255, 255, 255, 0.12); @@ -846,7 +853,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #1e1e1e; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: rgba(255, 255, 255, 0.06); } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: rgba(255, 255, 255, 0.08); +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: rgba(255, 255, 255, 0.1); +} .p-password-panel { padding: 0.75rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css index d6e709841..39c23ab4a 100644 --- a/public/themes/mdc-light-deeppurple/theme.css +++ b/public/themes/mdc-light-deeppurple/theme.css @@ -460,6 +460,7 @@ border-color: #673AB7; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f5f5f5; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-editor-container .p-editor-toolbar { border: 1px solid #e0e0e0; @@ -846,7 +853,7 @@ color: rgba(0, 0, 0, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f5f5f5; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-password-panel { padding: 0.75rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css index 04aa68596..2e5267d81 100644 --- a/public/themes/mdc-light-indigo/theme.css +++ b/public/themes/mdc-light-indigo/theme.css @@ -460,6 +460,7 @@ border-color: #3F51B5; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.75rem; } @@ -471,7 +472,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -530,9 +531,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f5f5f5; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-editor-container .p-editor-toolbar { border: 1px solid #e0e0e0; @@ -846,7 +853,7 @@ color: rgba(0, 0, 0, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: rgba(0, 0, 0, 0.6); width: 2.357rem; border-top-right-radius: 4px; @@ -927,10 +934,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f5f5f5; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #ececec; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #dcdcdc; +} .p-password-panel { padding: 0.75rem; @@ -4698,10 +4710,6 @@ .p-panel .p-panel-footer { border: 0 none; } -.p-panel .p-panel-header { - border-bottom-right-radius: 4px; - border-bottom-left-radius: 4px; -} .p-panel .p-panel-title { font-size: 1.25rem; } diff --git a/public/themes/nova-accent/theme.css b/public/themes/nova-accent/theme.css index da229a9f5..9c20f5a53 100644 --- a/public/themes/nova-accent/theme.css +++ b/public/themes/nova-accent/theme.css @@ -436,6 +436,7 @@ border-color: #007ad9; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -447,7 +448,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -506,9 +507,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f4f4f4; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-editor-container .p-editor-toolbar { border: 1px solid #007ad9; @@ -822,7 +829,7 @@ color: #666666; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -903,10 +910,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f4f4f4; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/nova-alt/theme.css b/public/themes/nova-alt/theme.css index f5ea060e8..646a90c45 100644 --- a/public/themes/nova-alt/theme.css +++ b/public/themes/nova-alt/theme.css @@ -440,6 +440,7 @@ border-color: #007ad9; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f4f4f4; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-editor-container .p-editor-toolbar { border: 1px solid #333333; @@ -826,7 +833,7 @@ color: #666666; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f4f4f4; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/nova-vue/theme.css b/public/themes/nova-vue/theme.css index 2a3ff9923..16b2282db 100644 --- a/public/themes/nova-vue/theme.css +++ b/public/themes/nova-vue/theme.css @@ -440,6 +440,7 @@ border-color: #41b883; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f4f4f4; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-editor-container .p-editor-toolbar { border: 1px solid #c8c8c8; @@ -826,7 +833,7 @@ color: #666666; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f4f4f4; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/nova/theme.css b/public/themes/nova/theme.css index 485121b61..91d48a3c0 100644 --- a/public/themes/nova/theme.css +++ b/public/themes/nova/theme.css @@ -440,6 +440,7 @@ border-color: #007ad9; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f4f4f4; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-editor-container .p-editor-toolbar { border: 1px solid #c8c8c8; @@ -826,7 +833,7 @@ color: #666666; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #848484; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f4f4f4; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css index cb18053f0..66c659b2a 100644 --- a/public/themes/rhea/theme.css +++ b/public/themes/rhea/theme.css @@ -436,6 +436,7 @@ border-color: #7B95A3; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.429rem; } @@ -447,7 +448,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #666666; width: 2.357rem; border-top-right-radius: 2px; @@ -506,9 +507,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f4f4f4; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-editor-container .p-editor-toolbar { border: 1px solid #7B95A3; @@ -822,7 +829,7 @@ color: #a6a6a6; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #666666; width: 2.357rem; border-top-right-radius: 2px; @@ -903,10 +910,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f4f4f4; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f4f4f4; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f4f4f4; +} .p-password-panel { padding: 0.571rem 1rem; diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css index 156c2c0e5..e561e96f4 100644 --- a/public/themes/saga-blue/theme.css +++ b/public/themes/saga-blue/theme.css @@ -440,6 +440,7 @@ border-color: #2196F3; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f8f9fa; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-editor-container .p-editor-toolbar { border: 1px solid #dee2e6; @@ -826,7 +833,7 @@ color: #6c757d; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f8f9fa; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css index 2c76579fd..26f42e5d9 100644 --- a/public/themes/saga-green/theme.css +++ b/public/themes/saga-green/theme.css @@ -440,6 +440,7 @@ border-color: #4CAF50; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f8f9fa; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-editor-container .p-editor-toolbar { border: 1px solid #dee2e6; @@ -826,7 +833,7 @@ color: #6c757d; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f8f9fa; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css index ceaef3279..282d9b61c 100644 --- a/public/themes/saga-orange/theme.css +++ b/public/themes/saga-orange/theme.css @@ -440,6 +440,7 @@ border-color: #FFC107; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #f8f9fa; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-editor-container .p-editor-toolbar { border: 1px solid #dee2e6; @@ -826,7 +833,7 @@ color: #6c757d; } .p-multiselect .p-multiselect-trigger { - background: #ffffff; + background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #f8f9fa; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #f8f9fa; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #f8f9fa; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css index 97e6b2bfa..6e66b2f08 100644 --- a/public/themes/vela-blue/theme.css +++ b/public/themes/vela-blue/theme.css @@ -440,6 +440,7 @@ border-color: #64B5F6; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #304562; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #304562; +} .p-editor-container .p-editor-toolbar { border: 1px solid #304562; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #304562; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #304562; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css index c48032dc8..5eba49ddf 100644 --- a/public/themes/vela-green/theme.css +++ b/public/themes/vela-green/theme.css @@ -440,6 +440,7 @@ border-color: #81C784; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #304562; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #304562; +} .p-editor-container .p-editor-toolbar { border: 1px solid #304562; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #304562; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #304562; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css index 605038ea7..d5f8bd65e 100644 --- a/public/themes/vela-orange/theme.css +++ b/public/themes/vela-orange/theme.css @@ -440,6 +440,7 @@ border-color: #FFD54F; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #304562; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #304562; +} .p-editor-container .p-editor-toolbar { border: 1px solid #304562; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #304562; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #304562; +} .p-password-panel { padding: 1rem; diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css index 2e5a3327c..ffd83f9fe 100644 --- a/public/themes/vela-purple/theme.css +++ b/public/themes/vela-purple/theme.css @@ -440,6 +440,7 @@ border-color: #BA68C8; } .p-dropdown .p-dropdown-label { + background: transparent; border: 0 none; padding-right: 1.5rem; } @@ -451,7 +452,7 @@ box-shadow: none; } .p-dropdown .p-dropdown-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -510,9 +511,15 @@ border-width: 1px; } -.p-input-filled .p-dropdown-trigger { +.p-input-filled .p-dropdown { background: #304562; } +.p-input-filled .p-dropdown:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-dropdown:not(.p-disabled).p-focus { + background-color: #304562; +} .p-editor-container .p-editor-toolbar { border: 1px solid #304562; @@ -826,7 +833,7 @@ color: rgba(255, 255, 255, 0.6); } .p-multiselect .p-multiselect-trigger { - background: #17212f; + background: transparent; color: rgba(255, 255, 255, 0.6); width: 2.357rem; border-top-right-radius: 3px; @@ -907,10 +914,15 @@ border-width: 1px; } -.p-input-filled .p-multiselect-label, -.p-input-filled .p-multiselect-trigger { +.p-input-filled .p-multiselect { background: #304562; } +.p-input-filled .p-multiselect:not(.p-disabled):hover { + background-color: #304562; +} +.p-input-filled .p-multiselect:not(.p-disabled).p-focus { + background-color: #304562; +} .p-password-panel { padding: 1rem; diff --git a/src/App.vue b/src/App.vue index d97714b50..2f2e18264 100755 --- a/src/App.vue +++ b/src/App.vue @@ -121,7 +121,7 @@ export default { this.$appState.darkTheme = event.dark; if (event.theme.startsWith('md')) { - this.$appState.ripple = true; + this.$primevue.ripple = true; } }, addClass(element, className) { @@ -158,7 +158,7 @@ export default { return [{ 'layout-news-active': this.newsActive, 'p-input-filled': this.$appState.inputStyle === 'filled', - 'p-ripple-disabled': this.$appState.ripple === false + 'p-ripple-disabled': this.$primevue.ripple === false }]; } }, diff --git a/src/AppConfigurator.vue b/src/AppConfigurator.vue index 55cdbe614..19bb1c152 100755 --- a/src/AppConfigurator.vue +++ b/src/AppConfigurator.vue @@ -310,14 +310,6 @@ export default { } } }, - computed: { - containerClass() { - return ['layout-config', {'layout-config-active': this.active}]; - }, - rippleActive() { - return this.$appState.ripple; - } - }, methods: { toggleConfigurator(event) { this.active = !this.active; @@ -365,8 +357,16 @@ export default { document.documentElement.style.fontSize = this.scale + 'px'; }, onRippleChange(value) { - this.$appState.ripple = value; + this.$primevue.ripple = value; } - } + }, + computed: { + containerClass() { + return ['layout-config', {'layout-config-active': this.active}]; + }, + rippleActive() { + return this.$primevue.ripple; + } + }, } diff --git a/src/assets/styles/app/_config.scss b/src/assets/styles/app/_config.scss index 64cccb5a6..7c5543ffe 100644 --- a/src/assets/styles/app/_config.scss +++ b/src/assets/styles/app/_config.scss @@ -16,8 +16,10 @@ .layout-config-content-wrapper { .layout-config-button { + opacity: .9; + i { - transform: rotate(360deg); + transform: rotate(0deg); } } } @@ -48,16 +50,13 @@ border-top-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; - transition: background-color .2s, box-shadow .2s; - box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), - 0 5px 22px 4px rgba(0, 0, 0, 0.12), - 0 12px 17px 2px rgba(0, 0, 0, 0.14); + box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12); i { font-size: 26px; line-height: inherit; cursor: pointer; - transform: rotate(0deg); + transform: rotate(360deg); transition: transform 1s; } } diff --git a/src/components/ripple/Ripple.js b/src/components/ripple/Ripple.js index 2373f5c3f..9c54cd51d 100644 --- a/src/components/ripple/Ripple.js +++ b/src/components/ripple/Ripple.js @@ -21,6 +21,7 @@ function create(el) { function remove(el) { let ink = getInk(el); if (ink) { + unbindEvents(el); ink.removeEventListener('animationend', onAnimationEnd); ink.remove(); } @@ -75,13 +76,14 @@ function getInk(el) { } const Ripple = { - inserted(el) { - create(el); - bindEvents(el); + inserted(el, binding, vnode) { + if (vnode.context.$primevue && vnode.context.$primevue.ripple) { + create(el); + bindEvents(el); + } }, unbind(el) { remove(el); - unbindEvents(el); } }; diff --git a/src/main.js b/src/main.js index 2578db6f0..5d1153be6 100644 --- a/src/main.js +++ b/src/main.js @@ -90,7 +90,8 @@ Vue.use(Vuelidate); Vue.use(ToastService); Vue.directive('tooltip', Tooltip); -Vue.prototype.$appState = Vue.observable({ inputStyle: 'outlined', darkTheme: false, ripple: false }); +Vue.prototype.$appState = Vue.observable({inputStyle: 'outlined', darkTheme: false}); +Vue.prototype.$primevue = Vue.observable({ripple: true}); Vue.config.productionTip = false; diff --git a/src/views/setup/Setup.vue b/src/views/setup/Setup.vue index da6ec7daa..1e4b12cbd 100755 --- a/src/views/setup/Setup.vue +++ b/src/views/setup/Setup.vue @@ -143,6 +143,14 @@ primevue/resources/themes/luna-blue/theme.css primevue/resources/themes/luna-green/theme.css primevue/resources/themes/luna-pink/theme.css primevue/resources/themes/rhea/theme.css + + +
Ripple
+

Ripple is an optional animation for the supported components such as buttons. It is disabled by default and needs to be enabled at + your app's entry file (e.g. main.js) using the $primevue instance variable. +

+ +Vue.prototype.$primevue = {ripple: true};
Quickstart