Spring Boot Structure

Spring Boot File Structure

Overview


    @@include("partials/main.html")

    <head>

        @@include("partials/title-meta.html", {"title": "Starter"})

        @@include("partials/head-css.html")

    </head>

    <body>

        <!-- Begin page -->
        <div id="layout-wrapper">

            @@include("partials/menu.html")

            <!-- ============================================================== -->
            <!-- Start right Content here -->
            <!-- ============================================================== -->
            <div class="main-content">

                <div class="page-content">
                    <div class="container-fluid">

                        @@include("partials/page-title.html", {"pagetitle": "Dashboards", "title": "Starter"})

                    </div>
                    <!-- container-fluid -->
                </div>
                <!-- End Page-content -->

                @@include("partials/footer.html")
            </div>
            <!-- end main content-->

        </div>
        <!-- END layout-wrapper -->

        @@include("partials/customizer.html")

        @@include("partials/vendor-scripts.html")

        <!-- App js -->
        <script src="assets/js/app.js">

    </body>
</html>                                            

<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout}">

<th:block layout:fragment="pagetitle">
	<!--page title-->
	<div th:replace="partials/title-meta :: title-meta('Dashboard')"></div>
</th:block>

<head>
	<!-- jsvectormap css -->
	<link href="/assets/libs/jsvectormap/css/jsvectormap.min.css" rel="stylesheet" type="text/css" />

	<!--Swiper slider css2-->
	<link href="/assets/libs/swiper/swiper-bundle.min.css" rel="stylesheet" type="text/css" />
</head>

<body>
<!-- main content -->
	<div layout:fragment="content">
		<div th:replace="partials/page-title :: page-title('Starter Page','Starter Page')"></div>
	</div>
    <th:block layout:fragment="modal">
    </th:block>
    <th:block layout:fragment="pagejs">
    </th:block>
</body>

</html>

Layout setup

You can set the default layout in the src/main/resources/templates/layout.html file in the html tag.

<html data-layout="vertical" data-topbar="light" data-sidebar="dark" data-sidebar-size="lg">
data-layout="vertical" To set default layout as Vertical
data-layout="horizontal" To set default layout as Horizontal
data-layout="twocolumn" To set default layout as Two column
data-layout="semibox" To set default layout as Semibox
data-layout-mode="light" To set Light layout mode.
data-layout-mode="dark" To set Dark layout mode.
data-sidebar-size="lg" data-layout-width="fluid" To set layout width Fluid and left sidebar large.
data-sidebar-size="sm-hover" data-layout-width="boxed" To set layout width Boxed and left sidebar on hover show menu.
data-layout-position="fixed" To set layout position Fixed.
data-layout-position="scrollable" To set layout position Scrollable.
data-topbar="light" To set the Light color of Topbar.
data-topbar="dark" To set the dark color of Topbar.
data-sidebar-size="lg" To set the Large left sidebar.
data-sidebar-size="md" To set the Compact left sidebar.
data-sidebar-size="sm" To set the Icon view left sidebar.
data-sidebar-size="sm-hover" To set the Icon hover left sidebar.
data-layout-style="default" To set the Default layout.
data-layout-style="detached" To set the Detached layout.
data-sidebar="light" To set the Light color of left Sidebar.
data-sidebar="dark" To set the Dark color of left Sidebar.
data-sidebar="gradient" To set the Gradient color of left Sidebar.
data-sidebar="gradient-2" To set the Gradient-2 color of left Sidebar.
data-sidebar="gradient-3" To set the Gradient-3 color of left Sidebar.
data-sidebar="gradient-4" To set the Gradient-4 color of left Sidebar.
data-sidebar-image="none" To Disable image on left Sidebar.
data-sidebar-image="img-1" To set the img-1 Image of left Sidebar.
data-sidebar-image="img-2" To set the img-2 Image of left Sidebar.
data-sidebar-image="img-3" To set the img-3 Image of left Sidebar.
data-sidebar-image="img-4" To set the img-4 Image of left Sidebar.
data-preloader="enable" To enable the preloader on the Page.
data-preloader="disable" To disable the preloader on the Page.

Galaxy Layout setup

You can set the galaxy layout in the src/main/resources/templates/layout.html file in the html tag.

<html lang="en" data-layout="vertical" data-topbar="light" data-sidebar="dark" data-sidebar-size="lg" data-sidebar-image="none" data-layout-mode="dark" data-body-image="img-1" data-preloader="disable">
data-body-image="img-1" To set img-1 on whole page(body).
data-body-image="img-2" To set img-2 on whole page(body).
data-body-image="img-3" To set img-3 on whole page(body).
data-body-image="none" To remove image on whole page(body).

Notes:Above attributes works only in Galaxy version layout.

© Velzon.
Design & Develop by Themesbrand