xsl/juzi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(h5): optimize camera flipping and angle haptics, refresh splash branding

Browse Source
This commit is contained in:
xsl
2026-10-13 17:57:55 +08:00
parent e71368db6d
commit 7381306139
19 changed files with 2125 additions and 1282 deletions
Download Patch File Download Diff File Expand all files Collapse all files
h5/css/style.css
+5
View File
@@ -220,6 +220,11 @@ button { font-family: inherit; border: 0; background: none; cursor: pointer; col
#cam-video.mirror { transform: scaleX(-1); } /* 前置镜头镜像预览 */
#s-cam.cam-live #cam-video { display: block; }
#s-cam.cam-live .cam-bg { display: none; }
#cam-frozen { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:none; z-index:0; pointer-events:none; }
#cam-frozen.mirror { transform:scaleX(-1); }
#s-cam.cam-switching #cam-frozen { display:block; }
#s-cam.cam-switching .cam-bg { display:none; }
.cam-flip:disabled { opacity:.5; }
/* 纵向定位按 WebView 口径:Figma 帧 812 高扣掉顶部 86px 微信导航栏 = 726 高视口 */
.cam-step {
position: absolute; left: 0; right: 0; top: 7.1%;
h5/css/ui-20261009.css
+1 -1
View File
@@ -95,7 +95,7 @@
}
.guide-description { font-size: 12px; line-height: 1.6; margin-bottom: calc(35 * var(--u)); }
.cam-feature-lines { fill: none; stroke: #fff; stroke-width: 2.5; stroke-dasharray: 5 5; filter: drop-shadow(0 1px 1px #000); }
#s-cam:not(.cam-live) .cam-feature-lines { stroke: #111; filter: none; }
#s-cam:not(.cam-live):not(.cam-switching) .cam-feature-lines { stroke: #111; filter: none; }
.font-credit { display: block; text-align: center; color: #888; font-size: 10px; margin: 24px auto 0; }
.account-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 8px; font-size: 12px; }
.account-status span::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #b7bac0; }
h5/css/ui-20261012.css
+7
View File
@@ -9,6 +9,13 @@
top: max(6.838833%, calc(env(safe-area-inset-top) + 48px));
}
#s-splash .splash-slogan { top: max(6.838833%, calc(env(safe-area-inset-top) + 48px)); }
/* Retain the PSD's two lower slogan lines; the updated brand uses regular type. */
.splash-slogan-updated .splash-slogan-copy { width:100%; height:100%; clip-path:inset(32% 0 0); }
.splash-slogan-brand { position:absolute; top:0; left:50%; transform:translateX(-50%); font-family:Arial,sans-serif; font-size:23px; font-weight:400; line-height:1; white-space:nowrap; }
#s-splash [data-action="open-privacy"],
#s-splash [data-action="open-privacy"]:focus,
#s-splash [data-action="open-privacy"]:active { border:0; outline:none; box-shadow:none; -webkit-appearance:none; appearance:none; }
#s-splash [data-action="open-privacy"]:focus-visible { filter:brightness(.94); }
.splash-bottom { bottom: max(5.882353%, env(safe-area-inset-bottom)); gap: calc(7.291667 * var(--u)); padding-bottom: 0; }
.brand-row { margin-bottom: calc(10.416667 * var(--u)); gap: 0; }
.brand-lockup { width: 179.513889px; height: 20.486111px; }