From 2eb72d92818b4d8300225e5a507940defbb20466 Mon Sep 17 00:00:00 2001 From: sau-mili <146661411+sau-mili@users.noreply.github.com> Date: Tue, 30 Jul 2024 22:16:43 +0530 Subject: [PATCH 1/2] Update plantrip.html --- plantrip.html | 505 +++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 479 insertions(+), 26 deletions(-) diff --git a/plantrip.html b/plantrip.html index f1abad49..fcee656b 100644 --- a/plantrip.html +++ b/plantrip.html @@ -9,15 +9,30 @@ rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css" /> + + + + + + + + + + + + + -
- -

Trip Planner

-
+
+ +
+
+
+
+
+
- +
+ +
+
+
+ +
+
+
+
From 4d2261e574e468224c4bca4773a2b5817bf309fc Mon Sep 17 00:00:00 2001 From: sau-mili <146661411+sau-mili@users.noreply.github.com> Date: Mon, 5 Aug 2024 01:40:28 +0530 Subject: [PATCH 2/2] Updated plan a trip page --- plantrip.html | 953 +++++++++++++++----------------------------------- 1 file changed, 279 insertions(+), 674 deletions(-) diff --git a/plantrip.html b/plantrip.html index fcee656b..fde8a61e 100644 --- a/plantrip.html +++ b/plantrip.html @@ -1,706 +1,311 @@ - - - - Trip Planner - - - - - - - - - - - - - - - /* padding: 0rem 1rem; - margin-top: 0.5rem; - margin-left:0.5rem; - margin-right: 0.5rem; - width: 99%; */ -} - -.navLinks { - display: flex; - justify-content: center; - align-items: center; - font-size: 1.16rem; - list-style: none; - gap: 0.97rem; - position: relative; - top: 0.5rem; - z-index: 10; - right: 24px; -} - -.link { - position: relative; -} -.link > a { - display: block; - color: white; - text-align: center; - padding: 12px 20px; - text-decoration: none; - width: 100%; - transition: all 0.3s linear; -} -.link > a:hover { - background-color: #f6ddff; - border-radius: 10px; - box-shadow: rgb(56, 0, 109) 0px 0px 8px 2px inset; -} -.dropdown-menu { - display: none; - position: absolute; - background-color: #123456; - min-width: 160px; - box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); - z-index: 1; -} - -.dropdown-menu > li { - float: none; -} - -.dropdown-menu > li > a { - padding: 12px 16px; - text-decoration: none; - display: block; - text-align: left; -} - -.dropdown-menu > li > a:hover { - background-color: #575757; -} - -.dropdown:hover .dropdown-menu { - display: block; -} -/* .link a::before { - position: absolute; - content: ""; - height: 2px; - width: 0%; - bottom: -5px; - left: 0; - background-color: red; -} */ - -/* .link a::after { - position: absolute; - content: ""; - height: 2px; - width: 0%; - top: -5px; - right: 0; - background-color: red; - transition: all 0.2s ease-in-out; -} */ - -/* .link a:hover::before { - width: 100%; - transition: all 0.2s ease-in-out; -} */ -/* -.link a:hover::after { - width: 100%; - transition: all 0.2s ease-in-out; -} */ -.contact-btn { - position: relative; - right: 15px; - box-sizing: border-box; -} - -#themeToggle { - width: inherit; -} - -.hamburger { - height: 2rem; - width: 1.7rem; - display: flex; - justify-content: space-between; - flex-direction: column; - display: none; - transition: 0.2s; -} - -.line { - height: 5px; - width: 100%; - background-color: white; - border-radius: 2px; -} - -@media screen and (max-width: 1220px) { - .hamburger { - display: flex; - cursor: pointer; - } - .nav__logo { - margin-left: 0px; - } - .navLinks { - position: absolute; - top: 70px; - background-color: #091020; - width: 0%; - left: 0; - height: 100vh; - padding: 2rem 0; - flex-direction: column; - transition: 0.2s; - overflow: hidden; - } - - .navLinks li { - width: 100%; - padding: 0.5rem 0; - background-color: #1f2532; - z-index: 10; - } - - #toggle { - font-size: 0.6rem; - } -} -.footer-head { - position: relative; - display: inline-block; - padding: 10px 0; -} - -/* .footer-head::before, -.footer-head::after { - content: ""; - position: absolute; - width: 0; - height: 2px; - background-color: red; - transition: width 0.2s ease-in; -} */ - -.footer-head::before { - top: 0; - left: 50%; - transform: translateX(-50%); -} - -.footer-head::after { - bottom: 0; - left: 50%; - transform: translateX(-50%); -} - - /* .footer-head:hover::before { - width: 100%; - } - .footer-head:hover::after { - width: 100%; - } */ -.navLinks:active { - color: rgb(169, 35, 252); -} - -.navLinks.activeHamburger { - width: 100%; -} - -/* Initially the Login Button and View button are not in Hamburger Menu */ -.navLinks #LogIn-link, .navLinks #View-link { - display: none; -} -/* @media screen and (max-width: 1146px) { - .toggle-container { - position: relative; - right: 148px; - } - .hamburger { - position: relative; - right: 150px; - } -} */ -/* @media only screen and (max-width:957px){ - .toggle-container{ - left: 30px; - } - .hamburger{ - left: 30px; - } -} */ -/* @media screen and (max-width: 846px) { - .toggle-container { - position: relative; - right: 200px; - } - .hamburger { - position: relative; - right: 245px; - } - .btn { - position: relative; - right: 57px; - top: 1px; - } -} */ - -/* Move Login from newNav to Hamburger */ -@media screen and (max-width: 690px) { - .navLinks #LogIn-link { - display: inline; - } - .newNav #nav-login-btn { - display: none; - } -} - -/* Move Login from Hamburger to newNav */ -@media screen and (min-width: 690px) { - .navLinks #LogIn-link { - display: none; - } - .newNav #nav-login-btn { - display: inline; - } -} - -/* Move View from newNav to Hamburger */ -@media screen and (max-width: 510px) { - .navLinks #View-link { - display: inline; - } - .newNav #nav-view-btn { - display: none; - } - .newNav img{ - position: relative; - } -} - -/* Move View from Hamburger to newNav */ -@media screen and (min-width: 510px) { - .navLinks #View-link { - display: none; - } - .newNav #nav-view-btn { - display: inline; - } -} - -/* TO prevent unnecessary wrapping */ -@media screen and (max-width: 400px) { - .newNav { - gap: 0; - } -} - -/* Hide the logo name */ -@media screen and (max-width: 350px) { - .newNav .nav__logo { - display: none; - } -} - -@media screen and (max-width: 652px) { - .toggle { - width: 5vw; - } - .line { - width: 5vw; - } - -} -@media only screen and (max-width:577px){ - .but{ - position: relative; - top: -37px; - left: 85px; - } -} -@media only screen and (max-width: 465.5px){ - - .but{ - position: relative; - left:17px; - top: -4px; - } - .but2{ - position: relative; - left: 30px; - top: -2px; - } -} -/* @media screen and (max-width: 430px) { - .toggle-container { - right: 374px; - } - .newNav img { - left: 75px; - } - .nav__logo { - left: 36px; - } -} */ -/* New NAvbar CSS Ends Here*/ - - - - + - - -
- + + + -
-
- - +
+

Plan a Trip

+ +
+ +
-
- - + +
-
- -
- - + +
-
- - +
+
+ +
- - -
+ - +
+
+
+

Trip Suggestions

+ +
+ + +
+
+ +