magnus/datagraph
1
0
Fork 0
Code Issues 3 Pull requests Projects Releases 3 Packages Wiki Activity Actions

Saving of nodes

Browse source
This commit is contained in:
Magnus Åhall 2025-07-03 13:25:08 +02:00
parent c5bec0afa6
commit 08fd2cf4e9
16 changed files with 852 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

84
static/css/main.css
View file

@ -8,7 +8,7 @@ html {
body {
margin: 0px;
padding: 0px;
background-color: #333;
background-color: #444 !important;
}
*,
*:before,
@ -21,13 +21,80 @@ body {
[onClick] {
cursor: pointer;
}
#nodes {
.section {
background-color: #fff;
padding: 32px;
border-radius: 8px;
margin: 32px;
display: none;
}
.section.show {
display: block;
}
#layout {
display: grid;
grid-template-areas: "menu menu" "navigation details";
grid-template-columns: min-content 1fr;
grid-gap: 32px;
padding: 32px;
}
#menu {
grid-area: menu;
grid-template-columns: repeat(100, min-content);
grid-gap: 16px;
align-items: center;
}
#menu.section {
display: grid;
padding: 16px 32px;
}
#menu .item {
cursor: pointer;
}
#menu .item.selected {
font-weight: bold;
}
#logo img {
height: 96px;
margin-right: 32px;
}
#nodes {
grid-area: navigation;
width: min-content;
}
#editor-node {
grid-area: details;
}
#types {
grid-area: navigation;
}
#types .group {
font-weight: bold;
white-space: nowrap;
margin-top: 32px;
margin-bottom: 8px;
}
#types .group:first-child {
margin-top: 0px;
}
#types .type {
display: grid;
grid-template-columns: min-content 1fr;
grid-gap: 8px;
align-items: center;
cursor: pointer;
margin-bottom: 8px;
}
#types .type .img img {
height: 24px;
display: inline;
}
#types .type .title {
white-space: nowrap;
line-height: 24px;
}
#editor-type-schema {
grid-area: details;
}
.node {
display: grid;
grid-template-columns: min-content min-content 100%;
@ -44,7 +111,7 @@ body {
padding-right: 8px;
}
.node .expand-status.leaf {
width: 36px;
width: 40px;
}
.node .expand-status.leaf img {
display: none;
@ -52,15 +119,16 @@ body {
.node .expand-status img {
cursor: pointer;
}
.node .icon {
padding-right: 8px;
.node .type-icon {
padding-right: 4px;
}
.node .icon img {
filter: invert(0.7) sepia(0.5) hue-rotate(50deg) saturate(300%) brightness(0.85);
.node .type-icon img {
filter: invert(0.7) sepia(0.5) hue-rotate(50deg) saturate(300%) brightness(0.85) !important;
}
.node .name {
margin-bottom: 8px;
line-height: 24px;
cursor: pointer;
}
.node .children {
display: none;