settings
キーカラー
code:style.css
html, body {
}
.navbar {
}
.grid li.relation-label.links a {
}
Scrapboxのロゴを非表示
code:style.css
.col-brand { visibility: hidden; }
Scrapboxのロゴを常に右上に表示する
!code:style.css
.navbar > .container > .row {
position: relative;
}
.navbar > .container > .row > .col-brand {
width: 75px;
flex-grow: 0;
position: absolute;
top: 0;
right: 0;
}
/* モバイル */
@media (max-width: 767px) {
/* Scrapboxロゴは非表示 */
.navbar > .container > .row > .col-brand {
display: none;
}
}
ブログのロゴマークを使う
code:style.css
/* ロゴマークの導入 */
.project-home {
width: 207px;
height: 38px;
z-index: 1000;
}
.project-home:hover {
opacity: 0.5;
}
.project-home > .title {
display: none;
}
/* 元の家アイコンとテキストを隠す*/
.quick-launch .project-home > .icon.icon-home {
color: transparent !important;
display: none;
}
.quick-launch .project-home > .title {
color: transparent !important;
display: none;
}
/*
@media (min-width: 768px) and (max-width: 1280px) {
.quick-launch .new-button {
display: block;
}
}
*/
/* モバイル */
@media (max-width: 767px) {
.project-home {
width: 100%;
z-index: 9999;
}
.project-home:hover {
opacity: 1.0;
}
.quick-launch .flex-box .flex-item {
min-width: 50px;
}
.flex-box > .flex-item:first-child {
width: calc(100% - 60px * 2);
text-align: center;
position: fixed;
top: 8px;
z-index: 9999;
top: 8px;
left: 60px;
}
.flex-box > .flex-item:first-child > .left-box {
display: inline-block;
max-width: 207px;
width: 100%;
}
.flex-box > .flex-item:first-child > .left-box > .project-home {
position: static;
}
.navbar > .container > .row > .col-brand {
width: 40px;
}
.navbar .navbar-brand.dropdown-toggle > .icon.icon-arrow-down {
display: none;
}
.expandable-menu {
z-index: 9999;
top: initial;
bottom: 64px;
}
}
ロゴマークをナビゲーションバー上に移動する
!code:style.css
.project-home {
position: fixed;
top: 6px;
}
.navbar {
height: 52px;
padding-top: 7px;
padding-bottom: 7px;
}
.navbar .row .col-search {
width: 80%;
}
.navbar .row .col-search > .navbar-form > a.new-button {
position: fixed;
left: 20px;
}
.navbar .row .col-search > .navbar-form > form.search-form {
margin-left: 247px;
}
アカウントメニューを消す
code:style.css
.col-menu {
display: none;
}
/* モバイルでは消さない(検索動線なので) */
@media (max-width: 767px) {
.col-menu {
display: block;
}
/* アカウントボタンは消す */
.col-menu li.dropdown:last-child {
display: none;
}
}
グローバルメニュー
code:style.css
.navbar .col-brand ul.global-menu-for-user.global-menu.dropdown-menu {
/* スクローラブルにする */
max-height: 80vh;
overflow-y: auto;
/* 画面外に出ないように左にずらす */
margin-left: -225px;
}
code:style.css
display: none;
}
テロメア
code:style.css
.line .telomere .telomere-border {
border-color: rgba(143, 152, 153, 0.1);
}
.line .telomere .telomere-border.unread {
border-color: rgba(200, 235, 220, 1.00);
}
.line .telomere .telomere-border .description {
background: rgba(243, 243, 244, 1.00);
}
Tweak
リストからsettingsを消す
code:style.css
/* settingsへのリンクを消す */
display: none;
}
/* 新2: 画面まるごと横切る水平線にしちゃう
.page-list-item.grid-style-item.pin:nth-child(10) {
width: 100%;
height: 0px;
border-top: 1px solid #ddd; margin-top: 20px;
margin-bottom: 30px;
}
*/
「私の植物」で始まるページに🌱を追加
code:style.css
content: '🌱 ';
}
「はじめに」のfaviconを隠す
code:style.css
.page-list > ul.grid > li.page-list-item.grid-style-item.pin:first-child .icon {
display: none;
}
セルの上空白を消す
code:style.css
.grid li.page-list-item a .header {
border: 0;
}
背景色
code:style.css
body {
}
.grid li.page-list-item a .pin {
}
ページ内の記法を増やす
吹き出し
code:style.css
.deco-\{, .deco-\} {
font-size: 1em;
padding: 0.3em 0.2em 0.3em 0.2em;
border-radius: 0.4em;
margin: auto 0.3em;
display: inline-block;
max-width: calc(100% - 100px);
vertical-align: top;
}
左吹き出し
code:style.css
.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;
}
右吹き出し
code:style.css
.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;
}
水平線をクリックできなくする
code:style.css
pointer-events: none;
}
特定ページへのリンクはコード記法っぽい見た目にする
code:style.css
/* 見た目を近づける */
{
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
padding: 0 8px 0 8px;
font-size: 90%;
background-color: rgba(0,0,0,0.04);
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
white-space: pre-wrap;
word-wrap: break-word;
border-radius: 4px;
}
/* 編集時にガタッとなるのを避ける */
{
padding: 0;
background-color: transparent;
}
プロジェクトオーナーだけが適用されるCSS
自分だけが読み込むCSS群を指定
code:only-me.css
/akiroom/akix に書かれたCSS読み込みのcode:style.cssの4行を非表示にする
code:style.css
display: none;
}
/* */
勝手に適当なアイコンを割り当てる
code:katte-icons.css
display: inline-block;
margin-right: 6px;
width: 18px;
height: 18px;
background: no-repeat center/contain;
}
opacity: .5;
}
/* Copy URL */
content: ' ';
}
/* Copy TwitterURL */
content: ' ';
}
/* --- */
/* Drawing */
content: ' ';
}
/* Duplicate page */
content: ' ';
}
/* Pin at home */
content: ' ';
}
/* --- */
/* Start presentation */
content: ' ';
}
/* Hide dots */
content: ' ';
}
/* History */
content: ' ';
}
code:$.shはCLI用のインライナーとみなして$記号を付与してファイルアクセスを隠す
code:style.css
position: relative;
}
display: none;
}
content: "$";
position: absolute;
left: 0.5em;
top: 1.6em;
}