From cb528caa3ab4c56439f33cb16dc674f473001c52 Mon Sep 17 00:00:00 2001 From: AlbertXXuu Date: Sat, 5 Sep 2026 21:13:32 +0800 Subject: [PATCH] feat: align Studio with shared AlvenX brand --- .github/workflows/ci.yml | 3 +- README.md | 4 +- README.zh-CN.md | 4 +- docs/alvenx-studio.md | 16 +++- docs/assets/alvenx-lockup.svg | 79 ++++++++++++++++ docs/assets/alvenx-wordmark.svg | 42 +-------- docs/launch/README.md | 3 +- scripts/build_social_preview.py | 8 +- .../assets/brand/alvenx-wordmark.svg.b64 | 2 +- .../assets/studio/alvenx-studio.css | 47 +++++----- src/openmultimodal_lab/studio_assets.py | 14 ++- tests/test_social_preview.py | 4 +- tests/test_studio.py | 91 ++++++++++++++++++- 13 files changed, 237 insertions(+), 80 deletions(-) create mode 100644 docs/assets/alvenx-lockup.svg diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index e9a6665..059d738 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -113,7 +113,8 @@ jobs: - name: Install Studio extra run: | python -m pip install --upgrade "pip>=26.2" - python -m pip install -e ".[studio]" + python -m pip install -e ".[studio]" "playwright>=1.55,<2" + python -m playwright install --with-deps chromium - name: Check Studio dependencies run: python -m pip check - name: Build and test Studio diff --git a/README.md b/README.md index 8e6e39b..d1f81b4 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,7 @@

- AlvenX — Multimodal Evidence + AlvenX +
+ MULTIMODAL EVIDENCE

# OpenMultimodalLab diff --git a/README.zh-CN.md b/README.zh-CN.md index f78f35f..b2cc3ae 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -1,5 +1,7 @@

- AlvenX — Multimodal Evidence + AlvenX +
+ MULTIMODAL EVIDENCE

