Skip to content

Commit

Permalink
Nav Update
Browse files Browse the repository at this point in the history
  • Loading branch information
monurajputrko committed Jan 4, 2024
1 parent 299dd42 commit eaae5f8
Show file tree
Hide file tree
Showing 9 changed files with 288 additions and 958 deletions.
446 changes: 0 additions & 446 deletions Puneet-index.html

This file was deleted.

Binary file added images/oestin logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
30 changes: 24 additions & 6 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/MajnuDev/All-CDNm@main/Oeston-index.css">
<link rel="stylesheet" href="/index.css">

<link rel="stylesheet" href="./monu/Style/navbar.css">

<link rel="shortcut icon" href="https://htmldemo.net/oestin/oestin/img/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="https://shrtco.de/DEjZPX">
<link rel="stylesheet" href="./monu/Style/style.css">
Expand All @@ -26,7 +27,7 @@
</head>
<body>
<!-- ---------------------------------- Navbar Starts Here -------------------------------------------- -->
<div id="homepage-section1" class="homepage-section1">
<!-- <div id="homepage-section1" class="homepage-section1">
<nav>
<div class="wrapperH">
<div class="div-1">
Expand Down Expand Up @@ -108,8 +109,25 @@ <h1>Oestin</h1>
<label for="menu-btn" class="btn menu-btn"><i class="fas fa-bars"></i></label>
</div>
</nav>
</div>
<div class="containerMonu">
</div> -->
<section id="header"><a href="/"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIfW51RPKPeUqq2AHQhUPZJn5LD10fmDEG-MOJIvmQwnF9J8blujj60J-Q3U8zyA6PB6eMC7_LuK_zNSYcBuamgcOWZzpELJ2D2gQiDRc33wGH0GtzuKwJ7OBB5fkI48X_OhiGkvjNTCMPXHHSWbXhX3oagXkZSJmd2BFSMMtUwM6O1iuErpbe8CzF3y9J/s16000/oestin%20logo.png"
class="logo" alt="Logo"></a>
<div>
<ul id="navbar">
<li><a class="active" href="./index.html">Home</a></li>
<li><a href="./monu/rooms.html">Rooms</a></li>
<li><a href="./monu/location.html">Location</a></li>
<li><a href="./monu/contact.html">Contact</a></li>
<li id="lg-bag"></li><a href="#" id="close"><i
class="fa-solid fa-xmark"></i></a>
</ul>
</div>
<div id="mobile"><i id="bar"
class="fa-solid fa-bars"></i></div>
</section>
<!-- </br> -->
<!-- <div class="containerMonu">
<input type="radio" id="i1" name="images" checked />
<input type="radio" id="i2" name="images" />
Expand Down Expand Up @@ -180,7 +198,7 @@ <h1 class="pt-180">welcome to Oestin</h1>
<a class="default-btn" href="room-grid.html">explore</a>
</div>
</div>
<div style="margin-bottom: 3%;"></div>
<div style="margin-bottom: 3%;"></div> -->

<!-- ------------------- Navbar Till Here-------------------------------------- -->

Expand Down Expand Up @@ -1182,7 +1200,7 @@ <h3>collections</h3>
<!-- <a href="./monu/PageDis.html"></a> -->
<!-- Footer Bottom Area End -->
</footer>
<script src="https://shrtco.de/pHH9lk"></script>
<script src="./monu/Script/navbar.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
Expand Down
157 changes: 16 additions & 141 deletions monu/PageDis.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,153 +12,27 @@
<link rel="stylesheet" href="https://shrtco.de/yKj4x9">
<link rel="shortcut icon" href="https://htmldemo.net/oestin/oestin/img/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="Style/pagedis.css">
<link rel="stylesheet" href="./Style/navbar.css">
<title>Room Details</title>
</head>

<body>
<!-- ---------------------------------- Navbar Starts Here -------------------------------------------- -->
<div id="homepage-section1" class="homepage-section1">
<nav>
<div class="wrapperH">
<div class="div-1">
<div class="content">
<h1>Oestin</h1>
</div>
</div>
<div class="div-2">
<div class="content1">
<p> <span>Contact: </span>9997222612</p>
</div>
<div class="content2">
<i class="fa-brands fa-google-plus-g fa-flip fa-xl"></i>
<i class="fa-brands fa-twitter fa-flip fa-xl"></i>
<i class="fa-brands fa-facebook fa-flip fa-xl"></i>
<i class="fa-brands fa-instagram fa-flip fa-xl"></i>
<i class="fa-brands fa-pinterest fa-flip fa-xl"></i>
</div>
</div>
</div>
<div id="arhant" class="wrapper">
<div class="logo"><a id="changelogo" href="#">MENU</a></div>
<input type="radio" name="slider" id="menu-btn">
<input type="radio" name="slider" id="close-btn">
<ul class="nav-links">
<label for="close-btn" class="btn close-btn"><i class="fas fa-times"></i></label>
<li><a href="../index.html">HOME</a></li>
<li>
<a href="#" class="desktop-item">ROOM</a>
<input type="checkbox" id="showDrop">
<label for="showDrop" class="mobile-item">ROOM</label>
<ul class="drop-menu">
<li><a href="../monu/rooms.html">ROOM LIST</a></li>
<li><a href="../monu/rooms.html">ROOM DETAILS</a></li>
</ul>
</li>
<li>
<a href="#" class="desktop-item">ACTIVITIES</a>
<input type="checkbox" id="showMega">
<label for="showMega" class="mobile-item">ACTIVITIES</label>
<div class="mega-box">
<div class="content">
<div class="row">
<header>MEGAMENU LIST</header>
<ul class="mega-links">
<li><a href="../monu/location.html">LOCATION</a></li>
<li><a href="#">ROOM GRID</a></li>
<li><a href="#">ROOM LIST</a></li>
<li><a href="#">ROOM DETAILS</a></li>
</ul>
</div>
<div class="row">
<header>MEGAMENU LIST</header>
<ul class="mega-links">
<li><a href="#">EVENT</a></li>
<li><a href="#">MEGA MENU</a></li>
<li><a href="../monu/contact.html">CONTACT</a></li>
<li><a href="#">TEAM</a></li>
</ul>
</div>
<div class="row">
<header>MEGAMENU LIST</header>
<ul class="mega-links">
<li><a href="#">ROOM LIST</a></li>
<li><a href="#">MEGA MENU</a></li>
<li><a href="#">ROOM GRID</a></li>
<li><a href="#">ROOM DETAILS</a></li>
</ul>
</div>
</div>
</div>
</li>
<li><a href="../monu/location.html">LOCATION</a></li>
<li><a href="#">EVENT</a></li>
<li><a href="../monu/contact.html">CONTACT</a></li>
<li><a id="UserM" href="#">SignUp/LogIn</a></li>

