Center text on triggers on small screen sizes
This commit is contained in:
parent
a3a205fb5d
commit
f89cdcdddd
2 changed files with 35 additions and 14 deletions
|
|
@ -43,15 +43,26 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.small > .value {
|
&.small {
|
||||||
font-size: $font-small;
|
& > .value {
|
||||||
margin: 0;
|
font-size: $font-small;
|
||||||
max-width: 200px;
|
margin: 0;
|
||||||
|
max-width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
@include breakpoint(tablet) {
|
@include breakpoint(tablet) {
|
||||||
width: 100%;
|
&::before {
|
||||||
max-width: inherit;
|
content: '';
|
||||||
text-align: center;
|
display: block;
|
||||||
|
width: calc($unit-2x - 1px);
|
||||||
|
}
|
||||||
|
|
||||||
|
& > .value {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
max-width: inherit;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -7,15 +7,25 @@
|
||||||
gap: $unit;
|
gap: $unit;
|
||||||
padding: ($unit * 1.5) $unit-2x;
|
padding: ($unit * 1.5) $unit-2x;
|
||||||
|
|
||||||
&.small > span:not(.icon) {
|
&.small {
|
||||||
font-size: $font-small;
|
& > span:not(.icon) {
|
||||||
margin: 0;
|
font-size: $font-small;
|
||||||
max-width: 200px;
|
margin: 0;
|
||||||
|
max-width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
@include breakpoint(tablet) {
|
@include breakpoint(tablet) {
|
||||||
width: 100%;
|
&::before {
|
||||||
max-width: inherit;
|
content: '';
|
||||||
text-align: center;
|
display: block;
|
||||||
|
width: calc($unit-2x - 1px);
|
||||||
|
}
|
||||||
|
|
||||||
|
& > span:not(.icon) {
|
||||||
|
width: 100%;
|
||||||
|
max-width: inherit;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue