core.html 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  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. <p class="description">This is simple project description, it only would tell You what it is, or what it could be.</p>
  112. <div class="control-button">
  113. <button
  114. name="close-it"
  115. </div>
  116. <div class="content">
  117. </div>
  118. </div>
  119. <div class="elements-bar">
  120. <div class="control-button">
  121. <button
  122. name="open-it"
  123. class="open-it"
  124. type="button">
  125. <span
  126. class="material-symbols-outlined">
  127. open_in_full
  128. </span>
  129. </button>
  130. </div>
  131. <div class="items-list">
  132. <div class="list-item">
  133. <span
  134. class="material-symbols-outlined">
  135. layers
  136. </span>
  137. <p>
  138. Element 1
  139. </p>
  140. </div>
  141. <div class="list-item">
  142. <span
  143. class="material-symbols-outlined">
  144. layers
  145. </span>
  146. <p>
  147. Element 2
  148. </p>
  149. </div>
  150. <div class="list-item">
  151. <span
  152. class="material-symbols-outlined">
  153. layers
  154. </span>
  155. <p>
  156. Element 3
  157. </p>
  158. </div>
  159. <div class="list-item">
  160. <span
  161. class="material-symbols-outlined">
  162. layers
  163. </span>
  164. <p>
  165. Element 4
  166. </p>
  167. </div>
  168. </div>
  169. </div>
  170. <div class="element-container">
  171. <div class="title">
  172. <div class="content">
  173. </div>
  174. <div class="control">
  175. <button
  176. name="close-it"
  177. class="close-it"
  178. type="button">
  179. <span
  180. class="material-symbols-outlined">
  181. close
  182. </span>
  183. </button>
  184. </div>
  185. </div>
  186. </div>
  187. </div>
  188. </body>
  189. </html>