projects/c0de.it
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dsfsdf
All checks were successful
Deploy / deploy (push) Successful in 44s
Details

Browse Source
This commit is contained in:
Lars Gebhardt-Kusche
2026-05-17 00:47:09 +02:00
parent 8647bff20f
commit f5bb37f96e
2 changed files with 174 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
public/assets/app.css
View File

@@ -197,6 +197,11 @@ button, input, select {
padding: 14px;
display: grid;
gap: 10px;
cursor: grab;
}
.component-card:active {
cursor: grabbing;
}
.component-card__preview {
@@ -400,12 +405,19 @@ button, input, select {
pointer-events: auto;
cursor: pointer;
z-index: 3;
opacity: 0.32;
transition: opacity 120ms ease, transform 120ms ease;
}
.rack-insert-zone.is-disabled {
cursor: not-allowed;
}
.rack-insert-zone.is-preview,
.rack-insert-zone:hover {
opacity: 1;
}
.rack-insert-zone__ear {
width: 28px;
height: calc(100% - 4px);
@@ -482,11 +494,11 @@ button, input, select {
user-select: none;
overflow: hidden;
border-radius: 8px;
border: 1px solid rgba(34, 38, 44, 0.55);
background: linear-gradient(180deg, rgba(237, 241, 246, 0.96), rgba(205, 213, 222, 0.96));
border: 1px solid rgba(32, 36, 42, 0.8);
background: linear-gradient(180deg, rgba(235, 239, 244, 0.98), rgba(191, 200, 211, 0.98));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.9),
0 10px 18px rgba(5, 6, 7, 0.28);
inset 0 1px 0 rgba(255, 255, 255, 0.94),
0 8px 14px rgba(5, 6, 7, 0.24);
touch-action: none;
cursor: grab;
}
@@ -509,8 +521,10 @@ button, input, select {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 8px 10px 8px 12px;
background: linear-gradient(90deg, rgba(250, 251, 252, 0.86), rgba(250, 251, 252, 0.08) 38%, rgba(250, 251, 252, 0.72));
padding: 6px 10px 6px 10px;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 42%),
linear-gradient(90deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.06) 34%, rgba(255, 255, 255, 0.18));
}
.rack-item__face {
@@ -527,6 +541,7 @@ button, input, select {
.rack-item__header strong {
color: #17191c;
font-size: 1rem;
}
.rack-item__drag-hint {
@@ -537,6 +552,7 @@ button, input, select {
color: rgba(245, 247, 250, 0.95);
font-size: 0.72rem;
letter-spacing: 0.04em;
pointer-events: none;
}
.rack-item__remove {
@@ -557,6 +573,10 @@ button, input, select {
cursor: pointer;
}
.rack-item__remove:hover {
background: rgba(134, 24, 24, 0.88);
}
.subpanel {
padding: 16px;
display: grid;
@@ -646,7 +666,7 @@ button, input, select {
position: relative;
width: 100%;
height: 100%;
padding: 8px 28px;
padding: 6px 24px;
overflow: hidden;
}
@@ -699,7 +719,7 @@ button, input, select {
.device-brand {
position: absolute;
top: 7px;
top: 6px;
left: 36px;
font-size: 0.72rem;
letter-spacing: 0.04em;
@@ -710,7 +730,7 @@ button, input, select {
.device-silkscreen {
position: absolute;
left: 36px;
bottom: 8px;
bottom: 6px;
font-size: 0.7rem;
letter-spacing: 0.12em;
text-transform: uppercase;
@@ -765,7 +785,8 @@ button, input, select {
position: absolute;
left: 40px;
right: 70px;
top: 22px;
top: 48%;
transform: translateY(-50%);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
@@ -792,7 +813,8 @@ button, input, select {
position: absolute;
left: 40px;
right: 40px;
top: 20px;
top: 48%;
transform: translateY(-50%);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
@@ -807,10 +829,11 @@ button, input, select {
.device-uplink {
position: absolute;
top: 20px;
top: 50%;
right: 40px;
width: 22px;
height: 16px;
transform: translateY(-50%);
border-radius: 4px;
border: 1px solid rgba(110, 117, 127, 0.25);
background: linear-gradient(180deg, #5b646f, #262b31);
@@ -818,9 +841,10 @@ button, input, select {
.device-sockets {
position: absolute;
top: 18px;
top: 50%;
left: 40px;
right: 56px;
transform: translateY(-50%);
grid-template-columns: repeat(8, minmax(0, 1fr));
align-items: center;
}
@@ -838,9 +862,10 @@ button, input, select {
.device-display {
position: absolute;
left: 40px;
top: 16px;
top: 50%;
width: 68px;
height: 30px;
transform: translateY(-50%);
border-radius: 8px;
background:
linear-gradient(180deg, rgba(46, 180, 156, 0.9), rgba(18, 97, 90, 0.92)),
@@ -852,10 +877,11 @@ button, input, select {
.device-vents {
position: absolute;
top: 18px;
top: 50%;
right: 42px;
width: 96px;
height: 22px;
transform: translateY(-50%);
background:
repeating-linear-gradient(90deg, rgba(102, 108, 118, 0.36) 0 3px, transparent 3px 7px);
opacity: 0.8;
@@ -879,8 +905,9 @@ button, input, select {
position: absolute;
left: 40px;
right: 40px;
top: 18px;
top: 50%;
height: 18px;
transform: translateY(-50%);
border-radius: 4px 4px 12px 12px;
background: linear-gradient(180deg, #d1d7df, #8f98a4);
box-shadow: 0 5px 12px rgba(78, 82, 90, 0.18);