Comments (19)
BTW,不知道作者大大有没有兴趣参考下隔壁notion的悬浮状态栏之类的
from rem-craft.
- 已修复,请等待版本更新
- notion主题是把
隐藏边栏
按钮融入边栏,不适合我的主题,所以在无法解决这个按钮的情况下,无法将其他按钮的样式直接抄过来。我目前没想到怎么搞,你有什么解决的建议吗?
from rem-craft.
from rem-craft.
css只能做到以屏幕四角为原点确定位置,放在这里的话,移动分割线的时候,这个按钮不会跟着移动,看起来会很奇怪
from rem-craft.
想了想,确实是不太好处理。
还有个小问题,
这两个菜单的位置没有对齐。
from rem-craft.
这个不是bug,主要是为了解决帮助按钮悬浮菜单很难点到的问题,所以把菜单下移了
from rem-craft.
这样!还有一点小问题
这个备注,因为引用的样式的边框是圆角,所以和普通的文本会有割裂
from rem-craft.
我这边不是圆角,你看看是不是缓存问题
from rem-craft.
删掉重新下载了一遍,似乎还是圆角?
不过这个问题感觉不太重要..毕竟同时备注普通文本和引用挺难用的。
from rem-craft.
啊,原来你是说同时备注和引用啊,那确实没改过,不过像你说的那样,也没必要改了
from rem-craft.
- 已修复,请等待版本更新
- notion主题是把
隐藏边栏
按钮融入边栏,不适合我的主题,所以在无法解决这个按钮的情况下,无法将其他按钮的样式直接抄过来。我目前没想到怎么搞,你有什么解决的建议吗?
from rem-craft.
请教一下怎么改的,能贴一下代码片段就更好了
from rem-craft.
基本上就是借用的 notion-theme 里的代码(CSS 都是直接用的 notion-theme 的)
function loadStyle(url, id, cssName) {
var headElement = document.head;
let style = document.getElementById(id);
if (id != null) {
if (style) headElement.removeChild(style);
}
style = document.createElement("link");
if (id != null) style.id = id;
style.setAttribute("type", "text/css");
style.setAttribute("rel", "stylesheet");
style.setAttribute("href", url);
if (cssName != null) style.setAttribute("class", cssName);
headElement.appendChild(style);
return style;
}
function addButton() {
var buttonList = document
.getElementById("barHelp")
.getElementsByTagName("div")[0];
var buttonElement = document.createElement("button");
buttonElement.id = "hide_left_column";
buttonElement.setAttribute("class", "b3-menu__item");
buttonList.appendChild(buttonElement);
buttonElement.innerHTML =
"<svg class='b3-menu__icon'><use xlink:href='#iconLeft'></use></svg><span class='b3-menu__label'>隐藏左侧菜单</span>";
var offNo = localStorage.getItem("hide_left_column");
if (offNo == "1") {
loadStyle(
"/appearance/themes/notion-theme/style/topbar/leftcolumn.css",
"leftColumn悬浮"
).setAttribute("topBarcss", "leftColumn悬浮");
localStorage.setItem("hide_left_column", "1");
var btn = document.getElementById("hide_left_column");
btn.removeAttribute("class");
btn.setAttribute("class", "b3-menu__item b3-menu__item--selected");
} else if (offNo != "0") {
localStorage.setItem("hide_left_column", "0");
document.getElementById("leftColumn悬浮").remove();
localStorage.setItem("hide_left_column", "0");
btn.removeAttribute("class");
btn.setAttribute("class", "b3-menu__item");
}
buttonElement.addEventListener("click", () => {
var offNo = localStorage.getItem("hide_left_column");
var btn = document.getElementById("hide_left_column");
if (offNo == "0") {
loadStyle(
"/appearance/themes/notion-theme/style/topbar/leftcolumn.css",
"leftColumn悬浮"
).setAttribute("topBarcss", "leftColumn悬浮");
localStorage.setItem("hide_left_column", "1");
btn.removeAttribute("class");
btn.setAttribute("class", "b3-menu__item b3-menu__item--selected");
offNo = "1";
return;
}
if (offNo == "1") {
document.getElementById("leftColumn悬浮").remove();
localStorage.setItem("hide_left_column", "0");
btn.removeAttribute("class");
btn.setAttribute("class", "b3-menu__item");
offNo = "0";
return;
}
});
}
addButton();
没怎么写过 js 和 css,应该有不少可以改进的lol
from rem-craft.
js对我来说也有点困难,而且看里面还引用了notion-theme的css文件,我慢慢试着改吧,先发个版
from rem-craft.
简单的js,像是添加按钮之类的,我倒是可以帮忙写 ... 不过css我是真心不会了,所以就直接用了notion-theme的css
from rem-craft.
话说..新的版本似乎性能有一点问题?滚动起来卡卡的,打开设置的动画也不太顺滑
from rem-craft.
这些应该不是主题的问题,我应该只是在打开边栏的动画有问题…
from rem-craft.
emm...用其他主题的时候似乎没有问题,重装似乎也没有什么帮助
用了 恢复默认窗口
选项之后好像正常了... 如果有人卡了可以建议试试
from rem-craft.
最新版已修改并上传,请等待集市打包上架或自行下载仓库到主题文件夹使用
from rem-craft.
Related Issues (20)
- 缩进的无序列表在被折叠后无法再展开 HOT 3
- 【建议】日历样式更新 HOT 1
- 反链面板在右下方时,下方的浮动状态栏会遮挡「提及」面板的按钮 HOT 1
- 左下角的通知横条挡住了标签按钮和部分标签 HOT 4
- 页签重叠 HOT 8
- 集市改版后所有按钮不显示,UI不适配 HOT 1
- 打开集市后,有些按钮显示不完全 HOT 1
- 两个文字显示的小问题 HOT 1
- 页签右键点击移动到新窗口,打开后的页签会和关闭开启栏重合 HOT 3
- 行距过大 HOT 2
- 目录层级多了之后显示错位 HOT 1
- Rem-Craft使用网页视图插件后,显示的网页只有上方一小截(网页显示不全) HOT 4
- 思源笔记-设置-集市中已下载插件页面UI显示错位 HOT 1
- 添加题头图后,按钮显示与标题重叠 HOT 1
- 不同级别的标题区分度较低 HOT 2
- 快捷命令菜单栏显示不完整,占据全屏导致无法滚动 HOT 6
- SiYuan 最新版本代码块内容与左侧边界距离变的很大
- 能否在file协议链接前显示文件图标
- 分割线显示不正常
- 临时修复 v2.6.12 在思源 2.10.10 样式的代码片段 HOT 6
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from rem-craft.