diff options
| author | Yasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com> | 2026-10-05 13:17:29 +0900 |
|---|---|---|
| committer | Yasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com> | 2026-10-05 13:17:29 +0900 |
| commit | eecb25b1ac52ec87e382ff8249fa3dfb9e295c13 (patch) | |
| tree | 2c22e605d883f128366f4e43acbe81eea38d09ab /public/bluebey-studio/src/style.css | |
| parent | e22218a01f418fffc89d0c16d88ada84a764b448 (diff) | |
bluebey-studio: ARカメラにシャッターを追加し、スマホ操作の説明を追記
Diffstat (limited to 'public/bluebey-studio/src/style.css')
| -rw-r--r-- | public/bluebey-studio/src/style.css | 27 |
1 files changed, 27 insertions, 0 deletions
diff --git a/public/bluebey-studio/src/style.css b/public/bluebey-studio/src/style.css index f4c9270..61c53db 100644 --- a/public/bluebey-studio/src/style.css +++ b/public/bluebey-studio/src/style.css @@ -111,6 +111,33 @@ body:not(.panel-hidden) #stage { small-screen media query at the end of the viewport/panel section below. */ #viewport-hint-touch { display: none; } +/* AR (camera) mode's shutter: a camera-app button over the viewport. It is a DOM + layer, so it never appears in the exported PNG. */ +.ar-shutter { + position: absolute; + left: 50%; + bottom: calc(22px + env(safe-area-inset-bottom)); + transform: translateX(-50%); + z-index: 4; + width: 64px; + height: 64px; + padding: 0; + border-radius: 50%; + border: 4px solid #ffffff; + background: rgba(255, 255, 255, 0.35); + box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35); + cursor: pointer; +} +.ar-shutter::after { + content: ""; + position: absolute; + inset: 6px; + border-radius: 50%; + background: #ffffff; +} +.ar-shutter:active::after { background: #d9d2e8; } +.ar-shutter[hidden] { display: none; } + /* -------------------------------------------------------------------- panel */ #panel { |