fix(ui): enlarge router model and hide router controls

This commit is contained in:
yaya
2026-10-09 13:34:01 +01:00
parent 6b97505a59
commit 1291ea1508
2 changed files with 8 additions and 3 deletions
+3 -2
View File
@@ -9,9 +9,10 @@ const props = withDefaults(defineProps<{
fallback?: string fallback?: string
fillViewport?: boolean fillViewport?: boolean
glassContainer?: boolean glassContainer?: boolean
controls?: boolean
/** Development-only gallery controls. Never rendered in production builds. */ /** Development-only gallery controls. Never rendered in production builds. */
devBrowse?: boolean devBrowse?: boolean
}>(), { fallback: '', fillViewport: false, glassContainer: false, devBrowse: false }) }>(), { fallback: '', fillViewport: false, glassContainer: false, controls: true, devBrowse: false })
const host = ref<HTMLElement>() const host = ref<HTMLElement>()
const frame = ref<HTMLElement>() const frame = ref<HTMLElement>()
const ready = ref(false) const ready = ref(false)
@@ -161,7 +162,7 @@ onBeforeUnmount(() => {
<svg viewBox="0 0 200 120" aria-hidden="true"><rect x="31" y="59" width="138" height="46" rx="15"/><path d="M38 65V17Q38 9 45 9T52 17V60M148 60V17Q148 9 155 9T162 17V65M92 87h16"/></svg> <svg viewBox="0 0 200 120" aria-hidden="true"><rect x="31" y="59" width="138" height="46" rx="15"/><path d="M38 65V17Q38 9 45 9T52 17V60M148 60V17Q148 9 155 9T162 17V65M92 87h16"/></svg>
</div> </div>
</div> </div>
<figcaption class="device-model__caption"> <figcaption v-if="controls || devBrowseEnabled" class="device-model__caption">
<span>{{ failed ? label : (devBrowseEnabled ? devModelLabel(currentModel) : 'Drag to explore') }}</span> <span>{{ failed ? label : (devBrowseEnabled ? devModelLabel(currentModel) : 'Drag to explore') }}</span>
<template v-if="devBrowseEnabled"> <template v-if="devBrowseEnabled">
<button type="button" aria-label="Previous 3D model" @click="browseModel(-1)">Back</button> <button type="button" aria-label="Previous 3D model" @click="browseModel(-1)">Back</button>
+5 -1
View File
@@ -535,7 +535,7 @@ onMounted(() => {
<div class="glass-card p-6 mb-6 overflow-hidden router-model-card"> <div class="glass-card p-6 mb-6 overflow-hidden router-model-card">
<div class="grid grid-cols-1 lg:grid-cols-[minmax(0,1fr)_minmax(280px,360px)] gap-6 items-start"> <div class="grid grid-cols-1 lg:grid-cols-[minmax(0,1fr)_minmax(280px,360px)] gap-6 items-start">
<DeviceModel model="beryl-ax" label="Beryl AX (GL-MT3000) OpenWrt router" fill-viewport /> <DeviceModel model="beryl-ax" label="Beryl AX (GL-MT3000) OpenWrt router" fill-viewport :controls="false" />
<RouterMarketplace /> <RouterMarketplace />
</div> </div>
</div> </div>
@@ -1022,6 +1022,10 @@ onMounted(() => {
<style scoped> <style scoped>
@media (min-width: 1024px) { @media (min-width: 1024px) {
.router-model-card .device-model--viewport {
min-height: calc(100dvh - 216px);
}
.router-model-card > .grid > .router-marketplace { .router-model-card > .grid > .router-marketplace {
align-self: end; align-self: end;
margin-top: 0; margin-top: 0;