试用于 1920*1080 分辨率的网道样式优化, 提升阅读体验
// ==UserScript==
// @name 网道美化
// @namespace http://tampermonkey.net/
// @version 0.9
// @description 试用于 1920*1080 分辨率的网道样式优化, 提升阅读体验
// @author jsbay
// @match https://wangdoc.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=wangdoc.com
// @require https://code.jquery.com/jquery-3.7.1.min.js
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// Your code here...
// const style = $('<style>@media screen and (min-width: 1608px) .container:not(.is-max-desktop):not(.is-max-widescreen) { max-width: 1644px; }</style>')
// $('head').append(style)
// 右侧的大导航
const rightColumn = $('.column.is-3')
// 右侧的大导航内容高度设置
$('.panel-menu .panel-block').css({ 'height': 'calc(100vh - 375px)', 'overflow-y': 'scroll', 'align-items': 'flex-start' })
rightColumn.remove()
$(rightColumn).removeClass('is-offset-1')
$(rightColumn).css('position', 'fixed')
$(rightColumn).css('width', '300px')
$(rightColumn).css('z-index', '1')
$('.main').append(rightColumn)
// 中间的内容导航
const toc = $('.article-toc')
toc.remove()
$(toc).css('position', 'fixed')
$(toc).css('right', '40px')
$(toc).css('height', 'calc(100vh - 98px)')
$(toc).css('display', 'inherit')
$(toc).css('overflow-y', 'scroll')
$(toc).css('width', '300px')
$(toc).css('z-index', '1')
$('.main').append(toc)
// 内容 + 评论
const container = $('.main .container')
container.remove()
$('.main').append(container)
$('.main').css('padding-top', '80px')
$('.column.is-6-widescreen.is-8').removeClass('is-offset-1-widescreen')
$('.column.is-6-widescreen.is-8').css('width', '100%')
$('.column.is-6-widescreen.is-8').css('padding-left', '90px')
$('.column.is-6-widescreen.is-8').css('padding-right', '120px')
$('.panel-support').remove()
// 防止没能只能删掉, 1s 后再次执行删除
setTimeout(() => {
$('.panel-support').remove()
}, 1000)
$('.navbar').css('position', 'fixed').css('width', '100%')
})();