search

📄Page Structure


<%- include '../layouts/main' %>
  <!-- [Head] start -->

  <head>
    <%- include '../layouts/head-page-meta' %>
    <!-- map-vector css -->
    <link rel="stylesheet" href= "assets/css/plugins/jsvectormap.min.css" %}>
    <%- include('../layouts/head-css') %>
  </head>
  <!-- [Head] end -->
  <!-- [Body] Start -->

  <body <%= bodysetup %> >
     <%- include('../layouts/layout-vertical') %>

    <!-- [ Main Content ] start -->
    <div class="pc-container">
      <div class="pc-content">
        <%- include('../layouts/breadcrumb') %> 
        <!-- [ Main Content ] start -->
        <div class="row">
          <div class="col-md-6 col-xl-8">
            <div class="card table-card">
              <div class="card-header d-flex align-items-center justify-content-between">
                <h5>Recent Users</h5>
                <div class="dropdown">
                  <a
                    class="avtar avtar-xs btn-link-secondary dropdown-toggle arrow-none"
                    href="#"
                    data-bs-toggle="dropdown"
                    aria-haspopup="true"
                    aria-expanded="false"
                    ><i class="material-icons-two-tone f-18">more_vert</i></a
                  >
                  <div class="dropdown-menu dropdown-menu-end">
                    <a class="dropdown-item" href="#">View</a>
                    <a class="dropdown-item" href="#">Edit</a>
                  </div>
                </div>
              </div>
              <div class="card-body py-2 px-0">
                <div class="table-responsive">
                  <table class="table table-hover table-borderless table-sm mb-0">
                    <tbody>
                      <tr>
                        <td>
                          <div class="d-inline-block align-middle">
                            <img src="assets/images/user/avatar-1.jpg" %} alt="user image" class="img-radius align-top m-r-15" style="width:40px;">
                            <div class="d-inline-block">
                              <h6 class="m-b-0">Quinn Flynn</h6>
                              <p class="m-b-0">Android developer</p>
                            </div>
                          </div>
                        </td>
                        <td><p class="mb-0"><i class="ph-duotone ph-circle text-warning f-12"></i> 11 may 12:30</p></td>
                        <td class="text-end">
                          <button class="btn btn-sm btn-link-danger">Reject</button>
                          <button class="btn btn-sm btn-primary">Approve</button>
                        </td>
                      </tr>
                      <tr>
                        <td>
                          <div class="d-inline-block align-middle">
                            <img src="assets/images/user/avatar-2.jpg" %} alt="user image" class="img-radius align-top m-r-15" style="width:40px;">
                            <div class="d-inline-block">
                              <h6 class="m-b-0">Garrett Winters</h6>
                              <p class="m-b-0">Android developer</p>
                            </div>
                          </div>
                        </td>
                        <td><p class="mb-0"><i class="ph-duotone ph-circle text-success f-12"></i> 11 may 12:30</p></td>
                        <td class="text-end">
                          <button class="btn btn-sm btn-link-danger">Reject</button>
                          <button class="btn btn-sm btn-primary">Approve</button>
                        </td>
                      </tr>
                      <tr>
                        <td>
                          <div class="d-inline-block align-middle">
                            <img src="assets/images/user/avatar-3.jpg" %} alt="user image" class="img-radius align-top m-r-15" style="width:40px;">
                            <div class="d-inline-block">
                              <h6 class="m-b-0">Ashton Cox</h6>
                              <p class="m-b-0">Android developer</p>
                            </div>
                          </div>
                        </td>
                        <td><p class="mb-0"><i class="ph-duotone ph-circle text-primary f-12"></i> 11 may 12:30</p></td>
                        <td class="text-end">
                          <button class="btn btn-sm btn-link-danger">Reject</button>
                          <button class="btn btn-sm btn-primary">Approve</button>
                        </td>
                      </tr>
                      <tr>
                        <td>
                          <div class="d-inline-block align-middle">
                            <img src= "assets/images/user/avatar-4.jpg" %} alt="user image" class="img-radius align-top m-r-15" style="width:40px;">
                            <div class="d-inline-block">
                              <h6 class="m-b-0">Cedric Kelly</h6>
                              <p class="m-b-0">Android developer</p>
                            </div>
                          </div>
                        </td>
                        <td><p class="mb-0"><i class="ph-duotone ph-circle text-danger f-12"></i> 11 may 12:30</p></td>
                        <td class="text-end">
                          <button class="btn btn-sm btn-link-danger">Reject</button>
                          <button class="btn btn-sm btn-primary">Approve</button>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- [ Main Content ] end -->
      </div>
    </div>
    <!-- [ Main Content ] end -->
    <%- include('../layouts/footer-block') %>
    <%- include('../layouts/customizer') %>
    <!-- [Page Specific JS] start -->
    <script src= "assets/js/plugins/apexcharts.min.js"></script>
    <script src= "assets/js/plugins/jsvectormap.min.js"></script>
    <script src= "assets/js/plugins/world.js" ></script>
    <script src= "assets/js/plugins/world-merc.js"></script>
    <script src= "assets/js/pages/dashboard-default.js"></script>
    <!-- [Page Specific JS] end -->
    <%- include('../layouts/footer-js') %}
  </body>
  <!-- [Body] end -->
</html>

```

hashtag
Layout settings

You can change the default layout in the routers/routes.js file in the body tag

Attribute
Description

data-pc-preset= "preset-1"

To set the your primary theme color you can change ['preset-1' to 'preset-10'] for different color.

data-pc-sidebar-theme = "light"

To set the Light color left Sidebar.

data-pc-sidebar-theme = "dark"

To set the Light color dark Sidebar.

data-pc-sidebar-caption = "true"

To set the caption on.

data-pc-sidebar-caption = "false"

To set the caption off.

data-pc-direction = "ltr"

To set the layout direction left to right.

data-pc-direction = "rtl"

To set the layout direction right to left.

data-pc-theme = "light"

To set the layout theme light.

data-pc-theme = "dark"

To set the layout theme dark.

PreviousFolder StructureNextLayout Customizer

Last updated