refactor(map): remove access gate
This commit is contained in:
lingniu
+61
-80
@@ -290,80 +290,6 @@ body {
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.segment-btn.is-locked::after {
|
||||
content: '⌁';
|
||||
margin-left: 1px;
|
||||
color: var(--text-sub);
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.access-trigger {
|
||||
min-height: 28px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid rgba(0, 113, 67, 0.18);
|
||||
border-radius: 8px;
|
||||
background: rgba(0, 113, 67, 0.07);
|
||||
color: var(--accent-primary);
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
|
||||
}
|
||||
|
||||
.access-trigger:hover { border-color: rgba(0, 113, 67, 0.34); background: rgba(0, 113, 67, 0.12); transform: translateY(-1px); }
|
||||
.access-trigger.is-authorized { border-color: rgba(2, 132, 199, 0.25); background: rgba(2, 132, 199, 0.09); color: var(--accent-blue); }
|
||||
|
||||
.access-dialog {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
margin: auto;
|
||||
width: min(390px, calc(100vw - 32px));
|
||||
max-height: calc(100dvh - 32px);
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 20px;
|
||||
background: transparent;
|
||||
color: var(--text-main);
|
||||
box-shadow: 0 24px 80px rgba(15, 23, 42, 0.3);
|
||||
}
|
||||
|
||||
.access-dialog::backdrop { background: rgba(15, 23, 42, 0.42); backdrop-filter: blur(5px); }
|
||||
|
||||
.access-dialog-card {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
padding: 22px;
|
||||
border: 1px solid var(--glass-border);
|
||||
border-radius: inherit;
|
||||
background: color-mix(in srgb, var(--glass-bg) 98%, white);
|
||||
}
|
||||
|
||||
.access-dialog-icon {
|
||||
display: grid;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
place-items: center;
|
||||
border-radius: 12px;
|
||||
background: rgba(0, 113, 67, 0.1);
|
||||
color: var(--accent-primary);
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.access-dialog-heading h2 { margin: 0; font-size: 18px; letter-spacing: -0.02em; }
|
||||
.access-dialog-heading p { margin: 6px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.6; }
|
||||
.access-session-note { margin: -7px 0 0; padding: 9px 10px; border-radius: 10px; background: rgba(2, 132, 199, 0.08); color: #0369a1; font-size: 11px; line-height: 1.55; }
|
||||
|
||||
.access-code-field { display: grid; gap: 7px; color: var(--text-muted); font-size: 11px; font-weight: 700; }
|
||||
.access-code-field input { width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--glass-border); border-radius: 10px; outline: 0; background: var(--pill-bg); color: var(--text-main); font: 13px/1.2 'JetBrains Mono', monospace; box-sizing: border-box; }
|
||||
.access-code-field input:focus { border-color: rgba(2, 132, 199, 0.5); box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.1); }
|
||||
.access-dialog-error { margin: -6px 0 0; color: #dc2626; font-size: 11px; }
|
||||
.access-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
||||
.access-cancel-btn, .access-submit-btn { min-height: 36px; padding: 0 13px; border-radius: 9px; font-size: 12px; font-weight: 700; cursor: pointer; }
|
||||
.access-cancel-btn { border: 1px solid var(--glass-border); background: transparent; color: var(--text-muted); }
|
||||
.access-submit-btn { border: 1px solid var(--accent-primary); background: var(--accent-primary); color: white; }
|
||||
.access-submit-btn:disabled { opacity: 0.58; cursor: wait; }
|
||||
|
||||
.bw-svg {
|
||||
stroke: currentColor;
|
||||
}
|
||||
@@ -795,6 +721,55 @@ body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.navigation-launch-overlay {
|
||||
position: absolute;
|
||||
z-index: 28;
|
||||
inset: 0;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 22px;
|
||||
background: rgba(15, 23, 42, 0.14);
|
||||
backdrop-filter: blur(1.5px);
|
||||
-webkit-backdrop-filter: blur(1.5px);
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
transition: opacity 0.18s ease;
|
||||
}
|
||||
|
||||
.navigation-launch-overlay[hidden] { display: none; }
|
||||
.navigation-launch-overlay.is-visible { opacity: 1; pointer-events: auto; }
|
||||
|
||||
.navigation-launch-panel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 11px;
|
||||
max-width: min(280px, calc(100vw - 48px));
|
||||
padding: 13px 15px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.64);
|
||||
border-radius: 16px;
|
||||
background: color-mix(in srgb, var(--glass-bg) 94%, white);
|
||||
box-shadow: 0 18px 42px rgba(15, 23, 42, 0.2);
|
||||
transform: translateY(8px) scale(0.97);
|
||||
transition: transform 0.22s cubic-bezier(.2, .75, .25, 1);
|
||||
}
|
||||
|
||||
.navigation-launch-overlay.is-visible .navigation-launch-panel { transform: translateY(0) scale(1); }
|
||||
.navigation-launch-panel strong, .navigation-launch-panel span { display: block; }
|
||||
.navigation-launch-panel strong { color: var(--text-main); font-size: 12px; line-height: 1.35; }
|
||||
.navigation-launch-panel div > span { margin-top: 2px; color: var(--text-muted); font-size: 10px; line-height: 1.45; }
|
||||
|
||||
.navigation-launch-spinner {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex: 0 0 20px;
|
||||
border: 2px solid rgba(0, 113, 67, 0.18);
|
||||
border-top-color: var(--accent-primary);
|
||||
border-radius: 50%;
|
||||
animation: navigation-spin 0.78s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes navigation-spin { to { transform: rotate(360deg); } }
|
||||
|
||||
.map-detail-card {
|
||||
position: absolute;
|
||||
left: 14px;
|
||||
@@ -910,6 +885,17 @@ body {
|
||||
.detail-navigate-btn:hover { transform: translateY(-1px); border-color: rgba(0, 113, 67, 0.34); background: rgba(0, 113, 67, 0.15); }
|
||||
.detail-navigate-btn:disabled { cursor: default; opacity: 0.45; }
|
||||
.detail-navigate-btn svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.9; }
|
||||
.detail-navigate-btn.is-launching { transform: scale(0.92); background: rgba(0, 113, 67, 0.17); }
|
||||
.detail-navigate-btn.is-launching svg { animation: navigation-pulse 0.7s ease-in-out infinite alternate; }
|
||||
|
||||
@keyframes navigation-pulse { to { transform: scale(1.15); } }
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.navigation-launch-overlay,
|
||||
.navigation-launch-panel { transition: none; }
|
||||
.navigation-launch-spinner,
|
||||
.detail-navigate-btn.is-launching svg { animation: none; }
|
||||
}
|
||||
|
||||
.detail-grid {
|
||||
display: grid;
|
||||
@@ -1462,16 +1448,11 @@ body {
|
||||
}
|
||||
|
||||
.segment-btn,
|
||||
.bw-btn,
|
||||
.access-trigger {
|
||||
.bw-btn {
|
||||
padding: 4px 8px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.access-trigger { min-height: 26px; }
|
||||
|
||||
.access-dialog-card { padding: 18px; }
|
||||
|
||||
.time-widget {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user