HTWK/htwkalender-pwa
1
0
Fork 0
mirror of https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender-pwa.git synced 2025-07-16 09:38:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat:#47 changed success button focus

Browse Source
This commit is contained in:
Elmar Kresse
2024-04-04 22:16:21 +02:00
parent 51eb885c05
commit 84fe949ae6
4 changed files with 37 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/public/primevue-sass-theme/themes/lara/lara-light/_extensions.scss
View File

@ -62,7 +62,7 @@
}
&.p-button-success:enabled:focus {
@include focused-ring(scale-color($successButtonBg, $lightness: 50%));
@include focused-ring($successButtonBg);
}
&.p-button-info:enabled:focus {

22
frontend/public/primevue-sass-theme/themes/lara/lara-light/_variables.scss
View File

@ -182,25 +182,25 @@ $secondaryButtonFocusShadow:0 0 0 0.2rem #E2E8F0 !default;
$infoButtonBg: map-get($colors, "htwk-blau") !default;
$infoButtonTextColor:#ffffff !default;
$infoButtonBorder:1px solid map-get($colors, "primary") !default;
$infoButtonBorder:1px solid map-get($colors, "htwk-blau") !default;
$infoButtonHoverBg: #0257c7 !default;
$infoButtonTextHoverColor:$infoButtonTextColor !default;
$infoButtonHoverBorderColor:#rgba(map-get($colors, "htwk-blau"), .8) !default;
$infoButtonActiveBg:rgba(map-get($colors, "primary"), .8) !default;
$infoButtonHoverBorderColor: map-get($colors, "htwk-blau") !default;
$infoButtonActiveBg:rgba(map-get($colors, "htwk-blau"), .8) !default;
$infoButtonTextActiveColor:$infoButtonTextColor !default;
$infoButtonActiveBorderColor:rgba(map-get($colors, "primary"), .9) !default;
$infoButtonFocusShadow:0 0 0 0.2rem rgba(map-get($colors, "primary"), .7) !default;
$infoButtonActiveBorderColor:rgba(map-get($colors, "htwk-blau"), .9) !default;
$infoButtonFocusShadow:0 0 0 0.2rem rgba(map-get($colors, "htwk-blau"), .7) !default;
$successButtonBg:#22C55E !default;
$successButtonBg: map-get($colors, "htwk-gruen") !default;
$successButtonTextColor:#ffffff !default;
$successButtonBorder:1px solid #22C55E !default;
$successButtonHoverBg:#16A34A !default;
$successButtonBorder:1px solid map-get($colors, "htwk-gruen") !default;
$successButtonHoverBg: map-get($colors, "htwk-gruen") !default;
$successButtonTextHoverColor:$successButtonTextColor !default;
$successButtonHoverBorderColor:#16A34A !default;
$successButtonHoverBorderColor: map-get($colors, "htwk-gruen") !default;
$successButtonActiveBg:#15803D !default;
$successButtonTextActiveColor:$successButtonTextColor !default;
$successButtonActiveBorderColor:#15803D !default;
$successButtonFocusShadow:0 0 0 0.2rem #BBF7D0 !default;
$successButtonActiveBorderColor:rgba(map-get($colors, "htwk-gruen"), .9) !default;
$successButtonFocusShadow:0 0 0 0.2rem map-get($colors, "htwk-gruen") !default;
$warningButtonBg:#f97316 !default;
$warningButtonTextColor:#ffffff !default;

48
frontend/public/themes/lara-light-blue/theme.css
View File

@ -3317,20 +3317,20 @@
.p-button.p-button-info, .p-button-group.p-button-info > .p-button, .p-splitbutton.p-button-info > .p-button {
color: #ffffff;
background: #004699;
border: 1px solid #00944c;
border: 1px solid #004699;
}
.p-button.p-button-info:not(:disabled):hover, .p-button-group.p-button-info > .p-button:not(:disabled):hover, .p-splitbutton.p-button-info > .p-button:not(:disabled):hover {
background: #0257c7;
color: #ffffff;
border-color: #rgba #004699, 0.8;
border-color: #004699;
}
.p-button.p-button-info:not(:disabled):focus, .p-button-group.p-button-info > .p-button:not(:disabled):focus, .p-splitbutton.p-button-info > .p-button:not(:disabled):focus {
box-shadow: 0 0 0 0.2rem rgba(0, 148, 76, 0.7);
box-shadow: 0 0 0 0.2rem rgba(0, 70, 153, 0.7);
}
.p-button.p-button-info:not(:disabled):active, .p-button-group.p-button-info > .p-button:not(:disabled):active, .p-splitbutton.p-button-info > .p-button:not(:disabled):active {
background: rgba(0, 148, 76, 0.8);
background: rgba(0, 70, 153, 0.8);
color: #ffffff;
border-color: rgba(0, 148, 76, 0.9);
border-color: rgba(0, 70, 153, 0.9);
}
.p-button.p-button-info.p-button-outlined, .p-button-group.p-button-info > .p-button.p-button-outlined, .p-splitbutton.p-button-info > .p-button.p-button-outlined {
background-color: transparent;
@ -3364,51 +3364,51 @@
}
.p-button.p-button-success, .p-button-group.p-button-success > .p-button, .p-splitbutton.p-button-success > .p-button {
color: #ffffff;
background: #22C55E;
border: 1px solid #22C55E;
background: #00964e;
border: 1px solid #00964e;
}
.p-button.p-button-success:not(:disabled):hover, .p-button-group.p-button-success > .p-button:not(:disabled):hover, .p-splitbutton.p-button-success > .p-button:not(:disabled):hover {
background: #16A34A;
background: #00964e;
color: #ffffff;
border-color: #16A34A;
border-color: #00964e;
}
.p-button.p-button-success:not(:disabled):focus, .p-button-group.p-button-success > .p-button:not(:disabled):focus, .p-splitbutton.p-button-success > .p-button:not(:disabled):focus {
box-shadow: 0 0 0 0.2rem #BBF7D0;
box-shadow: 0 0 0 0.2rem #00964e;
}
.p-button.p-button-success:not(:disabled):active, .p-button-group.p-button-success > .p-button:not(:disabled):active, .p-splitbutton.p-button-success > .p-button:not(:disabled):active {
background: #15803D;
color: #ffffff;
border-color: #15803D;
border-color: rgba(0, 150, 78, 0.9);
}
.p-button.p-button-success.p-button-outlined, .p-button-group.p-button-success > .p-button.p-button-outlined, .p-splitbutton.p-button-success > .p-button.p-button-outlined {
background-color: transparent;
color: #22C55E;
color: #00964e;
border: 1px solid;
}
.p-button.p-button-success.p-button-outlined:not(:disabled):hover, .p-button-group.p-button-success > .p-button.p-button-outlined:not(:disabled):hover, .p-splitbutton.p-button-success > .p-button.p-button-outlined:not(:disabled):hover {
background: rgba(34, 197, 94, 0.04);
color: #22C55E;
background: rgba(0, 150, 78, 0.04);
color: #00964e;
border: 1px solid;
}
.p-button.p-button-success.p-button-outlined:not(:disabled):active, .p-button-group.p-button-success > .p-button.p-button-outlined:not(:disabled):active, .p-splitbutton.p-button-success > .p-button.p-button-outlined:not(:disabled):active {
background: rgba(34, 197, 94, 0.16);
color: #22C55E;
background: rgba(0, 150, 78, 0.16);
color: #00964e;
border: 1px solid;
}
.p-button.p-button-success.p-button-text, .p-button-group.p-button-success > .p-button.p-button-text, .p-splitbutton.p-button-success > .p-button.p-button-text {
background-color: transparent;
color: #22C55E;
color: #00964e;
border-color: transparent;
}
.p-button.p-button-success.p-button-text:not(:disabled):hover, .p-button-group.p-button-success > .p-button.p-button-text:not(:disabled):hover, .p-splitbutton.p-button-success > .p-button.p-button-text:not(:disabled):hover {
background: rgba(34, 197, 94, 0.04);
background: rgba(0, 150, 78, 0.04);
border-color: transparent;
color: #22C55E;
color: #00964e;
}
.p-button.p-button-success.p-button-text:not(:disabled):active, .p-button-group.p-button-success > .p-button.p-button-text:not(:disabled):active, .p-splitbutton.p-button-success > .p-button.p-button-text:not(:disabled):active {
background: rgba(34, 197, 94, 0.16);
background: rgba(0, 150, 78, 0.16);
border-color: transparent;
color: #22C55E;
color: #00964e;
}
.p-button.p-button-warning, .p-button-group.p-button-warning > .p-button, .p-splitbutton.p-button-warning > .p-button {
color: #ffffff;
@ -9440,7 +9440,7 @@
color: #ffffff;
}
.p-badge.p-badge-success {
background-color: #22C55E;
background-color: #00964e;
color: #ffffff;
}
.p-badge.p-badge-info {
@ -9965,7 +9965,7 @@
border-radius: 6px;
}
.p-tag.p-tag-success {
background-color: #22C55E;
background-color: #00964e;
color: #ffffff;
}
.p-tag.p-tag-info {
@ -10059,7 +10059,7 @@
box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #b0b9c6, 0 1px 2px 0 rgb(0, 0, 0);
}
.p-button.p-button-success:enabled:focus {
box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #88eaac, 0 1px 2px 0 rgb(0, 0, 0);
box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #00964e, 0 1px 2px 0 rgb(0, 0, 0);
}
.p-button.p-button-info:enabled:focus {
box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #4d9eff, 0 1px 2px 0 rgb(0, 0, 0);

2
frontend/public/themes/lara-light-blue/theme.css.map
View File

File diff suppressed because one or more lines are too long