css: introduce pk-button-(delete|submit|cancel) for link-cell (#77764)
gitea/gadjo/pipeline/head This commit looks good Details

This commit is contained in:
Thomas Jund 2023-05-31 15:07:11 +02:00 committed by Thomas Jund
parent d5c2c674ba
commit 107730d105
2 changed files with 26 additions and 4 deletions

View File

@ -128,11 +128,11 @@ a.button {
}
}
a.button, a.pk-button, a[class*=pk-button], a.pk-big-button, a[class*="pk-big-button"], button, input[type=submit], div.buttons input, div.buttons a.cancel {
a.button, a.pk-button, a[class*=pk-button-], a.pk-big-button, a[class*="pk-big-button-"], button, input[type=submit], div.buttons input, div.buttons a.cancel {
@extend %button;
}
a.pk-big-button, a[class*="pk-big-button"] {
a.pk-big-button, a[class*="pk-big-button-"] {
padding: 2rem 4rem;
}
@ -140,6 +140,7 @@ input[type=submit] {
height: 2.3rem;
}
%cancel-button,
a.cancel-button, button.cancel-button, a.pk-button-cancel, a.pk-big-button-cancel, div.buttons .cancel-button input, div.buttons a.cancel, div.buttons .cancel-button button {
--color: #727272;
--hover-color: var(--color);
@ -161,11 +162,13 @@ div.buttons {
}
}
%delete-button,
a.delete-button, button.delete-button, a.pk-button-delete, a.pk-big-button-delete, div.buttons .delete-button input, div.buttons .delete-button button {
--color: #{$button-delete-color};
--outline-color: #{darken($button-delete-color, 10%)};
}
%submit-button,
a.submit-button, button.submit-button, a.pk-button-submit, a.pk-big-button-submit, div.buttons .submit-button input, div.buttons .submit-button button {
--color: var(--blue-dusty);
}

View File

@ -49,15 +49,34 @@ div#portal-agent-content, aside#sidebar {
}
}
}
&.pk-button, &.pk-big-button { // when used on link cells
&.pk-button, &.pk-big-button,
&[class*=pk-button-], &[class*="pk-big-button-"] { // when used on link cells
padding: 0;
a {
@extend %button;
text-align: center;
display: block;
}
&.pk-big-button a {
}
&.pk-big-button,
&[class*="pk-big-button-"] {
a {
padding: 2rem 4rem;
}
}
&.pk-button-cancel, &.pk-big-button-cancel {
a {
@extend %cancel-button;
}
}
&.pk-button-delete, &.pk-big-button-delete {
a {
@extend %delete-button;
}
}
&.pk-button-submit, &.pk-big-button-submit {
a {
@extend %submit-button;
}
}
}