diff --git a/src/styles/nodes.css b/src/styles/nodes.css index 9526268d..d7d2e50d 100644 --- a/src/styles/nodes.css +++ b/src/styles/nodes.css @@ -34,12 +34,15 @@ --category-function-border: #6b6b6b; } -.tree > div > .object-node > .node-body, -.choice-node > .object-node > .node-body { +.tree > div > .object-node > .node-body { border-left: none; padding-left: 0; } +.tree > div > .node > .node-body { + margin-top: -5px; /* no idea why this is necessary */ +} + .node { margin: 2px 0; } @@ -57,6 +60,8 @@ transition: border-color var(--style-transition); } +/* Node headers */ + .node-header { display: inline-flex; align-items: center; @@ -103,6 +108,8 @@ cursor: pointer; } +/** Rounded corners */ + .node-header > *:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; @@ -131,6 +138,8 @@ border-bottom-left-radius: 3px; } +/* Buttons */ + button.selected { background-color: var(--node-selected); border-color: var(--node-selected-border); @@ -181,6 +190,8 @@ button.add svg { fill: var(--node-remove); } +/* Node body and list entry */ + .node-body { display: flex; flex-direction: column; @@ -208,6 +219,8 @@ button.add svg { margin-top: 2px; } +/* Node type specifics */ + .range-node select { width: 25px; } @@ -217,6 +230,8 @@ button.add svg { width: 100px; } +/* Color categories */ + [data-category=predicate] > .node-header > label, [data-category=predicate] > .node-body > .node.node-header > *:first-child, [data-category=predicate] > .node-body > .node > .node-header > *:first-child {