56 lines
773 B
SCSS
56 lines
773 B
SCSS
@import "colors";
|
|
|
|
.areas {
|
|
margin-bottom: 10px;
|
|
|
|
input {
|
|
margin-top: 5px;
|
|
}
|
|
}
|
|
|
|
.ds-ctrl button {
|
|
color: $dark-grey;
|
|
|
|
&.on,
|
|
&:hover {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
}
|
|
|
|
.react-aria-popover {
|
|
&[data-placement='top'] {
|
|
--origin: translateY(8px);
|
|
}
|
|
|
|
&[data-placement='bottom'] {
|
|
--origin: translateY(-8px);
|
|
}
|
|
|
|
&[data-placement='right'] {
|
|
--origin: translateX(-8px);
|
|
}
|
|
|
|
&[data-placement='left'] {
|
|
--origin: translateX(8px);
|
|
}
|
|
|
|
&[data-entering] {
|
|
animation: popover-slide 200ms;
|
|
}
|
|
|
|
&[data-exiting] {
|
|
animation: popover-slide 200ms reverse ease-in;
|
|
}
|
|
}
|
|
|
|
@keyframes popover-slide {
|
|
from {
|
|
transform: var(--origin);
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
transform: translateY(0);
|
|
opacity: 1;
|
|
}
|
|
}
|