quiz_imapsync.css 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. /* Taken from https://code-boxx.com/simple-javascript-quiz */
  2. /* (A) WRAPPER */
  3. #quizWrap {
  4. border-style: solid;
  5. border-collapse: collapse;
  6. background: #e0e0e0;
  7. }
  8. #quizNumber,#quizScore{
  9. text-align: center;
  10. padding: 10px;
  11. border-width: thin;
  12. border-style: solid;
  13. border-left-style: none;
  14. border-right-style: none;
  15. }
  16. #quizScore{
  17. border-bottom-style: none;
  18. }
  19. #quizRestart {
  20. margin: auto;
  21. margin-bottom: 10px;
  22. text-align: center;
  23. padding: 10px;
  24. border-radius: 10px;
  25. border-style: solid;
  26. border-width: thin;
  27. background: #d8ffc4;
  28. width: 100px;
  29. cursor: pointer;
  30. }
  31. #quizQn {
  32. padding: 20px;
  33. text-align: center;
  34. font-weight: bold;
  35. }
  36. /* (C) ANSWERS */
  37. #quizAns {
  38. margin: 10px;
  39. text-align: center;
  40. border-width: thin;
  41. display: grid;
  42. grid-template-columns: auto auto;
  43. grid-gap: 10px;
  44. justify-content: space-evenly;
  45. align-content: space-evenly;
  46. }
  47. #quizAns input[type=radio] { display: none; }
  48. #quizAns label {
  49. /* background: #cccccc;
  50. border: 1px solid #eee;
  51. font-size: 20px; */
  52. cursor: pointer;
  53. background: #ffffff;
  54. font-weight: bold;
  55. padding: 10px;
  56. border-radius: 10px;
  57. border-style: solid;
  58. border-width: thin;
  59. margin-top: 5px;
  60. margin-left: 25px;
  61. margin-right: 25px;
  62. margin-bottom: 5px;
  63. }
  64. #quizAns label.correct {
  65. background: #d8ffc4;
  66. border: 1px solid #60a03f;
  67. }
  68. #quizAns label.wrong {
  69. background: #ffe8e8;
  70. border: 1px solid #c78181;
  71. }