fix: update frontend styles and scripts
This commit is contained in:
@@ -14569,9 +14569,7 @@ jdp-container .jdp-icon-plus.not-in-range svg, jdp-container .jdp-icon-minus.not
|
||||
opacity: 0.3;
|
||||
}
|
||||
jdp-container .jdp-years, jdp-container .jdp-months {
|
||||
display: -webkit-inline-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
/*display: -webkit-flex;*/
|
||||
display: inline-flex;
|
||||
margin: 0 2.5%;
|
||||
font-size: 120%;
|
||||
@@ -14747,3 +14745,469 @@ jdp-container .jdp-btn-today, jdp-container .jdp-btn-empty {
|
||||
.datepic:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
TRAVEL HERO HEADER
|
||||
========================================================= */
|
||||
|
||||
.travel-header {
|
||||
position: relative;
|
||||
min-height: 560px;
|
||||
overflow: hidden;
|
||||
direction: rtl;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* Background */
|
||||
|
||||
.travel-header-bg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.travel-header-bg-image {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
transform: scale(1.02);
|
||||
}
|
||||
|
||||
.travel-header-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
||||
background:
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(5, 20, 40, .78) 0%,
|
||||
rgba(5, 20, 40, .48) 45%,
|
||||
rgba(5, 20, 40, .72) 100%
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
/* Content */
|
||||
|
||||
.travel-header-content {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
NAVBAR
|
||||
========================================================= */
|
||||
|
||||
.travel-navbar {
|
||||
min-height: 90px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
border-bottom: 1px solid rgba(255,255,255,.18);
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
/* Logo */
|
||||
|
||||
.travel-logo a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
|
||||
text-decoration: none !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.travel-logo-icon {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
border-radius: 14px;
|
||||
|
||||
background: rgba(255,255,255,.15);
|
||||
|
||||
border: 1px solid rgba(255,255,255,.28);
|
||||
|
||||
backdrop-filter: blur(8px);
|
||||
|
||||
font-size: 21px;
|
||||
}
|
||||
|
||||
.travel-logo-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.travel-logo-content strong {
|
||||
font-size: 17px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.travel-logo-content small {
|
||||
font-size: 11px;
|
||||
opacity: .75;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
MENU
|
||||
========================================================= */
|
||||
|
||||
.travel-menu ul {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
list-style: none;
|
||||
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.travel-menu li {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.travel-menu a {
|
||||
display: block;
|
||||
|
||||
padding: 12px 17px;
|
||||
|
||||
color: rgba(255,255,255,.88);
|
||||
|
||||
text-decoration: none !important;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
|
||||
border-radius: 9px;
|
||||
|
||||
transition: all .25s ease;
|
||||
}
|
||||
|
||||
.travel-menu a:hover {
|
||||
color: #fff;
|
||||
background: rgba(255,255,255,.12);
|
||||
}
|
||||
|
||||
.travel-menu li.active a {
|
||||
color: #fff;
|
||||
background: rgba(255,255,255,.15);
|
||||
}
|
||||
|
||||
|
||||
/* خط زیر آیتم فعال */
|
||||
|
||||
.travel-menu li.active::after {
|
||||
content: "";
|
||||
|
||||
position: absolute;
|
||||
|
||||
bottom: -1px;
|
||||
left: 17px;
|
||||
right: 17px;
|
||||
|
||||
height: 3px;
|
||||
|
||||
background: #fff;
|
||||
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
ACTION
|
||||
========================================================= */
|
||||
|
||||
.travel-navbar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.travel-login {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
|
||||
padding: 11px 18px;
|
||||
|
||||
color: #fff !important;
|
||||
|
||||
text-decoration: none !important;
|
||||
|
||||
border-radius: 10px;
|
||||
|
||||
background: rgba(255,255,255,.14);
|
||||
|
||||
border: 1px solid rgba(255,255,255,.25);
|
||||
|
||||
backdrop-filter: blur(8px);
|
||||
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
|
||||
transition: all .25s ease;
|
||||
}
|
||||
|
||||
.travel-login:hover {
|
||||
background: rgba(255,255,255,.23);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
HERO CONTENT
|
||||
========================================================= */
|
||||
|
||||
.travel-hero {
|
||||
min-height: 465px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.travel-hero-content {
|
||||
max-width: 800px;
|
||||
margin: auto;
|
||||
padding: 70px 20px 80px;
|
||||
}
|
||||
|
||||
.travel-hero-label {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
|
||||
padding: 8px 16px;
|
||||
|
||||
border-radius: 50px;
|
||||
|
||||
background: rgba(255,255,255,.13);
|
||||
|
||||
border: 1px solid rgba(255,255,255,.2);
|
||||
|
||||
backdrop-filter: blur(8px);
|
||||
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.travel-hero h1 {
|
||||
margin: 20px 0 15px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
font-size: 48px;
|
||||
line-height: 1.45;
|
||||
|
||||
font-weight: 800;
|
||||
|
||||
text-shadow: 0 4px 20px rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
.travel-hero h1 span {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.travel-hero p {
|
||||
max-width: 620px;
|
||||
margin: 0 auto;
|
||||
|
||||
color: rgba(255,255,255,.88);
|
||||
|
||||
font-size: 16px;
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
HERO BUTTONS
|
||||
========================================================= */
|
||||
|
||||
.travel-hero-buttons {
|
||||
margin-top: 30px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.hero-btn {
|
||||
min-width: 160px;
|
||||
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
gap: 8px;
|
||||
|
||||
padding: 13px 22px;
|
||||
|
||||
border-radius: 11px;
|
||||
|
||||
text-decoration: none !important;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
|
||||
transition: all .25s ease;
|
||||
}
|
||||
|
||||
.hero-btn-primary {
|
||||
color: #1268d8 !important;
|
||||
background: #fff;
|
||||
|
||||
box-shadow: 0 10px 30px rgba(0,0,0,.18);
|
||||
}
|
||||
|
||||
.hero-btn-primary:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 14px 35px rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
.hero-btn-outline {
|
||||
color: #fff !important;
|
||||
|
||||
border: 1px solid rgba(255,255,255,.45);
|
||||
|
||||
background: rgba(255,255,255,.08);
|
||||
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
.hero-btn-outline:hover {
|
||||
color: #1268d8 !important;
|
||||
background: #fff;
|
||||
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
MOBILE
|
||||
========================================================= */
|
||||
|
||||
.travel-mobile-toggle {
|
||||
display: none;
|
||||
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
|
||||
border: 1px solid rgba(255,255,255,.25);
|
||||
border-radius: 10px;
|
||||
|
||||
background: rgba(255,255,255,.12);
|
||||
|
||||
color: #fff;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.travel-mobile-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
/* =========================================================
|
||||
RESPONSIVE
|
||||
========================================================= */
|
||||
|
||||
@media (max-width: 991px) {
|
||||
|
||||
.travel-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.travel-mobile-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.travel-header {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.travel-hero h1 {
|
||||
font-size: 38px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 576px) {
|
||||
|
||||
.travel-navbar {
|
||||
min-height: 72px;
|
||||
}
|
||||
|
||||
.travel-logo-icon {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
}
|
||||
|
||||
.travel-logo-content strong {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.travel-logo-content small {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.travel-login {
|
||||
padding: 9px 11px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.travel-login i {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.travel-hero {
|
||||
min-height: 420px;
|
||||
}
|
||||
|
||||
.travel-hero-content {
|
||||
padding: 50px 15px;
|
||||
}
|
||||
|
||||
.travel-hero h1 {
|
||||
font-size: 30px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.travel-hero p {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.travel-hero-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.hero-btn {
|
||||
width: 100%;
|
||||
max-width: 260px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -359,3 +359,31 @@ $('.mobile-picker').each(function(i, item){
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
|
||||
const menuButton = document.querySelector('.mobile-menu-toggle');
|
||||
const mobileNavigation = document.querySelector('.mobile-navigation');
|
||||
|
||||
if (!menuButton || !mobileNavigation) {
|
||||
return;
|
||||
}
|
||||
|
||||
menuButton.addEventListener('click', function () {
|
||||
|
||||
const isOpen = mobileNavigation.style.display === 'block';
|
||||
|
||||
mobileNavigation.style.display = isOpen ? 'none' : 'block';
|
||||
|
||||
const icon = menuButton.querySelector('i');
|
||||
|
||||
if (icon) {
|
||||
icon.className = isOpen
|
||||
? 'fa fa-bars'
|
||||
: 'fa fa-times';
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user