mirror of
https://github.com/dillonzq/LoveIt.git
synced 2024-11-14 02:46:16 +01:00
fix(header): Use data attributes for header mode
Partially fixes: #401 Signed-off-by: Khusika Dhamar Gusti <mail@khusika.com>
This commit is contained in:
parent
fbceb4ad5d
commit
1281b13109
9 changed files with 15 additions and 15 deletions
|
@ -52,11 +52,11 @@
|
|||
.page {
|
||||
width: 100%;
|
||||
|
||||
[header-mobile] & {
|
||||
[data-header-mobile] & {
|
||||
padding-top: $header-height;
|
||||
}
|
||||
|
||||
[header-mobile=normal] & {
|
||||
[data-header-mobile=normal] & {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
|
|
|
@ -4,11 +4,11 @@
|
|||
width: 60%;
|
||||
margin: 0 auto;
|
||||
|
||||
[header-desktop] & {
|
||||
[data-header-desktop] & {
|
||||
padding-top: $header-height;
|
||||
}
|
||||
|
||||
[header-desktop=normal] & {
|
||||
[data-header-desktop=normal] & {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
|
|
|
@ -151,7 +151,7 @@ header {
|
|||
height: $header-height;
|
||||
line-height: $header-height;
|
||||
|
||||
[header-desktop=normal] & {
|
||||
[data-header-desktop=normal] & {
|
||||
position: static;
|
||||
}
|
||||
|
||||
|
@ -216,7 +216,7 @@ header {
|
|||
height: $header-height;
|
||||
line-height: $header-height;
|
||||
|
||||
[header-mobile=normal] & {
|
||||
[data-header-mobile=normal] & {
|
||||
position: static;
|
||||
}
|
||||
|
||||
|
|
|
@ -60,7 +60,7 @@
|
|||
left: 0;
|
||||
visibility: hidden;
|
||||
|
||||
[header-desktop=normal] & {
|
||||
[data-header-desktop=normal] & {
|
||||
top: 5rem;
|
||||
}
|
||||
|
||||
|
|
4
assets/js/theme.min.js
vendored
4
assets/js/theme.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -14,7 +14,7 @@
|
|||
{{- partial "head/link.html" . -}}
|
||||
{{- partial "head/seo.html" . -}}
|
||||
</head>
|
||||
<body header-desktop="{{ .Site.Params.header.desktopMode }}" header-mobile="{{ .Site.Params.header.mobileMode }}">
|
||||
<body data-header-desktop="{{ .Site.Params.header.desktopMode }}" data-header-mobile="{{ .Site.Params.header.mobileMode }}">
|
||||
{{- /* Check theme isDark before body rendering */ -}}
|
||||
{{- $theme := .Site.Params.defaulttheme -}}
|
||||
<script type="text/javascript">(window.localStorage && localStorage.getItem('theme') ? localStorage.getItem('theme') === 'dark' : ('{{ $theme }}' === 'auto' ? window.matchMedia('(prefers-color-scheme: dark)').matches : '{{ $theme }}' === 'dark')) && document.body.setAttribute('theme', 'dark');</script>
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -419,7 +419,7 @@ class Theme {
|
|||
const $tocLinkElements = $tocCore.querySelectorAll('a:first-child');
|
||||
const $tocLiElements = $tocCore.getElementsByTagName('li');
|
||||
const $headerLinkElements = document.getElementsByClassName('headerLink');
|
||||
const headerIsFixed = document.body.getAttribute('header-desktop') !== 'normal';
|
||||
const headerIsFixed = document.body.getAttribute('data-header-desktop') !== 'normal';
|
||||
const headerHeight = document.getElementById('header-desktop').offsetHeight;
|
||||
const TOP_SPACING = 20 + (headerIsFixed ? headerHeight : 0);
|
||||
const minTocTop = $toc.offsetTop;
|
||||
|
@ -632,8 +632,8 @@ class Theme {
|
|||
|
||||
onScroll() {
|
||||
const $headers = [];
|
||||
if (document.body.getAttribute('header-desktop') === 'auto') $headers.push(document.getElementById('header-desktop'));
|
||||
if (document.body.getAttribute('header-mobile') === 'auto') $headers.push(document.getElementById('header-mobile'));
|
||||
if (document.body.getAttribute('data-header-desktop') === 'auto') $headers.push(document.getElementById('header-desktop'));
|
||||
if (document.body.getAttribute('data-header-mobile') === 'auto') $headers.push(document.getElementById('header-mobile'));
|
||||
if (document.getElementById('comments')) {
|
||||
const $viewComments = document.getElementById('view-comments');
|
||||
$viewComments.href = `#comments`;
|
||||
|
|
Loading…
Reference in a new issue