mai
/
posimai-root
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(posimai-sc): モバイルの理解度ジャンプ精度と設問折り返しを改善 

Made-with: Cursor
This commit is contained in:
posimai 2026-04-20 20:07:06 +09:00
parent 220c7c2449
commit f33854b8a0
3 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
posimai-sc/index.html
View File

@ -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}

20
posimai-sc/js/app.js
View File

@ -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;

2
posimai-sc/sw.js
View File

@ -1,5 +1,5 @@
// posimai-sc SW — same-origin の静的資産のみキャッシュ（CDN は対象外）
const CACHE = 'posimai-sc-v5';
const CACHE = 'posimai-sc-v6';
const STATIC = [
'/',
'/index.html',