geosphere-maps/public/assets/esri/themes/base/widgets/_Sketch.scss
2023-09-22 11:33:13 +02:00

155 lines
3.0 KiB
SCSS

@mixin sketch() {
$border: 1px solid $border-color;
.esri-sketch {
display: flex;
flex-flow: column wrap;
.esri-snapping-controls__panel {
display: flex;
width: auto;
}
}
.esri-expand__content {
.esri-sketch {
width: max-content;
}
}
.esri-sketch__menu-header {
margin: $cap-spacing--half;
border-bottom: $border;
display: flex;
align-items: center;
}
.esri-sketch__menu-title {
flex: 1 1 auto;
overflow: hidden;
}
.esri-sketch__panel {
align-items: center;
display: flex;
flex-flow: row wrap;
padding: 0;
}
.esri-sketch__info-panel {
background-color: $background-color--offset;
opacity: 1;
transition: opacity 250ms ease-in-out;
&:empty {
opacity: 0;
padding: 0;
visibility: hidden;
}
}
.esri-sketch__menu-container {
background-color: $background-color;
display: flex;
flex-flow: column;
flex: 1 1 auto;
flex-direction: column;
margin: $cap-spacing--half;
}
.esri-sketch__section {
align-items: center;
display: flex;
flex-flow: row wrap;
padding: 0 $side-spacing--half;
margin: $cap-spacing--half 0;
}
.esri-sketch__tool-section {
border-right: $border;
&:last-child {
border-right: none;
}
}
.esri-sketch__action-toggle--on .esri-sketch__item-action-icon {
// Toggle on
background-color: $button-color;
box-shadow: 0 0 0 1px $button-color;
&:before {
background-color: $interactive-font-color--inverse;
left: $toggle-handle-size;
}
}
.esri-sketch__feature-count-badge {
align-items: center;
background: $background-color;
border-bottom: $border;
border-radius: $border-radius;
display: flex;
font-size: $font-size--small;
justify-content: center;
margin: 0;
padding: 0.25em 0.75em;
}
[dir="rtl"] {
.esri-sketch__tool-section {
border-left: $border;
border-right: none;
&:last-child {
border: none;
}
}
.esri-expand__content {
.esri-sketch--vertical {
.esri-sketch__tool-section {
border-left: none;
border-right: none;
}
}
}
}
.esri-sketch--vertical {
flex-flow: row-reverse;
.esri-sketch__panel {
flex-flow: column;
}
.esri-sketch__section {
flex-flow: column;
padding-left: 0;
padding-right: 0;
margin-left: $side-spacing--half;
margin-right: $side-spacing--half;
}
.esri-sketch__tool-section {
border-right: none;
border-bottom: $border;
&:last-child {
border-bottom: none;
}
}
.esri-sketch__info-panel {
&:empty {
padding: 0;
}
}
.esri-sketch__info-section {
margin-top: $cap-spacing--quarter;
width: $button-width;
}
.esri-selection-toolbar__container {
flex-direction: column;
}
}
}
@if $include_Sketch == true {
@include sketch();
}