This commit is contained in:
Mateusz Gruszczyński
2026-09-17 13:11:37 +02:00
parent 86a6fa1f2f
commit eede4e88e6
10 changed files with 145 additions and 20 deletions
+22 -3
View File
@@ -695,6 +695,12 @@ textarea:focus {
background: var(--success);
}
.status__dot.is-connecting,
.status__dot.is-reconnecting {
background: var(--warning);
}
.status__dot.is-error,
.status__dot.is-offline {
background: var(--danger);
}
@@ -710,9 +716,9 @@ textarea:focus {
align-items: center;
gap: 12px;
padding: 11px 14px;
border: 1px solid color-mix(in srgb, var(--danger) 48%, var(--border-strong));
border: 1px solid color-mix(in srgb, var(--warning) 48%, var(--border-strong));
border-radius: 12px;
background: color-mix(in srgb, var(--surface-strong, var(--surface-strong)) 94%, var(--danger));
background: color-mix(in srgb, var(--surface-strong, var(--surface-strong)) 94%, var(--warning));
box-shadow: 0 16px 42px var(--shadow-38);
opacity: 0;
pointer-events: none;
@@ -725,6 +731,11 @@ textarea:focus {
transform: translate(-50%, 0) scale(1);
}
.connection-notice.is-error {
border-color: color-mix(in srgb, var(--danger) 58%, var(--border-strong));
background: color-mix(in srgb, var(--surface-strong, var(--surface-strong)) 94%, var(--danger));
}
.connection-notice.is-restored {
border-color: color-mix(in srgb, var(--success) 58%, var(--border-strong));
background: color-mix(in srgb, var(--surface-strong, var(--surface-strong)) 94%, var(--success));
@@ -739,6 +750,10 @@ textarea:focus {
flex: 0 0 auto;
gap: 3px;
border-radius: 50%;
background: color-mix(in srgb, var(--warning) 18%, transparent);
}
.connection-notice.is-error .connection-notice__signal {
background: color-mix(in srgb, var(--danger) 18%, transparent);
}
@@ -750,10 +765,14 @@ textarea:focus {
width: 3px;
height: 10px;
border-radius: 3px;
background: var(--danger);
background: var(--warning);
animation: connection-pulse .9s ease-in-out infinite;
}
.connection-notice.is-error .connection-notice__signal span {
background: var(--danger);
}
.connection-notice__signal span:nth-child(2) {
animation-delay: .12s;
}