diff --git a/themes/vue/layout/index.ejs b/themes/vue/layout/index.ejs index d3524bb460..ae77e1e77f 100644 --- a/themes/vue/layout/index.ejs +++ b/themes/vue/layout/index.ejs @@ -163,11 +163,10 @@ }) window.addEventListener('scroll', function () { - var offset = 20 - if (window.pageYOffset > offset && !topScrolled) { + if (window.pageYOffset > 165 && !topScrolled) { topScrolled = true document.getElementById('mobile-bar').classList.remove('top') - } else if (window.pageYOffset <= offset && topScrolled) { + } else if (window.pageYOffset <= 165 && topScrolled) { topScrolled = false document.getElementById('mobile-bar').classList.add('top') } diff --git a/themes/vue/layout/layout.ejs b/themes/vue/layout/layout.ejs index 7df4749d04..8205035927 100644 --- a/themes/vue/layout/layout.ejs +++ b/themes/vue/layout/layout.ejs @@ -1,6 +1,5 @@ <% var isIndex = page.path === 'index.html' %> <% var isThemes = page.path === 'resources/themes.html' %> -<% var hasVueSchoolBanner = true %> @@ -55,7 +54,7 @@ - + @@ -91,11 +90,6 @@ - - <% if (hasVueSchoolBanner) { %> - <%- partial('partials/vueschool_banner') %> - <% } %> -
> diff --git a/themes/vue/layout/partials/vueschool_banner.ejs b/themes/vue/layout/partials/vueschool_banner.ejs deleted file mode 100644 index 0bd837c32e..0000000000 --- a/themes/vue/layout/partials/vueschool_banner.ejs +++ /dev/null @@ -1,22 +0,0 @@ - -
- Vue School logo -
- -
-
- backpack illustration -
-
- Flash Sale - Less than 48hrs left to get 20% OFF! -
-
- GET OFFER -
-
-
- Close -
- diff --git a/themes/vue/source/css/_header.styl b/themes/vue/source/css/_header.styl index 7f43c6ffab..4b4a3f7119 100644 --- a/themes/vue/source/css/_header.styl +++ b/themes/vue/source/css/_header.styl @@ -1,4 +1,3 @@ -@import "_settings" $header-height = 40px red-dot-before(leftPos = -8px) @@ -13,12 +12,10 @@ red-dot-before(leftPos = -8px) #header background-color: #fff - padding: $heading-padding-vertical 30px $heading-padding-vertical 60px + height: $header-height + padding: $heading-padding-vertical 60px position: relative z-index: $z-header - display: flex - justify-content: space-between - box-sizing: border-box #v3-banner background-color: $green @@ -43,11 +40,18 @@ body.docs position: fixed width: 100% top: 0 + #nav + position: fixed + top: $heading-padding-vertical #nav list-style-type: none margin: 0 padding: 0 + position: absolute + right: 30px + top: $heading-padding-vertical + height: $header-height line-height: $header-height .break display: none @@ -143,7 +147,6 @@ body.docs display: none box-shadow: 0 0 2px rgba(0,0,0,.25) pointer-events: none - transition: background-color 0.25s ease-in > * pointer-events: auto .menu-button diff --git a/themes/vue/source/css/_sidebar.styl b/themes/vue/source/css/_sidebar.styl index 78a72dbcb1..81980f3f21 100644 --- a/themes/vue/source/css/_sidebar.styl +++ b/themes/vue/source/css/_sidebar.styl @@ -67,7 +67,7 @@ position: fixed background-color: #f9f9f9 height: 100% - top: 40px + top: 0 left: 0 box-shadow: 0 0 10px rgba(0,0,0,.2) transition: all .4s cubic-bezier(0.4, 0, 0, 1) diff --git a/themes/vue/source/css/_vueschool.styl b/themes/vue/source/css/_vueschool.styl deleted file mode 100644 index 0fb891f1f4..0000000000 --- a/themes/vue/source/css/_vueschool.styl +++ /dev/null @@ -1,142 +0,0 @@ -@import "_settings" -$mobile-bar-height = 40px -$vs-banner-height-desktop = 80px -$vs-banner-height-mobile = 50px -$menu-height = 63px - -body.has-vs-banner - - #v3-banner - margin-top: $vs-banner-height-mobile - @media (min-width: 680px) - margin-top: $vs-banner-height-desktop - @media (min-width: 900px) - margin-top: 0 - - #mobile-bar - top: $vs-banner-height-mobile - @media (min-width: 680px) - top: $vs-banner-height-desktop - - .sidebar - top: $vs-banner-height-mobile + $mobile-bar-height - @media (min-width: 680px) - top: $vs-banner-height-desktop + $mobile-bar-height - @media (min-width: 900px) - top: $vs-banner-height-desktop + $menu-height - - .content - padding-top: 85px - @media (min-width: 680px) - padding-top: 125px - @media (min-width: 900px) - padding-top: 35px - - &.docs - @media (min-width: 900px) - padding-top: 144px - - #vs - position: fixed - - #header - top: $vs-banner-height-mobile - @media (min-width: 680px) - top: $vs-banner-height-desktop - - #sidebar-sponsors-platinum-right - @media (min-width: 900px) - top: 160px - -#vs - font-family "Roboto", sans-serif - z-index: 8 - box-sizing: border-box - color: #fff - background-size: cover - background-color: #202A5A - display: flex - justify-content: center - align-items: center - position: fixed - left: 0 - right: 0 - padding: 0 10px - min-height: $vs-banner-height-mobile - top: 0 - @media (min-width: 680px) - min-height: $vs-banner-height-desktop - @media (min-width: 900px) - position: static - - &.vs-hidden - display: none - - &:hover - .vs-core - .vs-button - background-color: #364fde - - .vs-iso - position: absolute - left: 20px - height: 26px - img - height: 26px - @media (min-width: 680px) - display: none - - .vs-logo - position: absolute - display: none - left: 40px - @media (min-width: 900px) - display: block - - .vs-core - display: flex - align-items: center - - .vs-illustration - display: none - @media (min-width: 680px) - display: inline-block - margin-right: 8px - @media (min-width: 900px) - margin-right: 20px - - .vs-slogan - text-align: center - font-size: 14px - font-weight: bold - @media (min-width: 680px) - font-size: 22px - .vs-slogan-main - display: none - @media (min-width: 680px) - display: inline - - .vs-button - margin-left: 8px - color: #fff - background: #667dff - padding: 2px - border-radius: 40px - display: none - padding: 17px 24px - font-weight: bold - @media (min-width: 680px) - display: inline-block - @media (min-width: 900px) - margin-left: 20px - - .vs-close - right: 10px - position: absolute - padding: 10px - @media (min-width: 680px) - right: 0px - @media (min-width: 900px) - right: 20px - &:hover - color: #56D8FF \ No newline at end of file diff --git a/themes/vue/source/css/index.styl b/themes/vue/source/css/index.styl index b8f326fa8d..ff77f319d9 100644 --- a/themes/vue/source/css/index.styl +++ b/themes/vue/source/css/index.styl @@ -4,7 +4,6 @@ @import "_sponsors-index" @import "_modal" @import "_themes" -@import "_vueschool.styl" $width = 900px $space = 40px diff --git a/themes/vue/source/css/page.styl b/themes/vue/source/css/page.styl index e8b6b94cdc..90746a3d07 100644 --- a/themes/vue/source/css/page.styl +++ b/themes/vue/source/css/page.styl @@ -16,7 +16,6 @@ @import "_scrimba" @import "_vue-mastery" @import "_themes" -@import "_vueschool.styl" #header box-shadow: 0 0 1px rgba(0,0,0,.25) diff --git a/themes/vue/source/images/banners/close.svg b/themes/vue/source/images/banners/close.svg deleted file mode 100644 index 16b7786154..0000000000 --- a/themes/vue/source/images/banners/close.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/themes/vue/source/images/banners/vs-backpack.svg b/themes/vue/source/images/banners/vs-backpack.svg deleted file mode 100644 index 927a413fb6..0000000000 --- a/themes/vue/source/images/banners/vs-backpack.svg +++ /dev/null @@ -1,71 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/themes/vue/source/images/banners/vs-iso.svg b/themes/vue/source/images/banners/vs-iso.svg deleted file mode 100644 index d5fbbaac93..0000000000 --- a/themes/vue/source/images/banners/vs-iso.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/themes/vue/source/images/banners/vs-logo.svg b/themes/vue/source/images/banners/vs-logo.svg deleted file mode 100644 index 4e060ce4e2..0000000000 --- a/themes/vue/source/images/banners/vs-logo.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - - - - diff --git a/themes/vue/source/js/common.js b/themes/vue/source/js/common.js index 505c89a72e..aead1b5ea8 100644 --- a/themes/vue/source/js/common.js +++ b/themes/vue/source/js/common.js @@ -3,7 +3,6 @@ initMobileMenu() initVideoModal() initNewNavLinks() - initVueSchoolBanner() if (PAGE_TYPE) { initVersionSelect() initApiSpecLinks() @@ -281,23 +280,6 @@ }) } - /** - * Banner closing - */ - function initVueSchoolBanner () { - const banner = document.getElementById('vs') - if (banner && !localStorage.getItem('VS_OFFER_BANNER_CLOSED')) { - banner.classList.remove('vs-hidden') - document.body.classList.add('has-vs-banner') - document.getElementById('vs-close').addEventListener('click', function (e) { - e.preventDefault() - e.stopPropagation() - document.getElementById('vs').remove() - document.body.classList.remove('has-vs-banner') - localStorage.setItem('VS_OFFER_BANNER_CLOSED', 1) - }) - } - } /** * Modal Video Player @@ -441,7 +423,7 @@ if(dataTypeAttr && dataTypeAttr.nodeValue === 'theme-product-title') { return 300 } - return localStorage.getItem('VS_OFFER_BANNER_CLOSED') ? 0 : 80 + return 0 } }) }