/* ========================================================================== GIS Map Modal Styles (from Index.cshtml) ========================================================================== */ /* 近滿版：dialog 撐滿視窗、四邊留 16px 邊距；content 撐滿 dialog、body 以 flex 填滿（header 之外的剩餘高度），再由 height:100% 撐滿 body。 */ #modalGisMap .gis-map-dialog { max-width: none; width: calc(100vw - 32px); height: calc(100vh - 32px); margin: 16px auto; } #modalGisMap .gis-map-dialog .modal-content { height: 100%; } /* 讓撐滿 modal-body：host 預設 display:block 但高度 auto，內部 .gis-root 的 height:100% 需要 host 有明確高度，否則塌成 0。 */ #modalGisMap gis-map { display: block; width: 100%; height: 100%; } /* 載入遮罩：覆蓋整個 modal-body，置中 spinner + 文字。 */ #modalGisMap .gis-map-loading { position: absolute; inset: 0; z-index: 10; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; background-color: #f5f6f7; } #modalGisMap .gis-map-loading[hidden] { display: none; } #modalGisMap .gis-map-loading__spinner { width: 48px; height: 48px; border: 5px solid rgba(21, 101, 192, 0.2); border-top-color: #1565c0; border-radius: 50%; animation: gisMapSpin 0.8s linear infinite; } #modalGisMap .gis-map-loading__text { color: #44494d; font-size: 15px; } @keyframes gisMapSpin { to { transform: rotate(360deg); } } /* ========================================================================== Model Editor Styles (from modelEditorPage.html) ========================================================================== */ .gis-host { display: block; } .gis-root { position: relative; overflow: hidden; } .viewDiv { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; z-index: 1; } /* ── 子元件 chrome 樣式集中於此 ── 本元件以 Shadow DOM 渲染；子 .vue 的