This repository has been archived on 2024-02-08. You can view files and clone it, but cannot push or open issues or pull requests.
frontend/src/styles/components/switch-view.scss
konrad d1a2eefca6
All checks were successful
continuous-integration/drone/push Build is passing
Improve consistency of the layout (#386)
Co-authored-by: kolaente <k@knt.li>
Reviewed-on: #386
Co-authored-by: konrad <konrad@kola-entertainments.de>
Co-committed-by: konrad <konrad@kola-entertainments.de>
2021-01-23 17:18:09 +00:00

48 lines
844 B
SCSS

.switch-view {
background: $white;
display: inline-flex;
border-radius: $radius;
font-size: .75rem;
box-shadow: $shadow-sm;
height: $switch-view-height;
margin-bottom: 1rem;
padding: .5rem;
a {
padding: .25rem .5rem;
display: block;
border-radius: $radius;
-webkit-transition: all 100ms;
-moz-transition: all 100ms;
-ms-transition: all 100ms;
-o-transition: all 100ms;
transition: all 100ms;
&:not(:last-child) {
margin-right: .5rem;
}
&.is-active, &:hover {
color: $white;
}
&.is-active {
background: $primary;
font-weight: bold;
box-shadow: $shadow-xs;
}
&:hover {
background: $primary;
}
}
}
@media screen and (max-width: $tablet) {
.switch-view-container {
display: flex;
justify-content: center;
}
}