SVGRect style optimization

This commit is contained in:
Jörn-Michael Miehe 2023-11-06 00:32:56 +00:00
parent 8b581a7b50
commit 2282de2528

View file

@ -60,33 +60,22 @@ export default class extends Vue {
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/bulma-scheme"; @import "@/bulma-scheme";
@mixin visible_rect($name, $color) {
&.#{$name} {
background-color: rgba($color, 0.3);
border-color: rgba($color, 0.9);
}
}
foreignObject > div { foreignObject > div {
:deep() > * { &:not(.visible, :hover):deep() > * {
display: none; display: none;
} }
&.visible, &.visible,
&:hover { &:hover {
:deep() > * {
display: initial;
}
border-width: 3px; border-width: 3px;
border-style: solid; border-style: solid;
@include visible_rect("primary", $primary); @each $name, $color in $advent22-colors {
@include visible_rect("link", $link); &.#{$name} {
@include visible_rect("info", $info); background-color: rgba($color, 0.3);
@include visible_rect("success", $success); border-color: rgba($color, 0.9);
@include visible_rect("warning", $warning); }
@include visible_rect("danger", $danger); }
} }
} }
</style> </style>