Skip to content

K
kus-admin
Commit 6350c626 by talequale
Options

quiz questions desktop style

parent dd35f9ba
Showing with 246 additions and 21 deletions
public/uploads/images/correct.svg 0 → 100644
<svg width="11" height="9" viewBox="0 0 11 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 4.5L4.21429 8L10 1" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
public/uploads/images/incorrect.svg 0 → 100644
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.61108 1.2295L1.22724 7.61169C0.906455 7.9324 0.906455 8.45237 1.22724 8.77307C1.54803 9.09378 2.06813 9.09378 2.38892 8.77307L8.77276 2.39088C9.09354 2.07017 9.09355 1.5502 8.77276 1.2295C8.45197 0.908792 7.93187 0.908792 7.61108 1.2295Z" fill="white" stroke="white" stroke-width="0.5"/>
<path d="M8.77276 7.60913L2.38892 1.22693C2.06813 0.906223 1.54803 0.906223 1.22724 1.22693C0.906455 1.54763 0.906454 2.0676 1.22724 2.38831L7.61108 8.7705C7.93187 9.09121 8.45197 9.09121 8.77276 8.7705C9.09355 8.4498 9.09355 7.92983 8.77276 7.60913Z" fill="white" stroke="white" stroke-width="0.5"/>
</svg>
src/svg/link.svg 0 → 100644
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path d="M3.79811 23.1587L3.79866 23.1587L14.5005 23.1L14.6631 23.0991L14.589 22.9544L14.589 22.9544L14.589 22.9544L14.589 22.9544L14.589 22.9544L14.589 22.9544L14.589 22.9543L14.589 22.9543L14.589 22.9543L14.5889 22.9543L14.5889 22.9543L14.5889 22.9543L14.5889 22.9542L14.5889 22.9542L14.5889 22.9542L14.5889 22.9542L14.5889 22.9542L14.5889 22.9541L14.5888 22.9541L14.5888 22.9541L14.5888 22.954L14.5888 22.954L14.5888 22.954L14.5888 22.9539L14.5887 22.9539L14.5887 22.9539L14.5887 22.9538L14.5887 22.9538L14.5887 22.9537L14.5886 22.9537L14.5886 22.9536L14.5886 22.9536L14.5886 22.9535L14.5885 22.9535L14.5885 22.9534L14.5885 22.9534L14.5884 22.9533L14.5884 22.9532L14.5884 22.9532L14.5883 22.9531L14.5883 22.953L14.5883 22.9529L14.5882 22.9529L14.5882 22.9528L14.5881 22.9527L14.5881 22.9526L14.588 22.9525L14.588 22.9524L14.5879 22.9523L14.5879 22.9523L14.5878 22.9522L14.5878 22.9521L14.5877 22.9519L14.5877 22.9518L14.5876 22.9517L14.5876 22.9516L14.5875 22.9515L14.5874 22.9514L14.5874 22.9512L14.5873 22.9511L14.5873 22.951L14.5872 22.9509L14.5871 22.9507L14.587 22.9506L14.587 22.9504L14.5869 22.9503L14.5868 22.9501L14.5867 22.95L14.5866 22.9498L14.5866 22.9496L14.5865 22.9495L14.5864 22.9493L14.5863 22.9491L14.5862 22.949L14.5861 22.9488L14.586 22.9486L14.5859 22.9484L14.5858 22.9482L14.5857 22.948L14.5856 22.9478L14.5855 22.9476L14.5854 22.9474L14.5853 22.9472L14.5852 22.9469L14.5851 22.9467L14.5849 22.9465L14.5848 22.9463L14.5847 22.946L14.5846 22.9458L14.5845 22.9455L14.5843 22.9453L14.5842 22.945L14.5841 22.9448L14.5839 22.9445L14.5838 22.9442L14.5836 22.9439L14.5835 22.9437L14.5834 22.9434L14.5832 22.9431L14.5831 22.9428L14.5829 22.9425L14.5827 22.9422L14.5826 22.9419L14.5824 22.9415L14.5823 22.9412L14.5821 22.9409L14.5819 22.9406L14.5817 22.9402L14.5816 22.9399L14.5814 22.9395L14.5812 22.9392L14.581 22.9388L14.5808 22.9384L14.5806 22.9381L14.5805 22.9377L14.5803 22.9373L14.5801 22.9369L14.5799 22.9365L14.5796 22.9361L14.5794 22.9357L14.5792 22.9353L14.579 22.9349L14.5788 22.9345L14.5786 22.934L14.5784 22.9336L14.5781 22.9332L14.5779 22.9327L14.5777 22.9323L14.5774 22.9318L14.5772 22.9313L14.5769 22.9308L14.5767 22.9304L14.5764 22.9299L14.5762 22.9294L14.5759 22.9289L14.5757 22.9284L14.5754 22.9279L14.5751 22.9273L14.5749 22.9268L14.5746 22.9263L14.5743 22.9257L14.574 22.9252L14.5738 22.9246L14.5735 22.9241L14.5732 22.9235L14.5729 22.9229L14.5726 22.9223L14.5723 22.9217L14.572 22.9211L14.5717 22.9205L14.5714 22.9199L14.571 22.9193L14.5707 22.9187L14.5704 22.918L14.5701 22.9174L14.5697 22.9168L14.5694 22.9161L14.5691 22.9154L14.5687 22.9148L14.5684 22.9141L14.568 22.9134L14.5677 22.9127L14.5673 22.912L14.5669 22.9113L14.5666 22.9106L14.5662 22.9098L14.5658 22.9091L14.5654 22.9084L14.565 22.9076L14.5647 22.9068L14.5643 22.9061L14.5639 22.9053L14.5635 22.9045L14.5631 22.9037L14.5627 22.9029L14.5622 22.9021L14.5618 22.9013L14.5614 22.9005L14.561 22.8996L14.5605 22.8988L14.5601 22.8979L14.5597 22.8971L14.5592 22.8962L14.5588 22.8953L14.5583 22.8944L14.5579 22.8935L14.5574 22.8926L14.5569 22.8917L14.5565 22.8908L14.556 22.8899L14.5555 22.8889L14.555 22.888L14.5545 22.887L14.554 22.8861L14.5535 22.8851L14.553 22.8841L14.5525 22.8831L14.552 22.8821L14.5515 22.8811L14.551 22.8801L14.5504 22.879L14.5499 22.878L14.5494 22.8769L14.5488 22.8759L14.5483 22.8748L14.5477 22.8737L14.5471 22.8726L14.5466 22.8715L14.546 22.8704L14.5454 22.8693L14.5449 22.8682L14.5443 22.867L14.5437 22.8659L14.5431 22.8647L14.5425 22.8635L14.5419 22.8624L14.5413 22.8612L14.5407 22.86L14.5401 22.8588L14.5394 22.8575L14.5388 22.8563L14.5382 22.8551L14.5375 22.8538L14.5369 22.8526L14.5362 22.8513L14.5356 22.85L14.5349 22.8487L14.5342 22.8474L14.5336 22.8461L14.5329 22.8448L14.5322 22.8434L14.5315 22.8421L14.5308 22.8407L14.5301 22.8393L14.5294 22.838L14.5287 22.8366L14.528 22.8352L14.5272 22.8337L14.5265 22.8323L14.5258 22.8309L14.525 22.8294L14.5243 22.828L14.5235 22.8265L14.5228 22.825L14.522 22.8235L14.5213 22.822L14.5205 22.8205L14.5197 22.819L14.5189 22.8174L14.5181 22.8159L14.5173 22.8143L14.5165 22.8128L14.5157 22.8112L14.5149 22.8096L14.5141 22.808L14.5132 22.8063L14.5124 22.8047L14.5115 22.8031L14.5107 22.8014L14.5098 22.7997L14.509 22.798L14.5081 22.7964L14.5072 22.7947L14.5064 22.7929L14.5055 22.7912L14.5046 22.7895L14.5037 22.7877L14.5028 22.7859L14.5019 22.7842L14.501 22.7824L14.5 22.7806L14.4991 22.7787L14.4982 22.7769L14.4972 22.7751L14.4963 22.7732L14.4953 22.7713L14.4944 22.7695L14.4934 22.7676L14.4924 22.7657L14.4914 22.7637L14.4904 22.7618L14.4894 22.7599L14.4884 22.7579L14.4874 22.7559L14.4864 22.7539L14.4854 22.752L14.4844 22.7499L14.4833 22.7479L14.4823 22.7459L14.4812 22.7438L14.4802 22.7418L14.4791 22.7397L14.478 22.7376L14.477 22.7355L14.4759 22.7334L14.4748 22.7312L14.4737 22.7291L14.4726 22.7269L14.4715 22.7248L14.4704 22.7226L14.4692 22.7204L14.4681 22.7181L14.4669 22.7159L14.4658 22.7137L14.4646 22.7114L14.4635 22.7091L14.4623 22.7069L14.4611 22.7046L14.46 22.7022L14.4588 22.6999L14.4576 22.6976L14.4564 22.6952L14.4551 22.6929L14.4539 22.6905L14.4527 22.6881L14.4515 22.6857L14.4502 22.6832L14.449 22.6808L14.4477 22.6783L14.4464 22.6758L14.4452 22.6734L14.4439 22.6709L14.4426 22.6683L14.4413 22.6658L14.44 22.6633L14.4387 22.6607L14.4374 22.6581L14.436 22.6555L14.4347 22.6529L14.4334 22.6503L14.432 22.6477L14.4307 22.645L14.4293 22.6424L14.4279 22.6397L14.4265 22.637L14.4252 22.6343L14.4238 22.6315L14.4224 22.6288L14.4209 22.626L14.4195 22.6232L14.4181 22.6205L14.4167 22.6177L14.4152 22.6148L14.4138 22.612L14.4123 22.6091L14.4108 22.6063L14.4094 22.6034L14.4079 22.6005L14.4064 22.5976L14.4049 22.5946L14.4034 22.5917L14.4018 22.5887L14.4003 22.5857L14.3988 22.5827L14.3972 22.5797L14.3957 22.5767L14.3941 22.5736L14.3926 22.5706L14.391 22.5675L14.3894 22.5644L14.3878 22.5613L14.3862 22.5582L14.3846 22.555L14.383 22.5519L14.3814 22.5487L14.3797 22.5455L14.3781 22.5423L14.3764 22.539L14.3748 22.5358L14.3731 22.5325L14.3714 22.5293L14.3697 22.526L14.368 22.5227L14.3663 22.5193L14.3646 22.516L14.3629 22.5126L14.3612 22.5092L14.3594 22.5058L14.3577 22.5024L14.3559 22.499L14.3542 22.4955L14.3524 22.4921L14.3506 22.4886L14.3488 22.4851L14.347 22.4816L14.3452 22.478L14.3434 22.4745L14.3415 22.4709L14.3397 22.4673L14.3379 22.4637L14.336 22.4601L14.3341 22.4564L14.3323 22.4528L14.3304 22.4491L14.3285 22.4454L14.3266 22.4417L14.3247 22.4379L14.3228 22.4342L14.3208 22.4304L14.3189 22.4266L14.3169 22.4228L14.315 22.419L14.313 22.4151L14.311 22.4113L14.3091 22.4074L14.3071 22.4035L14.3051 22.3996L14.303 22.3957L14.301 22.3917L14.299 22.3877L14.2969 22.3837L14.2949 22.3797L14.2928 22.3757L14.2908 22.3717L14.2887 22.3676L14.2866 22.3635L14.2845 22.3594L14.2824 22.3553L14.2803 22.3511L14.2781 22.347L14.276 22.3428L14.2738 22.3386L14.2717 22.3344L14.2695 22.3301L14.2673 22.3259L14.2651 22.3216L14.263 22.3173L14.2607 22.313L14.2585 22.3087L14.2563 22.3043L14.2541 22.2999L14.2518 22.2955L14.2496 22.2911L14.2473 22.2867L14.245 22.2823L14.2427 22.2778L14.2404 22.2733L14.2381 22.2688L14.2358 22.2642L14.2335 22.2597L14.2311 22.2551L14.2288 22.2505L14.2264 22.2459L14.224 22.2413L14.2217 22.2366L14.2193 22.232L14.2169 22.2273L14.2145 22.2226L14.212 22.2178L14.2096 22.2131L14.2072 22.2083L14.2047 22.2035L14.2022 22.1987L14.1998 22.1939L14.1973 22.189L14.1948 22.1841L14.1923 22.1792L14.1898 22.1743L14.1872 22.1694L14.1847 22.1644L14.1822 22.1595L14.1796 22.1545L14.177 22.1494L14.1745 22.1444L14.1719 22.1393L14.1693 22.1342L14.1666 22.1291L14.164 22.124L14.1614 22.1189L14.1587 22.1137L14.1561 22.1085L14.1534 22.1033L14.1507 22.0981L14.1481 22.0928L14.1454 22.0875L14.1426 22.0822L14.1399 22.0769L14.1372 22.0716L14.1344 22.0662L14.1317 22.0608L14.1289 22.0554L14.1261 22.05L14.1234 22.0446L14.1206 22.0391L14.1177 22.0336L14.1149 22.0281L14.1121 22.0225L14.1092 22.017L14.1064 22.0114L14.1035 22.0058L14.1006 22.0002L14.0978 21.9945L14.0949 21.9889L14.0919 21.9832L14.089 21.9775L14.0612 21.923H14H3.79811C3.47455 21.923 3.27308 22.2323 3.27308 22.5409C3.27308 22.6945 3.3123 22.8467 3.39919 22.9631C3.48847 23.0828 3.62415 23.1587 3.79811 23.1587ZM13.2904 20.6386H13.4258L13.386 20.5091C13.2795 20.1631 13.1747 19.8225 13.105 19.4828L13.0886 19.4029H13.0071H3.83353C3.50997 19.4029 3.3085 19.7122 3.3085 20.0207C3.3085 20.184 3.37105 20.3359 3.46473 20.4475C3.55738 20.5579 3.68946 20.6386 3.83353 20.6386H13.2904ZM12.83 18.0839H12.93V17.9839V17.9837V17.9835V17.9833V17.9831V17.9829V17.9827V17.9825V17.9823V17.9821V17.9819V17.9817V17.9815V17.9813V17.9811V17.9809V17.9807V17.9805V17.9802V17.98V17.9798V17.9796V17.9794V17.9792V17.979V17.9788V17.9786V17.9784V17.9782V17.978V17.9778V17.9776V17.9774V17.9772V17.977V17.9768V17.9766V17.9764V17.9762V17.976V17.9758V17.9756V17.9754V17.9752V17.975V17.9748V17.9746V17.9744V17.9742V17.974V17.9738V17.9736V17.9734V17.9732V17.973V17.9728V17.9726V17.9724V17.9722V17.972V17.9718V17.9716V17.9713V17.9711V17.9709V17.9707V17.9705V17.9703V17.9701V17.9699V17.9697V17.9695V17.9693V17.9691V17.9689V17.9687V17.9685V17.9683V17.9681V17.9679V17.9677V17.9675V17.9673V17.9671V17.9669V17.9667V17.9665V17.9663V17.9661V17.9659V17.9657V17.9655V17.9653V17.9651V17.9649V17.9647V17.9645V17.9643V17.9641V17.9639V17.9637V17.9635V17.9633V17.9631V17.9629V17.9627V17.9624V17.9622V17.962V17.9618V17.9616V17.9614V17.9612V17.961V17.9608V17.9606V17.9604V17.9602V17.96V17.9598V17.9596V17.9594V17.9592V17.959V17.9588V17.9586V17.9584V17.9582V17.958V17.9578V17.9576V17.9574V17.9572V17.957V17.9568V17.9566V17.9564V17.9562V17.956V17.9558V17.9556V17.9554V17.9552V17.955V17.9548V17.9546V17.9544V17.9542V17.954V17.9537V17.9535V17.9533V17.9531V17.9529V17.9527V17.9525V17.9523V17.9521V17.9519V17.9517V17.9515V17.9513V17.9511V17.9509V17.9507V17.9505V17.9503V17.9501V17.9499V17.9497V17.9495V17.9493V17.9491V17.9489V17.9487V17.9485V17.9483V17.9481V17.9479V17.9477V17.9475V17.9473V17.9471V17.9469V17.9467V17.9465V17.9463V17.9461V17.9459V17.9457V17.9455V17.9453V17.9451V17.9448V17.9446V17.9444V17.9442V17.944V17.9438V17.9436V17.9434V17.9432V17.943V17.9428V17.9426V17.9424V17.9422V17.942V17.9418V17.9416V17.9414V17.9412V17.941V17.9408V17.9406V17.9404V17.9402V17.94V17.9398V17.9396V17.9394V17.9392V17.939V17.9388V17.9386V17.9384V17.9382V17.938V17.9378V17.9376V17.9374V17.9372V17.937V17.9368V17.9366V17.9364V17.9362V17.9359V17.9357V17.9355V17.9353V17.9351V17.9349V17.9347V17.9345V17.9343V17.9341V17.9339V17.9337V17.9335V17.9333V17.9331V17.9329V17.9327V17.9325V17.9323V17.9321V17.9319V17.9317V17.9315V17.9313V17.9311V17.9309V17.9307V17.9305V17.9303V17.9301V17.9299V17.9297V17.9295V17.9293V17.9291V17.9289V17.9287V17.9285V17.9283V17.9281V17.9279V17.9277V17.9275V17.9273V17.927V17.9268V17.9266V17.9264V17.9262V17.926V17.9258V17.9256V17.9254V17.9252V17.925V17.9248V17.9246V17.9244V17.9242V17.924V17.9238V17.9236V17.9234V17.9232V17.923V17.9228V17.9226V17.9224V17.9222V17.922V17.9218V17.9216V17.9214V17.9212V17.921V17.9208V17.9206V17.9204V17.9202V17.92V17.9198V17.9196V17.9194V17.9192V17.919V17.9188V17.9186V17.9184V17.9181V17.9179V17.9177V17.9175V17.9173V17.9171V17.9169V17.9167V17.9165V17.9163V17.9161V17.9159V17.9157V17.9155V17.9153V17.9151V17.9149V17.9147V17.9145V17.9143V17.9141V17.9139V17.9137V17.9135V17.9133V17.9131V17.9129V17.9127V17.9125V17.9123V17.9121V17.9119V17.9117V17.9115V17.9113V17.9111V17.9109V17.9107V17.9105V17.9103V17.9101V17.9099V17.9097V17.9095V17.9092V17.909V17.9088V17.9086V17.9084V17.9082V17.908V17.9078V17.9076V17.9074V17.9072V17.907V17.9068V17.9066V17.9064V17.9062V17.906V17.9058V17.9056V17.9054V17.9052V17.905V17.9048V17.9046V17.9044V17.9042V17.904V17.9038V17.9036V17.9034V17.9032V17.903V17.9028V17.9026V17.9024V17.9022V17.902V17.9018V17.9016V17.9014V17.9012V17.901V17.9008V17.9005V17.9003V17.9001V17.8999V17.8997V17.8995V17.8993V17.8991V17.8989V17.8987V17.8985V17.8983V17.8981V17.8979V17.8977V17.8975V17.8973V17.8971V17.8969V17.8967V17.8965V17.8963V17.8961V17.8959V17.8957V17.8955V17.8953V17.8951V17.8949V17.8947V17.8945V17.8943V17.8941V17.8939V17.8937V17.8935V17.8933V17.8931V17.8929V17.8927V17.8925V17.8923V17.8921V17.8919V17.8917V17.8914V17.8912V17.891V17.8908V17.8906V17.8904V17.8902V17.89V17.8898V17.8896V17.8894V17.8892V17.889V17.8888V17.8886V17.8884V17.8882V17.888V17.8878V17.8876V17.8874V17.8872V17.887V17.8868V17.8866V17.8864V17.8862V17.886V17.8858V17.8856V17.8854V17.8852V17.885V17.8848V17.8846V17.8844V17.8842V17.884V17.8838V17.8836V17.8834V17.8832V17.883V17.8827V17.8825V17.8823V17.8821V17.8819V17.8817V17.8815V17.8813V17.8811V17.8809V17.8807V17.8805V17.8803C12.93 17.5763 12.9647 17.2712 13.0002 16.9595L13.0129 16.8482H12.9008H3.83353C3.50997 16.8482 3.3085 17.1575 3.3085 17.4661C3.3085 17.6294 3.37105 17.7812 3.46473 17.8928C3.55738 18.0032 3.68946 18.0839 3.83353 18.0839H12.83ZM13.2904 15.5638H13.3663L13.3867 15.4907C13.491 15.118 13.6297 14.7805 13.8023 14.4776L13.8876 14.3281H13.7155H3.83353C3.50997 14.3281 3.3085 14.6374 3.3085 14.9459C3.3085 15.1092 3.37105 15.2611 3.46473 15.3727C3.55738 15.4831 3.68946 15.5638 3.83353 15.5638H13.2904ZM21.9094 27.0676L21.8446 27.0597L21.8113 27.1158C21.4408 27.7396 20.7307 28.1371 19.9492 28.1371H4.36482C3.14252 28.1371 2.16257 27.1783 2.16257 25.9931V5.27963C2.16257 4.09445 3.14252 3.13567 4.36482 3.13567H19.9492C21.1715 3.13567 22.1515 4.09445 22.1515 5.27963V9.35328V9.45328H22.2515C22.3449 9.45328 22.4375 9.44425 22.5246 9.43576L22.5268 9.43555C22.6162 9.42684 22.6999 9.41876 22.7828 9.41876C22.9614 9.41876 23.1288 9.41906 23.2949 9.45143L23.4141 9.47466V9.35328V5.27963C23.4141 3.42683 21.8438 1.9 19.9492 1.9H4.36482C2.47023 1.9 0.9 3.42683 0.9 5.27963V25.9931C0.9 27.8459 2.47023 29.3727 4.36482 29.3727H19.9492C21.4075 29.3727 22.6477 28.4843 23.1586 27.2393L23.2152 27.1014H23.0661H23.0655H23.0649H23.0643H23.0636H23.063H23.0624H23.0618H23.0612H23.0605H23.0599H23.0593H23.0587H23.0581H23.0575H23.0569H23.0563H23.0556H23.055H23.0544H23.0538H23.0532H23.0526H23.052H23.0514H23.0508H23.0502H23.0496H23.049H23.0484H23.0478H23.0472H23.0466H23.046H23.0454H23.0448H23.0442H23.0436H23.043H23.0424H23.0418H23.0412H23.0406H23.0401H23.0395H23.0389H23.0383H23.0377H23.0371H23.0365H23.0359H23.0353H23.0348H23.0342H23.0336H23.033H23.0324H23.0318H23.0313H23.0307H23.0301H23.0295H23.0289H23.0284H23.0278H23.0272H23.0266H23.0261H23.0255H23.0249H23.0243H23.0238H23.0232H23.0226H23.022H23.0215H23.0209H23.0203H23.0198H23.0192H23.0186H23.0181H23.0175H23.0169H23.0164H23.0158H23.0152H23.0147H23.0141H23.0135H23.013H23.0124H23.0119H23.0113H23.0107H23.0102H23.0096H23.0091H23.0085H23.0079H23.0074H23.0068H23.0063H23.0057H23.0052H23.0046H23.004H23.0035H23.0029H23.0024H23.0018H23.0013H23.0007H23.0002H22.9996H22.9991H22.9985H22.998H22.9974H22.9969H22.9963H22.9958H22.9952H22.9947H22.9941H22.9936H22.993H22.9925H22.992H22.9914H22.9909H22.9903H22.9898H22.9892H22.9887H22.9882H22.9876H22.9871H22.9865H22.986H22.9854H22.9849H22.9844H22.9838H22.9833H22.9828H22.9822H22.9817H22.9811H22.9806H22.9801H22.9795H22.979H22.9785H22.9779H22.9774H22.9769H22.9763H22.9758H22.9752H22.9747H22.9742H22.9736H22.9731H22.9726H22.9721H22.9715H22.971H22.9705H22.9699H22.9694H22.9689H22.9683H22.9678H22.9673H22.9667H22.9662H22.9657H22.9652H22.9646H22.9641H22.9636H22.963H22.9625H22.962H22.9615H22.9609H22.9604H22.9599H22.9594H22.9588H22.9583H22.9578H22.9573H22.9567H22.9562H22.9557H22.9552H22.9546H22.9541H22.9536H22.9531H22.9525H22.952H22.9515H22.951H22.9504H22.9499H22.9494H22.9489H22.9484H22.9478H22.9473H22.9468H22.9463H22.9457H22.9452H22.9447H22.9442H22.9437H22.9431H22.9426H22.9421H22.9416H22.9411H22.9405H22.94H22.9395H22.939H22.9385H22.9379H22.9374H22.9369H22.9364H22.9359H22.9353H22.9348H22.9343H22.9338H22.9333H22.9327H22.9322H22.9317H22.9312H22.9307H22.9301H22.9296H22.9291H22.9286H22.9281H22.9276H22.927H22.9265H22.926H22.9255H22.925H22.9244H22.9239H22.9234H22.9229H22.9224H22.9218H22.9213H22.9208H22.9203H22.9198H22.9193H22.9187H22.9182H22.9177H22.9172H22.9167H22.9161H22.9156H22.9151H22.9146H22.9141H22.9135H22.913H22.9125H22.912H22.9115H22.9109H22.9104H22.9099H22.9094H22.9089H22.9083H22.9078H22.9073H22.9068H22.9063H22.9057H22.9052H22.9047H22.9042H22.9037H22.9031H22.9026H22.9021H22.9016H22.901H22.9005H22.9H22.8995H22.899H22.8984H22.8979H22.8974H22.8969H22.8963H22.8958H22.8953H22.8948H22.8942H22.8937H22.8932H22.8927H22.8921H22.8916H22.8911H22.8906H22.89H22.8895H22.889H22.8885H22.8879H22.8874H22.8869H22.8864H22.8858H22.8853H22.8848H22.8842H22.8837H22.8832H22.8827H22.8821H22.8816H22.8811H22.8805H22.88H22.8795H22.879H22.8784H22.8779H22.8774H22.8768H22.8763H22.8758H22.8752H22.8747H22.8742H22.8736H22.8731H22.8726H22.872H22.8715H22.871H22.8704H22.8699H22.8694H22.8688H22.8683H22.8677H22.8672H22.8667H22.8661H22.8656H22.865H22.8645H22.864H22.8634H22.8629H22.8623H22.8618H22.8613H22.8607H22.8602H22.8596H22.8591H22.8586H22.858H22.8575H22.8569H22.8564H22.8558H22.8553H22.8547H22.8542H22.8536H22.8531H22.8526H22.852H22.8515H22.8509H22.8504H22.8498H22.8493H22.8487H22.8482H22.8476H22.847H22.8465H22.8459H22.8454H22.8448H22.8443H22.8437H22.8432H22.8426H22.8421H22.8415H22.8409H22.8404H22.8398H22.8393H22.8387H22.8381H22.8376H22.837H22.8365H22.8359H22.8353H22.8348H22.8342H22.8336H22.8331H22.8325H22.8319H22.8314H22.8308H22.8302H22.8297H22.8291H22.8285H22.828H22.8274H22.8268H22.8263H22.8257H22.8251H22.8245H22.824H22.8234H22.8228H22.8222H22.8217H22.8211H22.8205H22.8199H22.8194H22.8188H22.8182H22.8176H22.817H22.8165H22.8159H22.8153H22.8147H22.8141H22.8135H22.8129H22.8124H22.8118H22.8112H22.8106H22.81H22.8094H22.8088H22.8082H22.8076H22.8071H22.8065H22.8059H22.8053H22.8047H22.8041H22.8035H22.8029H22.8023H22.8017H22.8011H22.8005H22.7999H22.7993H22.7987H22.7981H22.7975H22.7969H22.7963H22.7957H22.7951H22.7944H22.7938H22.7932H22.7926H22.792H22.7914H22.7908H22.7902H22.7896H22.7889H22.7883H22.7877H22.7871H22.7865H22.7859H22.7852H22.7846H22.784H22.7834H22.7828V27.1008L22.772 27.102C22.4662 27.1351 22.1937 27.1022 21.9094 27.0676ZM22.7828 26.1276C27.3692 26.1276 31.1 22.4949 31.1 18.0184C31.1 13.5419 27.3692 9.90921 22.7828 9.90921C18.1963 9.90921 14.4655 13.5419 14.4655 18.0184C14.4655 22.4949 18.1963 26.1276 22.7828 26.1276ZM22.7828 11.0758C26.6976 11.0758 29.9437 14.2102 29.9437 18.0184C29.9437 21.8618 26.7323 24.9955 22.7828 24.9955C18.8335 24.9955 15.6218 21.8276 15.6218 18.0184C15.6218 14.2102 18.868 11.0758 22.7828 11.0758Z" fill="currentColor" stroke="currentColor" stroke-width="0.2"/>
<path d="M23 16.0967C23.5515 16.0967 24 15.6248 24 15.0522C24 14.472 23.5515 14 23 14C22.4485 14 22 14.472 22 15.0522C22 15.6248 22.4485 16.0967 23 16.0967ZM22.2132 23L23.7868 23L23.7868 17.5977L22.2132 17.5977L22.2132 23Z" fill="currentColor"/>
</svg>
src/view/block/questionBlock/QuestionBlock.jsx
import './questionBlock.scss'; import './questionBlock.scss';
import Button from '../../cmp/button/Button.jsx'; import Button from '../../cmp/button/Button.jsx';
import Arr from '/svg/arr.svg'; import Arr from '/svg/arr.svg';
import LinkIcon from '/svg/link.svg';
const QuestionBlock = D.declare('view.block.QuestionBlock', () => { const QuestionBlock = D.declare('view.block.QuestionBlock', () => {
return <div class="question-block"> return <div class="question-block">
...@@ -10,38 +11,62 @@ const QuestionBlock = D.declare('view.block.QuestionBlock', () => { ...@@ -10,38 +11,62 @@ const QuestionBlock = D.declare('view.block.QuestionBlock', () => {
<div className="question-block__text"> <div className="question-block__text">
<ul className="question-block__options"> <ul className="question-block__options">
<li className="question-block__option"> <li className="question-block__option">
<label className="radio-button"> <label className="picker-button">
<input type="radio" name="group" className="radio-button__field"/> <input type="radio" name="group" className="picker-button__field"/>
<span className="radio-button__indicator"></span> <span className="picker-button__indicator"></span>
<span className="radio-button__desc">Вареная сгущенка</span> <span className="picker-button__desc">Вареная сгущенка</span>
</label> </label>
</li> </li>
<li className="question-block__option"> <li className="question-block__option">
<label className="radio-button"> <label className="picker-button">
<input type="radio" name="group" className="radio-button__field"/> <input type="radio" name="group" className="picker-button__field"/>
<span className="radio-button__indicator"></span> <span className="picker-button__indicator"></span>
<span className="radio-button__desc">Мука</span> <span className="picker-button__desc">Мука</span>
</label> </label>
</li> </li>
<li className="question-block__option"> <li className="question-block__option">
<label className="checkbox"> <label className="picker-button picker-button--correct">
<input type="checkbox" className="checkbox__field"/> <span className="picker-button__indicator"></span>
<span className="checkbox__indicator"></span> <span className="picker-button__desc">Вареная сгущенка <b>Это верный ответ</b><a class="picker-button__link" href="#" aria-label="Просмотр карточки"><LinkIcon width="32" height="32"/></a></span>
<span className="checkbox__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label> </label>
</li> </li>
<li className="question-block__option"> <li className="question-block__option">
<label className="checkbox"> <label className="picker-button picker-button--incorrect">
<input type="checkbox" className="checkbox__field"/> <span className="picker-button__indicator"></span>
<span className="checkbox__indicator"></span> <span className="picker-button__desc">Вареная сгущенка <b>Этот ответ был выбран неверно</b></span>
<span className="checkbox__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label> </label>
</li> </li>
<li className="question-block__option"> <li className="question-block__option">
<label className="checkbox"> <label className="picker-button picker-button--multiple">
<input type="checkbox" className="checkbox__field"/> <input type="checkbox" className="picker-button__field"/>
<span className="checkbox__indicator"></span> <span className="picker-button__indicator"></span>
<span className="checkbox__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span> <span className="picker-button__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label>
</li>
<li className="question-block__option">
<label className="picker-button picker-button--multiple">
<input type="checkbox" className="picker-button__field"/>
<span className="picker-button__indicator"></span>
<span className="picker-button__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label>
</li>
<li className="question-block__option">
<label className="picker-button picker-button--multiple">
<input type="checkbox" className="picker-button__field"/>
<span className="picker-button__indicator"></span>
<span className="picker-button__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label>
</li>
<li className="question-block__option">
<label className="picker-button picker-button--multiple picker-button--correct">
<span className="picker-button__indicator"></span>
<span className="picker-button__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label>
</li>
<li className="question-block__option">
<label className="picker-button picker-button--multiple picker-button--incorrect">
<span className="picker-button__indicator"></span>
<span className="picker-button__desc">Lorem Ipsum has been the industry's standard 234 dummy text ever since the 1500s</span>
</label> </label>
</li> </li>
</ul> </ul>
......
src/view/block/questionBlock/questionBlock.scss
...@@ -5,5 +5,194 @@ ...@@ -5,5 +5,194 @@
.question-block__notify { .question-block__notify {
@include mainBodyText; @include mainBodyText;
margin: 0; margin: 0 0 25px;
} }
.question-block__body {
display: flex;
align-items: flex-start;
}
.question-block__text {
margin-right: 50px;
min-width: calc(50% - 25px);
}
.question-block__image {
flex: none;
margin-top: -10px;
margin-left: auto;
width: calc(50% - 25px);
}
.question-block__image-wrapper {
position: relative;
padding-top: 59%;
background-image: linear-gradient(180deg, #FFFFFF 0%, #D1D1D1 125.35%);;
border: 5px solid $bg-main;
border-radius: 10px;
overflow: hidden;
}
.question-block__image-wrapper img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.question-block__options {
@include list-reset;
margin-bottom: 42px;
}
.question-block__option {
margin-bottom: 10px;
}
.question-block__option:last-child {
margin-bottom: 0;
}
.picker-button {
position: relative;
display: block;
box-sizing: border-box;
padding: 5px 0 0 50px;
min-height: 39px;
cursor: pointer;
&__desc {
@include bodyText;
display: block;
}
&__indicator {
position: absolute;
top: 0;
left: 0;
box-sizing: border-box;
width: 30px;
height: 30px;
background-color: $bg-main;
background-repeat: no-repeat;
background-position: center;
background-size: 9px auto;
border: 2px solid #C9C7C7;
border-radius: 50%;
transition: border-color 0.3s ease;
&::after {
content: "";
position: absolute;
top: 3px;
left: 3px;
width: 20px;
height: 20px;
background-color: $accent-main;
background-repeat: no-repeat;
background-position: center;
background-size: 9px auto;
border-radius: 50%;
opacity: 0;
transition: opacity 0.3s ease;
}
}
&__field {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
white-space: nowrap;
clip-path: inset(100%);
clip: rect(0 0 0 0);
overflow: hidden;
&:checked + .picker-button__indicator {
border-color: $accent-main;
&::after {
opacity: 1;
}
}
}
&__link {
@include hover;
transform: translateY(-5px);
display: inline-block;
vertical-align: top;
margin-left: 15px;
color: $accent-dark;
}
&--multiple {
.picker-button__indicator {
border-radius: 6px;
&::after {
border-radius: 3px;
}
}
}
&--disabled {
cursor: default;
pointer-events: none;
.picker-button__desc {
color: rgba(201, 199, 199, 0.5);
}
}
&--correct {
cursor: default;
.picker-button__desc {
color: $accent-main;
}
.picker-button__indicator {
background-color: $accent-main;
background-image: url("/uploads/images/correct.svg");
border-color: $accent-main;
cursor: default;
&::after {
opacity: 0;
}
}
}
&--incorrect {
cursor: default;
.picker-button__desc {
color: $red;
pointer-events: none;
}
.picker-button__indicator {
background-color: $red;
background-image: url("/uploads/images/incorrect.svg");
border-color: $red;
cursor: default;
&::after {
opacity: 0;
}
}
}
.picker-button__desc b {
font-weight: 500;
color: $text-main;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment