Fix styles

master
落雨楓 3 years ago
parent 132feeb955
commit b7212a2b16

@ -15,6 +15,7 @@
.bgimg-backdrop-blur { .bgimg-backdrop-blur {
backdrop-filter: @backdropFilter; backdrop-filter: @backdropFilter;
-webkit-backdrop-filter: @backdropFilter;
} }
/* 插件补丁 */ /* 插件补丁 */

@ -16,15 +16,15 @@ $(function(){
function initBackgroundImage(params){ function initBackgroundImage(params){
let bgImg = new isekai.BgImage(); let bgImg = new isekai.BgImage();
let bgImgElement = $('body').append('<div class="isekai-bgimg"></div>').find('div.isekai-bgimg:last'); // let bgImgElement = $('body').append('<div class="isekai-bgimg"></div>').find('div.isekai-bgimg:last');
let navbarBg = $('body').append('<div class="isekai-navbar-bg"></div>').find('div.isekai-navbar-bg:last'); let bgImgElement = $('body');
bgImg.addViewport(bgImgElement); bgImg.addViewport(bgImgElement);
bgImg.addBlurBackground(navbarBg);
bgImg.addBlurBackground($('.sidebar-chunk')); bgImg.addBlurBackground($('.sidebar-chunk'));
bgImg.addBlurBackground($('#mw-header-container'));
bgImg.addBlurBackground($('#mw-content')); bgImg.addBlurBackground($('#mw-content'));
bgImg.addBlurBackground($('#mw-content-container')); bgImg.addBlurBackground($('#content-bottom-stuff'));
bgImg.addBlurBackground($('#mw-footer-container')); bgImg.addBlurBackground($('#mw-footer-container'));
if(!('xcenter' in params)){ if(!('xcenter' in params)){

@ -1,7 +1,7 @@
@globalRadius: 0.4em; @globalRadius: 0.4em;
@globalBgColor: rgba(252, 252, 252, 0.8); @globalBgColor: rgba(252, 252, 252, 0.8);
@globalBgLoadingColor: rgba(252, 252, 252, 1); @globalBgLoadingColor: rgba(252, 252, 252, 1);
@headerBgColor: transparent; @headerBgColor: rgba(252, 252, 252, 0.8);
@footerBgColor: rgba(149, 149, 149, 0.7); @footerBgColor: rgba(149, 149, 149, 0.7);
@footerBgLoadingColor: rgba(149, 149, 149, 1); @footerBgLoadingColor: rgba(149, 149, 149, 1);
@globalBoxShadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), @globalBoxShadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2),
@ -22,26 +22,16 @@
height: 100vh; height: 100vh;
} }
.isekai-navbar-bg {
position: fixed;
z-index: 99;
top: 0;
left: 0;
width: 100%;
height: 3.125em;
}
body { body {
background: #f3f3f3; background: #f3f3f3;
} }
#mw-content-container { #mw-content-container,
#mw-content-block {
background: none; background: none;
backdrop-filter: none;
} }
#mw-footer-container { #mw-footer-container {
position: relative;
background: none; background: none;
background-color: @footerBgColor; background-color: @footerBgColor;
@ -64,12 +54,12 @@
} }
} }
#mw-content-container::after {
display: none;
}
#mw-header-container { #mw-header-container {
background: @headerBgColor; background: @headerBgColor;
&.bgimg-background-loading {
background-color: @footerBgLoadingColor;
}
} }
#simpleSearch { #simpleSearch {
@ -82,58 +72,31 @@
} }
} }
#mw-content {
position: relative;
}
@media screen and (max-width: 850px) {
.isekai-navbar-bg {
display: none;
}
}
@media screen and (max-width: 1099px) { @media screen and (max-width: 1099px) {
#mw-content { body {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border: none;
background: none;
backdrop-filter: none;
box-shadow: none;
}
#mw-content-block {
background: none; background: none;
} }
#mw-content-container {
background-color: @globalBgColor;
backdrop-filter: @backdropFilter;
&.bgimg-background-loading {
background-color: @globalBgLoadingColor;
}
}
#mw-header-hack {
z-index: 99;
}
#mw-site-navigation .sidebar-chunk, #mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk { #mw-related-navigation .sidebar-chunk {
background: none; background: none;
backdrop-filter: none; backdrop-filter: none;
-webkit-backdrop-filter: none;
} }
.isekai-bgimg { #mw-content {
display: none; border-bottom-left-radius: 0em;
border-bottom-right-radius: 0em;
}
#mw-header-container {
background: #fff;
} }
} }
@media screen and (min-width: 1100px) { @media screen and (min-width: 1100px) {
#mw-site-navigation .sidebar-chunk, #mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk { #mw-related-navigation .sidebar-chunk {
position: relative;
border: none; border: none;
border-radius: @globalRadius; border-radius: @globalRadius;
box-shadow: @globalBoxShadow; box-shadow: @globalBoxShadow;
@ -168,10 +131,6 @@
} }
&.bgimg-fallback { &.bgimg-fallback {
#mw-content-container {
background: none !important;
}
#mw-footer-container { #mw-footer-container {
--bgimg-overlay-color: @footerBgColor; --bgimg-overlay-color: @footerBgColor;
} }
@ -180,17 +139,10 @@
#mw-content { #mw-content {
background: none !important; background: none !important;
} }
#mw-content-container {
background: var(--bgimg-blur-image), var(--bgimg-overlay-color, @globalBgColor) !important;
background-blend-mode: saturation !important;
background-attachment: fixed !important;
background-size: var(--bgimg-bg-size) !important;
background-position: var(--bgimg-bg-pos) !important;
}
} }
@media screen and (max-width: 1099px) { @media screen and (max-width: 1099px) {
#mw-site-navigation .sidebar-chunk, #mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk { #mw-related-navigation .sidebar-chunk {
background: none !important; background: none !important;

Loading…
Cancel
Save