# OpenMultimodalLab diff --git a/docs/alvenx-studio.md b/docs/alvenx-studio.md index 853fd35..a3ea675 100644 --- a/docs/alvenx-studio.md +++ b/docs/alvenx-studio.md @@ -57,8 +57,11 @@ distinguish a **cold start** from **warm reuse**. The first request loads the selected model and can take substantially longer; after a successful request, Studio confirms that the model remains warm for the next run. Clearing media, prompt, and output does not unload that -model. The wordmark is a static identity element: it is not a button and has no -hidden click interaction. The glass header, segmented navigation, media +model. The AlvenX wordmark button returns to the actual document top and is +a no-op when already there. Home navigation revision `2026-09-04.1` preserves +the URL, browser history, selected view, inputs, and results. It supports keyboard +activation and uses instant scrolling when reduced motion is requested. +The glass header, segmented navigation, media selector, panels, and controls follow a nested radius system. Media and response surfaces use bounded heights with aspect-safe previews, scrolling text, and full-screen media controls. Narrow layouts return to natural document @@ -142,9 +145,14 @@ owner-approved connected `Al`, `l–v`, `e–n`, and `n–X` outline relationshi `v–e` remains physically separate. Its continuous blue-to-indigo-to-violet `Al` gradient is shared by the header and portable README artwork. The interface embeds the canonical subtitle-free AlvenX wordmark, verifies it against SHA-256 -`8ae10e02c27091e29e0191a7934506118f144aae11898b20222d7f9d587e2662`, +`6cc422fb2ed289bee723f1c6e6d19baec63c18d988616eb5b90d8332a30b7b1e`, and does not reconstruct `Al` and `venX` with browser letter spacing. The README -may use a project-specific lockup; the application header does not. +uses the same subtitle-free `docs/assets/alvenx-wordmark.svg`, with the project +signal rendered as separate text below it. The preserved project-specific +`docs/assets/alvenx-lockup.svg` supplies the social preview artwork. +Wordmark canvas alignment revision `2026-09-04.1` centers the visible outlines +within the existing 330×100 canvas. The glyph and color baseline remains +`2026-08-22.4`; the AX brand baseline remains `2026-08-24.1`. Chinese text follows the embedded Latin face with professional platform CJK fallbacks. Because the wordmark stores glyphs as SVG outlines, it remains identical across local interfaces without requiring a local font install. diff --git a/docs/assets/alvenx-lockup.svg b/docs/assets/alvenx-lockup.svg new file mode 100644 index 0000000..f767fc5 --- /dev/null +++ b/docs/assets/alvenx-lockup.svg @@ -0,0 +1,79 @@ + + AlvenX — Multimodal Evidence + AlvenX Instrument Sans outlines with a reduced optically joined X, a continuous blue-to-violet Al accent, and a centered Multimodal Evidence signal line. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/assets/alvenx-wordmark.svg b/docs/assets/alvenx-wordmark.svg index f767fc5..256c0d5 100644 --- a/docs/assets/alvenx-wordmark.svg +++ b/docs/assets/alvenx-wordmark.svg @@ -1,16 +1,14 @@ - - AlvenX — Multimodal Evidence - AlvenX Instrument Sans outlines with a reduced optically joined X, a continuous blue-to-violet Al accent, and a centered Multimodal Evidence signal line. + + AlvenX + AlvenX Instrument Sans outlines with a connected Al accent, compact pair spacing, and an optically reduced X joined to the lower corner of n. diff --git a/docs/launch/README.md b/docs/launch/README.md index 454908a..6942fb7 100644 --- a/docs/launch/README.md +++ b/docs/launch/README.md @@ -7,7 +7,8 @@ published or that any channel adopted the project. ![AlvenX social preview](../assets/alvenx-social-preview.png) Rebuild the preview with `python scripts/build_social_preview.py`. The script -uses the vendored Instrument Sans payload and a local Chromium-family browser; +uses the preserved `docs/assets/alvenx-lockup.svg` artwork, the vendored +Instrument Sans payload, and a local Chromium-family browser; the committed PNG is 1280×640 and remains below GitHub's 1 MB limit. ## Goal diff --git a/scripts/build_social_preview.py b/scripts/build_social_preview.py index 26f8e6a..63e6293 100644 --- a/scripts/build_social_preview.py +++ b/scripts/build_social_preview.py @@ -21,7 +21,7 @@ / "InstrumentSans-wdth-wght.woff2.b64" ) DEFAULT_OUTPUT = PROJECT_ROOT / "docs" / "assets" / "alvenx-social-preview.png" -WORDMARK_PATH = PROJECT_ROOT / "docs" / "assets" / "alvenx-wordmark.svg" +LOCKUP_PATH = PROJECT_ROOT / "docs" / "assets" / "alvenx-lockup.svg" CANVAS_SIZE = (1280, 640) @@ -66,7 +66,7 @@ def _find_browser(explicit: Path | None) -> Path: def _preview_html() -> str: font_base64 = "".join(FONT_PATH.read_text(encoding="ascii").split()) - wordmark_base64 = base64.b64encode(WORDMARK_PATH.read_bytes()).decode("ascii") + wordmark_base64 = base64.b64encode(LOCKUP_PATH.read_bytes()).decode("ascii") return f""" @@ -181,6 +181,8 @@ def build_preview(output: Path, *, browser: Path | None = None) -> None: str(executable), "--headless=new", "--disable-gpu", + "--enable-unsafe-swiftshader", + "--no-sandbox", "--hide-scrollbars", "--force-device-scale-factor=1", f"--window-size={CANVAS_SIZE[0]},{CANVAS_SIZE[1]}", @@ -192,6 +194,8 @@ def build_preview(output: Path, *, browser: Path | None = None) -> None: check=False, capture_output=True, text=True, + encoding="utf-8", + errors="replace", timeout=45, ) if completed.returncode != 0 or not output.is_file(): diff --git a/src/openmultimodal_lab/assets/brand/alvenx-wordmark.svg.b64 b/src/openmultimodal_lab/assets/brand/alvenx-wordmark.svg.b64 index 613bc3b..5bfc712 100644 --- a/src/openmultimodal_lab/assets/brand/alvenx-wordmark.svg.b64 +++ b/src/openmultimodal_lab/assets/brand/alvenx-wordmark.svg.b64 @@ -1 +1 @@ -PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMzAgMTAwIiByb2xlPSJpbWciIGFyaWEtbGFiZWxsZWRieT0idGl0bGUgZGVzYyI+CiAgPHRpdGxlIGlkPSJ0aXRsZSI+QWx2ZW5YPC90aXRsZT4KICA8ZGVzYyBpZD0iZGVzYyI+QWx2ZW5YIEluc3RydW1lbnQgU2FucyBvdXRsaW5lcyB3aXRoIGEgY29ubmVjdGVkIEFsIGFjY2VudCwgY29tcGFjdCBwYWlyIHNwYWNpbmcsIGFuZCBhbiBvcHRpY2FsbHkgcmVkdWNlZCBYIGpvaW5lZCB0byB0aGUgbG93ZXIgY29ybmVyIG9mIG4uPC9kZXNjPgogIDxzdHlsZT4KICAgIC5hY2NlbnQgeyBmaWxsOiB1cmwoI2JyYW5kLWdyYWRpZW50KTsgfQogICAgLm5hbWUgeyBmaWxsOiAjMGYxNzJhOyB9CiAgICAuZ3JhZGllbnQtc3RhcnQgeyBzdG9wLWNvbG9yOiAjMjU2M2ViOyB9CiAgICAuZ3JhZGllbnQtbWlkIHsgc3RvcC1jb2xvcjogIzRmNDZlNTsgfQogICAgLmdyYWRpZW50LWVuZCB7IHN0b3AtY29sb3I6ICM3YzNhZWQ7IH0KICAgIEBtZWRpYSAocHJlZmVycy1jb2xvci1zY2hlbWU6IGRhcmspIHsKICAgICAgLm5hbWUgeyBmaWxsOiAjZTdlZGY2OyB9CiAgICAgIC5ncmFkaWVudC1zdGFydCB7IHN0b3AtY29sb3I6ICM2MGE1ZmE7IH0KICAgICAgLmdyYWRpZW50LW1pZCB7IHN0b3AtY29sb3I6ICM4MThjZjg7IH0KICAgICAgLmdyYWRpZW50LWVuZCB7IHN0b3AtY29sb3I6ICNhNzhiZmE7IH0KICAgIH0KICA8L3N0eWxlPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJicmFuZC1ncmFkaWVudCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwIiB5MT0iNzIwIiB4Mj0iMTA1MCIgeTI9IjAiPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtc3RhcnQiIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMyNTYzZWIiLz4KICAgICAgPHN0b3AgY2xhc3M9ImdyYWRpZW50LXN0YXJ0IiBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzI1NjNlYiIvPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtbWlkIiBvZmZzZXQ9IjY0JSIgc3RvcC1jb2xvcj0iIzRmNDZlNSIvPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtZW5kIiBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YzNhZWQiLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8cGF0aCBpZD0iYnJhbmQtQSIgZD0iTTI1LjAwMDQ4ODI4MTI1IDAgMjc2LjUwMzI4NTcyODM5NSA3MjBIMzk2LjQwNTM3MzQ2NTI2OThMMTY0LjA2ODgyNTYxMzcwNzMgMFpNNTQyLjc0MTcyODA1NjIyMjIgMCAzMTEuMTk2ODQxNzgzODIxNiA3MjBINDM3LjE5NjA1ODQ5NjgzMjg1TDY4OC42OTg4NTU5NDM5Nzc4IDBaTTE1Ny45MTc5OTkyNzUwMjg3IDI3OS44MDYwODc5MTg1Nzk2SDU0NS45NzU3MjQ5NzI3ODQ1VjE2OC42Njc5Njg3NUgxNTcuOTE3OTk5Mjc1MDI4N1oiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1sIiBkPSJNNTguNjY2OTkyMTg3NSAwVjcyMEgyMDcuNjY3MjM2MzI4MTI1VjBaIi8+CiAgICA8cGF0aCBpZD0iYnJhbmQtQWwiIGQ9Ik0yNS4wMDA0ODgyODEyNSAwIDI3Ni41MDMyODU3MjgzOTUgNzIwSDM5Ni40MDUzNzM0NjUyNjk4TDE2NC4wNjg4MjU2MTM3MDczIDBaTTU0Mi43NDE3MjgwNTYyMjIyIDAgMzExLjE5Njg0MTc4MzgyMTYgNzIwSDQzNy4xOTYwNTg0OTY4MzI4NUw2ODguNjk4ODU1OTQzOTc3OCAwWk0xNTcuOTE3OTk5Mjc1MDI4NyAyNzkuODA2MDg3OTE4NTc5Nkg1NDUuOTc1NzI0OTcyNzg0NVYxNjguNjY3OTY4NzVIMTU3LjkxNzk5OTI3NTAyODdaTTY4MC42OTg5OTIxODc1IDBWNzIwSDgyOS42OTkyMzYzMjgxMjVWMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC12IiBkPSJNMTk4Ljk2MDE3OTY0NTU2ODEzIDAgMi40NzIzMjczNDQxMTk1NDkgNTEwSDE0OS40NDM0MDM0NjAwODU0TDMwMi43MjMzMDM4OTE3MTg0IDQwLjQ3MTgyODg5MjgyNzAzNEgyMzEuOTMxNDc5NTc2OTc1MUwzODQuMjExMzgwMDA4NjA4MSA1MTBINTI3LjE5NjM0MzMxNzYyNzlMMzMwLjcwODQ5MTAxNjE3OTMgMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1lIiBkPSJNMjkxLjc3OTA5NjgxOTQ2MDQgLTEwUTIxMC43MzcxOTEwOTk2NzM1IC0xMCAxNTAuMzM0MjA4MTc1NTM5OTcgMjMuNjI1MDI1NDMyNTU2ODY4UTg5LjkzMTIyNTI1MTQwNjQzIDU3LjI1MDA1MDg2NTExMzczNSA1Ni42Mzk0MjEyNTQzOTY0NCAxMTcuMjM2MTYzNjcyMDU5NzdRMjMuMzQ3NjE3MjU3Mzg2NDQ2IDE3Ny4yMjIyNzY0NzkwMDU4IDIzLjM0NzYxNzI1NzM4NjQ0NiAyNTUuNDE2Njc2ODQxNjc2MjRRMjMuMzQ3NjE3MjU3Mzg2NDQ2IDMzNC40NzIxNjQ1Nzg3MzU4IDU2LjYxODU2NTAzMjI1ODYzIDM5My45Mzc0NTE2ODExMjIyUTg5Ljg4OTUxMjgwNzEzMDgxIDQ1My40MDI3Mzg3ODM1MDg1NCAxNDkuNzg1NTUyMTM0NzM3MzcgNDg2LjcwMTM2OTM5MTc1NDI3UTIwOS42ODE1OTE0NjIzNDM5MyA1MjAgMjg4Ljg0ODQ2MTU3OTUzMTQzIDUyMFEzNjQuOTU5NzgyOTI0NTAzMSA1MjAgNDIwLjYyNjY3ODQ3NDI0NzQ2IDQ4OC4zODE5MTMwNzg5NDg4NlE0NzYuMjkzNTc0MDIzOTkxOCA0NTYuNzYzODI2MTU3ODk3NyA1MDYuODYzMTUyNDA3MTA5NzQgMzk5Ljk3MjE2NDU3ODczNThRNTM3LjQzMjczMDc5MDIyNzcgMzQzLjE4MDUwMjk5OTU3Mzk1IDUzNy40MzI3MzA3OTAyMjc3IDI2NS45NTgzNzkxMTU5MDkzNFE1MzcuNDMyNzMwNzkwMjI3NyAyNTEuMTgwNjc1OTM1MDAwMTggNTM2LjU1NzczMDc5MDIyNzcgMjM4LjU5MDQ1NDk1Mjc5MTMzUTUzNS42ODI3MzA3OTAyMjc3IDIyNi4wMDAyMzM5NzA1ODI0OSA1MzMuNzEwNTA1MTc2MzM1NiAyMTQuMzg5MDk1NzMxMDc5NThIMTA2LjE5NDM2OTg1MjU0Mjg4VjMwNy4yMzU4Njg2NjYzMjEwNEg0MjcuMTgzNTU0NzcyMjg3Nkw0MDEuMDE2OTI4Nzk1NzI1MSAyODUuMTI0NjE4NTI2NTQ4MTVRNDAxLjAwMzA0MTYwMjY3MTE1IDM1My4yMzYwNzIxMTE4NzQ4IDM3MC43MzE3Mzc3ODY5MDQgMzg2LjI4NTAyODI0MzQzNzRRMzQwLjQ2MDQzMzk3MTEzNjggNDE5LjMzMzk4NDM3NSAyODcuMTgxODI1NDMyOTI2NCA0MTkuMzMzOTg0Mzc1UTIyNy40MzA5NzA5NDA3Mzg5MiA0MTkuMzMzOTg0Mzc1IDE5My44NzQ4MjcwNzIwMjQzNSAzNzcuMzQ3NTkxODI0ODI5NlExNjAuMzE4NjgzMjAzMzA5NzcgMzM1LjM2MTE5OTI3NDY1OTE2IDE2MC4zMTg2ODMyMDMzMDk3NyAyNTMuMjc3ODE1MDgxMTc5MTRRMTYwLjMxODY4MzIwMzMwOTc3IDE3Mi4zMzMzMDI4MTgyMzg3NCAxOTMuNzkxNTE0MDgzNzQzMSAxMzEuNDk5NjU5MjIxNjE5MzdRMjI3LjI2NDM0NDk2NDE3NjQyIDkwLjY2NjAxNTYyNSAyOTIuMDAxMzEyMjYzMzA5OTYgOTAuNjY2MDE1NjI1UTMyOS4zNjI4ODc5MTg5NDkxIDkwLjY2NjAxNTYyNSAzNTYuMTY4OTE0ODAyMzcyNDYgMTA0Ljc4NDEzODE0ODY1MDUzUTM4Mi45NzQ5NDE2ODU3OTU4IDExOC45MDIyNjA2NzIzMDEwNSAzOTUuOTA1NzQ5ODYxMTUxIDE0OC44NjA2NzAyOTgzMzc5NEg1MjQuNTg1MzU3NjczNDY2MlE1MDAuNjY4NDM2NjkxMTY0OTcgNzUuMzQ2ODk1MDA1NTUzOTYgNDQxLjc1MTUxMDYyMzg0MjUgMzIuNjczNDQ3NTAyNzc2OThRMzgyLjgzNDU4NDU1NjUyIC0xMCAyOTEuNzc5MDk2ODE5NDYwNCAtMTBaIi8+CiAgICA8cGF0aCBpZD0iYnJhbmQtbiIgZD0iTTYyLjAwMDczMjQyMTg3NSAwVjUxMEgxOTUuODYwNjYwMTI4Mjk1NDJWMzkxLjk5OTUxMTcxODc1SDE5OS4zMzI4ODU3NDIxODc1VjBaTTQwOS4wODY2MDg4ODY3MTg3NSAwVjMyMi41OTY3MDE3MzAwNDI3UTQwOS4wODY2MDg4ODY3MTg3NSAzNjUuOTcyMzQ3Njg0MjA0NiAzODcuMjMyMDczNDY1MzYyMiAzODcuNTU2MDI2ODgzNDIzM1EzNjUuMzc3NTM4MDQ0MDA1NjMgNDA5LjEzOTcwNjA4MjY0MjEgMzIzLjQwNDU4MDAwODIzODU1IDQwOS4xMzk3MDYwODI2NDIxUTI4Ny4yMDk1MDgyNTg4NDk0IDQwOS4xMzk3MDYwODI2NDIxIDI1OS4wMjg0NDU3NzI4MjY3IDM5Mi42MTg2MzExNTI0MzYxNFEyMzAuODQ3MzgzMjg2ODAzOTYgMzc2LjA5NzU1NjIyMjIzMDIgMjE1LjA5MDEzNDUxNDQ5NTczIDM0Ny4yMzU5ODA1NjY1OTFRMTk5LjMzMjg4NTc0MjE4NzUgMzE4LjM3NDQwNDkxMDk1MTg1IDE5OS4zMzI4ODU3NDIxODc1IDI3OS41MjY1MzMzNDI4OTc5TDE4Ni4wNDEzMDU1MzgyNjY5IDM5OC4zMDUyNTM3NjY0NzcxUTIxMC43Nzc1NDA0MTU1MjU0NCA0NTQuMDk3MDE3MDc1ODY2NDYgMjU4Ljk5MzE4MzU1ODgwNjggNDg3LjA0ODUwODUzNzkzMzIzUTMwNy4yMDg4MjY3MDIwODgxIDUyMCAzNzYuMTI1ODE4ODg5NTg4MSA1MjBRNDU3LjczNzQ2NTc1MDQyNjA1IDUyMCA1MDIuMDc4MTEzOTc4NzI4NjUgNDczLjkxNjQzNzc4NjA3MjVRNTQ2LjQxODc2MjIwNzAzMTIgNDI3LjgzMjg3NTU3MjE0NSA1NDYuNDE4NzYyMjA3MDMxMiAzNTAuMzMyNjIxMjYxNDc3NDdWMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1YIiBkPSJNNTA1LjA4ODE5NTgwMDc4MTI1IDAgMzA2LjgwODEyMjQxODgyMDg2IDMxOS4wOTc1NjYzOTIyNzI3IDM5LjkxNzMwNzUzMzMyMzc2NSA3MjBIMjAzLjUyNzMwNjQ0NDk0Mjk1TDM4OS42NTQ1Njk4MzgxOTYwNCA0MTkuODE4ODk2ODE4OTA2MDdMNjY4LjY5ODE5NDcxMjQwMDQgMFpNMzI3LjY0MTA1OTAyNjEyMjEgNDIxLjI5MDc1NjIyMTg2MDY1IDUxOS45OTA4NjMzNzkwOTEgNzIwSDY2OC41NTkzMjI3ODE4NjA4TDM3Ny4zNjMxNDIyMjk2MTY2NCAyOTkuOTU5NDg3OTAzODYzMlpNMzYxLjQzMjgzMjUwNTU1Mzk2IDI5Ni4zNjIxNjU2NTIyMTU1IDE3MC4zNjA3ODIxOTg2MDc5MiAwSDIxLjc5MjMyMjc5NTgzODExOEwzMTEuNzEwNzQ5MzAyMDU5NCA0MTcuNjkzNDMzOTcwMjEyOTRaIi8+CiAgPC9kZWZzPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDguOTM3IDgyKSBzY2FsZSguMSAtLjEpIj4KICAgIDxnIGNsYXNzPSJhY2NlbnQiPgogICAgICA8dXNlIGhyZWY9IiNicmFuZC1BbCIgeD0iMCIvPgogICAgPC9nPgogICAgPGcgY2xhc3M9Im5hbWUiPgogICAgICA8dXNlIGhyZWY9IiNicmFuZC12IiB4PSI4MTcuMjI3Ii8+CiAgICAgIDx1c2UgaHJlZj0iI2JyYW5kLWUiIHg9IjEyNjEuMjI3Ii8+CiAgICAgIDxnIGlkPSJicmFuZC1uWC1saWdhdHVyZSI+CiAgICAgICAgPHVzZSBocmVmPSIjYnJhbmQtbiIgeD0iMTczMi42NTkiLz4KICAgICAgICA8dXNlIGhyZWY9IiNicmFuZC1YIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMjA3Ljk0OSAwKSBzY2FsZSguODc3Nzc4KSIvPgogICAgICA8L2c+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K +PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMzAgMTAwIiByb2xlPSJpbWciIGFyaWEtbGFiZWxsZWRieT0idGl0bGUgZGVzYyI+CiAgPHRpdGxlIGlkPSJ0aXRsZSI+QWx2ZW5YPC90aXRsZT4KICA8ZGVzYyBpZD0iZGVzYyI+QWx2ZW5YIEluc3RydW1lbnQgU2FucyBvdXRsaW5lcyB3aXRoIGEgY29ubmVjdGVkIEFsIGFjY2VudCwgY29tcGFjdCBwYWlyIHNwYWNpbmcsIGFuZCBhbiBvcHRpY2FsbHkgcmVkdWNlZCBYIGpvaW5lZCB0byB0aGUgbG93ZXIgY29ybmVyIG9mIG4uPC9kZXNjPgogIDxzdHlsZT4KICAgIC5hY2NlbnQgeyBmaWxsOiB1cmwoI2JyYW5kLWdyYWRpZW50KTsgfQogICAgLm5hbWUgeyBmaWxsOiAjMGYxNzJhOyB9CiAgICAuZ3JhZGllbnQtc3RhcnQgeyBzdG9wLWNvbG9yOiAjMjU2M2ViOyB9CiAgICAuZ3JhZGllbnQtbWlkIHsgc3RvcC1jb2xvcjogIzRmNDZlNTsgfQogICAgLmdyYWRpZW50LWVuZCB7IHN0b3AtY29sb3I6ICM3YzNhZWQ7IH0KICAgIEBtZWRpYSAocHJlZmVycy1jb2xvci1zY2hlbWU6IGRhcmspIHsKICAgICAgLm5hbWUgeyBmaWxsOiAjZTdlZGY2OyB9CiAgICAgIC5ncmFkaWVudC1zdGFydCB7IHN0b3AtY29sb3I6ICM2MGE1ZmE7IH0KICAgICAgLmdyYWRpZW50LW1pZCB7IHN0b3AtY29sb3I6ICM4MThjZjg7IH0KICAgICAgLmdyYWRpZW50LWVuZCB7IHN0b3AtY29sb3I6ICNhNzhiZmE7IH0KICAgIH0KICA8L3N0eWxlPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJicmFuZC1ncmFkaWVudCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwIiB5MT0iNzIwIiB4Mj0iMTA1MCIgeTI9IjAiPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtc3RhcnQiIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMyNTYzZWIiLz4KICAgICAgPHN0b3AgY2xhc3M9ImdyYWRpZW50LXN0YXJ0IiBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzI1NjNlYiIvPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtbWlkIiBvZmZzZXQ9IjY0JSIgc3RvcC1jb2xvcj0iIzRmNDZlNSIvPgogICAgICA8c3RvcCBjbGFzcz0iZ3JhZGllbnQtZW5kIiBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YzNhZWQiLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8cGF0aCBpZD0iYnJhbmQtQSIgZD0iTTI1LjAwMDQ4ODI4MTI1IDAgMjc2LjUwMzI4NTcyODM5NSA3MjBIMzk2LjQwNTM3MzQ2NTI2OThMMTY0LjA2ODgyNTYxMzcwNzMgMFpNNTQyLjc0MTcyODA1NjIyMjIgMCAzMTEuMTk2ODQxNzgzODIxNiA3MjBINDM3LjE5NjA1ODQ5NjgzMjg1TDY4OC42OTg4NTU5NDM5Nzc4IDBaTTE1Ny45MTc5OTkyNzUwMjg3IDI3OS44MDYwODc5MTg1Nzk2SDU0NS45NzU3MjQ5NzI3ODQ1VjE2OC42Njc5Njg3NUgxNTcuOTE3OTk5Mjc1MDI4N1oiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1sIiBkPSJNNTguNjY2OTkyMTg3NSAwVjcyMEgyMDcuNjY3MjM2MzI4MTI1VjBaIi8+CiAgICA8cGF0aCBpZD0iYnJhbmQtQWwiIGQ9Ik0yNS4wMDA0ODgyODEyNSAwIDI3Ni41MDMyODU3MjgzOTUgNzIwSDM5Ni40MDUzNzM0NjUyNjk4TDE2NC4wNjg4MjU2MTM3MDczIDBaTTU0Mi43NDE3MjgwNTYyMjIyIDAgMzExLjE5Njg0MTc4MzgyMTYgNzIwSDQzNy4xOTYwNTg0OTY4MzI4NUw2ODguNjk4ODU1OTQzOTc3OCAwWk0xNTcuOTE3OTk5Mjc1MDI4NyAyNzkuODA2MDg3OTE4NTc5Nkg1NDUuOTc1NzI0OTcyNzg0NVYxNjguNjY3OTY4NzVIMTU3LjkxNzk5OTI3NTAyODdaTTY4MC42OTg5OTIxODc1IDBWNzIwSDgyOS42OTkyMzYzMjgxMjVWMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC12IiBkPSJNMTk4Ljk2MDE3OTY0NTU2ODEzIDAgMi40NzIzMjczNDQxMTk1NDkgNTEwSDE0OS40NDM0MDM0NjAwODU0TDMwMi43MjMzMDM4OTE3MTg0IDQwLjQ3MTgyODg5MjgyNzAzNEgyMzEuOTMxNDc5NTc2OTc1MUwzODQuMjExMzgwMDA4NjA4MSA1MTBINTI3LjE5NjM0MzMxNzYyNzlMMzMwLjcwODQ5MTAxNjE3OTMgMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1lIiBkPSJNMjkxLjc3OTA5NjgxOTQ2MDQgLTEwUTIxMC43MzcxOTEwOTk2NzM1IC0xMCAxNTAuMzM0MjA4MTc1NTM5OTcgMjMuNjI1MDI1NDMyNTU2ODY4UTg5LjkzMTIyNTI1MTQwNjQzIDU3LjI1MDA1MDg2NTExMzczNSA1Ni42Mzk0MjEyNTQzOTY0NCAxMTcuMjM2MTYzNjcyMDU5NzdRMjMuMzQ3NjE3MjU3Mzg2NDQ2IDE3Ny4yMjIyNzY0NzkwMDU4IDIzLjM0NzYxNzI1NzM4NjQ0NiAyNTUuNDE2Njc2ODQxNjc2MjRRMjMuMzQ3NjE3MjU3Mzg2NDQ2IDMzNC40NzIxNjQ1Nzg3MzU4IDU2LjYxODU2NTAzMjI1ODYzIDM5My45Mzc0NTE2ODExMjIyUTg5Ljg4OTUxMjgwNzEzMDgxIDQ1My40MDI3Mzg3ODM1MDg1NCAxNDkuNzg1NTUyMTM0NzM3MzcgNDg2LjcwMTM2OTM5MTc1NDI3UTIwOS42ODE1OTE0NjIzNDM5MyA1MjAgMjg4Ljg0ODQ2MTU3OTUzMTQzIDUyMFEzNjQuOTU5NzgyOTI0NTAzMSA1MjAgNDIwLjYyNjY3ODQ3NDI0NzQ2IDQ4OC4zODE5MTMwNzg5NDg4NlE0NzYuMjkzNTc0MDIzOTkxOCA0NTYuNzYzODI2MTU3ODk3NyA1MDYuODYzMTUyNDA3MTA5NzQgMzk5Ljk3MjE2NDU3ODczNThRNTM3LjQzMjczMDc5MDIyNzcgMzQzLjE4MDUwMjk5OTU3Mzk1IDUzNy40MzI3MzA3OTAyMjc3IDI2NS45NTgzNzkxMTU5MDkzNFE1MzcuNDMyNzMwNzkwMjI3NyAyNTEuMTgwNjc1OTM1MDAwMTggNTM2LjU1NzczMDc5MDIyNzcgMjM4LjU5MDQ1NDk1Mjc5MTMzUTUzNS42ODI3MzA3OTAyMjc3IDIyNi4wMDAyMzM5NzA1ODI0OSA1MzMuNzEwNTA1MTc2MzM1NiAyMTQuMzg5MDk1NzMxMDc5NThIMTA2LjE5NDM2OTg1MjU0Mjg4VjMwNy4yMzU4Njg2NjYzMjEwNEg0MjcuMTgzNTU0NzcyMjg3Nkw0MDEuMDE2OTI4Nzk1NzI1MSAyODUuMTI0NjE4NTI2NTQ4MTVRNDAxLjAwMzA0MTYwMjY3MTE1IDM1My4yMzYwNzIxMTE4NzQ4IDM3MC43MzE3Mzc3ODY5MDQgMzg2LjI4NTAyODI0MzQzNzRRMzQwLjQ2MDQzMzk3MTEzNjggNDE5LjMzMzk4NDM3NSAyODcuMTgxODI1NDMyOTI2NCA0MTkuMzMzOTg0Mzc1UTIyNy40MzA5NzA5NDA3Mzg5MiA0MTkuMzMzOTg0Mzc1IDE5My44NzQ4MjcwNzIwMjQzNSAzNzcuMzQ3NTkxODI0ODI5NlExNjAuMzE4NjgzMjAzMzA5NzcgMzM1LjM2MTE5OTI3NDY1OTE2IDE2MC4zMTg2ODMyMDMzMDk3NyAyNTMuMjc3ODE1MDgxMTc5MTRRMTYwLjMxODY4MzIwMzMwOTc3IDE3Mi4zMzMzMDI4MTgyMzg3NCAxOTMuNzkxNTE0MDgzNzQzMSAxMzEuNDk5NjU5MjIxNjE5MzdRMjI3LjI2NDM0NDk2NDE3NjQyIDkwLjY2NjAxNTYyNSAyOTIuMDAxMzEyMjYzMzA5OTYgOTAuNjY2MDE1NjI1UTMyOS4zNjI4ODc5MTg5NDkxIDkwLjY2NjAxNTYyNSAzNTYuMTY4OTE0ODAyMzcyNDYgMTA0Ljc4NDEzODE0ODY1MDUzUTM4Mi45NzQ5NDE2ODU3OTU4IDExOC45MDIyNjA2NzIzMDEwNSAzOTUuOTA1NzQ5ODYxMTUxIDE0OC44NjA2NzAyOTgzMzc5NEg1MjQuNTg1MzU3NjczNDY2MlE1MDAuNjY4NDM2NjkxMTY0OTcgNzUuMzQ2ODk1MDA1NTUzOTYgNDQxLjc1MTUxMDYyMzg0MjUgMzIuNjczNDQ3NTAyNzc2OThRMzgyLjgzNDU4NDU1NjUyIC0xMCAyOTEuNzc5MDk2ODE5NDYwNCAtMTBaIi8+CiAgICA8cGF0aCBpZD0iYnJhbmQtbiIgZD0iTTYyLjAwMDczMjQyMTg3NSAwVjUxMEgxOTUuODYwNjYwMTI4Mjk1NDJWMzkxLjk5OTUxMTcxODc1SDE5OS4zMzI4ODU3NDIxODc1VjBaTTQwOS4wODY2MDg4ODY3MTg3NSAwVjMyMi41OTY3MDE3MzAwNDI3UTQwOS4wODY2MDg4ODY3MTg3NSAzNjUuOTcyMzQ3Njg0MjA0NiAzODcuMjMyMDczNDY1MzYyMiAzODcuNTU2MDI2ODgzNDIzM1EzNjUuMzc3NTM4MDQ0MDA1NjMgNDA5LjEzOTcwNjA4MjY0MjEgMzIzLjQwNDU4MDAwODIzODU1IDQwOS4xMzk3MDYwODI2NDIxUTI4Ny4yMDk1MDgyNTg4NDk0IDQwOS4xMzk3MDYwODI2NDIxIDI1OS4wMjg0NDU3NzI4MjY3IDM5Mi42MTg2MzExNTI0MzYxNFEyMzAuODQ3MzgzMjg2ODAzOTYgMzc2LjA5NzU1NjIyMjIzMDIgMjE1LjA5MDEzNDUxNDQ5NTczIDM0Ny4yMzU5ODA1NjY1OTFRMTk5LjMzMjg4NTc0MjE4NzUgMzE4LjM3NDQwNDkxMDk1MTg1IDE5OS4zMzI4ODU3NDIxODc1IDI3OS41MjY1MzMzNDI4OTc5TDE4Ni4wNDEzMDU1MzgyNjY5IDM5OC4zMDUyNTM3NjY0NzcxUTIxMC43Nzc1NDA0MTU1MjU0NCA0NTQuMDk3MDE3MDc1ODY2NDYgMjU4Ljk5MzE4MzU1ODgwNjggNDg3LjA0ODUwODUzNzkzMzIzUTMwNy4yMDg4MjY3MDIwODgxIDUyMCAzNzYuMTI1ODE4ODg5NTg4MSA1MjBRNDU3LjczNzQ2NTc1MDQyNjA1IDUyMCA1MDIuMDc4MTEzOTc4NzI4NjUgNDczLjkxNjQzNzc4NjA3MjVRNTQ2LjQxODc2MjIwNzAzMTIgNDI3LjgzMjg3NTU3MjE0NSA1NDYuNDE4NzYyMjA3MDMxMiAzNTAuMzMyNjIxMjYxNDc3NDdWMFoiLz4KICAgIDxwYXRoIGlkPSJicmFuZC1YIiBkPSJNNTA1LjA4ODE5NTgwMDc4MTI1IDAgMzA2LjgwODEyMjQxODgyMDg2IDMxOS4wOTc1NjYzOTIyNzI3IDM5LjkxNzMwNzUzMzMyMzc2NSA3MjBIMjAzLjUyNzMwNjQ0NDk0Mjk1TDM4OS42NTQ1Njk4MzgxOTYwNCA0MTkuODE4ODk2ODE4OTA2MDdMNjY4LjY5ODE5NDcxMjQwMDQgMFpNMzI3LjY0MTA1OTAyNjEyMjEgNDIxLjI5MDc1NjIyMTg2MDY1IDUxOS45OTA4NjMzNzkwOTEgNzIwSDY2OC41NTkzMjI3ODE4NjA4TDM3Ny4zNjMxNDIyMjk2MTY2NCAyOTkuOTU5NDg3OTAzODYzMlpNMzYxLjQzMjgzMjUwNTU1Mzk2IDI5Ni4zNjIxNjU2NTIyMTU1IDE3MC4zNjA3ODIxOTg2MDc5MiAwSDIxLjc5MjMyMjc5NTgzODExOEwzMTEuNzEwNzQ5MzAyMDU5NCA0MTcuNjkzNDMzOTcwMjEyOTRaIi8+CiAgPC9kZWZzPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI0LjAwNCA4Mikgc2NhbGUoLjEgLS4xKSI+CiAgICA8ZyBjbGFzcz0iYWNjZW50Ij4KICAgICAgPHVzZSBocmVmPSIjYnJhbmQtQWwiIHg9IjAiLz4KICAgIDwvZz4KICAgIDxnIGNsYXNzPSJuYW1lIj4KICAgICAgPHVzZSBocmVmPSIjYnJhbmQtdiIgeD0iODE3LjIyNyIvPgogICAgICA8dXNlIGhyZWY9IiNicmFuZC1lIiB4PSIxMjYxLjIyNyIvPgogICAgICA8ZyBpZD0iYnJhbmQtblgtbGlnYXR1cmUiPgogICAgICAgIDx1c2UgaHJlZj0iI2JyYW5kLW4iIHg9IjE3MzIuNjU5Ii8+CiAgICAgICAgPHVzZSBocmVmPSIjYnJhbmQtWCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjIwNy45NDkgMCkgc2NhbGUoLjg3Nzc3OCkiLz4KICAgICAgPC9nPgogICAgPC9nPgogIDwvZz4KPC9zdmc+Cg== diff --git a/src/openmultimodal_lab/assets/studio/alvenx-studio.css b/src/openmultimodal_lab/assets/studio/alvenx-studio.css index def3395..18bbbba 100644 --- a/src/openmultimodal_lab/assets/studio/alvenx-studio.css +++ b/src/openmultimodal_lab/assets/studio/alvenx-studio.css @@ -16,7 +16,7 @@ --alx-highlight: rgb(255 255 255 / 72%); --alx-panel: rgb(255 255 255 / 72%); --alx-panel-soft: rgb(255 255 255 / 48%); - --alx-inset: rgb(248 251 255 / 78%); + --alx-inset: rgb(251 253 255 / 78%); --alx-shadow: 0 24px 72px rgb(71 105 148 / 12%); --alx-fluid: cubic-bezier(.22, 1, .36, 1); } @@ -40,6 +40,8 @@ body, .gradio-container { color: var(--alx-ink) !important; } body { margin: 0; } +/* Expose the full-page canvas beyond the centered workspace. */ +gradio-app { background: transparent !important; } .gradio-container { width: 100% !important; @@ -116,7 +118,8 @@ body { margin: 0; } -webkit-backdrop-filter: blur(18px) saturate(148%); transform: translateX(-50%); } -.brand-wordmark { display: flex; align-items: center; cursor: default; user-select: none; } +.brand-wordmark { display: flex; align-items: center; flex: 0 0 auto; width: 160px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 12px; background: transparent; cursor: pointer; user-select: none; } +#alvenx-header .brand-wordmark:focus-visible { outline: 3px solid rgb(37 99 235 / 45%) !important; outline-offset: 4px !important; } .brand-wordmark-image { display: block; width: 160px; height: auto; } .header-nav { display: flex; @@ -157,7 +160,7 @@ body { margin: 0; } padding: 0 12px; border-radius: 999px; background: rgb(255 255 255 / 42%); - color: #315a88; + color: var(--alx-muted); font-size: 12px; font-weight: 620; } @@ -191,7 +194,7 @@ body { margin: 0; } } .run-map header { min-width: 0; } .kicker { - color: #315a88; + color: var(--alx-muted); font-size: 12px; font-weight: 680; letter-spacing: .12em; @@ -213,7 +216,7 @@ body { margin: 0; } .run-map li span { margin-bottom: 18px; color: var(--alx-blue); font-size: 11px; font-weight: 700; } .run-map li strong { color: var(--alx-ink); font-size: 14px; } .run-map li small { margin-top: 3px; color: var(--alx-muted); font-size: 11px; line-height: 1.4; } -.run-map aside { display: grid; grid-template-columns: auto 1fr; gap: 3px 9px; padding: 16px; border-radius: 16px; background: rgb(239 246 255 / 76%); } +.run-map aside { display: grid; grid-template-columns: auto 1fr; gap: 3px 9px; padding: 16px; border-radius: 16px; background: rgb(147 197 253 / 14%); } .run-map aside > span { grid-row: 1 / 3; color: var(--alx-blue); font-size: 9px; } .run-map aside strong { color: var(--alx-ink); font-size: 13px; line-height: 1.35; } .run-map aside small { color: var(--alx-muted); font-size: 11px; line-height: 1.45; } @@ -236,16 +239,16 @@ body { margin: 0; } #media-tabs { margin: 0 0 12px !important; } #media-tabs > .tab-nav, -#media-tabs > div:first-child { display: flex; min-height: 52px; gap: 4px; padding: 4px !important; border: 1px solid var(--alx-rule); border-radius: 14px; background: rgb(248 251 255 / 70%); } +#media-tabs > div:first-child { display: flex; min-height: 52px; gap: 4px; padding: 4px !important; border: 1px solid var(--alx-rule); border-radius: 14px; background: rgb(251 253 255 / 70%); } #media-tabs button[role="tab"], #media-tabs .visually-hidden button { min-height: 44px; flex: 1 1 0; padding: 5px 10px !important; border: 0 !important; border-radius: 10px !important; background: transparent !important; color: var(--alx-muted) !important; font-size: 12px !important; font-weight: 630 !important; } #media-tabs button[role="tab"][aria-selected="true"] { background: #fff !important; color: var(--alx-ink) !important; box-shadow: 0 6px 16px rgb(71 105 148 / 9%); } .media-guidance { display: flex; flex-wrap: wrap; gap: 2px 9px; align-items: baseline; margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--alx-rule); border-radius: 12px; background: rgb(255 255 255 / 46%); color: var(--alx-muted); font-size: 11px; line-height: 1.45; } .media-guidance strong { color: var(--alx-ink); font-size: 11px; } -.media-guidance.warning { border-color: rgb(180 83 9 / 24%); background: #fffbeb; } -.media-guidance.compatible { border-color: rgb(37 99 235 / 20%); background: rgb(219 234 254 / 60%); } +.media-guidance.warning { border-color: rgb(79 70 229 / 28%); background: rgb(79 70 229 / 8%); } +.media-guidance.compatible { border-color: rgb(37 99 235 / 20%); background: rgb(147 197 253 / 28%); } .media-guidance .media-facts { width: 100%; color: var(--alx-muted); font-size: 10px; } -.studio-media-input { min-height: 200px !important; border: 1px dashed rgb(71 105 148 / 28%) !important; border-radius: 16px !important; background: rgb(248 251 255 / 72%) !important; overflow: hidden; } -.studio-media-input img, .studio-media-input video { max-height: 320px !important; object-fit: contain !important; background: rgb(248 251 255 / 80%); } +.studio-media-input { min-height: 200px !important; border: 1px dashed rgb(71 105 148 / 28%) !important; border-radius: 16px !important; background: rgb(251 253 255 / 72%) !important; overflow: hidden; } +.studio-media-input img, .studio-media-input video { max-height: 320px !important; object-fit: contain !important; background: rgb(251 253 255 / 80%); } .gradio-container label > span, .gradio-container .label-wrap span { color: var(--alx-reading) !important; font-size: 12px !important; font-weight: 650 !important; } .gradio-container textarea, @@ -278,7 +281,7 @@ body { margin: 0; } box-shadow: none !important; } .studio-control { margin-top: 8px !important; } -.generation-controls { margin-top: 8px !important; border: 1px solid var(--alx-rule) !important; border-radius: 16px !important; background: rgb(248 251 255 / 60%) !important; } +.generation-controls { margin-top: 8px !important; border: 1px solid var(--alx-rule) !important; border-radius: 16px !important; background: rgb(251 253 255 / 60%) !important; } .generation-controls summary, .generation-controls > .label-wrap { display: flex; width: 100%; min-height: 44px; align-items: center; justify-content: space-between; color: var(--alx-ink); font-size: 13px; font-weight: 640; } .generation-controls .form { display: grid !important; gap: 18px !important; } @@ -315,7 +318,7 @@ body { margin: 0; } border: 0 !important; border-left: 1px solid var(--alx-rule) !important; border-radius: 0 !important; - background: rgb(241 245 249 / 72%) !important; + background: rgb(238 246 255 / 72%) !important; color: var(--alx-reading) !important; line-height: 1 !important; } @@ -337,23 +340,23 @@ body { margin: 0; } .workspace-actions button.secondary { border: 1px solid var(--alx-rule) !important; background: rgb(255 255 255 / 48%) !important; color: var(--alx-reading) !important; } .run-status { display: grid; grid-template-columns: auto 1fr; gap: 2px 9px; align-items: start; margin-top: 10px; padding: 12px 14px; border: 1px solid var(--alx-rule); border-radius: 14px; background: rgb(255 255 255 / 48%); color: var(--alx-muted); font-size: 12px; line-height: 1.5; } -.run-status > span { grid-row: 1 / 3; width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: #64748b; } +.run-status > span { grid-row: 1 / 3; width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: var(--alx-muted); } .run-status strong { color: var(--alx-ink); } .run-status.success > span { background: var(--alx-blue); box-shadow: 0 0 10px rgb(37 99 235 / 32%); } -.run-status.warning { border-color: rgb(180 83 9 / 24%); background: #fffbeb; color: #92400e; } -.run-status.warning > span { background: #b45309; } -.run-status.error { border-color: rgb(220 38 38 / 20%); background: #fef2f2; color: #b91c1c; } -.run-status.error > span { background: #dc2626; } +.run-status.warning { border-color: rgb(79 70 229 / 28%); background: rgb(79 70 229 / 8%); color: var(--alx-indigo); } +.run-status.warning > span { background: var(--alx-indigo); } +.run-status.error { border-color: rgb(124 58 237 / 42%); background: rgb(237 233 254 / 62%); color: #6d28d9; } +.run-status.error > span { background: var(--alx-violet); } .workspace-output #studio-response textarea { min-height: 300px !important; line-height: 1.62 !important; } .metric-panel { margin-top: 12px; padding: 18px; border: 1px solid var(--alx-rule); border-radius: 18px; background: rgb(255 255 255 / 54%); } .panel-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; } .panel-top h3, .empty-state h3 { margin: 7px 0 0; color: var(--alx-ink); font-size: 1.18rem; line-height: 1.2; } .empty-state p { max-width: 62ch; margin: 13px 0 0; color: var(--alx-reading); font-size: 13px; line-height: 1.62; } -.unscored-pill, .protocol-pill, .status-pill { display: inline-flex; min-height: 28px; align-items: center; padding: 0 9px; border-radius: 999px; background: #fffbeb; color: #92400e; font-size: 10px; font-weight: 700; letter-spacing: .07em; } -.status-pill.idle { background: rgb(241 245 249 / 88%); color: var(--alx-muted); } -.status-pill.complete { background: rgb(219 234 254 / 72%); color: #1d4ed8; } -.protocol-pill.formal { background: rgb(219 234 254 / 72%); color: #1d4ed8; } +.unscored-pill, .protocol-pill, .status-pill { display: inline-flex; min-height: 28px; align-items: center; padding: 0 9px; border-radius: 999px; background: rgb(147 197 253 / 28%); color: var(--alx-blue); font-size: 10px; font-weight: 700; letter-spacing: .07em; } +.status-pill.idle { background: rgb(238 246 255 / 88%); color: var(--alx-muted); } +.status-pill.complete { background: rgb(147 197 253 / 28%); color: var(--alx-blue); } +.protocol-pill.formal { background: rgb(147 197 253 / 28%); color: var(--alx-blue); } .live-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 16px; border: 1px solid var(--alx-rule); } .live-card { min-width: 0; padding: 16px; border-right: 1px solid var(--alx-rule); } .live-card:last-child { border-right: 0; } @@ -383,7 +386,7 @@ body { margin: 0; } .method-facts small { color: var(--alx-muted); font-size: 11px; } .method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; } .method-grid article { min-height: 270px; padding: 26px; border: 1px solid rgb(255 255 255 / 76%); border-radius: 22px; background: rgb(255 255 255 / 48%); } -.method-grid article > span { color: #315a88; font-size: 11px; font-weight: 700; letter-spacing: .08em; } +.method-grid article > span { color: var(--alx-muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; } .method-grid h2 { margin: 54px 0 0; color: var(--alx-ink); font-size: clamp(1.35rem, 2vw, 2rem); font-weight: 570; letter-spacing: -.03em; line-height: 1.08; } .method-grid p { margin: 18px 0 0; color: var(--alx-reading); font-size: 14px; line-height: 1.62; } diff --git a/src/openmultimodal_lab/studio_assets.py b/src/openmultimodal_lab/studio_assets.py index 05dcbda..83299cb 100644 --- a/src/openmultimodal_lab/studio_assets.py +++ b/src/openmultimodal_lab/studio_assets.py @@ -21,7 +21,7 @@ "aa72922aafcc0dc18f36ec1d805b0212057dabe8b9d5b8b57f67035aea1b826d" ) ALVENX_WORDMARK_SHA256 = ( - "8ae10e02c27091e29e0191a7934506118f144aae11898b20222d7f9d587e2662" + "6cc422fb2ed289bee723f1c6e6d19baec63c18d988616eb5b90d8332a30b7b1e" ) ALVENX_MONOGRAM_SHA256 = ( "45367ec933c2ed8565cdf9e683fd4b856057d375435b46c62acb4fbb2cbeef16" @@ -93,11 +93,11 @@ def _studio_theme() -> str: BRAND_HEADER_HTML = f"""
-
+
+