jess
/
Graphite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix Layer Tree panel CSS to allow scrolling (#208)

This commit is contained in:
Keavon Chambers 2021-06-13 12:29:50 -07:00
parent 9c0a23d03f
commit 3672c6919c
2 changed files with 37 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
client/web/src/components/panels/LayerTree.vue
View File

@ -44,6 +44,8 @@
<style lang="scss"> <style lang="scss">
.layer-tree-panel { .layer-tree-panel {
min-height: 0;
.options-bar { .options-bar {
height: 32px; height: 32px;
flex: 0 0 auto; flex: 0 0 auto;
@ -59,39 +61,44 @@
} }
} }
.layer-row { .layer-tree {
display: flex; overflow: auto;
height: 36px;
align-items: center;
margin: 0 8px;
.layer { .layer-row {
display: flex; display: flex;
height: 36px;
align-items: center; align-items: center;
background: var(--color-5-dullgray);
border-radius: 4px;
width: 100%;
height: 100%;
margin-left: 4px;
padding-left: 16px;
}
.selected {
background: var(--color-accent);
color: var(--color-f-white);
}
& + .layer-row {
margin-top: 2px;
}
.layer-thumbnail {
width: 64px;
height: 100%;
background: white;
}
.layer-type-icon {
margin: 0 8px; margin: 0 8px;
flex: 0 0 auto;
.layer {
display: flex;
align-items: center;
background: var(--color-5-dullgray);
border-radius: 4px;
width: 100%;
height: 100%;
margin-left: 4px;
padding-left: 16px;
}
.selected {
background: var(--color-accent);
color: var(--color-f-white);
}
& + .layer-row {
margin-top: 2px;
}
.layer-thumbnail {
width: 64px;
height: 100%;
background: white;
}
.layer-type-icon {
margin: 0 8px;
}
} }
} }
} }

1
client/web/src/components/workspace/Panel.vue
View File

@ -129,6 +129,7 @@
flex: 1 1 100%; flex: 1 1 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 0;
} }
} }
</style> </style>