unfixed-sidebar.astro 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. ---
  2. import Head from "@components/_head.astro";
  3. import Footer from "@components/dashboard/_footer.astro";
  4. import Topbar from "@components/dashboard/_topbar.astro";
  5. import Sidenav from "@components/dashboard/_sidenav.astro";
  6. import Scripts from "@components/_scripts.astro";
  7. const title = "AdminLTE 4 | Unfixed Sidebar";
  8. const path = "../../../dist";
  9. const mainPage = "layout";
  10. const page = "unfixed-sidebar";
  11. ---
  12. <!DOCTYPE html>
  13. <html lang="en">
  14. <!--begin::Head-->
  15. <head>
  16. <Head title={title} path={path} />
  17. </head>
  18. <!--end::Head-->
  19. <!--begin::Body-->
  20. <body class="sidebar-expand-lg bg-body-tertiary">
  21. <!--begin::App Wrapper-->
  22. <div class="app-wrapper">
  23. <Topbar path={path} />
  24. <Sidenav path={path} mainPage={mainPage} page={page} />
  25. <!--begin::App Main-->
  26. <main class="app-main">
  27. <!--begin::App Content Header-->
  28. <div class="app-content-header">
  29. <!--begin::Container-->
  30. <div class="container-fluid">
  31. <!--begin::Row-->
  32. <div class="row">
  33. <div class="col-sm-6">
  34. <h3 class="mb-0">Unfixed Layout</h3>
  35. </div>
  36. <div class="col-sm-6">
  37. <ol class="breadcrumb float-sm-end">
  38. <li class="breadcrumb-item"><a href="#">Home</a></li>
  39. <li class="breadcrumb-item active" aria-current="page">
  40. Unfixed Layout
  41. </li>
  42. </ol>
  43. </div>
  44. </div>
  45. <!--end::Row-->
  46. </div>
  47. <!--end::Container-->
  48. </div>
  49. <!--end::App Content Header-->
  50. <!--begin::App Content-->
  51. <div class="app-content">
  52. <!--begin::Container-->
  53. <div class="container-fluid">
  54. <!--begin::Row-->
  55. <div class="row">
  56. <div class="col-12">
  57. <!-- Default box -->
  58. <div class="card">
  59. <div class="card-header">
  60. <h3 class="card-title">Title</h3>
  61. <div class="card-tools">
  62. <button
  63. type="button"
  64. class="btn btn-tool"
  65. data-lte-toggle="card-collapse"
  66. title="Collapse"
  67. >
  68. <i data-lte-icon="expand" class="bi bi-plus-lg"></i>
  69. <i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
  70. </button>
  71. <button
  72. type="button"
  73. class="btn btn-tool"
  74. data-lte-toggle="card-remove"
  75. title="Remove"
  76. >
  77. <i class="bi bi-x-lg"></i>
  78. </button>
  79. </div>
  80. </div>
  81. <div class="card-body">
  82. Start creating your amazing application!
  83. </div>
  84. <!-- /.card-body -->
  85. <div class="card-footer">Footer</div>
  86. <!-- /.card-footer-->
  87. </div>
  88. <!-- /.card -->
  89. </div>
  90. </div>
  91. <!--end::Row-->
  92. </div>
  93. </div>
  94. <!--end::App Content-->
  95. </main>
  96. <!--end::App Main-->
  97. <Footer />
  98. </div>
  99. <!--end::App Wrapper-->
  100. <!--begin::Script-->
  101. <Scripts path={path} />
  102. <!--end::Script-->
  103. </body><!--end::Body-->
  104. </html>