优化微信读书样式,将左右两侧面板常驻显示,提高效率。了然于心
基于meteor199的代码,加上了右侧的标注划线面板并优化了样式,向该大佬致敬 。
原作者脚本链接: https://userstyles.world/style/2596/default-slug
微信读书网页样式优化 by wttzzz
Details
Authorwttzzz
License交互小让
Categoryhttps://weread.qq.com/web/reader/
Created
Updated
Size3.1 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
微信读书的网页版,其实可以好好改造下,现在阅读的时候是只显示中间部分,左右都是空的,
将其改造成了左侧显示章节目录,右侧显示批注划线,这样读一本书 就和读一个语雀文章合集或飞书知识库一样,会让我觉得很轻松。 就像读一篇一篇的文章合集。 10w字轻轻松松,1-2小时就读完了。同时优化排版布局样式,中间正文不知道怎么优化,不会了。以后会了再更新哈哈
Source code
/* ==UserStyle==
@name 微信读书网页版样式优化
@version v1.0
@namespace userstyles.world/user/meteor199
@description 微信读书的网页版,其实可以好好改造下,现在阅读的时候是只显示中间部分,左右都是空的,改造成l 左侧显示章节目录,右侧显示批注划线,这样读一本书 就和读一个语雀文章合集或飞书知识库一样,会让我觉得很轻松。 就像读一篇一篇的文章合集。 10w字轻轻松松,1-2小时就读完了。
@author 交互小让
@license wttzzz
==/UserStyle== */
@-moz-document domain("weread.qq.com") {
.readerCatalog{
display:flex !important;
left:0;
width:415px;
box-shadow: 1px 0 0px 0 rgba(0,0,0,.06);
}
.readerContent .app_content{
margin-left:400px;
}
.readerControls{
/* display:none; */
right: 0;
left: auto;
}
.readerNotePanel {
display: flex!important;
left: auto;
right:0;
max-width:400px;
box-shadow: -1px 0 0px 0 rgba(0,0,0,.06);
}
/* 背景颜色 */
html body {
background-color: #1c1c1d;
}
html body.wr_whiteTheme {
background-color: #ffffff;
}
/* 中间面板居中 */
.readerContent .app_content {
margin: 0 auto;
}
.noteItem_content .text {
font-family: -apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Arial,sans-serif !important;
font-size: 16px;
line-height:26px;
max-height: 300px;
}
.readerCatalog_bookInfo{
display:none
}
.noteItem_content .icon {
display: none;}
.sectionListItem_title {
word-break: break-all;
font-size: 18px;
font-weight:600;
color: #eef0f4;
margin: 16px 20px 4px;
}
.sectionListItem_divider.leftIndent {
margin-left: 24px;
}
.wr_whiteTheme .sectionListItem_divider {
border-radius: 0;
border: solid #e5e5e5;
border-width: 1px 0 0;
}
.wr_whiteTheme .readerNotePanel {
background-color: #f4f5f7;
}
.sectionListItem_content {
display: block;
padding: 16px 24px;
word-break: break-all;
font-size: 16px;
color: #b2b4b8;
cursor: default;
font-family: -apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Arial,sans-serif !important;
}
/* 中间正文字体优化 好像无效 */
.readerChapterContent.fontLevel1 {
font-size: 18px;
line-height:26px;
font-family: -apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Arial,sans-serif !important;
}
body
{font-family: -apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Arial,sans-serif !important;
}
.readerControls{
z-index: 99;
}
/*隐藏右下角打开目录和打开划线和下载的按钮,以及调整字体展开面板的位置*/
.catalog {
display: none;
}
.note{
display: none;
}
.download{
display: none;
}
.readerControls_fontSize.expand {
margin-left: -155px;
}
.readerControls {
width: 48px;
bottom: 96px;
}
}