settings
https://scrapbox.io/files/62ebe36354d80b001da45ff4.webp
トップページにださないようにする
code:style.css
.page-list-itemdata-page-title="settings"
{display: none !important;}
code:style.css
.navbar {
background-color: #3e3e3e;
}
body {
background-color: #F0F0F0;
}
.page, .grid li.page-list-item a {
background-color: #F0F0F0;
box-shadow: 12px 12px 24px #b6b6b6,
-12px -12px 24px #ffffff;
border-radius: 24px;
}
.page-list .grid li {
margin: 24px;
}
.icon img {
object-fit: contain;
height: 260px;
}
.grid li.page-list-item a .title {
font-size: 16px;
}
.page-list-item:hover {
background-color: #F0F0F0;
box-shadow: 5px 5px 12px #b6b6b6,
-5px -5px 12px #ffffff;
border-radius: 24px;
}
.line.line-title, .text-input.line-title {
font-size: 24px;
}
.page-list ul.grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: clamp(8px, 1.5svw, 16px);
}
赤文字と緑文字
code: style.css
/* hogehogeで緑文字 */
.deco-\# {
color: #fff; /* 白文字 */
background-color: #6a6; /* 緑背景 */
}
/* hogehogeで赤文字 */
.deco-\! { /* 重要な部分は!を付ける */
color: #fff;
background-color: #e66; /* 赤背景 */
font-size: 1.2em; /* 重要なので最初から大きな文字にする */
}
吹き出し
code: style.css
/* {, }で吹き出し */
.deco-\{, .deco-\} {
font-size: 1em;
color: #fff;
background-color: #b2bcba;
padding: 0.1em 0.2em 0.1em 0.2em;
border-radius: 0.4em;
margin: auto 0.3em;
display: inline-block;
max-width: calc(100% - 100px);
vertical-align: top;
}
.deco-\{:before {
position: absolute;
margin: 0;
padding: 0;
transform: translateX(-100%) translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0 0.6em 0.6em;
border-style: solid;
border-color: #b2bcba transparent;
}
.deco-\}:after {
position: absolute;
margin: 0;
padding: 0;
transform: translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0.6em 0.6em 0;
border-style: solid;
border-color: #b2bcba transparent;
}
.deco-\!:before, .deco-\!:after {
border-color: #ee6666 transparent;
}
/* 吹き出しないのリンクの色 */
.deco-\{ a,
.deco-\} a {
color: #66F;
}
diffのバーの非表示
code:style.css
/* テロメア非表示 */
.line .telomere .telomere-border, .line .telomere .telomere-border.unread {
display: none;
}
ページの画像サイズ
code:style.css
.line img.image {
max-height: none !important;
max-width: 95% !important;
}