core.html 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Loading cx-doxy...</title>
  5. <meta
  6. name="viewport"
  7. content="width=device-width, initial-scale=1">
  8. <meta
  9. charset="UTF-8">
  10. <script
  11. type="module"
  12. src="./assets/core.js">
  13. </script>
  14. <link
  15. href="./theme/core.css"
  16. rel="stylesheet"
  17. type="text/css">
  18. <link
  19. rel="stylesheet"
  20. href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200">
  21. <link
  22. rel="preconnect"
  23. href="https://fonts.googleapis.com">
  24. <link
  25. rel="preconnect"
  26. href="https://fonts.gstatic.com"
  27. crossorigin>
  28. <link
  29. href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
  30. rel="stylesheet">
  31. </head>
  32. <body>
  33. <div class="app dark">
  34. <div class="top-bar">
  35. <div class="project-name-bar">
  36. <p>Sample project</p>
  37. </div>
  38. <div class="submission-name-bar">
  39. <p class="submission-name">Sample submission</p>
  40. </div>
  41. <div class="search-bar">
  42. <input
  43. name="search-type"
  44. id="search-type"
  45. type="text">
  46. <button
  47. name="search-clear"
  48. id="search-clear"
  49. type="button">
  50. <span
  51. class="material-symbols-outlined">
  52. backspace
  53. </span>
  54. </button>
  55. </div>
  56. </div>
  57. <div class="top-bar-spacer"></div>
  58. <div class="left-bar">
  59. <div class="control-button">
  60. <button
  61. name="open-it"
  62. class="open-it"
  63. type="button">
  64. <span
  65. class="material-symbols-outlined">
  66. open_in_full
  67. </span>
  68. </button>
  69. </div>
  70. <div class="items-list">
  71. <div class="list-item">
  72. <span
  73. class="material-symbols-outlined">
  74. receipt_long
  75. </span>
  76. <p>
  77. Submission 1
  78. </p>
  79. </div>
  80. <div class="list-item">
  81. <span
  82. class="material-symbols-outlined">
  83. receipt_long
  84. </span>
  85. <p>
  86. Submission 2
  87. </p>
  88. </div>
  89. <div class="list-item">
  90. <span
  91. class="material-symbols-outlined">
  92. receipt_long
  93. </span>
  94. <p>
  95. Submission 3
  96. </p>
  97. </div>
  98. <div class="list-item">
  99. <span
  100. class="material-symbols-outlined">
  101. receipt_long
  102. </span>
  103. <p>
  104. Submission 4
  105. </p>
  106. </div>
  107. </div>
  108. </div>
  109. <div class="submission-container">
  110. <div class="submission-description">
  111. <div class="content"></div>
  112. <div class="control-button">
  113. <button
  114. name="close-it"
  115. class="close-it"
  116. type="button">
  117. <span
  118. class="material-symbols-outlined">
  119. close
  120. </span>
  121. </button>
  122. </div>
  123. </div>
  124. <div class="content">
  125. </div>
  126. </div>
  127. <div class="elements-bar">
  128. <div class="control-button">
  129. <button
  130. name="open-it"
  131. class="open-it"
  132. type="button">
  133. <span
  134. class="material-symbols-outlined">
  135. open_in_full
  136. </span>
  137. </button>
  138. </div>
  139. <div class="items-list">
  140. <div class="list-item">
  141. <span
  142. class="material-symbols-outlined">
  143. layers
  144. </span>
  145. <p>
  146. Element 1
  147. </p>
  148. </div>
  149. <div class="list-item">
  150. <span
  151. class="material-symbols-outlined">
  152. layers
  153. </span>
  154. <p>
  155. Element 2
  156. </p>
  157. </div>
  158. <div class="list-item">
  159. <span
  160. class="material-symbols-outlined">
  161. layers
  162. </span>
  163. <p>
  164. Element 3
  165. </p>
  166. </div>
  167. <div class="list-item">
  168. <span
  169. class="material-symbols-outlined">
  170. layers
  171. </span>
  172. <p>
  173. Element 4
  174. </p>
  175. </div>
  176. </div>
  177. </div>
  178. <div class="element-container">
  179. <div class="title">
  180. <div class="content">
  181. </div>
  182. <div class="control">
  183. <button
  184. name="close-it"
  185. class="close-it"
  186. type="button">
  187. <span
  188. class="material-symbols-outlined">
  189. close
  190. </span>
  191. </button>
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. </body>
  197. </html>