index.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. <html>
  2. <head>
  3. <title>Christmas Lights Bingo Card</title>
  4. <link href="style.css" rel="stylesheet">
  5. <link href="clickable.css" rel="stylesheet">
  6. <link href="phrases.css" rel="stylesheet">
  7. </head>
  8. <body>
  9. <div class="card-background">
  10. <div class="card-header">
  11. <div class="card-header-title">
  12. Christmas Lights Bingo Card
  13. </div>
  14. <span>Each tick box means you need that many to claim that space("elves" ◻ ◻ ◻ needs 3 separate yards with elves to cross off)</span>
  15. </div>
  16. <div class="card-body">
  17. <div class="card-row card-row-1">
  18. <div class="card-column card-column-1"></div>
  19. <div class="card-column card-column-2"></div>
  20. <div class="card-column card-column-3"></div>
  21. <div class="card-column card-column-4"></div>
  22. <div class="card-column card-column-5"></div>
  23. </div>
  24. <div class="card-row card-row-2">
  25. <div class="card-column card-column-1">
  26. </div>
  27. <div class="card-column card-column-2">
  28. </div>
  29. <div class="card-column card-column-3">
  30. </div>
  31. <div class="card-column card-column-4">
  32. </div>
  33. <div class="card-column card-column-5">
  34. </div>
  35. </div>
  36. <div class="card-row card-row-3">
  37. <div class="card-column card-column-1">
  38. </div>
  39. <div class="card-column card-column-2">
  40. </div>
  41. <div class="card-column card-column-3 toggled">
  42. </div>
  43. <div class="card-column card-column-4">
  44. </div>
  45. <div class="card-column card-column-5">
  46. </div>
  47. </div>
  48. <div class="card-row card-row-4">
  49. <div class="card-column card-column-1">
  50. </div>
  51. <div class="card-column card-column-2">
  52. </div>
  53. <div class="card-column card-column-3">
  54. </div>
  55. <div class="card-column card-column-4">
  56. </div>
  57. <div class="card-column card-column-5">
  58. </div>
  59. </div>
  60. <div class="card-row card-row-5">
  61. <div class="card-column card-column-1">
  62. </div>
  63. <div class="card-column card-column-2">
  64. </div>
  65. <div class="card-column card-column-3">
  66. </div>
  67. <div class="card-column card-column-4">
  68. </div>
  69. <div class="card-column card-column-5">
  70. </div>
  71. </div>
  72. </div>
  73. </div>
  74. <script src="phrases.js"></script>
  75. <script src="clickable.js"></script>
  76. <div id="pyrowrapper">
  77. </div>
  78. </body>
  79. </html>