diff --git a/posimai-sc/index.html b/posimai-sc/index.html index e2c59a89..54c6769e 100644 --- a/posimai-sc/index.html +++ b/posimai-sc/index.html @@ -217,9 +217,9 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1 .q-card.correct{border-color:rgba(74,222,128,.35);background:rgba(74,222,128,.04)} .q-card.wrong{border-color:rgba(248,113,113,.30);background:rgba(248,113,113,.03)} .q-num{font-size:10px;font-weight:600;color:var(--text3);letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px;display:flex;align-items:center;gap:5px} -.q-text{font-size:13px;color:var(--text);line-height:1.7;margin-bottom:12px} +.q-text{font-size:13px;color:var(--text);line-height:1.7;margin-bottom:12px;word-break:break-word;overflow-wrap:anywhere;line-break:auto} .q-choices{display:flex;flex-direction:column;gap:6px} -.q-choice{display:flex;align-items:flex-start;gap:9px;padding:8px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:12px;color:var(--text2);transition:all .15s;text-align:left;font-family:'Geist',sans-serif;line-height:1.5;width:100%} +.q-choice{display:flex;align-items:flex-start;gap:9px;padding:8px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:12px;color:var(--text2);transition:all .15s;text-align:left;font-family:'Geist',sans-serif;line-height:1.5;width:100%;word-break:break-word;overflow-wrap:anywhere;line-break:auto} .q-choice:hover:not(:disabled){border-color:var(--accent-border);color:var(--text);background:var(--accent-dim)} .q-choice:disabled{cursor:default} .q-choice.sel-ok{border-color:rgba(74,222,128,.45);background:rgba(74,222,128,.09);color:var(--ok)} @@ -253,8 +253,8 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1 .unit-nav{padding-bottom:20px} .home-cats{grid-template-columns:1fr} .q-card{padding:12px;margin-bottom:8px} - .q-text{font-size:12.5px;word-break:keep-all;line-break:strict} - .q-choice{padding:8px 10px;font-size:11.5px;line-height:1.55;word-break:keep-all;line-break:strict} + .q-text{font-size:12.5px;word-break:break-word;overflow-wrap:anywhere;line-break:auto} + .q-choice{padding:8px 10px;font-size:11.5px;line-height:1.55;word-break:break-word;overflow-wrap:anywhere;line-break:auto} .q-exp{font-size:11.5px} } ::-webkit-scrollbar{width:4px} diff --git a/posimai-sc/js/app.js b/posimai-sc/js/app.js index da2d0726..06478fd0 100644 --- a/posimai-sc/js/app.js +++ b/posimai-sc/js/app.js @@ -831,7 +831,10 @@ document.addEventListener('alpine:init', () => { this.$nextTick(()=>{ if(window.lucide) lucide.createIcons(); requestAnimationFrame(()=>{ - requestAnimationFrame(()=>{ this.scrollMainToComprehension(); }); + requestAnimationFrame(()=>{ + this.scrollMainToComprehension('auto'); + setTimeout(()=>{ this.scrollMainToComprehension('auto'); }, 140); + }); }); }); }, @@ -841,20 +844,25 @@ document.addEventListener('alpine:init', () => { } this.$nextTick(()=>{ requestAnimationFrame(()=>{ - requestAnimationFrame(()=>{ this.scrollMainToComprehension(); }); + requestAnimationFrame(()=>{ + this.scrollMainToComprehension('auto'); + setTimeout(()=>{ this.scrollMainToComprehension('auto'); }, 140); + }); }); if(window.lucide) lucide.createIcons(); }); }, - scrollMainToComprehension(){ + scrollMainToComprehension(behavior='auto'){ const m=document.getElementById('main'); const el=document.getElementById('comprehension-quiz'); if(!m||!el) return; try{ el.focus({ preventScroll:true }); }catch(e){} - // main内の実座標で算出して、カード先頭へ安定して合わせる + const firstQ=el.querySelector('.q-card'); + const target=firstQ||el; + // main内の実座標で算出して、カード先頭(Q1)へ安定して合わせる const offset=8; - const top=(el.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset; - m.scrollTo({ top:Math.max(0,top), behavior:'smooth' }); + const top=(target.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset; + m.scrollTo({ top:Math.max(0,top), behavior }); }, stepGoBack(){ if(!this.stepMode) return; diff --git a/posimai-sc/sw.js b/posimai-sc/sw.js index 6b56992c..18154280 100644 --- a/posimai-sc/sw.js +++ b/posimai-sc/sw.js @@ -1,5 +1,5 @@ // posimai-sc SW — same-origin の静的資産のみキャッシュ(CDN は対象外) -const CACHE = 'posimai-sc-v5'; +const CACHE = 'posimai-sc-v6'; const STATIC = [ '/', '/index.html',