Update VPN client and gateway behavior
This commit is contained in:
+22
-11
@@ -40,7 +40,9 @@ p {
|
||||
min-height: 100vh;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font: 700 16px/1 'JetBrains Mono', 'SF Mono', ui-monospace, Menlo, monospace;
|
||||
font: var(--type-section-title);
|
||||
letter-spacing: var(--type-section-title-tracking);
|
||||
text-transform: var(--type-section-title-transform);
|
||||
color: light-dark(oklch(0.42 0.01 145), oklch(0.76 0.01 145));
|
||||
background: light-dark(oklch(0.965 0.006 145), oklch(0.18 0.012 145));
|
||||
}
|
||||
@@ -54,27 +56,31 @@ p {
|
||||
padding: 32px;
|
||||
background: light-dark(oklch(0.965 0.006 145), oklch(0.18 0.012 145));
|
||||
color: light-dark(oklch(0.24 0.014 145), oklch(0.93 0.008 145));
|
||||
font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, Menlo, monospace;
|
||||
font-family: var(--font-family-client);
|
||||
}
|
||||
|
||||
.app-boot > span,
|
||||
.app-boot summary {
|
||||
color: light-dark(oklch(0.53 0.014 145), oklch(0.68 0.012 145));
|
||||
font-size: 11px;
|
||||
font: var(--type-body);
|
||||
letter-spacing: var(--type-body-tracking);
|
||||
text-transform: var(--type-body-transform);
|
||||
}
|
||||
|
||||
.app-boot h1 {
|
||||
max-width: 22ch;
|
||||
margin: 0;
|
||||
font-size: clamp(22px, 5vw, 34px);
|
||||
letter-spacing: -0.05em;
|
||||
font: var(--type-drawer-title);
|
||||
letter-spacing: var(--type-drawer-title-tracking);
|
||||
text-transform: var(--type-drawer-title-transform);
|
||||
}
|
||||
|
||||
.app-boot p {
|
||||
max-width: 58ch;
|
||||
color: light-dark(oklch(0.53 0.014 145), oklch(0.68 0.012 145));
|
||||
font-size: 12px;
|
||||
line-height: 1.7;
|
||||
font: var(--type-data);
|
||||
letter-spacing: var(--type-data-tracking);
|
||||
text-transform: var(--type-data-transform);
|
||||
}
|
||||
|
||||
.app-boot button,
|
||||
@@ -106,8 +112,9 @@ p {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
margin: 12px 0 0;
|
||||
font-size: 11px;
|
||||
line-height: 1.6;
|
||||
font: var(--type-body);
|
||||
letter-spacing: var(--type-body-tracking);
|
||||
text-transform: var(--type-body-transform);
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
@@ -126,7 +133,9 @@ p {
|
||||
box-shadow: 0 10px 32px oklch(0.08 0.015 145 / 0.14);
|
||||
backdrop-filter: blur(12px);
|
||||
color: var(--client-muted);
|
||||
font: 600 10px/1.3 'JetBrains Mono', 'SF Mono', ui-monospace, Menlo, monospace;
|
||||
font: var(--type-control);
|
||||
letter-spacing: var(--type-control-tracking);
|
||||
text-transform: var(--type-control-transform);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
@@ -136,5 +145,7 @@ p {
|
||||
|
||||
.client-stale-banner button {
|
||||
color: var(--client-text);
|
||||
font-size: 10px;
|
||||
font: var(--type-control);
|
||||
letter-spacing: var(--type-control-tracking);
|
||||
text-transform: var(--type-control-transform);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user