akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-23 23:27:09 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Upgrade mschema dependencies and add pool category

Browse Source
This commit is contained in:
Misode
2020-10-05 15:51:31 +02:00
parent 9138985153
commit 9f9c9b40fd
4 changed files with 83 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
src/styles/nodes.css
View File

@@ -18,6 +18,9 @@
--category-function: #979fa7;
--category-function-border: #788086;
--category-function-background: #dce0e4;
--category-pool: #76b865;
--category-pool-border: #398118;
--category-pool-background: #b1d6a6;
}
:root[data-theme=dark] {
@@ -40,32 +43,9 @@
--category-function: #838383;
--category-function-border: #6b6b6b;
--category-function-background: #414141;
}
#tree-view-output > .object-node > .node-body {
border-left: none;
padding-left: 0;
}
#tree-view-output > .node > .node-body {
margin-top: -5px; /* no idea why this is necessary */
}
.node {
margin: 2px 0;
}
.node-body > .node:first-child {
margin-top: 4px;
}
.node:last-child {
margin-bottom: 0;
}
.node-body {
border-left: 3px solid var(--node-indent-border);
transition: border-color var(--style-transition);
--category-pool: #386330;
--category-pool-border: #2e4922;
--category-pool-background: #21331d;
}
/* Node headers */
@@ -129,17 +109,17 @@
.node-header > *:last-child,
.node-header > input[list]:nth-last-child(2),
.node-header[data-help] > *:nth-last-child(2),
.node-header[data-help] > input[list]:nth-last-child(3),
.node-header[data-error] > *:nth-last-child(2),
.node-header[data-error] > input[list]:nth-last-child(3),
.node-header[data-help][data-error] > *:nth-last-child(3),
.node-header[data-help][data-error] > input[list]:nth-last-child(4) {
.node[data-help] > .node-header > *:nth-last-child(2),
.node[data-help] > .node-header > input[list]:nth-last-child(3),
.node[data-error] > .node-header > *:nth-last-child(2),
.node[data-error] > .node-header > input[list]:nth-last-child(3),
.node[data-help][data-error] > .node-header > *:nth-last-child(3),
.node[data-help][data-error] > .node-header > input[list]:nth-last-child(4) {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.node-header > *:not(:last-child) {
.node-header > * {
margin-right: -1px;
}
@@ -255,6 +235,23 @@ button.remove {
/* Node body and list entry */
.node {
margin-bottom: 4px;
}
.node-body > .node:first-child {
margin-top: 4px;
}
.node:last-child {
margin-bottom: 0;
}
.node-body {
border-left: 3px solid var(--node-indent-border);
transition: border-color var(--style-transition);
}
.node-body {
display: flex;
flex-direction: column;
@@ -269,7 +266,6 @@ button.remove {
border-left: none;
}
.node-entry > .object-node > .node-body > .node.node-header > *:first-child,
.node-entry > .object-node > .node-body > .node > .node-header > *:first-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
@@ -279,10 +275,12 @@ button.remove {
.node-entry {
display: flex;
flex-direction: column;
margin-top: 2px;
margin-top: 4px;
}
.node-entry > .object-node[data-category] {
.node-entry > .object-node[data-category],
.node-entry > .list-node[data-category],
.node-entry > .map-node[data-category] {
width: 100%;
min-width: max-content;
padding: 5px;
@@ -293,11 +291,15 @@ button.remove {
transition: background-color var(--style-transition);
}
.node-entry:first-child > .object-node[data-category] {
.node-entry:first-child > .object-node[data-category],
.node-entry:first-child > .list-node[data-category],
.node-entry:first-child > .map-node[data-category] {
margin-top: 4px;
}
.node-entry > .node.object-node[data-category] > .node-body {
.node-entry > .object-node[data-category] > .node-body,
.node-entry > .list-node[data-category] > .node-body,
.node-entry > .map-node[data-category] > .node-body {
border: none;
}
@@ -315,37 +317,55 @@ button.remove {
/* Color categories */
[data-category=predicate] > .node-header > label,
[data-category=predicate] > .node-body > .node.node-header > label,
[data-category=predicate] > .node-body > .node > .node-header > label {
background-color: var(--category-predicate) !important;
}
[data-category=predicate] > .node-body,
[data-category=predicate] > .node-header > label,
[data-category=predicate] > .node-body > .node.node-header > *:not(.selected),
[data-category=predicate] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-predicate-border) !important;
}
.node-entry > .node.object-node[data-category=predicate] {
.node-entry > .node.object-node[data-category=predicate],
.node-entry > .node.list-node[data-category=predicate],
.node-entry > .node.map-node[data-category=predicate] {
background-color: var(--category-predicate-background);
border-color: var(--category-predicate-border);
}
[data-category=function] > .node-header > label,
[data-category=function] > .node-body > .node.node-header > label,
[data-category=function] > .node-body > .node > .node-header > label {
background-color: var(--category-function) !important;
}
[data-category=function] > .node-body,
[data-category=function] > .node-header > label,
[data-category=function] > .node-body > .node.node-header > *:not(.selected),
[data-category=function] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-function-border) !important;
}
.node-entry > .node.object-node[data-category=function] {
.node-entry > .node.object-node[data-category=function],
.node-entry > .node.list-node[data-category=function],
.node-entry > .node.map-node[data-category=function] {
background-color: var(--category-function-background);
border-color: var(--category-function-border);
}
[data-category=pool] > .node-header > label,
[data-category=pool] > .node-body > .node > .node-header > label {
background-color: var(--category-pool) !important;
}
[data-category=pool] > .node-body,
[data-category=pool] > .node-header > label,
[data-category=pool] > .node-body > .node > .node-header > *:not(.selected) {
border-color: var(--category-pool-border) !important;
}
.node-entry > .node.object-node[data-category=pool],
.node-entry > .node.list-node[data-category=pool],
.node-entry > .node.map-node[data-category=pool] {
background-color: var(--category-pool-background);
border-color: var(--category-pool-border);
}