break graph toggles into two rows on small screens
This commit is contained in:
@@ -183,3 +183,43 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-toggle-rows {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
justify-content: stretch;
|
||||
|
||||
.btn-group {
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
@media (min-width: 500px) {
|
||||
.btn-group:first-child > .btn:last-child {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.btn-group:last-child > .btn:first-child {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 499px) {
|
||||
flex-direction: column;
|
||||
|
||||
.btn-group:first-child > .btn:first-child {
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
.btn-group:first-child > .btn:last-child {
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.btn-group:last-child > .btn:first-child {
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
.btn-group:last-child > .btn:last-child {
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user