</ul>
<label for="menu-btn" class="btn menu-btn"><i class="fas fa-bars"></i></label>
</div>
</nav>
</div>
<div class="containerMonu">

<input type="radio" id="i1" name="images" checked />
<input type="radio" id="i2" name="images" />
<input type="radio" id="i3" name="images" />
<input type="radio" id="i4" name="images" />
<input type="radio" id="i5" name="images" />

<div class="slide_img" id="one">

<img src="../images/photo-15.jpg">

<label class="prev" for="i5"><span>&#x2039;</span></label>
<label class="next" for="i2"><span>&#x203a;</span></label>

</div>

<div class="slide_img" id="two">

<img src="../images/psd123.jpg" >

<label class="prev" for="i1"><span>&#x2039;</span></label>
<label class="next" for="i3"><span>&#x203a;</span></label>

</div>

<div class="slide_img" id="three">
<img src="../images/The-Lobby-Lounge.jpg">

<label class="prev" for="i2"><span>&#x2039;</span></label>
<label class="next" for="i4"><span>&#x203a;</span></label>
</div>

<div class="slide_img" id="four">
<img src="../images/out123.jpg">

<label class="prev" for="i3"><span>&#x2039;</span></label>
<label class="next" for="i5"><span>&#x203a;</span></label>
</div>

<div class="slide_img" id="five">
<img src="../images/pexels-pixabay-2363.jpg">

<label class="prev" for="i4"><span>&#x2039;</span></label>
<label class="next" for="i1"><span>&#x203a;</span></label>

<section id="header"><a href="/"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIfW51RPKPeUqq2AHQhUPZJn5LD10fmDEG-MOJIvmQwnF9J8blujj60J-Q3U8zyA6PB6eMC7_LuK_zNSYcBuamgcOWZzpELJ2D2gQiDRc33wGH0GtzuKwJ7OBB5fkI48X_OhiGkvjNTCMPXHHSWbXhX3oagXkZSJmd2BFSMMtUwM6O1iuErpbe8CzF3y9J/s16000/oestin%20logo.png"
class="logo" alt="Logo"></a>
<div>
<ul id="navbar">
<li><a class="active" href="../index.html">Home</a></li>
<li><a href="./rooms.html">Rooms</a></li>
<li><a href="./location.html">Location</a></li>
<li><a href="./contact.html">Contact</a></li>
<li id="lg-bag"></li><a href="#" id="close"><i class="fa-solid fa-xmark"></i></a>
</ul>
</div>

<div id="nav_slide">
<label for="i1" class="dots" id="dot1"></label>
<label for="i2" class="dots" id="dot2"></label>
<label for="i3" class="dots" id="dot3"></label>
<label for="i4" class="dots" id="dot4"></label>
<label for="i5" class="dots" id="dot5"></label>
</div>

</div>
<div style="margin-bottom: 0%;"></div>

<div id="mobile"><i id="bar" class="fa-solid fa-bars"></i></div>
</section>
<div style="margin-bottom: -8;"></div>
<!-- ------------------- Navbar Till Here-------------------------------------- -->
<div id="popupDiv">
<h2 id="poptext" style="color: #ffffff; margin-top: -15%">
Expand Down Expand Up @@ -629,6 +503,7 @@ <h3>collections</h3>
document.getElementById("UserM").textContent="SignUp";
})
</script>
<script src="./Script/navbar.js"></script>
</body>

</html>
14 changes: 14 additions & 0 deletions monu/Script/navbar.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
// JavaScript to toggle the mobile menu
const mobileMenu = document.getElementById("mobile");
const navbar = document.getElementById("navbar");
const closeIcon = document.getElementById("close");

mobileMenu.addEventListener("click", () => {
navbar.style.right = "0";
closeIcon.style.display = "initial";
});

closeIcon.addEventListener("click", () => {
navbar.style.right = "-300px"; // Adjust this value to match the menu width
closeIcon.style.display = "none";
});
Loading

0 comments on commit eaae5f8

Please sign in to comment.