core.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  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="search-bar">
  39. <input
  40. name="search-type"
  41. id="search-type"
  42. type="text">
  43. <button
  44. name="search-clear"
  45. id="search-clear"
  46. type="button">
  47. <span
  48. class="material-symbols-outlined">
  49. backspace
  50. </span>
  51. </button>
  52. </div>
  53. </div>
  54. <div class="top-bar-spacer"></div>
  55. <div class="left-bar">
  56. <div class="control-button">
  57. <button
  58. name="open-it"
  59. class="open-it"
  60. type="button">
  61. <span
  62. class="material-symbols-outlined">
  63. open_in_full
  64. </span>
  65. </button>
  66. </div>
  67. <div class="items-list">
  68. <div class="list-item">
  69. <span
  70. class="material-symbols-outlined">
  71. receipt_long
  72. </span>
  73. <p>
  74. Submission 1
  75. </p>
  76. </div>
  77. <div class="list-item">
  78. <span
  79. class="material-symbols-outlined">
  80. receipt_long
  81. </span>
  82. <p>
  83. Submission 2
  84. </p>
  85. </div>
  86. <div class="list-item">
  87. <span
  88. class="material-symbols-outlined">
  89. receipt_long
  90. </span>
  91. <p>
  92. Submission 3
  93. </p>
  94. </div>
  95. <div class="list-item">
  96. <span
  97. class="material-symbols-outlined">
  98. receipt_long
  99. </span>
  100. <p>
  101. Submission 4
  102. </p>
  103. </div>
  104. </div>
  105. </div>
  106. <div class="submission-container">
  107. <div class="title">
  108. <p class="name">Project</p>
  109. <p class="description">This is simple project description, it only would tell You what it is, or what it could be.</p>
  110. </div>
  111. <div class="content">
  112. </div>
  113. </div>
  114. <div class="elements-bar">
  115. <div class="control-button">
  116. <button
  117. name="open-it"
  118. class="open-it"
  119. type="button">
  120. <span
  121. class="material-symbols-outlined">
  122. open_in_full
  123. </span>
  124. </button>
  125. </div>
  126. <div class="items-list">
  127. <div class="list-item">
  128. <span
  129. class="material-symbols-outlined">
  130. layers
  131. </span>
  132. <p>
  133. Element 1
  134. </p>
  135. </div>
  136. <div class="list-item">
  137. <span
  138. class="material-symbols-outlined">
  139. layers
  140. </span>
  141. <p>
  142. Element 2
  143. </p>
  144. </div>
  145. <div class="list-item">
  146. <span
  147. class="material-symbols-outlined">
  148. layers
  149. </span>
  150. <p>
  151. Element 3
  152. </p>
  153. </div>
  154. <div class="list-item">
  155. <span
  156. class="material-symbols-outlined">
  157. layers
  158. </span>
  159. <p>
  160. Element 4
  161. </p>
  162. </div>
  163. </div>
  164. </div>
  165. <div class="element-container">
  166. <div class="title">
  167. <div class="content">
  168. </div>
  169. <div class="control">
  170. <button
  171. name="close-it"
  172. class="close-it"
  173. type="button">
  174. <span
  175. class="material-symbols-outlined">
  176. close
  177. </span>
  178. </button>
  179. </div>
  180. </div>
  181. </div>
  182. </div>
  183. </body>
  184. </html>