app/assets/stylesheets/alchemy/toolbar.scss
#toolbar {
display: flex;
align-items: center;
gap: 2 * $default-padding;
z-index: 10;
@extend %gradiated-toolbar;
margin-right: 0px;
border-bottom: $default-border;
position: relative;
.toolbar_button {
form {
margin: 0;
display: inline-flex;
align-items: center;
}
}
div p {
float: right;
margin: 3px $default-margin 0 0;
padding: 0;
}
}
.toolbar_buttons {
display: flex;
flex-grow: 1;
white-space: nowrap;
overflow-x: auto;
overflow-y: visible;
-webkit-overflow-scrolling: touch;
@media screen and (min-width: $medium-screen-break-point) {
overflow: visible;
}
&.right {
flex-grow: 0;
padding: 8px 0;
.toolbar_button {
&:last-child {
margin-right: $default-margin;
}
}
}
.icon_button {
.icon {
width: var(--icon-size-xl);
height: var(--icon-size-xl);
}
}
.toolbar_button {
margin: 0 2 * $default-margin;
&:first-child {
margin-left: $default-margin;
select,
.alchemy_selectbox {
margin-left: 2 * $default-margin;
}
}
}
}
.toolbar_spacer {
display: inline-block;
vertical-align: middle;
width: 0px;
height: 29px;
border-right-style: solid;
border-right-width: 1px;
border-right-color: $default-border-color;
margin-right: $default-margin;
margin-left: $default-margin;
}
#overlay_toolbar {
@extend %gradiated-toolbar;
border-bottom: $default-border;
}
.button_group {
position: relative;
display: inline-block;
vertical-align: top;
margin: 0 2 * $default-margin;
&:hover label {
display: block;
}
.toolbar_button {
margin: 0;
}
}