css: align wcs form buttons on mobile (#71917) #53
|
@ -634,10 +634,6 @@ div.gru-content .previous-button button {
|
|||
div {
|
||||
display: block;
|
||||
}
|
||||
button {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -657,6 +657,7 @@ div.select2-search {
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: $buttons-alignment;
|
||||
gap: 0 1.5rem;
|
||||
|
||||
@each $btn, $grow in $buttons-order {
|
||||
$i: index($buttons-order, $btn);
|
||||
|
@ -675,6 +676,19 @@ div.select2-search {
|
|||
.savedraft-button {
|
||||
display: none;
|
||||
}
|
||||
// mobile: grow buttons.
|
||||
@media (max-width: $very-small-limit) {
|
||||
.widget {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.content {
|
||||
display: flex;
|
||||
}
|
||||
button {
|
||||
flex-grow: 1;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -504,16 +504,8 @@ div#rub_service {
|
|||
|
||||
@media (max-width: $very-small-limit) {
|
||||
.form-content--body .buttons {
|
||||
column-gap: 1.5rem;
|
||||
> * {
|
||||
flex: 1 0 30%;
|
||||
.content, .content button {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
&.submit-button {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
.submit-button {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -104,28 +104,6 @@ a.pk-button.pk-button {
|
|||
}
|
||||
}
|
||||
|
||||
// mobile buttons extended like metz-metropole-2019
|
||||
@media (max-width: $very-small-limit) {
|
||||
form.quixote div.buttons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
div.widget {
|
||||
div.content,
|
||||
button {
|
||||
width: 100%;
|
||||
}
|
||||
div.content {
|
||||
padding-right: 1.5rem;
|
||||
}
|
||||
}
|
||||
div.previous-button,
|
||||
div.cancel-button,
|
||||
div.submit-button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// GLOBAL LAYOUT
|
||||
//
|
||||
|
|
Loading…
Reference in New Issue