summaryrefslogtreecommitdiff
path: root/src/main/resources/templates/services.html
diff options
context:
space:
mode:
Diffstat (limited to 'src/main/resources/templates/services.html')
-rw-r--r--src/main/resources/templates/services.html330
1 files changed, 330 insertions, 0 deletions
diff --git a/src/main/resources/templates/services.html b/src/main/resources/templates/services.html
new file mode 100644
index 0000000..1265922
--- /dev/null
+++ b/src/main/resources/templates/services.html
@@ -0,0 +1,330 @@
+<!doctype html>
+<html class="no-js" lang="zxx">
+
+<head>
+ <meta charset="utf-8">
+ <meta http-equiv="x-ua-compatible" content="ie=edge">
+ <title>Barber</title>
+ <meta name="description" content="">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+
+ <!-- <link rel="manifest" href="site.webmanifest"> -->
+ <link rel="shortcut icon" type="image/x-icon" th:href="@{img/favicon.png}">
+ <!-- Place favicon.ico in the root directory -->
+
+ <!-- CSS here -->
+ <link rel="stylesheet" th:href="@{css/bootstrap.min.css}">
+ <link rel="stylesheet" th:href="@{css/owl.carousel.min.css}">
+ <link rel="stylesheet" th:href="@{css/magnific-popup.css}">
+ <link rel="stylesheet" th:href="@{css/font-awesome.min.css}">
+ <link rel="stylesheet" th:href="@{css/themify-icons.css}">
+ <link rel="stylesheet" th:href="@{css/nice-select.css}">
+ <link rel="stylesheet" th:href="@{css/flaticon.css}">
+ <link rel="stylesheet" th:href="@{css/gijgo.css}">
+ <link rel="stylesheet" th:href="@{css/animate.css}">
+ <link rel="stylesheet" th:href="@{css/slicknav.css}">
+ <link rel="stylesheet" th:href="@{css/style.css}">
+ <!-- <link rel="stylesheet" href="css/responsive.css}"> -->
+</head>
+
+<body>
+ <!--[if lte IE 9]>
+ <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
+ <![endif]-->
+
+ <!-- header-start -->
+ <header>
+ <div class="header-area ">
+ <div id="sticky-header" class="main-header-area">
+ <div class="container">
+ <div class="row align-items-center">
+ <div class="col-xl-3 col-lg-3">
+ <div class="logo-img">
+ <a th:href="@{/}">
+ <img th:src="@{img/logo.png}" alt="">
+ </a>
+ </div>
+ </div>
+ <div class="col-xl-9 col-lg-9">
+ <div class="menu_wrap d-none d-lg-block">
+ <div class="menu_wrap_inner d-flex align-items-center justify-content-end">
+ <div class="main-menu">
+ <nav>
+ <ul id="navigation">
+ <li><a class="active" th:href="@{/}">Home</a></li>
+ <li><a th:href="@{/services}">Services</a></li>
+ <li><a th:href="@{/about}">About</a></li>
+ <li><a th:href="@{/contact}">Contact</a></li>
+ </ul>
+ </nav>
+ </div>
+ <div class="book_room">
+ <div class="book_btn">
+ <a class="popup-with-form" href="#test-form">Appointment</a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-12">
+ <div class="mobile_menu d-block d-lg-none"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </header>
+ <!-- header-end -->
+
+ <!-- bradcam_area_start -->
+ <div class="bradcam_area breadcam_bg overlay">
+ <div class="container">
+ <div class="row">
+ <div class="col-lg-12">
+ <h3>Services</h3>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- bradcam_area_end -->
+
+ <div class="service_area">
+ <div class="container">
+ <div class="row justify-content-center ">
+ <div class="col-lg-6 col-md-10">
+ <div class="section_title text-center mb-55">
+ <h3>Our Services</h3>
+ <p>Our professional craftsmen will provide you with the best service.</p>
+ </div>
+ </div>
+ </div>
+ <div class="row justify-content-center">
+ <div class="col-lg-4 col-md-6">
+ <div class="single_service">
+ <div class="service_thumb">
+ <img th:src="@{img/service/1.png}" alt="">
+ </div>
+ <div class="service_content text-center">
+ <div class="icon">
+ <i class="flaticon-shave"></i>
+ </div>
+ <h3>Smooth Shave</h3>
+ <p>Cleanse your face first with a quality face wash or a gentle exfoliating scrub.</p>
+ </div>
+ </div>
+ </div>
+ <div class="col-lg-4 col-md-6">
+ <div class="single_service">
+ <div class="service_thumb">
+ <img th:src="@{img/service/2.png}" alt="">
+ </div>
+ <div class="service_content text-center">
+ <div class="icon">
+ <i class="flaticon-barber"></i>
+ </div>
+ <h3>Beard Triming</h3>
+ <p>Trimming and maintaining a beard is an essential grooming skill men learn to master.</p>
+ </div>
+ </div>
+ </div>
+ <div class="col-lg-4 col-md-6">
+ <div class="single_service">
+ <div class="service_thumb">
+ <img th:src="@{img/service/3.png}" alt="">
+ </div>
+ <div class="service_content text-center">
+ <div class="icon">
+ <i class="flaticon-null"></i>
+ </div>
+ <h3>Haircut Styles</h3>
+ <p>From the fade or undercut on the sides to the quiff, comb over, fohawk, or textured crop on top.</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- footer_start -->
+ <footer class="footer">
+ <div class="footer_top">
+ <div class="container">
+ <div class="row">
+ <div class="col-xl-5 col-md-6 col-lg-5 ">
+ <div class="footer_widget">
+ <div class="footer_logo">
+ <a href="#">
+ <img th:src="@{img/logo.png}" alt="">
+ </a>
+ </div>
+ <p class="address_text">In all countries of the world, including Uzbekistan, Kazakhstan, Russia and Ukraine.</p>
+ <div class="socail_links">
+ <ul>
+ <li>
+ <a href="#">
+ <i class="fa fa-instagram"></i>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <i class="ti-facebook"></i>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <i class="ti-twitter-alt"></i>
+ </a>
+ </li>
+ </ul>
+ </div>
+
+ </div>
+ </div>
+ <div class="col-xl-3 col-md-6 col-lg-3">
+ <div class="footer_widget">
+ <h3 class="footer_title">
+ Information
+ </h3>
+ <ul class="links">
+ <li><a th:href="@{/about}">About</a></li>
+ <li><a th:href="@{/services}">Services</a></li>
+ <li><a href="#">Testimonial</a></li>
+ </ul>
+ </div>
+ </div>
+ <div class="col-xl-2 col-md-6 col-lg-2">
+ <div class="footer_widget">
+ <h3 class="footer_title">
+ Services
+ </h3>
+ <ul class="links">
+ <li><a href="#">Smooth Shave </a></li>
+ <li><a href="#">Beard Triming</a></li>
+ <li><a href="#">Haircut Styles</a></li>
+ </ul>
+ </div>
+ </div>
+ <div class="col-xl-2 col-md-6 col-lg-2">
+ <div class="footer_widget">
+ <h3 class="footer_title">
+ Follow Us
+ </h3>
+ <ul class="links">
+ <li><a href="#">Instagram</a></li>
+ <li><a href="#">FaceBook</a></li>
+ <li><a href="#">Twitter</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="copy-right_text">
+ <div class="container">
+ <div class="row">
+ <div class="col-xl-12">
+ <p class="copy_right text-center">
+ <p>Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved</p>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </footer>
+ <!-- footer_end -->
+
+
+ <!-- form itself end-->
+ <form id="test-form" class="white-popup-block mfp-hide" th:action="@{/save/appointment}" method="post">
+ <div class="popup_box">
+ <div class="popup_inner">
+ <h3>Make an Appointment</h3>
+ <form th:action="@{/save/appointment}" method="post">
+ <div class="row">
+ <div class="col-xl-6 col-md-6">
+ <input id="datepicker" name="date" placeholder="Date" required>
+ </div>
+ <div class="col-xl-6 col-md-6">
+ <input id="timepicker" name="time" placeholder="Time" required>
+ </div>
+ <div class="col-xl-6 col-md-6">
+ <select class="form-select wide" name="service">
+ <option value="Hair cut" data-display="Hair cut">Hair cut</option>
+ <option value="Hair style">Hair style</option>
+ <option value="Shaving">Shaving</option>
+ </select>
+ </div>
+ <div class="col-xl-6 col-md-6">
+ <select class="form-select wide" name="barber">
+ <option th:each="barber: ${barbers}" th:text="${barber.firstName}" th:value="${barber.firstName}"></option>
+ </select>
+ </div>
+ <div class="col-xl-6 col-md-6">
+ <input type="text" name="name" placeholder="Your name" required>
+ </div>
+ <div class="col-xl-6 col-md-6">
+ <input type="text" name="telephoneNumber" placeholder="Phone no" required>
+ </div>
+ <div class="col-xl-12">
+ <input type="email" name="email" placeholder="Your email" required>
+ </div>
+ <div class="col-xl-12">
+ <button type="submit" class="boxed-btn3">Submit</button>
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ </form>
+ <!-- form itself end -->
+
+ <!-- JS here -->
+ <script th:src="@{js/vendor/modernizr-3.5.0.min.js}"></script>
+ <script th:src="@{js/vendor/jquery-1.12.4.min.js}"></script>
+ <script th:src="@{js/popper.min.js}"></script>
+ <script th:src="@{js/bootstrap.min.js}"></script>
+ <script th:src="@{js/owl.carousel.min.js}"></script>
+ <script th:src="@{js/isotope.pkgd.min.js}"></script>
+ <script th:src="@{js/ajax-form.js}"></script>
+ <script th:src="@{js/waypoints.min.js}"></script>
+ <script th:src="@{js/jquery.counterup.min.js}"></script>
+ <script th:src="@{js/imagesloaded.pkgd.min.js}"></script>
+ <script th:src="@{js/scrollIt.js}"></script>
+ <script th:src="@{js/jquery.scrollUp.min.js}"></script>
+ <script th:src="@{js/wow.min.js}"></script>
+ <script th:src="@{js/nice-select.min.js}"></script>
+ <script th:src="@{js/jquery.slicknav.min.js}"></script>
+ <script th:src="@{js/jquery.magnific-popup.min.js}"></script>
+ <script th:src="@{js/plugins.js}"></script>
+ <script th:src="@{js/gijgo.min.js}"></script>
+
+ <!--contact js-->
+ <script th:src="@{js/contact.js}"></script>
+ <script th:src="@{js/jquery.ajaxchimp.min.js}"></script>
+ <script th:src="@{js/jquery.form.js}"></script>
+ <script th:src="@{js/jquery.validate.min.js}"></script>
+ <script th:src="@{js/mail-script.js}"></script>
+
+ <script th:src="@{js/main.js}"></script>
+ <script>
+ $('#datepicker').datepicker({
+ iconsLibrary: 'fontawesome',
+ disableDaysOfWeek: [0, 0],
+ // icons: {
+ // rightIcon: '<span class="fa fa-caret-down"></span>'
+ // }
+ });
+ $('#datepicker2').datepicker({
+ iconsLibrary: 'fontawesome',
+ icons: {
+ rightIcon: '<span class="fa fa-caret-down"></span>'
+ }
+
+ });
+ var timepicker = $('#timepicker').timepicker({
+ format: 'HH.MM'
+ });
+ </script>
+</body>
+
+</html> \ No newline at end of file