ページの閲覧と編集しかできないようにするUserCSS
ソースコード
CSS本体
style.cssbody {
background-image: none !important;
background-color: #333 !important;
--page-bg: #444 !important;
--page-text-color: #ddd !important;
--line-title-color: var(--page-text-color);
--cursor-color: var(--page-text-color);
--cursor-text-color: #222;
}
.app div.page-wrapper .related-page-list,
/*.app div.col-page-side, */
.navbar .col-search,
.navbar .col-menu {
display: none;
}
nav.navbar {
background-color: transparent;
box-shadow: none;
}
.project-home .title {
color: #666;
}
.app div.page-wrapper {
display: block;
margin-top: 50px;
width: 100%;
min-height: 100%;
}
.app div.drag-and-drop-enter {
width: 100%;
}
.editor textarea.text-input {
color: var(--cursor-text-color);
background-color: var(--cursor-color);
}
.cursor-line.with-image {
animation: none !important;
}
JavaScriptから起動できるようにするやつ
script.js/**
* CSSを切り替えるよ（中身のない説明）
* @param {bool} [enable] 有効にするかどうか（trueで有効化、省略でトグル）
*/
export function switchPageFocusMode(enable = undefined) {
const id = "page-focus-mode-usercss"
const exist = document.getElementById(id)
if (exist === null) {
// 未実行の場合
if (enable === false) return
runPageFocusMode(id)
} else {
// 実行済みの場合
if (enable === true) return
removePageFocusMode(id)
}
}
function runPageFocusMode(id) {
const link = document.createElement("link")
link.href = "/api/code/Mijinko/ページの閲覧と編集しかできないようにするUserCSS/style.css"
link.rel = "stylesheet"
link.id = id
document.head.appendChild(link)
}
function removePageFocusMode(id) {
const exist = document.getElementById(id)
if (exist === null) return
exist.remove()
}