14 lines
16 KiB
CSS
14 lines
16 KiB
CSS
.exam-session{min-height:calc(100vh - 76px);color:#10213a;background:#f4f7fb}.exam-session-header{position:sticky;z-index:20;top:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 4%;border-bottom:1px solid #dde5ef;background:#fff;box-shadow:0 5px 15px rgba(16,33,58,.04)}.exam-session-header>div:first-child>span{color:#0871ef;font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.exam-session-header h1{display:inline;margin:0 8px 0 0;font-size:1.05rem}.exam-session-header p{display:inline;margin:0;color:#7c899d;font-size:.68rem}.exam-timer-wrap{text-align:right}.exam-timer-wrap>span{display:block;color:#8190a5;font-size:.58rem}.exam-timer-wrap strong{display:block;color:#0871ef;font-size:1.25rem;font-variant-numeric:tabular-nums}.exam-timer-wrap strong.is-warning{color:#d94b45}.exam-workspace{max-width:920px;margin:auto;padding:25px 4% 55px}.exam-workspace--split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:none;padding:0}.exam-passage,.exam-questions{min-width:0}.exam-workspace--split .exam-passage,.exam-workspace--split .exam-questions{height:calc(100vh - 145px);overflow-y:auto;padding:25px 4% 55px}.exam-passage{border-right:1px solid #dfe6ef;background:#fff}.exam-pane-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.exam-pane-heading span{font-size:.82rem;font-weight:700}.exam-pane-heading small{color:#8a96a8;font-size:.6rem}.exam-passage-text{color:#34435a;font-size:.82rem;line-height:1.8}.exam-passage-text p{margin-bottom:1.2em}.exam-audio{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px;padding:16px;border:1px solid #dce5ef;border-radius:12px;background:#fff}.exam-audio>div{display:flex;align-items:center;gap:10px}.exam-audio i{display:grid;width:38px;height:38px;place-items:center;border-radius:9px;color:#0871ef;background:#eaf3ff}.exam-audio strong,.exam-audio small{display:block}.exam-audio strong{font-size:.75rem}.exam-audio small{color:#8390a3;font-size:.6rem}.exam-audio audio{width:min(330px,50%);height:34px}.exam-question-intro{margin-bottom:17px}.exam-question-intro h2{margin:0 0 4px;font-size:1rem}.exam-question-intro p{margin:0;color:#7b899d;font-size:.68rem}.exam-question-card{min-width:0;margin:0 0 14px;padding:19px;border:1px solid #dde5ef;border-radius:12px;background:#fff;box-shadow:0 5px 17px rgba(16,33,58,.035)}.exam-question-card legend{display:flex;width:100%;align-items:flex-start;gap:10px;margin-bottom:15px;color:#23334c;font-size:.8rem;font-weight:600;line-height:1.55}.exam-question-card legend>span{display:grid;width:25px;height:25px;flex:0 0 25px;place-items:center;border-radius:7px;color:#0871ef;background:#eaf3ff;font-size:.65rem}.exam-options{display:grid;gap:8px;padding-left:35px}.exam-options label{display:flex;align-items:center;gap:9px;padding:9px 11px;border:1px solid #e4eaf2;border-radius:8px;color:#4d5b71;font-size:.73rem;cursor:pointer}.exam-options label:has(input:checked){border-color:#6daaf5;color:#075fcf;background:#f1f7ff}.exam-options input{accent-color:#0871ef}.exam-text-input,.exam-textarea{width:calc(100% - 35px);margin-left:35px;padding:10px 12px;border:1px solid #dce4ee;border-radius:8px;color:#1c2d47;background:#fff;font:inherit;font-size:.76rem;outline:0}.exam-textarea{resize:vertical;line-height:1.6}.exam-text-input:focus,.exam-textarea:focus{border-color:#549bf2;box-shadow:0 0 0 3px rgba(8,113,239,.1)}.exam-submit-area{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:21px;padding-top:18px;border-top:1px solid #dfe6ef}.exam-submit-area p{margin:0;color:#748298;font-size:.64rem}.exam-submit-area p i{margin-right:5px;color:#1b9c55}.exam-submit-area button{padding:11px 17px;border:0;border-radius:9px;color:#fff;background:#0871ef;font:inherit;font-size:.75rem;font-weight:600}.exam-submit-area button:disabled{opacity:.65}.results-page{min-height:calc(100vh - 76px);padding:33px 5% 65px;background:#f5f8fd}.results-shell{max-width:980px;margin:auto}.results-header{margin-bottom:22px}.results-header>span,.answer-review-heading>span{color:#0871ef;font-size:.65rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.results-header h1{margin:5px 0 7px;font-size:1.75rem}.results-header p{margin:0;color:#758297;font-size:.76rem}.results-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:19px}.results-summary article{display:flex;align-items:center;gap:12px;padding:17px;border:1px solid #e0e7f0;border-radius:13px;background:#fff}.result-summary-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:10px}.result-summary-icon--blue{color:#0871ef;background:#eaf3ff}.result-summary-icon--green{color:#1a9650;background:#eaf8ef}.result-summary-icon--orange{color:#d97716;background:#fff2e4}.results-summary article div span,.results-summary article div strong{display:block}.results-summary article div span{color:#8190a4;font-size:.63rem}.results-summary article div strong{margin-top:2px;font-size:.95rem}.answer-review{padding:23px;border:1px solid #e0e7f0;border-radius:15px;background:#fff}.answer-review-heading{margin-bottom:14px}.answer-review-heading h2{margin:3px 0 0;font-size:1rem}.answer-card{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:17px 0;border-top:1px solid #edf1f6}.answer-number{display:grid;width:28px;height:28px;place-items:center;border-radius:8px;color:#0871ef;background:#eaf3ff;font-size:.68rem;font-weight:700}.answer-body h3{margin:3px 0 12px;font-size:.78rem;line-height:1.5}.answer-response{padding:11px;border-radius:8px;background:#f6f8fb}.answer-response span{color:#8995a6;font-size:.6rem;text-transform:uppercase}.answer-response p{margin:3px 0 0;color:#46546a;font-size:.72rem;line-height:1.55}.answer-status{display:inline-flex;align-items:center;gap:5px;margin-top:10px;padding:5px 8px;border-radius:15px;font-size:.62rem;font-weight:600}.answer-status--correct{color:#168c49;background:#eaf8ef}.answer-status--wrong{color:#c44343;background:#ffeded}.answer-status--graded{color:#6840bd;background:#f1eaff}.answer-status--pending{color:#bd6816;background:#fff2e4}.results-empty{padding:30px;color:#8491a4;text-align:center}.results-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.results-actions a{padding:9px 13px;border:1px solid #bcd3ef;border-radius:8px;color:#0871ef;font-size:.7rem;font-weight:600;text-decoration:none}.results-actions a.results-primary{color:#fff;border-color:#0871ef;background:#0871ef}@media(max-width:760px){.exam-workspace--split{grid-template-columns:1fr}.exam-workspace--split .exam-passage,.exam-workspace--split .exam-questions{height:auto;overflow:visible;padding:22px 4%}.exam-passage{border-right:0;border-bottom:1px solid #dfe6ef}.exam-session-header p{display:none}.exam-audio{align-items:stretch;flex-direction:column}.exam-audio audio{width:100%}.results-summary{grid-template-columns:1fr}}@media(max-width:520px){.exam-session-header{padding:11px 4%}.exam-session-header h1{display:block}.exam-session-header p{display:none}.exam-options{padding-left:0}.exam-text-input,.exam-textarea{width:100%;margin-left:0}.exam-submit-area{align-items:stretch;flex-direction:column}.results-page{padding:25px 4% 45px}.results-actions{flex-direction:column;text-align:center}}
|
|
.speaking-upload{width:calc(100% - 35px);margin:10px 0 0 35px;padding:11px;border:1px dashed #b9cbe2;border-radius:9px;background:#f7faff}.speaking-upload label{display:flex;align-items:center;gap:9px;margin-bottom:8px;color:#35465f}.speaking-upload label i{color:#0871ef}.speaking-upload strong,.speaking-upload small{display:block}.speaking-upload strong{font-size:.7rem}.speaking-upload small{margin-top:2px;color:#8190a3;font-size:.58rem}.speaking-upload input{width:100%;font-size:.65rem}.answer-response audio{width:100%;height:35px;margin-top:10px}@media(max-width:520px){.speaking-upload{width:100%;margin-left:0}}
|
|
.exam-session--reading{position:fixed;z-index:2000;inset:0;width:100vw;height:100vh;overflow:hidden;background:#fff}.exam-session--reading .exam-session-header{min-height:60px;padding:8px 18px;border-bottom:1px solid #dce3ec}.exam-session-title{min-width:0}.exam-session--reading .exam-session-title{display:flex;align-items:center;gap:10px}.exam-session--reading .exam-session-title>span{padding:4px 8px;border-radius:12px;color:#53637a;background:#eef2f7;white-space:nowrap}.exam-session--reading .exam-session-title h1{font-size:.9rem}.exam-session--reading .exam-session-title p{overflow:hidden;max-width:300px;text-overflow:ellipsis;white-space:nowrap}.exam-fullscreen-button{display:inline-flex;align-items:center;gap:7px;margin-left:auto;padding:7px 11px;border:1px solid #cfd9e5;border-radius:7px;color:#4c5c73;background:#f8fafc;font:inherit;font-size:.68rem;font-weight:600}.exam-fullscreen-button:hover{color:#0871ef;border-color:#8ebcf4;background:#f1f7ff}.exam-session--reading .exam-timer-wrap{min-width:95px;padding:5px 10px;border:1px solid #f2c4c4;border-radius:7px;background:#fff3f3;text-align:center}.exam-session--reading .exam-timer-wrap>span{color:#9a5b5b}.exam-session--reading .exam-timer-wrap strong{color:#c33e3e;font-size:1rem}.exam-session--reading .exam-session-form{display:flex;height:calc(100vh - 60px);min-height:0;flex-direction:column}.exam-session--reading .exam-workspace--split{display:grid;grid-template-columns:var(--passage-width,55%) 5px minmax(0,1fr);height:auto;min-height:0;padding:0;flex:1}.exam-session--reading .exam-passage,.exam-session--reading .exam-questions{height:100%;min-height:0;overflow-y:auto;padding:22px 26px 45px}.exam-session--reading .exam-passage{background:#fafafa}.exam-session--reading .exam-questions{background:#fff}.exam-session--reading .exam-question-card{scroll-margin:35px}.exam-resizer{position:relative;z-index:3;width:5px;background:#d6dee8;cursor:col-resize;touch-action:none}.exam-resizer:hover,.exam-resizer:focus{background:#8db7e8;outline:0}.exam-resizer:after{content:"";position:absolute;top:50%;left:50%;width:3px;height:44px;border-radius:3px;background:#8594a7;transform:translate(-50%,-50%)}body.is-resizing-exam{cursor:col-resize!important;user-select:none}.exam-question-nav{display:flex;min-height:62px;align-items:center;justify-content:space-between;gap:16px;padding:9px 16px;border-top:1px solid #dce3ec;background:#f8fafc;box-shadow:0 -3px 10px rgba(16,33,58,.05);flex:0 0 auto}.exam-question-numbers{display:flex;min-width:0;gap:6px;overflow-x:auto;padding:3px;scrollbar-width:thin}.exam-question-number{display:grid;width:34px;height:34px;flex:0 0 34px;place-items:center;border:1px solid #cbd5e1;border-radius:50%;color:#475569;background:#e9eef4;font:inherit;font-size:.7rem;font-weight:700;transition:.18s}.exam-question-number:hover{border-color:#8ebcf4;color:#0871ef;background:#eef6ff}.exam-question-number.is-answered{color:#176b3a;border-color:#74c995;background:#ccefd9}.exam-question-number.is-current{color:#fff;border-color:#0871ef;background:#0871ef;box-shadow:0 0 0 3px rgba(8,113,239,.16);transform:scale(1.06)}.exam-question-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}.exam-nav-button,.exam-bottom-submit{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 11px;border:1px solid #cbd5e1;border-radius:7px;color:#475569;background:#fff;font:inherit;font-size:.68rem;font-weight:600}.exam-nav-button:hover:not(:disabled){color:#0871ef;border-color:#8ebcf4;background:#f1f7ff}.exam-nav-button:disabled{cursor:not-allowed;opacity:.45}.exam-bottom-submit{color:#fff;border-color:#21965a;background:#28a966}.exam-bottom-submit:hover{background:#218d56}.exam-bottom-submit:disabled{opacity:.6}@media(max-width:760px){.exam-session--reading .exam-session-header{min-height:58px}.exam-session--reading .exam-session-title>span,.exam-session--reading .exam-session-title p,.exam-fullscreen-button span{display:none}.exam-session--reading .exam-session-form{height:calc(100vh - 58px)}.exam-session--reading .exam-workspace--split{display:block;overflow-y:auto}.exam-session--reading .exam-passage,.exam-session--reading .exam-questions{height:auto;overflow:visible;padding:19px 4% 28px}.exam-resizer{display:none}.exam-question-nav{align-items:stretch;gap:7px;padding:7px 9px;flex-direction:column}.exam-question-numbers{width:100%}.exam-question-actions{width:100%;justify-content:flex-end}.exam-question-actions .exam-bottom-submit{margin-left:auto}}@media(max-width:480px){.exam-fullscreen-button{padding:7px 9px}.exam-nav-button span{display:none}.exam-question-number{width:31px;height:31px;flex-basis:31px}.exam-bottom-submit{padding:8px 10px}}
|
|
.exam-session--reading{display:flex;flex-direction:column}.exam-session--reading .exam-session-header{flex:0 0 auto}.exam-session--reading .exam-session-form{height:auto;flex:1}@media(max-width:760px){.exam-session--reading .exam-session-form{height:auto}}
|
|
.exam-session--reading .exam-passage{position:relative}.passage-selection-toolbar{position:fixed;z-index:2100;display:flex;gap:3px;padding:4px;border:1px solid #c9d7e7;border-radius:8px;background:#10213a;box-shadow:0 8px 20px rgba(16,33,58,.22)}.passage-selection-toolbar[hidden]{display:none}.passage-selection-toolbar:after{position:absolute;bottom:-5px;left:14px;width:9px;height:9px;border-right:1px solid #c9d7e7;border-bottom:1px solid #c9d7e7;background:#10213a;content:"";transform:rotate(45deg)}.passage-selection-toolbar button{position:relative;z-index:1;display:inline-flex;align-items:center;gap:5px;padding:7px 9px;border:0;border-radius:5px;color:#fff;background:transparent;font:inherit;font-size:.64rem;font-weight:700}.passage-selection-toolbar button:hover{background:rgba(255,255,255,.14)}.passage-selection-toolbar i{color:#f6d93c;font-size:.75rem}.passage-note-editor{position:fixed;z-index:2110;width:300px;padding:12px;border:1px solid #c8daf1;border-radius:9px;background:#f3f8ff;box-shadow:0 10px 28px rgba(16,33,58,.18)}.passage-note-editor[hidden]{display:none}.passage-note-editor strong{font-size:.7rem}.passage-note-editor p{overflow:hidden;margin:4px 0 8px;color:#61728b;font-size:.62rem;font-style:italic;text-overflow:ellipsis;white-space:nowrap}.passage-note-editor textarea{box-sizing:border-box;width:100%;resize:vertical;padding:8px;border:1px solid #c8d7e8;border-radius:6px;color:#253851;background:#fff;font:inherit;font-size:.68rem;outline:0}.passage-note-editor textarea:focus{border-color:#549bf2;box-shadow:0 0 0 3px rgba(8,113,239,.1)}.passage-note-editor>div{display:flex;justify-content:flex-end;gap:6px;margin-top:8px}.passage-note-editor button{padding:6px 9px;border:1px solid #c7d6e7;border-radius:5px;color:#5d6f88;background:#fff;font:inherit;font-size:.61rem;font-weight:700}.passage-note-editor button:last-child{border-color:#0871ef;color:#fff;background:#0871ef}.exam-highlight{padding:0 1px;border-radius:2px;background:#fff09b;box-shadow:inset 0 -1px 0 rgba(206,168,0,.32);cursor:help}.exam-highlight[data-note]{border-bottom:2px dotted #0871ef}@media(max-width:760px){.passage-selection-toolbar{max-width:calc(100vw - 20px)}.passage-note-editor{width:min(300px,calc(100vw - 20px))}}
|
|
/* Reading band detail shown beneath the band score. */
|
|
.results-summary article div small{display:block;margin-top:2px;color:#7b899d;font-size:.55rem;font-weight:600}
|
|
/* Results-page navigation and heading hierarchy. */
|
|
.results-page .exam-back{display:inline-flex;align-items:center;gap:7px;margin:0 0 18px;padding:7px 10px;border:1px solid #d7e2ef;border-radius:8px;color:#48617e;background:#fff;font-size:.68rem;font-weight:700;line-height:1;text-decoration:none;box-shadow:0 2px 7px rgba(16,33,58,.04)}
|
|
.results-page .exam-back:hover{border-color:#a9caf3;color:#0871ef;background:#f7fbff}
|
|
.results-page .results-header{margin-top:0}
|
|
.results-page .results-header>span{display:block;margin:0 0 7px}
|
|
.results-page .results-header h1{margin:0 0 7px}
|