[verified] refactor: harden operations and redesign device console

This commit is contained in:
chick
2026-07-15 16:33:16 +08:00
parent e04a16e817
commit 4977afdc20
24 changed files with 769 additions and 779 deletions
+2 -1
View File
@@ -1 +1,2 @@
@media(max-width:1260px){.home-toolbar{grid-template-columns:1fr}.detail-layout{grid-template-columns:1fr}.device-detail-board{grid-column:auto;grid-row:auto}.detail-actions-card{grid-column:auto}.device-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nook-metrics{grid-template-columns:repeat(4,1fr)}}@media(max-width:900px){body{overflow:auto}.sim-shell{height:auto;padding:14px}.sim-topbar,.workspace-hero{flex-direction:column;align-items:flex-start}.sim-main{overflow:visible}.view{overflow:visible}.home-tools{grid-template-columns:1fr}.home-device-grid{overflow:visible;grid-template-columns:1fr}.api-layout.active{grid-template-columns:1fr}.nook-metrics,.device-detail-grid{grid-template-columns:1fr 1fr}.hero-actions{justify-content:flex-start}}@media(max-width:560px){.wallet-row,.signal-grid,.nook-metrics,.device-detail-grid,.sim-card-kpis{grid-template-columns:1fr}.hero-actions{width:100%}.hero-actions .animal-btn{width:100%}.console-toolbar{grid-template-columns:1fr}.device-info-card dl div{grid-template-columns:76px minmax(0,1fr)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:1023px){.api-layout.active{grid-template-columns:1fr}.endpoint-list{max-height:300px}.console-toolbar{grid-template-columns:auto 100px;align-items:center}.console-toolbar label:nth-of-type(2),.console-toolbar input,.console-toolbar .animal-btn{grid-column:1/-1}.console-toolbar label{margin-bottom:-6px}.dialog-card{max-height:calc(100dvh - 20px);overflow-y:auto;margin-block:10px}}
@media(max-width:767px){button,a,input,select,textarea{min-height:44px}.desktop-sidebar{display:none}.app-content{margin-left:0;padding:12px 12px 82px}.sim-topbar,.fleet-overview,.workspace-hero{align-items:flex-start;flex-direction:column}.sim-topbar .hero-actions,.workspace-hero .hero-actions{width:100%}.home-toolbar,.console-toolbar{grid-template-columns:1fr}.home-toolbar label,.console-toolbar label{margin-bottom:-6px}.status-filters{grid-column:auto}.home-device-grid,.device-detail-grid,.signal-grid,.nook-metrics{grid-template-columns:1fr}.detail-layout{grid-template-columns:1fr}.detail-board,.detail-actions-card{grid-column:auto;grid-row:auto}.api-layout.active{grid-template-columns:1fr}.endpoint-list{max-height:300px}.mobile-nav{position:fixed;z-index:10;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,1fr);background:#f0e8d8;border-top:2px solid #d4c9b4;padding:6px max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))}.mobile-nav button{min-height:52px;border:0;border-radius:14px;background:transparent;color:#725d42}.mobile-nav button.active{background:#82d5bb}.mobile-nav span{display:block;font-size:11px}.sim-card-kpis{grid-template-columns:1fr}.frame{height:70vh}}@media(min-width:768px){.app-content{padding-inline:18px}.home-device-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1024px){.app-content{padding-inline:24px}.home-device-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media(min-width:1440px){:root{--sidebar-width:240px}.app-content{padding-inline:32px}.home-device-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}@media(max-width:390px){.app-content{padding-inline:10px}.hero-actions .animal-btn,.card-actions .animal-btn{flex:1}.dialog-card{padding:16px}}@media(max-width:320px){.app-content{padding-inline:8px}.sim-topbar h1{font-size:26px}.animal-btn{padding-inline:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}