morri/hotel-am-see
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
hotel-am-see/rooms.html
Jontil88 2b462bc0e6 Initial commit: Hotel am See website with bilingual i18n (DE/EN) 
- Static HTML hotel website with Bootstrap 5
- i18next-based client-side internationalization
- Language switcher (DE/EN) in navbar
- German and English translation JSON files
- Translated: navigation, content, forms, FAQ, legal pages (AGB)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-13 22:49:57 +01:00

334 lines
12 KiB
HTML
Raw Permalink Blame History

<!doctype html>
<html lang="de">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto&family=Work+Sans:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="fonts/icomoon/style.css">
<link rel="stylesheet" href="fonts/flaticon/font/flaticon.css">
<link rel="stylesheet" href="css/tiny-slider.css">
<link rel="stylesheet" href="css/aos.css">
<link rel="stylesheet" href="css/flatpickr.min.css">
<link rel="stylesheet" href="css/glightbox.min.css">
<link rel="stylesheet" href="css/style.css">
<title>Hotel am See &mdash;Ihre Unterkunft in Obermaubach</title>
</head>
<body>
<div class="site-mobile-menu site-navbar-target">
<div class="site-mobile-menu-header">
<div class="site-mobile-menu-close">
<span class="icofont-close js-menu-toggle"></span>
</div>
</div>
<div class="site-mobile-menu-body"></div>
</div>
<nav class="site-nav">
<div class="container">
<div class="menu-bg-wrap">
<div class="site-navigation">
<div class="row g-0 align-items-center">
<div class="col-2">
<a href="index.html" class="logo m-0 float-start text-white" data-i18n="common.logo">Hotel am See</a>
</div>
<div class="col-8 text-center">
<ul class="js-clone-nav d-none d-lg-inline-block text-start site-menu mx-auto">
<li><a href="index.html" data-i18n="common.nav.home">Home</a></li>
<li class="active"><a href="rooms.html" data-i18n="common.nav.rooms">Unsere Zimmer</a></li>
<li><a href="services.html" data-i18n="common.nav.services">Services</a></li>
<li><a href="about.html" data-i18n="common.nav.about">Über uns</a></li>
<li><a href="contact.html" data-i18n="common.nav.contact">Kontakt</a></li>
<li><a href="impressum.html" data-i18n="common.nav.impressum">Impressum</a></li>
</ul>
</div>
<div class="col-2 text-end">
<a href="#" class="burger ms-auto float-end site-menu-toggle js-menu-toggle d-inline-block d-lg-none light">
<span></span>
</a>
<div class="lang-switcher float-end" role="navigation" aria-label="Sprachwahl / Language selection">
<a href="#" class="lang-option active" data-lang="de" aria-label="Deutsch" aria-current="true">DE</a>
<span class="lang-divider" aria-hidden="true">|</span>
<a href="#" class="lang-option" data-lang="en" aria-label="English">EN</a>
</div>
<a href="#" class="call-us d-flex align-items-center">
<span class="icon-phone"></span>
<span data-i18n="[html]common.phone">+49 2422 / 504 48 66<br>+49 176 / 847 34 595</span>
</a>
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="hero overlay" style="background-image: url('images/img_1.jpg')">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col-lg-8 text-center">
<h1 class="heading mb-5 text-white" data-aos="fade-up" data-i18n="rooms.hero_heading">Unsere Zimmer</h1>
</div>
</div>
</div>
</div>
<div class="section sec-posts">
<div class="container">
<div class="row mb-4">
<div class="col-lg-7" data-aos="fade-up">
<h2 class="heading mb-4" data-i18n="rooms.rooms_heading">Unsere Zimmer</h2>
</div>
</div>
<div class="row">
<div class="col-lg-12" data-aos="fade-up" data-aos-delay="100">
<div class="post-slider-wrap">
<div id="post-slider-nav">
<button class="btn btn-primary prev" data-controls="prev" data-i18n="common.prev">Zurück</button>
<button class="btn btn-primary next" data-controls="next" data-i18n="common.next">Weiter</button>
</div>
<div class="post-slider" id="post-slider">
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/42.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "120"}'>120 € pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/70.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "130"}'>130 € pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/28.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "99"}'>99€ pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/78.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "110"}'>110€ pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/76.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "80"}'>80€ pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/59.jpg" alt="Image"
class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "90"}'>90€ pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/34.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "70"}'>70€ pro Nacht</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="post-entry">
<a href="#" class="thumbnail"><img src="images/23.jpg" alt="Image" class="img-fluid"></a>
<div class="post-entry-body">
<!--<span class="icon-pencil"></span>-->
<h3><a href="#"></a></h3>
<div class="read-more-wrap">
<a href="#" class="more" data-i18n="rooms.price_per_night" data-i18n-options='{"price": "60"}'>60€ pro Nacht</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="site-footer bg-light">
<div class="container">
<div class="row">
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<!--<h3>Home</h3>
<ul class="list-unstyled float-left links">
<li><a href="#">About us</a></li>
<li><a href="#">Places</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Destination</a></li>
<li><a href="#">Terms</a></li>
<li><a href="#">Privacy</a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<!--<h3>Practice Area</h3>
<ul class="list-unstyled float-left links">
<li><a href="#">Travel</a></li>
<li><a href="#">Popular places</a></li>
<li><a href="#">Destination</a></li>
<li><a href="#">Tour</a></li>
<li><a href="#">Family Vacation</a></li>
</ul>-->
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<!--<h3>Services</h3>
<ul class="list-unstyled float-left links">
<li><a href="#">Tour</a></li>
<li><a href="#">Swimming</a></li>
<li><a href="#">Kayak</a></li>
<li><a href="#">Surfing</a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<h3 data-i18n="common.footer.contact_heading">Kontakt</h3>
<address data-i18n="[html]common.footer.address">Seestraße 2D,<br> 52372 Kreuzau-Obermaubach</address>
<ul class="list-unstyled links mb-4">
<li><a href="tel://+4924225044866">+49(2422) 504 48 66</a></li>
<li><a href="tel://+4916084734595">+49(160) 84734 595</a></li>
<li><a href="mailto:info@hotel-obermaubach.de">info@hotel-obermaubach.de</a></li>
</ul>
<h3 data-i18n="common.footer.connect_heading">Connect</h3>
<ul class="list-unstyled social">
<li><a href="#"><span class="icon-instagram"></span></a></li>
<!--<li><a href="#"><span class="icon-twitter"></span></a></li>
<li><a href="#"><span class="icon-facebook"></span></a></li>
<li><a href="#"><span class="icon-linkedin"></span></a></li>
<li><a href="#"><span class="icon-pinterest"></span></a></li>
<li><a href="#"><span class="icon-dribbble"></span></a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
</div> <!-- /.row -->
<div class="row mt-5">
<div class="col-12 text-center">
<p data-i18n="[html]common.footer.copyright">Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | <i class="icon-heart text-danger" aria-hidden="true"></i> </p>
</div>
</div>
</div> <!-- /.container -->
</div> <!-- /.site-footer -->
<!-- Preloader -->
<div id="overlayer"></div>
<div class="loader">
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden" data-i18n="common.loading">Loading...</span>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/tiny-slider.js"></script>
<script src="js/flatpickr.min.js"></script>
<script src="js/glightbox.min.js"></script>
<script src="https://unpkg.com/i18next@23.16.8/i18next.min.js"></script>
<script src="https://unpkg.com/i18next-http-backend@3.0.2/i18nextHttpBackend.min.js"></script>
<script src="js/i18n.js"></script>
<script src="js/aos.js"></script>
<script src="js/navbar.js"></script>
<script src="js/counter.js"></script>
<script src="js/custom.js"></script>
</body>
</html>
Reference in a new issue View git blame Copy permalink