diff --git a/apps/ui/css/openapi-import.css b/apps/ui/css/openapi-import.css index b1da85a..034104a 100644 --- a/apps/ui/css/openapi-import.css +++ b/apps/ui/css/openapi-import.css @@ -13,20 +13,25 @@ position: fixed; inset: 0; z-index: 1200; + display: flex; + align-items: flex-start; + justify-content: center; + padding: 28px 16px; + overflow: auto; } .openapi-import-backdrop { - position: absolute; + position: fixed; inset: 0; - background: rgba(15, 23, 42, 0.52); - backdrop-filter: blur(5px); + background: rgba(4, 8, 18, 0.72); + backdrop-filter: blur(3px); } .openapi-import-dialog { position: relative; width: min(1040px, calc(100vw - 32px)); - max-height: min(860px, calc(100vh - 32px)); - margin: 16px auto; + max-height: calc(100vh - 56px); + margin: 0 auto; display: flex; flex-direction: column; overflow: hidden; @@ -74,7 +79,8 @@ } #openapi-import-document { - min-height: 180px; + min-height: 132px; + max-height: 34vh; resize: vertical; padding: 14px; border: 1px solid var(--border); @@ -86,6 +92,40 @@ line-height: 1.55; } +#openapi-import-file { + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + clip: rect(0 0 0 0); + clip-path: inset(50%); + white-space: nowrap; +} + +.openapi-file-control { + display: flex; + align-items: center; + gap: 10px; + min-width: 0; +} + +.openapi-file-button { + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 32px; + cursor: pointer; +} + +.openapi-file-name { + overflow: hidden; + color: var(--text-muted); + font-size: 13px; + font-weight: 500; + text-overflow: ellipsis; + white-space: nowrap; +} + .openapi-import-actions, .openapi-import-footer { display: flex; diff --git a/apps/ui/index.html b/apps/ui/index.html index 2d46d87..98935e4 100644 --- a/apps/ui/index.html +++ b/apps/ui/index.html @@ -392,6 +392,10 @@