SILVER/NODEDC_TASKMANAGER
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: настройки проекта, модалки и drag-and-drop канон

Browse Source
This commit is contained in:
DCCONSTRUCTIONS
2026-04-20 09:22:37 +03:00
parent bd7a7d96fe
commit df68c96795
47 changed files with 703 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plane-src/apps/web/styles/globals.css
+259 -3
View File
@@ -30,6 +30,9 @@
--nodedc-accent-rgb: 51 163 255;
--nodedc-card-passive-rgb: 42 43 46;
--nodedc-card-active-rgb: 195 255 102;
--brand-default: rgb(var(--nodedc-accent-rgb));
--brand-300: color-mix(in srgb, rgb(var(--nodedc-accent-rgb)) 35%, white);
--brand-700: color-mix(in srgb, rgb(var(--nodedc-accent-rgb)) 75%, black);
/* end background colors */
}
/* background colors */
@@ -419,7 +422,7 @@
box-shadow: none !important;
border-radius: 999px !important;
min-height: 2.5rem;
padding-inline: 1rem;
padding-inline: 1.35rem;
background: rgba(18, 18, 22, 0.94) !important;
color: var(--text-color-primary) !important;
transition:
@@ -428,6 +431,11 @@
transform 160ms ease;
}
.nodedc-toolbar-pill-wide {
min-width: 9.75rem;
padding-inline: 1.75rem;
}
.nodedc-toolbar-pill:hover {
background: rgba(24, 24, 29, 0.96) !important;
}
@@ -442,13 +450,261 @@
box-shadow: none !important;
border-radius: 999px !important;
min-height: 2.5rem;
padding-inline: 1rem;
padding-inline: 1.55rem;
background: rgb(var(--nodedc-accent-rgb)) !important;
color: #0b1117 !important;
}
.nodedc-toolbar-primary-wide {
min-width: 13rem;
padding-inline: 2rem;
}
.nodedc-toolbar-primary:hover {
background: rgba(var(--nodedc-accent-rgb), 0.92) !important;
background: color-mix(in srgb, rgb(var(--nodedc-accent-rgb)) 82%, white) !important;
}
.nodedc-modal-secondary-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgba(255, 255, 255, 0.06) !important;
color: var(--text-color-primary) !important;
padding-inline: 1.25rem !important;
}
.nodedc-modal-secondary-button:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
.nodedc-modal-primary-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgb(var(--nodedc-card-active-rgb)) !important;
color: #0b1117 !important;
padding-inline: 1.25rem !important;
}
.nodedc-modal-primary-button:hover {
background: color-mix(in srgb, rgb(var(--nodedc-card-active-rgb)) 82%, white) !important;
}
.nodedc-modal-danger-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
padding-inline: 1.25rem !important;
}
.nodedc-modal-chip {
min-height: 2.5rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.012) 100%),
rgba(255, 255, 255, 0.028) !important;
color: var(--text-color-secondary) !important;
padding-inline: 1rem !important;
}
.nodedc-modal-chip:hover {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.038) 0%, rgba(255, 255, 255, 0.016) 100%),
rgba(255, 255, 255, 0.04) !important;
}
.nodedc-settings-card {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.026) 0%, rgba(255, 255, 255, 0.01) 100%),
rgba(255, 255, 255, 0.032);
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.35rem !important;
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
}
.nodedc-settings-field {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%),
rgba(255, 255, 255, 0.03) !important;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
transition: background 160ms ease;
}
.nodedc-settings-field:hover,
.nodedc-settings-field:focus-within {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.038) 0%, rgba(255, 255, 255, 0.016) 100%),
rgba(255, 255, 255, 0.042) !important;
}
.nodedc-settings-input {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%),
rgba(255, 255, 255, 0.03) !important;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
min-height: 3rem;
color: var(--text-color-primary) !important;
font-size: 0.875rem !important;
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
}
.nodedc-settings-input:focus,
.nodedc-settings-input:focus-visible {
outline: none !important;
box-shadow: none !important;
}
.nodedc-settings-select {
min-height: 3rem !important;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%),
rgba(255, 255, 255, 0.03) !important;
color: var(--text-color-primary) !important;
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
}
.nodedc-settings-select:hover,
.nodedc-settings-select:focus-visible {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.038) 0%, rgba(255, 255, 255, 0.016) 100%),
rgba(255, 255, 255, 0.042) !important;
}
.nodedc-settings-chip {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%),
rgba(255, 255, 255, 0.03) !important;
color: var(--text-color-primary) !important;
padding-inline: 1rem !important;
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
}
.nodedc-settings-chip:hover {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.038) 0%, rgba(255, 255, 255, 0.016) 100%),
rgba(255, 255, 255, 0.042) !important;
}
.nodedc-settings-primary-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgb(var(--nodedc-card-active-rgb)) !important;
color: #0b1117 !important;
padding-inline: 1.35rem !important;
}
.nodedc-settings-primary-button:hover {
background: color-mix(in srgb, rgb(var(--nodedc-card-active-rgb)) 82%, white) !important;
color: #0b1117 !important;
}
.nodedc-settings-save-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgb(var(--nodedc-card-active-rgb)) !important;
color: #0b1117 !important;
padding-inline: 1.45rem !important;
}
.nodedc-settings-save-button:hover {
background: color-mix(in srgb, rgb(var(--nodedc-card-active-rgb)) 82%, white) !important;
color: #0b1117 !important;
}
.nodedc-overlay-button {
min-height: 2.5rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.05rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.018) 100%),
rgba(8, 8, 10, 0.58) !important;
color: #f5f7fb !important;
padding-inline: 1rem !important;
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
transition:
background 120ms ease,
color 120ms ease,
transform 120ms ease;
}
.nodedc-overlay-button:hover {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.075) 0%, rgba(255, 255, 255, 0.03) 100%),
rgba(8, 8, 10, 0.72) !important;
color: #ffffff !important;
}
.nodedc-settings-secondary-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgba(255, 255, 255, 0.06) !important;
color: var(--text-color-primary) !important;
padding-inline: 1.25rem !important;
}
.nodedc-settings-secondary-button:hover {
background: rgba(255, 255, 255, 0.1) !important;
color: var(--text-color-primary) !important;
}
.nodedc-settings-danger-button {
min-height: 2.75rem;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 1.25rem !important;
background: rgba(255, 82, 82, 0.14) !important;
color: rgb(255, 141, 141) !important;
padding-inline: 1.25rem !important;
}
.nodedc-settings-danger-button:hover {
background: rgba(255, 82, 82, 0.2) !important;
color: rgb(255, 162, 162) !important;
}
.nodedc-toolbar-filter-toggle {