diff --git a/src/components/Question.vue b/src/components/Question.vue index 9a8d7f2..258e4dd 100644 --- a/src/components/Question.vue +++ b/src/components/Question.vue @@ -94,7 +94,9 @@ const d = ref(0); @click="nextQuestion" /> @@ -264,36 +266,37 @@ legend label cursor: pointer + display: block input[type=radio] display: none - & + label + & + label > div position: relative padding: .2rem .2rem .2rem 2rem - & + label::before, - & + label::after + & + label > div::before, + & + label > div::after display: block position: absolute box-sizing: border-box content:'' border-radius: 1rem - & + label::before - bottom: .3rem + & + label > div::before + top: .5rem left: 0 background-color: var(--color-green) width: 1rem height: 1rem - & + label::after - bottom: calc(3px + .3rem) + & + label > div::after + top: calc(3px + .5rem) left: 3px width: calc(1rem - 6px) height: calc(1rem - 6px) - &:checked + label + &:checked + label > div text-shadow: -0.06ex 0 0 currentColor, 0.06ex 0 0 currentColor - &:not(:checked) + label::before + &:not(:checked) + label > div::before background-color: var(--color-green) - &:not(:checked) + label::after + &:not(:checked) + label > div::after background-color: white .main