From 50ac28725a1c60d52c63af5d3830634fc4757493 Mon Sep 17 00:00:00 2001 From: cagataycivici Date: Mon, 29 Jun 2020 11:22:38 +0300 Subject: [PATCH] Aligned disabled buttons with material spec --- public/themes/md-dark-deeppurple/theme.css | 11 ++++++++++- public/themes/md-dark-indigo/theme.css | 11 ++++++++++- public/themes/md-light-deeppurple/theme.css | 11 ++++++++++- public/themes/md-light-indigo/theme.css | 11 ++++++++++- public/themes/mdc-dark-deeppurple/theme.css | 11 ++++++++++- public/themes/mdc-dark-indigo/theme.css | 11 ++++++++++- public/themes/mdc-light-deeppurple/theme.css | 11 ++++++++++- public/themes/mdc-light-indigo/theme.css | 11 ++++++++++- 8 files changed, 80 insertions(+), 8 deletions(-) diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css index 39a09cd3a..4532979bb 100644 --- a/public/themes/md-dark-deeppurple/theme.css +++ b/public/themes/md-dark-deeppurple/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css index 46786120b..56df6f4c7 100644 --- a/public/themes/md-dark-indigo/theme.css +++ b/public/themes/md-dark-indigo/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css index fdfc3da63..b5bd9b2db 100644 --- a/public/themes/md-light-deeppurple/theme.css +++ b/public/themes/md-light-deeppurple/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css index 55aec53c9..857259af2 100644 --- a/public/themes/md-light-indigo/theme.css +++ b/public/themes/md-light-indigo/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css index f1cbff673..e41de3859 100644 --- a/public/themes/mdc-dark-deeppurple/theme.css +++ b/public/themes/mdc-dark-deeppurple/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css index 9f89b3107..22fa28be6 100644 --- a/public/themes/mdc-dark-indigo/theme.css +++ b/public/themes/mdc-dark-indigo/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css index 39c23ab4a..a96a56c8f 100644 --- a/public/themes/mdc-light-deeppurple/theme.css +++ b/public/themes/mdc-light-deeppurple/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css index 2e5267d81..30f4b7e00 100644 --- a/public/themes/mdc-light-indigo/theme.css +++ b/public/themes/mdc-light-indigo/theme.css @@ -4598,9 +4598,18 @@ } .p-button:disabled { background-color: rgba(0, 0, 0, 0.12) !important; - color: rgba(0, 0, 0, 0.26) !important; + color: rgba(0, 0, 0, 0.38) !important; opacity: 1; } +.p-button:disabled.p-button-text { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; +} +.p-button:disabled.p-button-outlined { + background-color: transparent !important; + color: rgba(0, 0, 0, 0.38) !important; + border-color: rgba(0, 0, 0, 0.38) !important; +} .p-button.p-button-raised:enabled:focus { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }