diff --git a/edit.txt b/edit.txt
new file mode 100644
index 0000000..7888925
--- /dev/null
+++ b/edit.txt
@@ -0,0 +1 @@
+Header部分修改结构,增加按钮和下拉菜单,保留原有按钮。
\ No newline at end of file
diff --git a/src-tauri/src/inject/custom.css b/src-tauri/src/inject/custom.css
new file mode 100644
index 0000000..4ba7d96
--- /dev/null
+++ b/src-tauri/src/inject/custom.css
@@ -0,0 +1,132 @@
+.readerControls {
+ left: unset !important;
+ margin-left: unset !important;
+ right: 16px !important;
+ transition: opacity .3s ease-in-out;
+ }
+
+ div.app_content div.readerTopBar {
+ height: 32px;
+ left:0;
+ right:0;
+ width: unset;
+ max-width: unset;
+ transition: opacity .3s ease-in-out;
+ }
+
+ div.readerContent div.app_content {
+ max-width: ${getLS(contentWidthKey) || 1000}px !important;
+ }
+
+ .wr_whiteTheme .readerContent div.app_content {
+ background-color: rgb(253,246,227) !important;
+ }
+
+ .readerBottomBar {
+ display: none !important;
+ }
+
+ .drag-bar {
+ position: fixed;
+ height: 100%;
+ width: 8px;
+ top: 0;
+ bottom: 0;
+ }
+
+ .right-bar {
+ cursor: col-resize;
+ left: 50%;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ background: linear-gradient(0.25turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ opacity: 0;
+ }
+
+ .right-bar.active {
+ opacity: 1;
+ }
+
+ .left-bar {
+ right: 50%;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ background: linear-gradient(0.75turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ opacity: 0;
+ }
+
+ .left-bar.active {
+ opacity: 1;
+ }
+
+ .darg-indicator {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ background: linear-gradient(0.25turn, transparent, #295BE9 20%, #295BE9 80%, transparent);
+ height: 2px;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ opacity: 0;
+ display: none;
+ }
+
+ .darg-indicator.active {
+ opacity: 1;
+ display: block;
+ }
+
+ .ind-num {
+ font-size: 30px;
+ color: #295BE9;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 50%;
+ width: 500px;
+ text-align: center;
+ margin: auto auto 0;
+ text-shadow: 5px 3px 6px #576b95;
+ background: linear-gradient(45deg, transparent,#fff 50%, #fff 50%, transparent);
+ margin-bottom: 2px;
+ z-index: 10;
+ opacity: 0;
+ display: none;
+ }
+
+ .ind-num.active {
+ opacity: 1;
+ display: block;
+ }
+
+ .navBar_link.navBar_link_ChangeFont {
+ border: none;
+ cursor: pointer;
+ }
+
+ .navBar_font_menu {
+ position: relative;
+ display: inline-block;
+ }
+
+ .navBar-subMenu {
+ display: none;
+ position: absolute;
+ background-color: #f1f1f1;
+ min-width: 160px;
+ overflow: auto;
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+ z-index: 1;
+ }
+
+ .navBar-subMenu span {
+ color: black;
+ padding: 12px 16px;
+ text-decoration: none;
+ display: block;
+ }
+
+ .navBar-subMenu span:hover {background-color: #ddd;}
+
+ .show {display: block;}
+
\ No newline at end of file
diff --git a/src-tauri/src/inject/custom.js b/src-tauri/src/inject/custom.js
index 68632a8..c8edd18 100644
--- a/src-tauri/src/inject/custom.js
+++ b/src-tauri/src/inject/custom.js
@@ -7,118 +7,250 @@
const contentWidthKey = 'cWidthz';
-function applyCss() {
- const css = `
- * {
- font-family: "LXGW WenKai Screen", LXGWWenKai, TsangerJinKai05, sans-serif !important;
- }
-
- .readerControls {
- left: unset !important;
- margin-left: unset !important;
- right: 16px !important;
- transition: opacity .3s ease-in-out;
- }
+const css = `
+.readerControls {
+ left: unset !important;
+ margin-left: unset !important;
+ right: 16px !important;
+ transition: opacity .3s ease-in-out;
+}
- div.app_content div.readerTopBar {
- height: 32px;
- left:0;
- right:0;
- width: unset;
- max-width: unset;
- transition: opacity .3s ease-in-out;
- }
+div.app_content div.readerTopBar {
+ height: 32px;
+ left:0;
+ right:0;
+ width: unset;
+ max-width: unset;
+ transition: opacity .3s ease-in-out;
+}
- div.readerContent div.app_content {
- max-width: ${getLS(contentWidthKey) || 1000}px !important;
- }
+div.readerContent div.app_content {
+ max-width: ${getLS(contentWidthKey) || 1000}px !important;
+}
- .wr_whiteTheme .readerContent div.app_content {
- background-color: rgb(253,246,227) !important;
- }
+.wr_whiteTheme .readerContent div.app_content {
+ background-color: rgb(253,246,227) !important;
+}
- .readerBottomBar {
- display: none !important;
- }
-
- .drag-bar {
- position: fixed;
- height: 100%;
- width: 8px;
- top: 0;
- bottom: 0;
- }
+.readerBottomBar {
+ display: none !important;
+}
- .right-bar {
- cursor: col-resize;
- left: 50%;
- transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
- background: linear-gradient(0.25turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
- opacity: 0;
- }
+.drag-bar {
+ position: fixed;
+ height: 100%;
+ width: 8px;
+ top: 0;
+ bottom: 0;
+}
- .right-bar.active {
- opacity: 1;
- }
+.right-bar {
+ cursor: col-resize;
+ left: 50%;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ background: linear-gradient(0.25turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ opacity: 0;
+}
- .left-bar {
- right: 50%;
- transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
- background: linear-gradient(0.75turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
- opacity: 0;
- }
+.right-bar.active {
+ opacity: 1;
+}
- .left-bar.active {
- opacity: 1;
- }
+.left-bar {
+ right: 50%;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ background: linear-gradient(0.75turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ opacity: 0;
+}
- .darg-indicator {
- position: fixed;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- margin: auto;
- background: linear-gradient(0.25turn, transparent, #295BE9 20%, #295BE9 80%, transparent);
- height: 2px;
- transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
- opacity: 0;
- display: none;
- }
+.left-bar.active {
+ opacity: 1;
+}
- .darg-indicator.active {
- opacity: 1;
- display: block;
- }
+.darg-indicator {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ background: linear-gradient(0.25turn, transparent, #295BE9 20%, #295BE9 80%, transparent);
+ height: 2px;
+ transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ opacity: 0;
+ display: none;
+}
- .ind-num {
- font-size: 30px;
- color: #295BE9;
- position: fixed;
- left: 0;
- right: 0;
- bottom: 50%;
- width: 500px;
- text-align: center;
- margin: auto auto 0;
- text-shadow: 5px 3px 6px #576b95;
- background: linear-gradient(45deg, transparent,#fff 50%, #fff 50%, transparent);
- margin-bottom: 2px;
- z-index: 10;
- opacity: 0;
- display: none;
- }
+.darg-indicator.active {
+ opacity: 1;
+ display: block;
+}
- .ind-num.active {
- opacity: 1;
- display: block;
- }
- `;
+.ind-num {
+ font-size: 30px;
+ color: #295BE9;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 50%;
+ width: 500px;
+ text-align: center;
+ margin: auto auto 0;
+ text-shadow: 5px 3px 6px #576b95;
+ background: linear-gradient(45deg, transparent,#fff 50%, #fff 50%, transparent);
+ margin-bottom: 2px;
+ z-index: 10;
+ opacity: 0;
+ display: none;
+}
+
+.ind-num.active {
+ opacity: 1;
+ display: block;
+}
+
+.navBar_link.navBar_link_ChangeFont {
+ border: none;
+ cursor: pointer;
+}
+
+.navBar_font_menu {
+ position: relative;
+ display: inline-block;
+}
+
+.navBar-subMenu {
+ display: none;
+ position: absolute;
+ background-color: #f1f1f1;
+ min-width: 160px;
+ overflow: auto;
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+ z-index: 1;
+}
+
+.navBar-subMenu button {
+ text-decoration: none;
+ display: block;
+}
+
+.navBar-subMenu button:hover {background-color: #ddd;}
+
+.show {display: block;}
+`;
- const styleElement = document.createElement('style');
- styleElement.innerHTML = css;
- document.head.appendChild(styleElement);
-};
+// function applyCss() {
+ // const css = `
+ // * {
+ // font-family: "LXGW WenKai Screen", LXGWWenKai, TsangerJinKai05, sans-serif !important;
+ // }
+
+ // .readerControls {
+ // left: unset !important;
+ // margin-left: unset !important;
+ // right: 16px !important;
+ // transition: opacity .3s ease-in-out;
+ // }
+
+ // div.app_content div.readerTopBar {
+ // height: 32px;
+ // left:0;
+ // right:0;
+ // width: unset;
+ // max-width: unset;
+ // transition: opacity .3s ease-in-out;
+ // }
+
+ // div.readerContent div.app_content {
+ // max-width: ${getLS(contentWidthKey) || 1000}px !important;
+ // }
+
+ // .wr_whiteTheme .readerContent div.app_content {
+ // background-color: rgb(253,246,227) !important;
+ // }
+
+ // .readerBottomBar {
+ // display: none !important;
+ // }
+
+ // .drag-bar {
+ // position: fixed;
+ // height: 100%;
+ // width: 8px;
+ // top: 0;
+ // bottom: 0;
+ // }
+
+ // .right-bar {
+ // cursor: col-resize;
+ // left: 50%;
+ // transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ // background: linear-gradient(0.25turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ // opacity: 0;
+ // }
+
+ // .right-bar.active {
+ // opacity: 1;
+ // }
+
+ // .left-bar {
+ // right: 50%;
+ // transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ // background: linear-gradient(0.75turn, #295BE9, #295BE9 20%, transparent 20%, transparent);
+ // opacity: 0;
+ // }
+
+ // .left-bar.active {
+ // opacity: 1;
+ // }
+
+ // .darg-indicator {
+ // position: fixed;
+ // top: 0;
+ // bottom: 0;
+ // left: 0;
+ // right: 0;
+ // margin: auto;
+ // background: linear-gradient(0.25turn, transparent, #295BE9 20%, #295BE9 80%, transparent);
+ // height: 2px;
+ // transition: opacity 0.3s cubic-bezier(0.4, 0, 1, 1);
+ // opacity: 0;
+ // display: none;
+ // }
+
+ // .darg-indicator.active {
+ // opacity: 1;
+ // display: block;
+ // }
+
+ // .ind-num {
+ // font-size: 30px;
+ // color: #295BE9;
+ // position: fixed;
+ // left: 0;
+ // right: 0;
+ // bottom: 50%;
+ // width: 500px;
+ // text-align: center;
+ // margin: auto auto 0;
+ // text-shadow: 5px 3px 6px #576b95;
+ // background: linear-gradient(45deg, transparent,#fff 50%, #fff 50%, transparent);
+ // margin-bottom: 2px;
+ // z-index: 10;
+ // opacity: 0;
+ // display: none;
+ // }
+
+ // .ind-num.active {
+ // opacity: 1;
+ // display: block;
+ // }
+ // `;
+
+// const styleElement = document.createElement('style');
+// styleElement.innerHTML = css;
+// document.head.appendChild(styleElement);
+// };
function saveLS(key, value) {
try {
@@ -310,6 +442,103 @@ function titleHelper() {
);
}
+// 这里不修改原有的按钮,而是在前面添加按钮
+function modifyHeader() {
+ const linkUpload = document.getElementsByClassName('navBar_link navBar_link_Upload')
+ const navBarSpace = document.getElementsByClassName('navBar_placeholder_regular')
+ const navBarSeparator = document.createElement('span')
+ const headerParent = document.getElementsByClassName('navBar_inner')
+ // const navBarSeparator = document.getElementsByClassName('navBar_separator')[0]
+
+ navBarSeparator.className = 'navBar_separator'
+ // 在这两个元素之间插入别的按钮
+ function addButton() {
+ const HeaderUnit = document.createElement('div')
+ HeaderUnit.id = 'change_font_unit'
+ HeaderUnit.className = 'navBar_font_menu'
+
+ // 需要把选择的字体传递到函数外,修改整体的CSS?
+
+ const button_ChangeFont = document.createElement('button')
+ //
+ //
+ button_ChangeFont.innerText = '全局字体'
+ button_ChangeFont.className = 'navBar_link navBar_link_ChangeFont'
+ button_ChangeFont.onclick = showFunction()
+
+
+
+ // 下拉菜单
+ const HiddenList = document.createElement('div')
+ HiddenList.className = 'navBar-subMenu'
+
+ const fontName = ['思源宋体','霞鹜文楷','思源黑体']
+ const fontCount = fontName.length // 和加入的字体个数相等
+ for (var i=0; iGithub
+ //
+ //
+ //
+ return HeaderUnit
+ }
+ function createALink(name, url, beforeWhatNode) {
+ const HeaderUnit = document.createElement('div')
+ HeaderUnit.id('header_add_unit')
+
+ const item = document.createElement('a');
+ item.innerText = name;
+ item.target = '_blank';
+ item.className = 'navBar_link';
+ item.style.cursor = 'pointer';
+
+ item.addEventListener('click', () => {
+ window.__TAURI__.shell.open(url);
+ });
+
+ HeaderUnit.after(item,navBarSeparator)
+ beforeWhatNode.insertBefore(HeaderUnit)
+ return HeaderUnit;
+ }
+ const FontButton = addButton()
+ const IssueLink = createALink('PC版问题反馈', 'https://github.com/zeyios/weread-pc/issues', FontButton)
+ const CodeLink = createALink('Github', 'https://github.com/zeyios/weread-pc', IssueLink)
+}
+
+
function modifyHeader() {
const sendBook = document.querySelector('.navBar_link.navBar_link_Upload');
const linkPage = document.querySelector('.navBar_link.navBar_link_ink');
@@ -328,7 +557,7 @@ function modifyHeader() {
return item;
}
-
+ // 这里我还是想保留传书功能
if (sendBook) {
const githubLink = createALink('Github', 'https://github.com/zeyios/weread-pc');
sendBook.replaceWith(githubLink);
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-Bold.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-Bold.otf
new file mode 100644
index 0000000..10c3523
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-Bold.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-ExtraLight.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-ExtraLight.otf
new file mode 100644
index 0000000..d1f485c
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-ExtraLight.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-Heavy.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-Heavy.otf
new file mode 100644
index 0000000..34f2489
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-Heavy.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-Light.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-Light.otf
new file mode 100644
index 0000000..dff82b1
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-Light.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-Medium.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-Medium.otf
new file mode 100644
index 0000000..9e10784
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-Medium.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-Regular.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-Regular.otf
new file mode 100644
index 0000000..8b4993b
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-Regular.otf differ
diff --git a/src-tauri/src/inject/fonts/SourceHanSerifSC-SemiBold.otf b/src-tauri/src/inject/fonts/SourceHanSerifSC-SemiBold.otf
new file mode 100644
index 0000000..f50fdeb
Binary files /dev/null and b/src-tauri/src/inject/fonts/SourceHanSerifSC-SemiBold.otf differ