Settings
https://gyazo.com/12ee85889cde6dc67d4ec58c38d0f95b
Body
code:style.css
body {
background-color: #eee;
}
.stream h1 {
background-color: #eee;
}
Navbar
code:style.css
.navbar-default {
background-color: #333;
padding: 2px 0 4px;
}
Button
code:style.css
.new-button {
background-color: #6C6263;
}
data-hover-visible .new-button:hover {
background-color: #6C6263;
filter: brightness(1.2);
}
Page List Item
code:style.css
.grid li.page-list-item a .title {
height: 60px;
}
.grid li.page-list-item a .pin {
background: linear-gradient(45deg, #ccc, #ccc 50%, #eee 50%, #eee);
}
Relation Label
code:style.css
.related-page-list li.relation-label a {
background-color: #f12b00;
}
.related-page-list li.relation-label .arrow {
border-left-color: #f12b00;
}
.related-page-list li.relation-label.links a {
background-color: #ad002d;
}
.related-page-list li.relation-label.links .arrow {
border-left-color: #ad002d;
}
.related-page-list li.relation-label.empty-links a {
background-color: #999;
}
.related-page-list li.relation-label.empty-links .arrow {
border-left-color: #999;
}
Quote
code:style.css
.line .quote {
padding-left: 16px;
color: #999;
background-color: #fff;
border-left: solid 4px #ccc;
}
Link
code:style.css
a, a.link, a.page-link {
color: #ad002d;
}
data-hover-visible a:hover {
color: #ad002d;
text-decoration: underline;
}
.line a.link img.image {
border-color: #ad002d;
}
.line a.link img.image:hover {
border-color: #ad002d;
}
.page-list-item .description .link {
color: #ad002d;
}
.page-list-item .description .page-link {
color: #ad002d;
}
.stream .page .link {
color: #ad002d;
}
.stream .page .page-link {
color: #ad002d;
}
Hashtag
code:style.css
atype="hashTag" {
padding: 0.2em 0.4em;
font-size: 0.8em;
color: #fff !important;
background-color: #ad002d;
border-radius: 0.2em;
}
List
code:style.css
.line .indent-mark .dot {
top: 12px;
width: 6px;
height: 4px;
background-color: #ccc;
border-radius: 0;
}
Table
code:style.css
.table-block .table-block-start {
padding: 2px 4px;
background-color: #ad002d;
}
.table-block .table-block-start a {
color: #fff;
}
.table-block .table-block-start code {
color: #fff;
}
Cursor
ref. カーソルをカスタマイズ
code:style.css
.cursor {
width: 3px;
background-color: rgba(192,192,192,.5);
animation: blink 1s infinite;
}
.cursor svg {
display: none;
}
@keyframes blink {
0% { opacity: 0 }
49% { opacity: 0 }
50% { opacity: 1 }
}
Code
code:style.css
.line code.code {
padding: 4px 0;
font-size: 0.8em;
}
.line span.code-block .code-block-start {
padding: 2px 4px;
background-color: #ad002d;
}
.line span.code-block .code-block-start a {
color: #fff;
}
.line span.code-block .code-block-start code {
color: #fff;
}
.line span.code-block .code-block-start span {
color: #fff;
}
.page-list-item .description code {
padding: 4px;
font-size: 0.8em;
color: #ad002d;
}
.stream .line code.code {
padding: 4px;
}
.stream span.code-block .code-block-start code {
background-color: #ad002d;
}
highlight.js
ref. https://github.com/isagalaev/highlight.js/blob/master/src/styles/googlecode.css
code:style.css
/*
Google Code style (c) Aahan Krish <geekpanth3r@gmail.com>
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: white;
color: black;
}
.hljs-comment,
.hljs-quote {
color: #800;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-section,
.hljs-title,
.hljs-name {
color: #008;
}
.hljs-variable,
.hljs-template-variable {
color: #660;
}
.hljs-string,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-regexp {
color: #080;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-meta,
.hljs-number,
.hljs-link {
color: #066;
}
.hljs-title,
.hljs-doctag,
.hljs-type,
.hljs-attr,
.hljs-built_in,
.hljs-builtin-name,
.hljs-params {
color: #606;
}
.hljs-attribute,
.hljs-subst {
color: #000;
}
.hljs-formula {
background-color: #eee;
font-style: italic;
}
.hljs-selector-id,
.hljs-selector-class {
color: #9B703F;
}
.hljs-addition {
background-color: #baeeba;
}
.hljs-deletion {
background-color: #ffc8bd;
}
.hljs-doctag,
.hljs-strong {
font-weight: bold;
}
.hljs-emphasis {
font-style: italic;
}