diff --git a/dist/Js/main.js b/dist/Js/main.js index d276f16..1c53dc3 100644 --- a/dist/Js/main.js +++ b/dist/Js/main.js @@ -14,30 +14,26 @@ $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff"); } setTimeout(naChanges, 1000); - win.on('scroll', function() { - var scroll = win.scrollTop(); - if (scroll < 200) { - header.removeClass('stick'); - if(ele_page == true){ - $(".header-bottom.sticky-bar.stick").removeClass("sticky-bar stick"); - let img_src = `./dist/assets/imgs/anwi-logo-2.png`; - $(".logo-menu-wrap").find("a img").attr("src",img_src); - $(".main-menu").find("nav ul li a").addClass("text-white"); - $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff"); - } - } else { - header.addClass('stick'); - - if(ele_page == true){ - $(".header-bottom").addClass("sticky-bar stick"); - let src = `./dist/assets/imgs/anwi-logo-1.png`; - $(".logo-menu-wrap").find("a img").attr("src",src); - $(".main-menu").find("nav ul li a").removeClass("text-white"); - $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","currentcolor"); - } - - } - }); + win.on('scroll', function() { + var scroll = win.scrollTop(); + if (scroll < 200) { + header.removeClass('stick'); + $(".header-bottom.sticky-bar.stick").removeClass("sticky-bar stick"); + let img_src = `./dist/assets/imgs/anwi-logo-2.png`; + $(".logo-menu-wrap").find("a img").attr("src",img_src); + $(".main-menu").find("nav ul li a").addClass("text-white"); + $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff"); + } else { + header.addClass('stick'); + + $(".header-bottom").addClass("sticky-bar stick"); + let src = `./dist/assets/imgs/anwi-logo-1.png`; + $(".logo-menu-wrap").find("a img").attr("src",src); + $(".main-menu").find("nav ul li a").removeClass("text-white"); + $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","currentcolor"); + + } +}); /*-------------------------------- Slider active 1 diff --git a/dist/Js/navbar.js b/dist/Js/navbar.js index 36d357c..7b19f0b 100644 --- a/dist/Js/navbar.js +++ b/dist/Js/navbar.js @@ -1,13 +1,13 @@ let nav_html = ` -
+
- - - -
- - `; - $("#navbar-head").html(navbarHtml); - let navhtml = ` -
+ +
+
+
+
+ +
+
+
- - -
  • Accessories - +
    +
      +
    • Monday - Friday: 9:00 - 19:00
    • +
    • Info@example.com
    • +
    • (+55) 254. 254. 254
    • +
    • Helios Tower 75 Tam Trinh Hoang - Ha Noi - Viet Nam
    • +
    +
    +
  • - - - -
  • - Support -
  • - - -
    - -
    - `; - $(".biz-nav-wrapper").after(navhtml); - //$("#navbar-head").html(navbarHtml); - $(".navbar-toggler").click(function () { - $("#navbar-head").toggleClass("bg-white"); - }) - - $('.pricing').find('.biz-nav-wrapper .navbar').addClass('bg-white'); - - // active-menu - if (location.pathname != "/") { - // Main Nav - $(".navbar-nav li a").each(function () { - if (this.href === location.href) { - $(this).addClass("active"); - if ($(this).parents().hasClass("nav-item")) { - $(this).parents(".nav-item").find(".nav-link").addClass("active"); - } - return false; - } +$("#navbar-head").html(nav_html); +let width = $(window).width(); +$(".menu-negative-mrg2,.menu-negative-mrg3,.menu-negative-mrg4").css("width",width); + let ele_page = $("body").hasClass("product_pg"); + if(ele_page == true){ + $(".header-area").removeClass("bg-white"); + $(".main-menu").find("nav ul li a").addClass("text-white"); + $(".header-bottom.sticky-bar").removeClass("sticky-bar"); + let src =`../dist/assets/imgs/anwi-logo-2.png`; + $(".logo-menu-wrap").find("a img").attr("src",src); + $(".main-body").find("iframe").attr("width",width); + if (width <= 575 && width >= 390) { + $(".main-body").find("iframe").attr({ + width: width, + height: 236, + }) + } else if(width <= 390 && width >= 270){ + $(".main-body").find("iframe").attr({ + width: width, + height: 210, }); - } - - // Add Dropdown chevron icon - let width = $(window).width(); - - if (width <= 991.98) { - $(".dropdown .nav-link").attr("data-toggle", "dropdown"); - $('.navbar-collapse.mega-nav ul').addClass('d-none') - $('.navbar-collapse.mobile-menu ul').removeClass('d-none'); - $(".biz-nav-wrapper").removeClass("d-none"); - $(".ruby-menu-demo-header").addClass("d-none"); - - } else { - $(".dropdown .nav-link").attr("data-toggle", ""); - $('.navbar-collapse.mega-nav ul').removeClass('d-none') - $('.navbar-collapse.mobile-menu ul').addClass('d-none') - $('.navbar-expand-lg .navbar-collapse.mobile-menu').remove() - } - // Toggle Icon Change - $(".biz-nav-wrapper .navbar-toggler").click(function () { - $(this).find(".navbar-toggler-icon,.navbar-close-icon").toggle("slow"); - $(".index-new").find(".navbar").toggleClass("bg-white"); - }); - - $(".nav-item.dropdown.has-mega-menu").off().hover( - function (e) { $("#navbar-head").find(".navbar").css("background-color", "#fff"); }, // over - function (e) { $("#navbar-head").find(".navbar").css("background-color", ""); } // out - ); - $(document).scroll(function () { - if ($(window).scrollTop() === 0) { - $(".nav-item.dropdown.has-mega-menu").off().hover( - function (e) { $("#navbar-head").find(".navbar").css("background-color", "#fff"); }, // over - function (e) { $("#navbar-head").find(".navbar").css("background-color", ""); } // out - ); - } - else { - $(".nav-item.dropdown.has-mega-menu").off().hover( - function (e) { $("#navbar-head").find(".navbar").css("background-color", "#fff"); }, // over - function (e) { $("#navbar-head").find(".navbar").css("background-color", "#fff"); } // out - ); - } - }); - - var scroll_start = 0; - var startchange = $(".main-body"); - var offset = startchange.offset(); - $("#navbar-head") - .find(".navbar").addClass("bg-white"); - if (startchange.length) { - $(document).scroll(function () { - scroll_start = $(this).scrollTop(); - if (scroll_start > offset.top) { - $("#navbar-head") - .find(".navbar") - .css("background-color", "#fff") - .css("box-shadow", "0px 12px 20px -25px"); - } else { - $("#navbar-head") - .find(".navbar") - // .css("background-color", "transparent") - .css("box-shadow", "none"); - $(".nav-item.dropdown.has-mega-menu").hover( - function (e) { $("#navbar-head").find(".navbar").css("background-color", "#fff"); }, // over - function (e) { $("#navbar-head").find(".navbar").css("background-color", ""); } // out - ); - } + } else if (width <= 998 && width > 575) { + $(".main-body").find("iframe").attr({ + width: width, + height: 530, }); - } else { - $("#navbar-head") - .find(".navbar") - .css("background-color", "#fff") - .css("box-shadow", "0px 12px 20px -25px"); + } else if(width <= 2720 && width > 1920){ + $(".main-body").find("iframe").attr({ + width: width, + height: 1440, + }); + }else { + $(".main-body").find("iframe").attr({ + width: width, + height: 860, + }); + } + } + + +$("a.ram_data").click(function () { + let item_id = $(this).attr("accessories_id"); + let loc_path = '/products.html' + if (window.location.pathname.includes(loc_path)) { + window.location.href = `?itemid=${item_id}` } + else { + window.location.href = `/products.html#itemid=${item_id}`; + } +}) - $('.owl-carousel.server-img-sec').owlCarousel({ - // loop: true, - margin: 10, - rtl: false, - nav: false, - autoHeight: true, - responsive: { - 0: { - items: 1 - }, - 600: { - items: 3 - }, - 1000: { - items: 4 - } - } - }); - $('.owl-carousel.accessories-img-sec').owlCarousel({ - // loop: true, - margin: 10, - rtl: false, - nav: false, - autoHeight: true, - responsive: { - 0: { - items: 1 - }, - 600: { - items: 3 - }, - 1000: { - items: 4 - } - } - }); - $(".ruby-menu").find(".nav_item").each(function () { - $(this).click(function () { - let item_id = $(this).attr("item_id"); - let loc_path = '/products.html' - if (window.location.pathname.includes(loc_path)) { - window.location.href = `?products` - } - else { - window.location.href = `/products.html?products`; +$(".main-menu nav ul").find("li").each(function(){ + var current = window.location.pathname; + var $this = $(this).find("a"); + if(current != "/"){ + if($this.attr('href').indexOf(current) !== -1){ + $(this).addClass('active_nav'); + } + } + +}) + +// destroy localstorage data +let loc_path = '/productdetails.html'; +if (window.location.pathname.includes(loc_path) === false) { + localStorage.removeItem("product_data"); + localStorage.removeItem("top_data") +} + + +//services pages links and sources + +let $body_pg = $("body").hasClass("services_page"); +let $hm_pg = "../index.html"; +let $nav_img ="../dist/assets/imgs/anwi-logo-1.png"; +let $footer_img = "../dist/assets/imgs/anwi-logo-2.png"; +let $scrool_top_img = "../dist/assets/imgs/Home/rocket-footer.png"; + +if($body_pg == true){ +$(".header-large-device").find(".logo-menu-wrap .logo").find("a").attr("href",$hm_pg); +$(".header-large-device").find(".logo-menu-wrap .logo").find("a img").attr("src",$nav_img); +$(".mobile-logo").find("a").attr("href",$hm_pg); +$(".mobile-logo").find("a img").attr("src",$nav_img); + $(".main-menu").find("nav ul").find("li a").each(function(){ + let $arc = $(this).attr("href"); + let $spcial_char = $arc.includes("./"); + if($spcial_char === true){ + let $refarence = `.${$arc}` + $(this).attr("href",$refarence); + } + $(".same-style").find("a").each(function(){ + let $arc1 = $(this).attr("href"); + let $spcial_char1 = $arc1.includes("./"); + if($spcial_char1 === true){ + let $refarence1 = `.${$arc1}` + $(this).attr("href",$refarence1); } }) }); - - $("a.ram_data").click(function () { - let item_id = $(this).attr("accessories_id"); - let loc_path = '/products.html' - if (window.location.pathname.includes(loc_path)) { - window.location.href = `?itemid=${item_id}` + $(".clickable-mainmenu-wrap").find("nav ul").find("li a").each(function(){ + let $arc_mbil = $(this).attr("href"); + let $spcial_char_mbil = $arc_mbil.includes("./"); + if($spcial_char_mbil === true){ + let $refarence_mbil = `.${$arc_mbil}` + $(this).attr("href",$refarence_mbil); } - else { - window.location.href = `/products.html?itemid=${item_id}`; - } - }) - - // destroy localstorage data - let loc_path = '/productdetails.html'; - if (window.location.pathname.includes(loc_path) === false) { - localStorage.removeItem("product_data") - } -}); \ No newline at end of file + }); +} \ No newline at end of file diff --git a/dist/css/main.css b/dist/css/main.css index b223fd0..c6804f1 100644 --- a/dist/css/main.css +++ b/dist/css/main.css @@ -1091,7 +1091,7 @@ html,body{ /* ORDER DETAILS */ .bg-return{ - background-color: #d0f5ff !important; + background-color: #f7f0e1 !important; } .close_exchange{ bottom:10px; @@ -1106,7 +1106,7 @@ html,body{ font-size: 1rem !important; } .order-summary{ - background-color:#c8ebff !important; + background-color:#f3e2be !important; } .fs-7{ font-size: 0.7rem; @@ -1513,8 +1513,12 @@ display: none; background: linear-gradient(112.1deg, rgb(63, 76, 119) -14.8% , rgb(32, 38, 57) 100.4%); } .bg-gradient-violet{ - background: linear-gradient(90deg, rgba(230,242,244,1) 6%, rgba(236,228,220,1) 100%); - } + /* background: linear-gradient(90deg, rgba(230,242,244,1) 6%, rgba(236,228,220,1) 100%); + */ + background:url(../assets/imgs/login_bg.png); + background-size: cover; + background-repeat: no-repeat; +} @media only screen and (min-width: 769px) and (max-width: 1199px) { span.transform_text2 { position: absolute; @@ -1596,19 +1600,315 @@ display: none; background: rgb(22,62,96); background: linear-gradient(75deg, rgb(56 89 118) 51%, rgb(107 18 111) 89%) } -.same-style a{ - font-size:12px !important; - font-weight:600 !important; -} -.fs-60 { - font-size: 60px !important; - padding: 40px 0px !important; -} -.Order_details_section{ - position: sticky; - top: 120px; -} -.primary_btn{ - background: #0A1039 !important; - color: #fff !important; -} \ No newline at end of file +/*Text neon */ +.neon { + text-shadow: + 0 0 0px #fff, + 0 0 0px #fff, + 0 0 0px #ff9300, + 0 0 1px #ff9300, + 0 0 10px #ff9300, + 0 0 10px #ff9300, + 0 0 0px #ff9300; + } + /* .neon-orange { + text-shadow: + 0 0 0px #fff, + 0 0 0px #fff, + 0 0 0px #b2674e, + 0 0 1px #b2674e, + 0 0 10px #b2674e, + 0 0 10px #b2674e, + 0 0 0px #b2674e; + } + .neon-blue { + text-shadow: + 0 0 0px #fff, + 0 0 0px #fff, + 0 0 0px #3b6ec9, + 0 0 1px #3b6ec9, + 0 0 10px #3b6ec9, + 0 0 10px #3b6ec9, + 0 0 0px #3b6ec9; + } + .neon-purple { + text-shadow: + 0 0 0px #fff, + 0 0 0px #fff, + 0 0 0px #885bce, + 0 0 1px #885bce, + 0 0 10px #885bce, + 0 0 10px #885bce, + 0 0 0px #885bce; + } */ + section.graphene_img_section { + height: 100vh; + background-attachment: fixed !important; + background-repeat: no-repeat !important; + background-size: cover !important; + } + section#graphene_section { + padding-top: 50px; + } + .main-text{ + background: linear-gradient(270deg, #f6940c 50%, #ff9300 50%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + font-size: 40px; + } + .item-title { + font-size: 16px; + font-weight: 500; + padding: 20px 0px; + } + + /*button*/ + .buy-now { + border-radius: 4px; + /* background-color: #f4511e; */ + border: none; + color: #FFFFFF; + text-align: center; + padding: 5px 15px; + width: 120px; + transition: all 0.5s; + cursor: pointer; + margin: auto; + } + + .butbuy-nowton span { + cursor: pointer; + display: inline-block; + position: relative; + transition: 0.5s; + } + + .buy-now span:after { + content: '\00bb'; + position: absolute; + opacity: 0; + top: 0; + right: 20px; + transition: 0.5s; + } + + .buy-now:hover span { + border-bottom: solid 1px white; + } + + .buy-now:hover span:after { + opacity: 1; + right: 0; + } + .buy-now{ + background:#5782ce !important; + color:white; + } + @media (min-width:320px) and (max-width:1198px){ + section.graphene_img_section { + height: 200px; + background-attachment: initial !important; + background-repeat: no-repeat !important; + background-size: 100% !important; + } + .main-text { + background: linear-gradient(270deg, #f4a73c 50%, #ff9300 50%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + font-size: 24px; + } + } + .footer-wrapper{ + background-image: linear-gradient(145deg,rgb(33,37,41,0.9),rgb(33,37,41,0.9)),url(../assets/imgs/home/h1.jpg); + } + + .orangeWrapper { + padding:0; + } + .card-item-header { + width: 80%; + margin: auto; + margin-top: -90px; + } + .row.product_card_section { + padding-top: 100px; + } + + .card-header-sub-1, .card-header-sub-2, .card-header-sub-3 { + border-radius: 20px; + height: 180px; + } + .card-item-header .card-header-sub-1 { + background-image: url(../assets/imgs/Home_new/Explore_Fyro_bg.png); + background-position: center; + background-size: cover; + background-repeat: no-repeat; + } + .product_card_1 .card-item-body:hover h3 a{ + color:#ff9300; + } + .product_card_2 .card-item-body:hover h3 a{ + color:#5d87d0; + } + .product_card_3 .card-item-body:hover h3 a{ + color:#9973d4; + } + .product_card_1 .card-item-body:hover .card_product_footer a{ + color:#ff9300; + } + .product_card_2 .card-item-body:hover .card_product_footer a{ + color:#5d87d0; + } + .product_card_3 .card-item-body:hover .card_product_footer a{ + color:#9973d4; + } + .card-item-body p { + color: #212529; + margin-bottom: 1px; + font-size: 15px; + } + .card-item-body { + padding: 50px; + height: 320px; + } + .shadow:hover{ + box-shadow: rgba(0, 0, 0, 0.15) 10px 1rem 1rem !important; + } + .card_product_footer{ + position: absolute; + bottom:5px; + } + .card_product_footer a{ + font-weight: 500; + } + .product_card_1 { + border: 1px solid rgb(204, 204, 204,0.1); + border-radius: 10px; + background: #8e9eab; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #f8f8f8, #f8f8f8); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #f8f8f8, #f8f8f8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + position: relative; + } + .product_card_1:hover img{ + transform: scale(1.3); + } + .product_card_2 { + border: 1px solid rgb(204, 204, 204,0.1); + border-radius: 10px; + background: #8e9eab; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #f8f8f8, #f8f8f8); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #f8f8f8, #f8f8f8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + position: relative; + } + .product_card_2:hover img{ + transform: scale(1.2); + } + .product_card_2:hover .card-item-footer{ + display: block; + animation: fadeIn 0.8s; + } + .card-item-header .card-header-sub-2 { + background-image: url(../assets/imgs/allin_imgs/laptop_bg.png); + background-position: center; + background-size: cover; + background-repeat: no-repeat; + } + .product_card_3 { + border: 1px solid rgb(204, 204, 204,0.1); + border-radius: 10px; + background: #8e9eab; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #f8f8f8, #f8f8f8); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #f8f8f8, #f8f8f8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + position: relative; + } + .product_card_3:hover img{ + transform: scale(1.2); + } + .product_card_3:hover .card-item-footer{ + display: block; + animation: fadeIn 0.8s; + } + .card-item-header .card-header-sub-3 { + background-image: url(../assets/imgs/allin_imgs/desktop_bg.png); + background-position: center; + background-size: cover; + background-repeat: no-repeat; + } + .product_card_section h6 { + font-size: 14px; + } + #pills-tabContent .col-sm-4{ + margin-top:100px; + } + #pills-tabContent .product_card_section{ + padding-top:0px; + } + .theme-btn { + position: relative; + z-index: 2; + overflow: hidden; + vertical-align: middle; + display: inline-block; + border: none; + text-transform: capitalize; + text-align: center; + background-color: #202639 !important; + color: white !important; + font-size: 14px; + font-weight: 600; + line-height: 1; + padding: 20.5px 29px; + box-shadow: 0px 6px 16px rgba(13, 94, 244, 0.24); + border-radius: 5px; + } + .theme-btn:before { + content: ""; + position: absolute; + height: 0%; + left: 50%; + top: 50%; + width: 600%; + background-color: #142c8e !important; + -webkit-transform: translateX(-50%) translateY(-50%) rotate(60deg); + -ms-transform: translateX(-50%) translateY(-50%) rotate(60deg); + transform: translateX(-50%) translateY(-50%) rotate(60deg); + z-index: -1; + -webkit-transition: 0.7s ease; + transition: 0.7s ease; + } + .theme-btn:hover, .theme-btn.active { + color: var(--white-color); + } + .or_line{ + width: 100%; + text-align: center; + border-bottom: 1px solid #ccc; + line-height: 0.1em; + line-height: 0 !important; + font-size: 16px !important; + + } + .or_line span { + background:#fff; + padding:0 10px; + } + .bg-gradient-anwi-outline{ + border:solid 2px #142c70 !important; + color:#142c70 !important; + background: linear-gradient(145deg,rgb(255,255,255,0.9),rgb(255,255,255)); + } + .bg-gradient-anwi-outline:hover{ + background: linear-gradient(145deg,rgb(27,45,83,0.9),rgb(10,19,34)) !important; + border:solid 2px rgb(10,19,34)!important; + color:white !important; + } + .main-menu.menu-lh-1 > ul > li >a{ + line-height: 50px; + } + + .banner-main-container .carousel_img { + height: 100%; + min-height: 100%; + max-height: 100% !important; + } + diff --git a/dist/css/style.css b/dist/css/style.css index 5695194..748d14c 100644 --- a/dist/css/style.css +++ b/dist/css/style.css @@ -3794,7 +3794,7 @@ margin-bottom: 0.5rem !important; .header-action-wrap .same-style a { font-size: 20px; - color: #0A1039; + color: #fff; } .header-action-wrap .same-style a:hover { @@ -4069,8 +4069,8 @@ margin-bottom: 0.5rem !important; position: absolute; bottom: -1px; left: -10px; - background: rgb(63, 76, 119); - height: 4px; + background: rgb(63, 76, 119,0.5); + height: 1px; width: 100%; z-index: 200; transition: all 200ms cubic-bezier(0.5, 0.15, 0, 1); @@ -4082,8 +4082,8 @@ margin-bottom: 0.5rem !important; position: absolute; bottom: -1px; left: -10px; - background: rgb(63, 76, 119); - height: 3px; + background: rgb(63, 76, 119,0.5); + height: 2px; width: 100%; z-index: 200; transition: all 200ms cubic-bezier(0.5, 0.15, 0, 1); @@ -4092,12 +4092,26 @@ margin-bottom: 0.5rem !important; } .main-menu > nav > ul > li > a { font-size: 12px; - color: #060A27; + color: #fff; display: inline-block; font-weight: 600;; } - - +.header-bottom.sticky-bar.stick .main-menu > nav > ul > li > a { + font-size: 12px; + color: #0A1039; + display: inline-block; + font-weight: 600;; +} +.header-bottom.sticky-bar.stick .header-action-wrap .same-style a { + font-size: 20px; + color: rgb(10, 16, 57); +} +/* .sticky-bar.stick .main-menu > nav > ul > li > a { + font-size: 12px; + color: #fff; + display: inline-block; + font-weight: 600;; +} */ .main-menu > nav > ul > li:hover > a { color: #0A1039; } @@ -4508,7 +4522,7 @@ margin-bottom: 0.5rem !important; @media only screen and (min-width: 1366px) and (max-width: 1600px) { .main-menu.main-menu-padding-1 > nav > ul > li { - padding: 0 20px 0 0; + margin: 0 20px 0 0; } } @@ -31615,10 +31629,10 @@ h4.checkout-title::before { } } */ -.sticky-bar{ - /* border-bottom: 1px solid #f9f9f9 !important; */ - /* box-shadow: 0 3px 6px 0 rgba(0,0,0,.2) !important; */ -} +/* .sticky-bar{ + border-bottom: 1px solid #f9f9f9 !important; + box-shadow: 0 3px 6px 0 rgba(0,0,0,.2) !important; +} */ .order_details_btn { width: 180px; diff --git a/index.html b/index.html index 828930e..06551fb 100644 --- a/index.html +++ b/index.html @@ -74,19 +74,19 @@