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

UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: доработка главной сводки и быстрых проектов

Browse Source
This commit is contained in:
DCCONSTRUCTIONS
2026-04-25 23:49:44 +03:00
parent 7d520c7aaf
commit ba996998e8
9 changed files with 710 additions and 199 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plane-src/apps/web/styles/globals.css
+413 -30
View File
@@ -1790,6 +1790,60 @@
box-shadow 160ms ease;
}
.nodedc-home-route-surface {
min-height: 100vh;
background: #333333 !important;
}
main:has(.nodedc-home-route-surface) {
background: #333333 !important;
}
.nodedc-home-page-shell {
max-width: min(1840px, calc(100vw - 5rem));
}
.nodedc-home-top-toolbar > .nodedc-glass-modal {
max-width: min(1840px, calc(100vw - 5rem));
margin-inline: auto;
border: 0 !important;
background: transparent !important;
padding-inline: 0 !important;
box-shadow: none !important;
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
.nodedc-home-top-toolbar {
padding-inline: 0 !important;
}
.nodedc-home-dashboard-shell {
gap: 0.75rem;
}
.nodedc-home-dashboard-grid {
align-items: stretch;
gap: 0.75rem;
}
.nodedc-home-lower-grid {
gap: 0.75rem;
align-items: stretch;
}
.nodedc-home-project-panel {
margin-top: 1.75rem;
height: calc(100% - 1.75rem) !important;
min-height: 0;
}
.nodedc-home-main-column {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.nodedc-home-hero {
position: relative;
overflow: hidden;
@@ -1797,17 +1851,16 @@
border: 0 !important;
outline: none !important;
border-radius: 1.9rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.008) 100%), rgba(10, 10, 12, 0.74) !important;
padding: 1rem;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.022) !important;
-webkit-backdrop-filter: blur(28px);
backdrop-filter: blur(28px);
background: transparent !important;
padding: 0;
box-shadow: none !important;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
@media (min-width: 768px) {
.nodedc-home-hero {
padding: 1.2rem;
padding: 0;
}
}
@@ -1817,42 +1870,58 @@
justify-content: flex-end;
gap: 0.8rem;
min-height: 1.75rem;
padding: 0.15rem 0.35rem 0.85rem;
padding: 0.1rem 0.35rem 0.45rem;
text-align: right;
}
.nodedc-home-hero-grid {
--nodedc-home-title-width: 13.25rem;
display: grid;
min-width: 0;
gap: 1rem;
position: relative;
min-height: 8.55rem;
}
@media (min-width: 1280px) {
.nodedc-home-hero-grid {
grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
grid-template-columns: minmax(0, 1fr);
align-items: stretch;
}
}
.nodedc-home-hero-title-cell {
position: absolute;
inset: 0;
z-index: 1;
display: flex;
min-height: 8rem;
min-height: 8.55rem;
flex-direction: column;
justify-content: flex-end;
justify-content: center;
border-radius: 1.7rem;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.022), rgba(255, 255, 255, 0.006)), rgba(0, 0, 0, 0.18);
background: #474747 !important;
padding: 1.25rem;
padding-right: max(1.25rem, calc(100% - var(--nodedc-home-title-width)));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}
.nodedc-home-hero-title-cell h1 {
max-width: 16rem;
max-width: 18rem;
color: var(--text-color-primary);
font-size: clamp(2rem, 3vw, 3.35rem);
font-size: clamp(1.05rem, 1.25vw, 1.45rem);
font-weight: 700;
line-height: 0.92;
line-height: 1.02;
letter-spacing: 0;
}
.nodedc-home-hero-title-label {
margin-bottom: 0.45rem;
color: var(--text-color-secondary);
font-size: 0.7rem;
font-weight: 650;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.nodedc-home-hero-title-cell p {
margin-top: 0.75rem;
color: var(--text-color-secondary);
@@ -1886,21 +1955,58 @@
}
.nodedc-home-market-band {
position: absolute;
top: 0;
right: 0;
left: var(--nodedc-home-title-width);
z-index: 2;
display: flex;
width: auto;
min-width: 0;
min-height: 8rem;
min-height: 8.55rem;
align-items: flex-end;
gap: 1.5rem;
border-radius: 1.7rem;
gap: 1rem;
border-radius: 1.7rem !important;
background: rgb(var(--nodedc-card-active-rgb)) !important;
padding: 1.25rem;
padding: 1rem;
color: rgb(var(--nodedc-on-card-active-rgb));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.42),
0 18px 42px rgba(0, 0, 0, 0.18) !important;
}
.nodedc-home-market-focus-title {
line-height: 1.22 !important;
}
.nodedc-home-market-progress {
height: 1.05rem;
margin-top: 0.5rem;
overflow: hidden;
border-radius: 999px;
background: rgba(0, 0, 0, 0.18);
}
@media (max-width: 767px) {
.nodedc-home-hero-grid {
display: flex;
min-height: auto;
flex-direction: column;
gap: 0.75rem;
}
.nodedc-home-hero-title-cell,
.nodedc-home-market-band {
position: relative;
inset: auto;
width: 100%;
min-height: 6rem;
}
.nodedc-home-hero-title-cell {
padding: 1rem;
}
.nodedc-home-market-band {
flex-direction: column;
align-items: stretch;
@@ -1913,11 +2019,10 @@
isolation: isolate;
min-height: 30rem;
border-radius: 2rem !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.026) 0%, rgba(255, 255, 255, 0.008) 100%), rgba(8, 8, 10, 0.78) !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02) !important;
-webkit-backdrop-filter: blur(28px);
backdrop-filter: blur(28px);
background: #050506 !important;
box-shadow: none !important;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
.nodedc-home-gantt-toolbar {
@@ -1926,11 +2031,67 @@
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
justify-content: flex-start;
gap: 1rem;
padding: 1.25rem;
}
.nodedc-home-gantt-toolbar-spacer {
display: none;
}
.nodedc-home-gantt-controls {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
gap: 0.65rem;
}
.nodedc-home-gantt-range-group {
display: inline-flex;
align-items: center;
gap: 0.15rem;
border-radius: 999px;
background: #171718;
padding: 0.2rem;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.045),
0 14px 28px rgba(0, 0, 0, 0.24);
}
.nodedc-home-gantt-range-button {
display: inline-flex;
height: 2.15rem;
min-width: 2.15rem;
align-items: center;
justify-content: center;
border: 0 !important;
outline: none !important;
border-radius: 999px !important;
background: transparent !important;
padding-inline: 0.82rem;
color: var(--text-color-secondary);
font-size: 0.72rem;
font-weight: 800;
transition:
background 160ms ease,
color 160ms ease,
transform 160ms ease;
}
.nodedc-home-gantt-range-button:hover {
color: var(--text-color-primary);
}
.nodedc-home-gantt-range-button-active {
background: rgb(var(--nodedc-card-active-rgb)) !important;
color: rgb(var(--nodedc-on-card-active-rgb)) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.42),
0 10px 22px rgba(var(--nodedc-card-active-rgb), 0.18);
}
.nodedc-home-gantt-chip {
display: inline-flex;
height: 2.35rem;
@@ -1961,10 +2122,34 @@
border: 0 !important;
outline: none !important;
border-radius: 999px !important;
background: rgba(0, 0, 0, 0.42) !important;
background: #151516 !important;
color: var(--text-color-primary);
}
.nodedc-home-gantt-filter-button-has-count {
display: inline-flex !important;
width: auto;
min-width: 3.85rem;
gap: 0.45rem;
padding-inline: 0.72rem;
background: rgba(0, 0, 0, 0.56) !important;
color: var(--text-color-primary) !important;
}
.nodedc-home-gantt-filter-count {
display: grid;
width: 1.25rem;
min-width: 1.25rem;
height: 1.25rem;
place-items: center;
border-radius: 999px;
background: rgba(255, 255, 255, 0.96);
color: #08080a;
font-size: 0.68rem;
font-weight: 900;
line-height: 1;
}
.nodedc-home-gantt-round-button:hover {
background: rgba(0, 0, 0, 0.58) !important;
}
@@ -1979,6 +2164,12 @@
display: inline-flex;
align-items: center;
gap: 0.5rem;
border-radius: 999px;
background: #0f0f10;
padding: 0.2rem;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.03),
0 14px 28px rgba(0, 0, 0, 0.22);
}
.nodedc-home-gantt-popover {
@@ -2092,7 +2283,7 @@
margin: 0 1.25rem 1.25rem;
overflow: hidden;
border-radius: 1.75rem;
background: rgba(0, 0, 0, 0.28);
background: #050506;
}
.nodedc-home-gantt-scroll {
@@ -2121,7 +2312,9 @@
position: relative;
min-height: 23.5rem;
padding: 1rem;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px) 0 0 / 100% 4.2rem;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px) 0 0 / 100% 4.2rem,
#050506;
}
.nodedc-home-gantt-floating {
@@ -2141,6 +2334,48 @@
backdrop-filter: blur(24px);
}
.nodedc-home-gantt-inspector {
position: absolute;
top: 5.35rem;
left: calc(12rem + 2.25rem);
z-index: 6;
width: min(31rem, calc(100% - 16rem));
min-height: 11.5rem;
border: 1px solid rgba(255, 255, 255, 0.065);
border-radius: 1.65rem;
background:
linear-gradient(135deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.025) 44%, rgba(255, 255, 255, 0.08)),
rgba(34, 34, 38, 0.58);
padding: 1rem 1.05rem 1.05rem 3.85rem;
box-shadow:
0 22px 60px rgba(0, 0, 0, 0.42),
inset 0 1px 0 rgba(255, 255, 255, 0.16);
-webkit-backdrop-filter: blur(28px) saturate(1.22);
backdrop-filter: blur(28px) saturate(1.22);
}
.nodedc-home-gantt-inspector-close {
position: absolute;
top: 0.72rem;
left: 0.72rem;
display: grid;
width: 2.35rem;
min-width: 2.35rem;
height: 2.35rem;
place-items: center;
border: 0 !important;
outline: none !important;
border-radius: 1.05rem !important;
background: rgba(0, 0, 0, 0.44) !important;
color: rgba(255, 255, 255, 0.82);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.nodedc-home-gantt-inspector-close:hover {
background: rgba(0, 0, 0, 0.62) !important;
color: rgb(var(--nodedc-card-active-rgb));
}
.nodedc-home-gantt-grid {
position: absolute;
top: 1rem;
@@ -2239,6 +2474,20 @@
align-items: center;
gap: 1rem;
min-height: 3.45rem;
cursor: pointer;
border-radius: 1.05rem;
transition:
background 140ms ease,
color 140ms ease;
}
.nodedc-home-gantt-row:hover,
.nodedc-home-gantt-row-selected {
background: rgba(255, 255, 255, 0.035);
}
.nodedc-home-gantt-row-selected .nodedc-home-gantt-row-label {
color: rgb(var(--nodedc-card-active-rgb));
}
.nodedc-home-gantt-row-compact {
@@ -2257,7 +2506,7 @@
left: 0;
z-index: 2;
border-radius: 1rem;
background: linear-gradient(90deg, rgba(7, 7, 9, 0.94) 0%, rgba(7, 7, 9, 0.72) 76%, transparent 100%);
background: linear-gradient(90deg, #050506 0%, rgba(5, 5, 6, 0.78) 76%, transparent 100%);
padding: 0.45rem 0.75rem 0.45rem 0;
}
@@ -2275,6 +2524,7 @@
height: 1.4rem;
min-width: 2.5rem;
border-radius: 999px;
cursor: pointer;
}
.nodedc-home-gantt-bar-accent {
@@ -2757,6 +3007,131 @@
opacity: 0.8;
}
.nodedc-home-project-quick-list {
display: flex;
width: calc(100% + 2rem);
margin-inline: -1rem;
flex-direction: column;
gap: 0;
overflow: hidden;
border-radius: 1.25rem;
background: rgba(8, 8, 10, 0.62);
}
.nodedc-home-project-quick-button {
display: flex;
width: 100%;
min-height: 3.22rem;
align-items: center;
justify-content: space-between;
gap: 0.8rem;
border: 0 !important;
outline: none !important;
border-radius: 0 !important;
background: rgba(255, 255, 255, 0.028) !important;
padding: 0.7rem 0.9rem;
color: var(--text-color-primary);
font-size: 0.95rem;
font-weight: 520;
text-align: left;
transition:
background 160ms ease,
color 160ms ease,
transform 160ms ease,
box-shadow 160ms ease;
}
.nodedc-home-project-quick-button + .nodedc-home-project-quick-button {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}
.nodedc-home-project-quick-button:first-child {
border-top-left-radius: 1.25rem !important;
border-top-right-radius: 1.25rem !important;
}
.nodedc-home-project-quick-button:last-child {
border-bottom-right-radius: 1.25rem !important;
border-bottom-left-radius: 1.25rem !important;
}
.nodedc-home-project-quick-button:hover {
background: rgba(255, 255, 255, 0.08) !important;
color: var(--text-color-primary);
transform: translateY(-1px);
}
.nodedc-home-project-quick-button[data-active="true"] {
background: rgba(255, 255, 255, 0.13) !important;
color: var(--text-color-primary);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09);
}
.nodedc-home-project-quick-main {
display: flex;
min-width: 0;
align-items: center;
gap: 0.62rem;
}
.nodedc-home-project-quick-logo {
display: grid;
width: 1.7rem;
min-width: 1.7rem;
height: 1.7rem;
place-items: center;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.nodedc-home-project-quick-button[data-active="true"] .nodedc-home-project-quick-logo {
background: rgba(var(--nodedc-card-active-rgb), 0.92);
color: #0a0a0b;
}
.nodedc-home-project-quick-metric {
display: inline-flex;
min-width: max-content;
align-items: center;
gap: 0.38rem;
font-size: 0.72rem;
font-weight: 650;
opacity: 0.78;
}
.nodedc-home-project-quick-dot {
display: block;
width: 0.48rem;
height: 0.48rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.58);
}
.nodedc-home-project-quick-button[data-active="true"] .nodedc-home-project-quick-dot {
background: rgb(var(--nodedc-card-active-rgb));
}
.nodedc-home-project-focus-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
background: transparent !important;
padding: 0 !important;
}
.nodedc-home-project-focus-item {
min-width: 0;
overflow: hidden;
border-radius: 0 !important;
background: transparent !important;
padding-inline: 0.75rem !important;
}
.nodedc-home-project-focus-value {
min-width: 0;
line-height: 1.2;
overflow-wrap: anywhere;
}
.nodedc-home-user-card {
position: relative;
overflow: hidden;
@@ -3020,6 +3395,14 @@
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.01) !important;
}
.nodedc-home-operations-card {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.022) 0%, rgba(255, 255, 255, 0.006) 100%),
rgba(10, 10, 12, 0.68) !important;
-webkit-backdrop-filter: blur(28px);
backdrop-filter: blur(28px);
}
.nodedc-home-soft-badge {
background: rgba(0, 0, 0, 0.34) !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.01) !important;