123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144 |
- :root {
- --background: #303030;
- --background-secondary: #424242;
- --normal: #eee;
- --primary: #f57c00;
- }
- .dark {
- .app-header {
- display: flex;
- align-items: center;
- color: var(--normal) !important;
- background: #212121 !important;
- box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2) !important;
- overflow: visible;
- z-index: 10;
- }
- .app-info {
- color: var(--normal);
- }
- .app-watermark {
- color: black !important;
- opacity: 0.02;
- }
- .app-flow-container {
- background: var(--background);
- }
- .flow-funcs__control {
- border-bottom: solid 1px var(--primary);
- }
- .flow-funcs__container {
- background: var(--background-secondary) !important;
- }
- .flow-funcs__container .flow-funcs__header {
- color: var(--normal);
- }
- .hx-toggle-arrow.active {
- color: var(--primary) !important;
- }
- .flow-funcs__inner {
- display: flex;
- flex: 1;
- flex-flow: column;
- justify-content: center;
- }
- .flow-funcs__inner .hx-collapsible {
- border: none !important;
- }
- .flow-funcs__container .item {
- color: var(--normal) !important;
- border: none !important;
- }
- .flow-funcs__group {
- padding: 10px;
- background: #323232;
- }
- .flow-funcs__control .item {
- color: var(--normal) !important;
- }
- .flow-container__control button {
- color: var(--normal) !important;
- }
- .flow-container__info {
- color: var(--normal);
- }
- .flow-node__body:hover {
- stroke: var(--primary) !important;
- }
- /*
- * LINKS
- */
- .flow-link__visible {
- stroke: var(--normal) !important;
- stroke-width: 2;
- }
- .flow-link:not(.flow-link--pointer):hover .flow-link__visible {
- stroke: var(--primary) !important;
- }
- .flow-link__head {
- fill: var(--normal) !important;
- }
- /*
- * NODES
- */
- .flow-container .flow-node {
- filter: none;
- }
- .flow-container .flow-node:hover {
- filter: url(#highlight-border);
- }
- .flow-container .flow-node__body {
- fill: transparent;
- stroke: attr(fill);
- }
- .flow-linking .flow-node__socket:not(.flow-node__socket--match) {
- fill: var(--primary) !important;
- stroke: var(--primary) !important;
- }
- /*
- * CHAT
- */
- .flow-chat {
- background: var(--background-secondary) !important;
- color: var(--normal);
- }
- .flow-chat__toggle {
- border: none;
- background: var(--background-secondary) !important;
- }
- .flow-chat .message .text {
- color: #999;
- }
- .flow-chat input.message {
- box-shadow: none !important;
- background: var(--background) !important;
- color: var(--normal);
- }
- }
|