Replace placeholder with eye icons for layers

This commit is contained in:
Keavon Chambers
2021-05-05 22:09:50 -07:00
parent 6dc8c91578
commit c74575724c
3 changed files with 13 additions and 12 deletions

View File

@@ -15,8 +15,8 @@
:key="layerId"
>
<div class="layer-visibility">
<IconButton @click="hideLayer(layerId)" :size="24" title="Visible"><EyeVisible /></IconButton>
<IconButton @click="showLayer(layerId)" :size="24" title="Hidden"><EyeHidden /></IconButton>
<IconButton v-if="layerId % 2 == 0" @click="hideLayer(layerId)" :size="24" title="Visible"><EyeVisible /></IconButton>
<IconButton v-if="layerId % 2 == 1" @click="showLayer(layerId)" :size="24" title="Hidden"><EyeHidden /></IconButton>
</div>
<div class="layer-thumbnail"></div>
<div class="layer-type-icon">
@@ -41,21 +41,15 @@
.layer-row {
display: flex;
height: 36px;
height: 24px;
align-items: center;
& + .layer-row {
margin-top: 2px;
}
.layer-visibility {
.icon-button + .icon-button {
display: none;
}
}
.layer-thumbnail {
width: 54px;
width: 36px;
height: 100%;
background: white;
}
@@ -76,8 +70,8 @@ import NumberInput from "../widgets/NumberInput.vue";
import DropdownButton from "../widgets/DropdownButton.vue";
import IconButton from "../widgets/IconButton.vue";
import IconContainer from "../widgets/IconContainer.vue";
import EyeVisible from "../../../assets/svg/24x24-bounds-16x16-icon/boolean-difference.svg";
import EyeHidden from "../../../assets/svg/24x24-bounds-16x16-icon/boolean-intersect.svg";
import EyeVisible from "../../../assets/svg/24x24-bounds-16x16-icon/visibility-eye-visible.svg";
import EyeHidden from "../../../assets/svg/24x24-bounds-16x16-icon/visibility-eye-hidden.svg";
import NodeTypePath from "../../../assets/svg/24x24-node-type-icon/node-type-path.svg";
export default defineComponent({