13,002
回編集
編集の要約なし |
編集の要約なし |
||
267行目: | 267行目: | ||
} | } | ||
/* | /* モダンな目次のスタイル */ | ||
#toc, | #toc, | ||
.toc { | .toc { | ||
border: | border: none; | ||
background: linear-gradient(135deg, | background: linear-gradient(135deg, | ||
# | #f8f9fa 0%, | ||
# | #ffffff 100% | ||
); | ); | ||
padding: | padding: 1.5rem; | ||
margin: | margin: 1.5rem 0; | ||
border-radius: | border-radius: 12px; | ||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05); | |||
} | } | ||
/* 目次のタイトル */ | /* 目次のタイトル */ | ||
.toc-title { | .toc-title { | ||
color: # | color: #2d3748; | ||
font-weight: | font-weight: 600; | ||
font-size: 1.25rem; | |||
margin-bottom: 1rem; | |||
} | |||
/* 目次の項目コンテナ */ | |||
.toc ul { | |||
background-color: transparent; | |||
padding: 0.5rem 0; | |||
margin: 0; | |||
list-style-type: none; | |||
} | } | ||
/* 目次の項目 */ | /* 目次の項目 */ | ||
.toc | .toc li { | ||
margin: 0.5rem 0; | |||
padding: | padding: 0.25rem 0; | ||
transition: all 0.2s ease; | |||
} | } | ||
/* | /* リンクの基本スタイル */ | ||
.toc a { | .toc a { | ||
color: # | color: #4a5568; | ||
text-decoration: none; | text-decoration: none; | ||
display: block; | |||
padding: 0.5rem 1rem; | |||
border-radius: 6px; | |||
transition: all 0.2s ease; | |||
} | } | ||
/* | /* ホバー時のスタイル */ | ||
.toc a:hover { | .toc a:hover { | ||
color: # | color: #2b6cb0; | ||
background-color: #ebf4ff; | |||
transform: translateX(4px); | |||
border: | border: none; | ||
padding: | padding: 0.5rem 1rem; | ||
} | } | ||
/* 目次の番号 */ | /* 目次の番号 */ | ||
.toc-number { | .toc-number { | ||
color: # | color: #2b6cb0; | ||
font-weight: | font-weight: 500; | ||
margin-right: 0.5rem; | |||
} | } | ||
/* 非表示ボタン */ | /* 非表示ボタン */ | ||
.toc .toctoggle { | .toc .toctoggle { | ||
color: # | color: #4a5568; | ||
background-color: #f7fafc; | |||
padding: 0.25rem 0.5rem; | |||
border-radius: 4px; | |||
font-size: 0.875rem; | |||
} | |||
/* ネストされた項目のインデント */ | |||
.toc ul ul { | |||
margin-left: 1.5rem; | |||
} | |||
/* アクティブな項目 */ | |||
.toc a:active { | |||
color: #2c5282; | |||
background-color: #bee3f8; | |||
} | } | ||