mirror of
https://github.com/Damillora/Yuika
synced 2024-12-25 13:43:46 +00:00
Abandon vertical menu for desktop
This commit is contained in:
parent
ca487735f1
commit
33ec7a91bb
@ -25,18 +25,14 @@ header {
|
||||
.index-navbar.enabled {
|
||||
height: 100vh;
|
||||
}
|
||||
@screen md {
|
||||
.index-navbar {
|
||||
width: 4rem;
|
||||
height: 100vh;
|
||||
}
|
||||
.index-navbar.enabled {
|
||||
width: 100vw;
|
||||
}
|
||||
}
|
||||
.index-navbar header {
|
||||
z-index: 12;
|
||||
@apply transition duration-300 ease-in-out h-full;
|
||||
}
|
||||
.index-navbar.enabled header {
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
}
|
||||
.index-navbar.detached header {
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
}
|
||||
.index-header {
|
||||
@ -67,31 +63,18 @@ header {
|
||||
}
|
||||
.site-background {
|
||||
position: absolute;
|
||||
opacity: 0%;
|
||||
top: -23vh;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
@apply transition-all duration-300 ease-in-out;
|
||||
}
|
||||
.index-navbar.enabled .site-background {
|
||||
opacity: 100%;
|
||||
top: 0;
|
||||
}
|
||||
@screen md {
|
||||
.site-background {
|
||||
top:0;
|
||||
right: -25vw;
|
||||
}
|
||||
.index-navbar.enabled .site-background {
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
.main-container {
|
||||
@apply pt-16 relative;
|
||||
}
|
||||
@screen md {
|
||||
.main-container {
|
||||
@apply pt-0 ml-16 min-h-screen;
|
||||
}
|
||||
@apply relative;
|
||||
}
|
||||
/* 3. Content Styling */
|
||||
#post p {
|
||||
|
@ -3,4 +3,55 @@ $("#menushow").click(function(){
|
||||
})
|
||||
$(".nav li").click(function(){
|
||||
$(".index-navbar").toggleClass('enabled');
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var nav = document.querySelector('.index-navbar');
|
||||
var feed = document.querySelector('.content');
|
||||
|
||||
var lastScrollY = window.scrollY;
|
||||
var lastWindowHeight = window.innerHeight;
|
||||
var lastDocumentHeight = $(document).height();
|
||||
var ticking = false;
|
||||
|
||||
function onScroll() {
|
||||
lastScrollY = window.scrollY;
|
||||
requestTick();
|
||||
}
|
||||
|
||||
function onResize() {
|
||||
lastWindowHeight = window.innerHeight;
|
||||
lastDocumentHeight = $(document).height();
|
||||
requestTick();
|
||||
}
|
||||
|
||||
function requestTick() {
|
||||
if (!ticking) {
|
||||
requestAnimationFrame(update);
|
||||
}
|
||||
ticking = true;
|
||||
}
|
||||
|
||||
function update() {
|
||||
var trigger = feed.getBoundingClientRect().top + window.scrollY;
|
||||
var progressMax = lastDocumentHeight - lastWindowHeight;
|
||||
|
||||
// show/hide nav
|
||||
if (lastScrollY >= nav.getBoundingClientRect().bottom) {
|
||||
nav.classList.add('detached');
|
||||
} else {
|
||||
nav.classList.remove('detached');
|
||||
}
|
||||
|
||||
ticking = false;
|
||||
}
|
||||
|
||||
window.addEventListener('scroll', onScroll, { passive: true });
|
||||
window.addEventListener('resize', onResize, false);
|
||||
|
||||
update();
|
||||
|
||||
});
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "yuika",
|
||||
"description": "nanao.moe's blog theme",
|
||||
"version": "2.5.2",
|
||||
"version": "2.6.0",
|
||||
"engines": {
|
||||
"ghost-api": "v3"
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user