pagraphcontrol/index.css
2018-11-09 00:51:38 +03:00

113 lines
1.7 KiB
CSS

body {
margin: 0;
background: var(--themeBaseColor);
color: var(--themeTextColor);
font: -webkit-control;
}
div {
box-sizing: border-box;
}
button {
background: var(--themeBgColor);
color: var(--themeTextColor);
border: 1px solid var(--borders);
user-select: none;
padding: 8px;
}
button:hover {
border-color: var(--themeSelectedBgColor);
}
button:focus {
outline: none;
border-color: var(--themeSelectedBgColor);
}
button:active {
background: var(--themeSelectedBgColor);
position: relative;
top: 1px;
}
.checkbox {
user-select: none;
padding: 8px;
}
.view-wrapper .graph {
background: var(--themeBaseColor);
}
.view-wrapper .grid-dot {
fill: var(--themeBgColor);
}
.view-wrapper .node {
fill: var(--themeBgColor);
stroke: var(--borders);
}
.view-wrapper .node.hovered {
stroke: var(--themeSelectedBgColor);
}
.view-wrapper .node.selected {
fill: var(--themeSelectedBgColor);
color: var(--themeSelectedFgColor);
}
.view-wrapper .sourceOutput .edge {
/* marker-end: none; */
/* marker-start: url(#start-arrow); */
marker-end: url(#my-source-arrow);
}
.view-wrapper .sinkInput .edge {
marker-end: url(#my-sink-arrow);
}
#edge-custom-container .edge {
marker-end: none;
}
.view-wrapper .graph .edge {
stroke: var(--successColor);
}
.view-wrapper .graph .arrow {
fill: var(--successColor);
}
.preferences {
position: absolute;
right: 0;
top: 0;
bottom: 0;
padding: 1rem;
overflow: auto;
}
.preferences:not(.open) {
pointer-events: none;
}
.preferences:not(.open) > * {
pointer-events: initial;
}
.preferences.open {
background: var(--themeBgColor);
}
.preferences > div {
margin-bottom: 1rem;
}
.view-wrapper .graph .edge-mouse-handler {
stroke-width: 30px;
}