Documentation

Vue

HTML Structure

Here is the general HTML structure of the template:

<!DOCTYPE html>
<html lang="❴❴ str_replace('_', '-', app()->getLocale()) ❵❵ " dir="ltr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title data-setting="app_name" data-rightJoin=" Pro | Responsive Bootstrap 5 Admin Dashboard Template">❴❴env('APP_NAME')❵❵| Responsive Bootstrap 5 Admin Dashboard Template</title>
    <meta name="description" content="Hope UI – free bootstrap 5 admin dashboard template comes with over 200+ elements finely crafted to speed up your development cycles. Production Ready Premium Dashboard UI Kit And Design System">
    <meta name="keywords" content="premium, admin, dashboard, template, bootstrap 5, clean ui, hope ui, admin dashboard,responsive dashboard, optimized dashboard,">
    <meta name="author" content="Iqonic Design">
    <meta name="DC.title" content="❴❴env('APP_NAME')❵❵  Pro| Responsive Bootstrap 5 Admin Dashboard Template">

    @include('components.partials._head')
</head>
<body class="">
    @include('components.partials._body')
</body>

</html>

HTML Structure

Here is the general HTML structure of the template:

<!-- Loader Start -->
<div id="loading">
    <x-partials._body_loader />
</div>
<!-- Loader End -->

<!-- Sidebar Start-->
@include('components.partials._body_sidebar')
<!-- Sidebar End-->

<!-- Page Content Start-->
<main class="main-content">
    <div class="position-relative ❴❴ $isBanner ? 'iq-banner' : '' ❵❵ default">
        <!-- Header Start-->
        @include('components.partials.pro.header')
        <!-- Header End-->
        @if($isBanner)
            <!-- Header Banner Start-->
            <x-partials.sub-header />
            <!-- Header Banner End-->
        @endif
    </div>

    <!-- Main Page Start-->
    <div class="conatiner-fluid content-inner">
    ❴❴ $slot ❵❵
    </div>
    <!-- Main Page End-->

    <!-- Footer Start-->
    <x-partials._body_footer />
    <!-- Footer End-->

    @if($modalJs)
        <!-- Ajax Modal Html-->
        <x-widgets.modal-view />
    @endif

</main>
<!-- Page Content End-->

<x-widgets.setting-offcanvas />
<!-- Setting Button & Offcanvas of setting panel end-->
<x-modal-pop />
<!-- Script Start -->
@include('components.partials._scripts')
<x-partials._app_toast />
<!-- Script End -->
Previous Next