menu.html

SUBMITTED BY: Lucoz18

DATE: Feb. 15, 2024, 1:18 a.m.

UPDATED: Feb. 15, 2024, 1:50 a.m.

FORMAT: Text only

SIZE: 2.6 kB

History Raw Download

HITS: 634

Report
  1. <!DOCTYPE html>
  2. <html lang="en">
  4. <head>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  8. <!-- Compiled and minified CSS -->
  9. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
  11. <!-- Compiled and minified JavaScript -->
  12. <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
  14. <link rel="stylesheet"
  15. href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
  16. </head>
  18. <body>
  19. <div class="screen" style="z-index: 100">
  20. <header>
  21. <p class="title">Version: 1.0.0</p>
  22. <i class="fa-solid fa-xmark" style="cursor:pointer; color:#b5b5b5; font-size:30px;"></i>
  23. </header>
  24. <div style="display:flex; flex-direction: row; height:calc(100% - 50.5px); width:100vw; position:relative;">
  25. <div class="main" style="overflow-y: scroll; height:100%; width:70%; position:relative;">
  27. </div>
  28. <div class="head-body" style="height:100%; width:30%; position:relative; background-color: #f0c032;">
  29. <div class="heads" style="height:50%; width:100%; display: flex; flex-wrap: wrap; padding: 8px 0px; overflow-y: scroll; border-bottom: 1px solid #363636">
  31. </div>
  32. <div id="bodys" style="height:50%; width:100%; display: flex; flex-wrap: wrap; padding: 8px 0px; overflow-y: scroll">
  34. </div>
  35. </div>
  36. </div>
  37. </div>
  39. </body>
  43. </html>
  46. <style>
  47. *{
  48. padding:0;
  49. margin:0;
  50. box-sizing: border-box;
  51. }
  52. .screen{
  53. background-color: #141414;
  54. width:100vw;
  55. height:100vh;
  56. }
  57. header{
  58. width:100vw;
  59. padding: 5px 20px;
  60. background-color: #050505;
  61. display:flex;
  62. justify-content: space-between;
  63. flex-direction: row;
  64. align-items: center;
  65. text-align: center;
  66. box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  67. }
  68. .title{
  69. color: #b5b5b5;
  70. font-size:27px;
  71. }
  73. ::-webkit-scrollbar {
  74. width: 10px;
  75. }
  77. /* Track */
  78. ::-webkit-scrollbar-track {
  79. /*box-shadow: inset 0 0 5px grey;
  80. border-radius: 10px;*/
  81. background-color: #262626;
  82. }
  84. /* Handle */
  85. ::-webkit-scrollbar-thumb {
  86. background: #000;
  87. border-radius: 10px;
  88. }
  90. /* Handle on hover */
  91. ::-webkit-scrollbar-thumb:hover {
  92. background: #000;
  93. }
  94. </style>
  96. <script src="./script.js"></script>
comments powered by Disqus