|
|
@@ -12,7 +12,7 @@
|
|
|
{props.currentSubject.opts.map((item: any, index: number) => (
|
|
|
<div class="answer-box" key={Number(index)}>
|
|
|
<div class="choose-icon">{String.fromCharCode(65 + Number(index))}</div>
|
|
|
- <span class={{ "answer-text": true, true: props.currentSubject.answer.includes(item) }}>{item}</span>
|
|
|
+ <span class={{ "answer-text": true, true: props.currentSubject.answer===item }}>{item}</span>
|
|
|
</div>
|
|
|
))}
|
|
|
</div>
|
|
|
@@ -25,39 +25,39 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
- .choose-icon {
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- border-radius: 50%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- font-size: 17px;
|
|
|
- box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
|
|
|
- box-sizing: border-box;
|
|
|
- margin-left: 5px;
|
|
|
- margin-top: 1px;
|
|
|
+.choose-icon {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 17px;
|
|
|
+ box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-left: 5px;
|
|
|
+ margin-top: 1px;
|
|
|
+}
|
|
|
+.checkbox-answer {
|
|
|
+ padding: 8px 10px;
|
|
|
+ background-color: #f2f3f5;
|
|
|
+ margin-top: 25px;
|
|
|
+}
|
|
|
+.answer-box {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 25px;
|
|
|
+ align-items: center;
|
|
|
+ .iconTrue {
|
|
|
+ background-color: #01c18d;
|
|
|
}
|
|
|
- .checkbox-answer {
|
|
|
- padding: 8px 10px;
|
|
|
- background-color: #f2f3f5;
|
|
|
- margin-top: 25px;
|
|
|
+ .answer-text {
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
- .answer-box {
|
|
|
- display: flex;
|
|
|
- margin-top: 25px;
|
|
|
- align-items: center;
|
|
|
- .iconTrue {
|
|
|
- background-color: #01c18d;
|
|
|
- }
|
|
|
- .answer-text {
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
- .true {
|
|
|
- color: #01c18d;
|
|
|
- }
|
|
|
- .false {
|
|
|
- color: #ff4d53;
|
|
|
- }
|
|
|
+ .true {
|
|
|
+ color: #01c18d;
|
|
|
}
|
|
|
+ .false {
|
|
|
+ color: #ff4d53;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
