MinimalUserCSS
code:style.css
/* =========================
0) 既存：インデント色
========================= */
@import "/api/code/shio/indentcolors/style.css";
@media screen {
.quick-launch .title { color: #fff; }
.grid-size-range { display: none !important; }
.project-home { font-size: 1.4em !important; }
.kamon.kamon-caret-down { display: none !important; }
.random-jump-button, .dropdown-toggle { color: #DDDDDD !important; }
a.bidirectional-page-link { display: none; }
}
/* =========================
1) ベース
========================= */
body { background: #fff; }
:root{
--serif-stack:
"Adobe Garamond Pro", "Garamond", "Times New Roman",
"游教科書体 横用", "游教科書体", "游教科書体 横用 ミディアム", "YuKyo_Yoko-Medium",
"UD デジタル 教科書体", "UDデジタル教科書体",
"ヒラギノ明朝 ProN", "Hiragino Mincho ProN",
"YuMincho", "Yu Mincho",
serif;
--ui-stack:
system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
}
/* UI（本文以外）＝ system-ui */
.stream, li.page-list-item, .navbar, .sidebar{
font-family: var(--ui-stack) !important;
color:#000;
}
/* 本文（ページ）＝ 教科書体優先 + Garamond系 + 明朝fallback */
.page, .page .lines, .page .line,
.editor .page, .editor .lines, .editor .line{
font-family: var(--serif-stack);
}
/* =========================
2) ナビバー／カード周り
========================= */
.grid li.page-list-item a { box-shadow: 0 1px 0 rgba(0,0,0,0); }
ul.grid li.page-list-item a .header,
ul.grid-md.grid li.page-list-item a .header { border-top: 0; }
ul.grid-lg.grid li.page-list-item a .header { border-top: 1px solid #555; }
.grid li.page-list-item a:hover { box-shadow: none; }
.page-list-item .description img.inline-icon { width: 100%; height: 100%; }
form { border: 0; }
/* =========================
5) 角丸 & hover
========================= */
.page,
.grid li.page-list-item a,
.grid.grid-md li.page-list-item a,
.grid.grid-lg li.page-list-item a { border-radius: 15px; }
.grid li.page-list-item a .header {
position: absolute;
bottom: 0;
z-index: 1;
background: rgba(240,240,240,0.9);
border-top: 1px;
}
.grid li.page-list-item a .icon img { position: absolute; top: 0; left: 0; }
.grid li.page-list-item a:hover { border-radius: 10px; box-shadow: 0 0 0 4px #729FCF; }
.container { max-width: none; }
/* =========================
6) カーソル
========================= */
.cursor { width: 3px; background: #000; }
/* =========================
8) 吹き出し
========================= */
.deco-\{, .deco-\} {
font-size: 1em; color: #fff; background: #a2acaa;
padding: 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; transform: translateX(-100%) translateY(calc(1em - 80%));
width: 0; content: "";
border-width: 0 0 0.6em 0.6em; border-style: solid; border-color: #a2acaa transparent;
}
.deco-\}:after {
position: absolute; transform: translateY(calc(1em - 80%));
width: 0; content: "";
border-width: 0 0.6em 0.6em 0; border-style: solid; border-color: #a2acaa transparent;
}
.deco-\!:before, .deco-\!:after { border-color: #ee6666 transparent; }
.deco-\{ a, .deco-\} a { color: #66F; }
/* =========================
9) マーカー／強調／注記
========================= */
.line strong:not(class) { color: #0a0705; background: linear-gradient(#fff 30%, #00ff01 80%); }
.line strong { color: #ff6faf; }
.deco-\# { color: #0a0705; background: linear-gradient(#fff 60%, #ff0 99%); }
.deco-\! { color: #fff; background: #ee6666; padding: 0.1em 0.2em; }
/* 位置揃え */
.deco-\< { position: absolute; width: 100%; text-align: center; }
.deco-\> { position: absolute; width: 100%; text-align: right; }
/* ドット */
.line .indent-mark .dot { top: 11px; width: 6px; height: 3px; background: #8888aa; }
/* 丸で囲む */
.line class="deco-\( deco-\)" {
display: inline-block; border-radius: 50%; border: .05em solid #f40;
min-width: 1em; padding: .1em; vertical-align: text-bottom; line-height: 1;
color: #f40; font-weight: 600;
}
/* =========================
10) テーブル
========================= */
.table-block .cell { border-right: 1px solid #fff; border-bottom: 1px solid #ddd; }
.table-block .cell:first-child { border-left: 1px solid #fff; }
.section-title + .line .table-block .cell { border-top: 1px solid #fff; font-weight: bolder; text-align: center; }
/* =========================
12) タイポグラフィ（タイトル1行目は触らない）
========================= */
.page .line { line-height: 1.85; letter-spacing: 0.00em; }
/* セクション見出しは“軽く”上品に（サイズは変えない） */
.page .line:has(.section-title) { font-weight: 500; letter-spacing: 0.015em; }
/* 引用は上品に（1回だけ定義） */
.line .quote {
font-style: normal;
padding: 0.25em 0.8em;
border-left: 3px solid #ff6faf30;
background: #fffafb;
margin: 0.4em 0;
}
/* 箇条書き */
.page .linedata-indent="1" { margin-left: 0.6em; }
.page .linedata-indent="2" { margin-left: 1.2em; }
/* Safariだけ微調整（入れるなら末尾） */
@supports (-webkit-touch-callout: none) {
.page, .page .line { font-weight: 400; letter-spacing: -0.00em; line-height: 1.9; }
}
/* =========================
ヘッダのプロジェクト名だけ serif（教科書体＋Garamond）
========================= */
.project-home, .project-home *,
.quick-launch .title, .quick-launch .title *{
font-family: var(--serif-stack) !important;
}
/* =========================================
A) トップページ（一覧）の文字を本文フォントにする
（UI全体はゴシックのまま）
========================================= */
/* 一覧の「ページタイトル」「説明文」だけ本文フォント */
.stream li.page-list-item a .title,
.stream li.page-list-item a .description,
.grid li.page-list-item a .title,
.grid li.page-list-item a .description,
li.page-list-item a .title,
li.page-list-item a .description{
font-family: var(--serif-stack) !important;
letter-spacing: 0.01em;
}
/* =========================================
B) 未確定文字列（IME変換中）にも本文フォントを効かせる
========================================= */
/* エディタ領域そのもの + 入力系に直接指定 */
.editor,
.editor contenteditable="true",
.editor textarea,
.editor input{
color:#000;
font-family: var(--serif-stack) !important;
}
/* UI も子要素まで強制的に本文フォントへ */
.navbar, .navbar *,
.navbar-default, .navbar-default *,
.sidebar, .sidebar *,
.stream, .stream *,
li.page-list-item, li.page-list-item *{
font-family: var(--serif-stack) !important;
}
https://gyazo.com/602c342332ed7ac92be9be7fbdac607fhttps://gyazo.com/d3db3b111dbb57afbcc6b220c4f6d4f5
インポート構文
code:style.css
@import "/api/code/shio/MinimalUserCSS/style.css";