tipitaka.css 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875
  1. /* resources/css/modules/_tipitaka.css
  2. Tipitaka 栏目专属样式。
  3. 来源:book-list.blade.php / book-item.blade.php 内联样式提取,
  4. 去除 CDN 引入,风格与 wiki 对齐。
  5. */
  6. /* ══════════════════════════════════════════
  7. 一、书籍卡片(.card-book)
  8. 纵向:封面上 + 信息下
  9. ══════════════════════════════════════════ */
  10. .card-book {
  11. transition:
  12. transform 0.2s,
  13. box-shadow 0.2s;
  14. }
  15. .card-book:hover {
  16. transform: translateY(-2px);
  17. box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  18. }
  19. .card-book__link {
  20. display: block;
  21. text-decoration: none;
  22. color: inherit;
  23. }
  24. .card-book__link:hover {
  25. text-decoration: none;
  26. color: inherit;
  27. }
  28. /* 封面:撑满卡片宽度 */
  29. .card-book .book-cover--md {
  30. width: 100%;
  31. min-width: unset;
  32. height: 200px;
  33. border-radius: var(--tblr-border-radius);
  34. }
  35. @media (max-width: 768px) {
  36. .card-book .book-cover--md {
  37. height: 150px;
  38. }
  39. }
  40. /* 信息区 */
  41. .card-book__info {
  42. padding: 0.75rem 0 0;
  43. }
  44. .card-book__title {
  45. font-size: 0.9375rem;
  46. font-weight: 600;
  47. color: var(--tblr-body-color);
  48. margin-bottom: 0.25rem;
  49. line-height: 1.4;
  50. display: -webkit-box;
  51. -webkit-line-clamp: 2;
  52. -webkit-box-orient: vertical;
  53. overflow: hidden;
  54. }
  55. .card-book:hover .card-book__title {
  56. color: var(--tblr-primary);
  57. }
  58. .card-book__author {
  59. font-size: 0.8125rem;
  60. color: var(--tblr-secondary);
  61. margin-bottom: 0.25rem;
  62. }
  63. .card-book__publisher {
  64. font-size: 0.8125rem;
  65. color: var(--tblr-secondary);
  66. margin-bottom: 0.375rem;
  67. }
  68. .card-book__publisher-link {
  69. color: var(--tblr-primary);
  70. text-decoration: none;
  71. }
  72. .card-book__publisher-link:hover {
  73. text-decoration: underline;
  74. }
  75. .card-book__badges {
  76. display: flex;
  77. flex-wrap: wrap;
  78. gap: 4px;
  79. margin-top: 0.375rem;
  80. }
  81. .card-book__badge {
  82. display: inline-block;
  83. padding: 2px 8px;
  84. background: var(--tblr-bg-surface-secondary);
  85. border: 1px solid var(--tblr-border-color);
  86. border-radius: 20px;
  87. font-size: 0.6875rem;
  88. color: var(--tblr-secondary);
  89. }
  90. /* ══════════════════════════════════════════
  91. 二、书籍网格(.book-grid)
  92. ══════════════════════════════════════════ */
  93. .book-grid {
  94. display: grid;
  95. grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  96. gap: 1.25rem;
  97. }
  98. @media (max-width: 575px) {
  99. .book-grid {
  100. grid-template-columns: repeat(2, 1fr);
  101. gap: 0.875rem;
  102. }
  103. }
  104. /* ══════════════════════════════════════════
  105. 三、show 页 — 文字截断
  106. ══════════════════════════════════════════ */
  107. .line2 {
  108. display: -webkit-box;
  109. -webkit-line-clamp: 2;
  110. -webkit-box-orient: vertical;
  111. overflow: hidden;
  112. text-overflow: ellipsis;
  113. }
  114. /* ══════════════════════════════════════════
  115. 四、子分类网格
  116. ══════════════════════════════════════════ */
  117. .tipitaka-sub-grid {
  118. display: grid;
  119. grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  120. gap: 8px;
  121. }
  122. /* ══════════════════════════════════════════
  123. 五、过滤器区
  124. ══════════════════════════════════════════ */
  125. .tipitaka-filters {
  126. display: flex;
  127. flex-direction: column;
  128. gap: 0.875rem;
  129. }
  130. .tipitaka-filter-row {
  131. display: flex;
  132. align-items: flex-start;
  133. gap: 0.75rem;
  134. }
  135. .tipitaka-filter-label {
  136. font-size: 0.75rem;
  137. font-weight: 500;
  138. color: var(--tblr-secondary);
  139. white-space: nowrap;
  140. padding-top: 4px;
  141. min-width: 2.5rem;
  142. }
  143. .tipitaka-filter-pills {
  144. display: flex;
  145. flex-wrap: wrap;
  146. gap: 6px;
  147. flex: 1;
  148. }
  149. .tipitaka-pill {
  150. display: inline-flex;
  151. align-items: center;
  152. gap: 4px;
  153. font-size: 0.8125rem;
  154. padding: 3px 10px;
  155. border-radius: 20px;
  156. border: 1px solid var(--tblr-border-color);
  157. color: var(--tblr-body-color);
  158. background: var(--tblr-bg-surface);
  159. text-decoration: none;
  160. transition:
  161. background 0.12s,
  162. border-color 0.12s,
  163. color 0.12s;
  164. white-space: nowrap;
  165. }
  166. .tipitaka-pill:hover {
  167. background: var(--tblr-bg-surface-secondary);
  168. border-color: var(--tblr-border-color-dark, #adb5bd);
  169. color: var(--tblr-body-color);
  170. text-decoration: none;
  171. }
  172. .tipitaka-pill--active {
  173. background: var(--tblr-primary);
  174. border-color: var(--tblr-primary);
  175. color: #fff;
  176. pointer-events: none;
  177. }
  178. .tipitaka-pill--active:hover {
  179. background: var(--tblr-primary);
  180. color: #fff;
  181. }
  182. .tipitaka-pill-count {
  183. font-size: 0.6875rem;
  184. opacity: 0.75;
  185. }
  186. .tipitaka-author-select {
  187. max-width: 220px;
  188. }
  189. .tipitaka-filter-clear {
  190. display: flex;
  191. justify-content: flex-end;
  192. padding-top: 0.25rem;
  193. border-top: 1px solid var(--tblr-border-color);
  194. }
  195. .tipitaka-clear-btn {
  196. font-size: 0.75rem;
  197. color: var(--tblr-secondary);
  198. text-decoration: none;
  199. display: inline-flex;
  200. align-items: center;
  201. gap: 4px;
  202. transition: color 0.12s;
  203. }
  204. .tipitaka-clear-btn:hover {
  205. color: var(--tblr-danger);
  206. }
  207. /* ══════════════════════════════════════════
  208. 六、排序栏
  209. ══════════════════════════════════════════ */
  210. .tipitaka-sort-bar {
  211. display: flex;
  212. align-items: center;
  213. justify-content: space-between;
  214. padding: 0 0.25rem;
  215. }
  216. .tipitaka-sort-bar__count {
  217. font-size: 0.8125rem;
  218. color: var(--tblr-secondary);
  219. }
  220. .tipitaka-sort-bar__count strong {
  221. color: var(--tblr-body-color);
  222. font-weight: 500;
  223. }
  224. .tipitaka-sort-bar__right {
  225. display: flex;
  226. align-items: center;
  227. gap: 0.5rem;
  228. }
  229. .tipitaka-sort-bar__label {
  230. font-size: 0.8125rem;
  231. color: var(--tblr-secondary);
  232. white-space: nowrap;
  233. }
  234. .tipitaka-sort-select {
  235. width: auto;
  236. min-width: 80px;
  237. }
  238. /* ══════════════════════════════════════════
  239. 七、活跃译者列表
  240. ══════════════════════════════════════════ */
  241. .tipitaka-author-list {
  242. list-style: none;
  243. padding: 0;
  244. margin: 0;
  245. }
  246. .tipitaka-author-list li {
  247. border-bottom: 1px solid var(--tblr-border-color);
  248. }
  249. .tipitaka-author-list li:last-child {
  250. border-bottom: none;
  251. }
  252. .tipitaka-author-item {
  253. display: flex;
  254. align-items: center;
  255. gap: 0.625rem;
  256. padding: 6px 0;
  257. text-decoration: none;
  258. color: inherit;
  259. transition: background 0.12s;
  260. }
  261. .tipitaka-author-item:hover {
  262. color: var(--tblr-primary);
  263. text-decoration: none;
  264. }
  265. .tipitaka-author-item__info {
  266. display: flex;
  267. flex-direction: column;
  268. min-width: 0;
  269. }
  270. .tipitaka-author-item__name {
  271. font-size: 0.8125rem;
  272. font-weight: 500;
  273. color: var(--tblr-body-color);
  274. white-space: nowrap;
  275. overflow: hidden;
  276. text-overflow: ellipsis;
  277. }
  278. .tipitaka-author-item:hover .tipitaka-author-item__name {
  279. color: var(--tblr-primary);
  280. }
  281. .tipitaka-author-item__count {
  282. font-size: 0.6875rem;
  283. color: var(--tblr-secondary);
  284. }
  285. /* ══════════════════════════════════════════
  286. 八、响应式
  287. ══════════════════════════════════════════ */
  288. @media (max-width: 768px) {
  289. /* 过滤器:label 和 pills 垂直排列 */
  290. .tipitaka-filter-row {
  291. flex-direction: column;
  292. gap: 0.375rem;
  293. }
  294. .tipitaka-filter-label {
  295. padding-top: 0;
  296. }
  297. /* 作者下拉撑满 */
  298. .tipitaka-author-select {
  299. max-width: 100%;
  300. width: 100%;
  301. }
  302. }
  303. /* 目录项布局 */
  304. .toc-item {
  305. display: flex;
  306. flex-direction: column; /* 默认:手机上下 */
  307. gap: 0.4rem;
  308. }
  309. /* 标题 */
  310. .toc-title {
  311. font-size: 0.95rem;
  312. }
  313. /* 进度区 */
  314. .toc-progress {
  315. display: flex;
  316. align-items: center;
  317. gap: 0.5rem;
  318. }
  319. /* 百分比 */
  320. .toc-progress-text {
  321. font-size: 0.7rem;
  322. color: var(--tblr-secondary);
  323. white-space: nowrap;
  324. }
  325. /* ≥ md(平板/桌面):左右分布 */
  326. @media (min-width: 768px) {
  327. .toc-item {
  328. flex-direction: row;
  329. align-items: center;
  330. }
  331. .toc-title {
  332. flex: 1;
  333. }
  334. .toc-progress {
  335. width: 140px;
  336. }
  337. }
  338. /* ══════════════════════════════════════════
  339. 子分类网格
  340. ══════════════════════════════════════════ */
  341. .tipitaka-subcategory-grid {
  342. display: grid;
  343. grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  344. gap: 8px;
  345. padding: 4px 0;
  346. }
  347. .tipitaka-subcategory-item {
  348. display: flex;
  349. flex-direction: column;
  350. align-items: center;
  351. gap: 8px;
  352. padding: 16px 12px;
  353. border-radius: var(--tblr-border-radius);
  354. text-decoration: none;
  355. color: var(--tblr-body-color);
  356. border: 1px solid transparent;
  357. transition:
  358. background 0.15s,
  359. border-color 0.15s;
  360. }
  361. .tipitaka-subcategory-item:hover {
  362. background: var(--tblr-bg-surface-secondary);
  363. border-color: var(--tblr-border-color);
  364. text-decoration: none;
  365. color: var(--tblr-body-color);
  366. }
  367. .tipitaka-subcategory-icon {
  368. font-size: 40px;
  369. color: var(--tblr-secondary);
  370. line-height: 1;
  371. }
  372. .tipitaka-subcategory-item:hover .tipitaka-subcategory-icon {
  373. color: var(--tblr-body-color);
  374. }
  375. .tipitaka-subcategory-name {
  376. font-size: 0.8125rem;
  377. text-align: center;
  378. line-height: 1.4;
  379. color: var(--tblr-secondary);
  380. }
  381. /* ══════════════════════════════════════════
  382. 两栏(无右边栏):channel 列表 / channel 作品列表
  383. ══════════════════════════════════════════ */
  384. .wiki-layout--two {
  385. grid-template-columns: 200px 1fr;
  386. grid-template-areas: 'left main';
  387. }
  388. @media (max-width: 768px) {
  389. .wiki-layout--two {
  390. grid-template-columns: 1fr;
  391. grid-template-areas: 'main' 'left';
  392. }
  393. }
  394. /* ══════════════════════════════════════════
  395. 进度条(x-ui.progress-bar)
  396. ══════════════════════════════════════════ */
  397. .ui-progress {
  398. display: flex;
  399. align-items: center;
  400. gap: 0.4rem;
  401. min-width: 0;
  402. }
  403. .ui-progress__bar {
  404. flex: 1;
  405. height: 6px;
  406. }
  407. .ui-progress__label {
  408. font-size: 0.7rem;
  409. color: var(--tblr-secondary);
  410. white-space: nowrap;
  411. min-width: 2.2em;
  412. text-align: right;
  413. }
  414. .card-book__progress {
  415. margin-top: 0.4rem;
  416. }
  417. .tipitaka-toc-summary {
  418. font-size: 0.75rem;
  419. color: var(--tblr-secondary);
  420. margin-left: 0.5rem;
  421. }
  422. .wiki-toc-list .toc-disabled .toc-title {
  423. color: var(--tblr-disabled-color, #aab);
  424. }
  425. .tipitaka-work-pali {
  426. color: var(--tblr-secondary);
  427. font-size: 0.875rem;
  428. }
  429. .tipitaka-pager {
  430. display: flex;
  431. justify-content: center;
  432. margin-top: 1rem;
  433. }
  434. /* ══════════════════════════════════════════
  435. 译本:首页磁贴 / 列表行 / channel 页头
  436. ══════════════════════════════════════════ */
  437. .tipitaka-channel-tiles {
  438. display: grid;
  439. grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  440. gap: 0.75rem;
  441. }
  442. .tipitaka-channel-tile,
  443. .tipitaka-channel-row {
  444. display: flex;
  445. align-items: center;
  446. gap: 0.75rem;
  447. color: var(--tblr-body-color);
  448. text-decoration: none;
  449. }
  450. .tipitaka-channel-tile {
  451. padding: 0.7rem 0.8rem;
  452. border: 1px solid var(--tblr-border-color);
  453. border-radius: var(--tblr-border-radius);
  454. background: var(--tblr-bg-surface);
  455. }
  456. .tipitaka-channel-tile:hover {
  457. border-color: var(--tblr-primary);
  458. text-decoration: none;
  459. }
  460. .tipitaka-channel-tile__info,
  461. .tipitaka-channel-row__info {
  462. display: flex;
  463. flex-direction: column;
  464. min-width: 0;
  465. flex: 1;
  466. }
  467. .tipitaka-channel-tile__name,
  468. .tipitaka-channel-row__name {
  469. font-weight: 600;
  470. overflow: hidden;
  471. text-overflow: ellipsis;
  472. white-space: nowrap;
  473. }
  474. .tipitaka-channel-tile__meta,
  475. .tipitaka-channel-row__meta,
  476. .tipitaka-channel-row__count {
  477. font-size: 0.75rem;
  478. color: var(--tblr-secondary);
  479. }
  480. .tipitaka-channel-row {
  481. padding: 0.65rem 0.25rem;
  482. border-bottom: 1px solid var(--tblr-border-color);
  483. }
  484. .tipitaka-channel-row:last-child {
  485. border-bottom: 0;
  486. }
  487. .tipitaka-channel-row:hover {
  488. background: var(--tblr-bg-surface-secondary);
  489. text-decoration: none;
  490. }
  491. .tipitaka-channel-head {
  492. margin-top: 1.5rem;
  493. }
  494. .tipitaka-channel-head__main {
  495. display: flex;
  496. align-items: center;
  497. gap: 1rem;
  498. }
  499. .tipitaka-channel-head__name {
  500. margin: 0;
  501. font-size: 1.35rem;
  502. }
  503. .tipitaka-channel-head__meta {
  504. font-size: 0.8125rem;
  505. color: var(--tblr-secondary);
  506. }
  507. .tipitaka-channel-tabs {
  508. display: flex;
  509. gap: 1.25rem;
  510. border-bottom: 1px solid var(--tblr-border-color);
  511. margin-top: 1rem;
  512. }
  513. .tipitaka-channel-tabs a {
  514. padding: 0.5rem 0;
  515. color: var(--tblr-secondary);
  516. border-bottom: 2px solid transparent;
  517. text-decoration: none;
  518. }
  519. .tipitaka-channel-tabs a.active {
  520. color: var(--tblr-primary);
  521. border-color: var(--tblr-primary);
  522. font-weight: 600;
  523. }
  524. /* ══════════════════════════════════════════
  525. channel 分类目录树(参考 documents/tipitaka_org.html)
  526. ══════════════════════════════════════════ */
  527. .tipitaka-tree-bar {
  528. display: flex;
  529. flex-wrap: wrap;
  530. gap: 0.5rem;
  531. align-items: center;
  532. justify-content: space-between;
  533. margin: 1rem 0 0;
  534. }
  535. .tipitaka-tree-bar__actions {
  536. display: flex;
  537. flex-wrap: wrap;
  538. gap: 0.5rem;
  539. }
  540. .tipitaka-tree {
  541. padding: 1rem 0 3rem;
  542. }
  543. .tipitaka-tree ul {
  544. list-style: none;
  545. margin: 0;
  546. padding-left: 26px;
  547. }
  548. .tipitaka-tree ul.tipitaka-tree__root {
  549. padding-left: 0;
  550. }
  551. .tipitaka-tree li[data-node] {
  552. position: relative;
  553. margin: 8px 0;
  554. }
  555. .tipitaka-tree ul ul > li[data-node]::before {
  556. content: '';
  557. position: absolute;
  558. left: -16px;
  559. top: 0;
  560. bottom: -8px;
  561. border-left: 1px solid var(--tblr-border-color);
  562. }
  563. .tipitaka-tree ul ul > li[data-node]:last-child::before {
  564. bottom: auto;
  565. height: 22px;
  566. }
  567. .tipitaka-tree ul ul > li[data-node]::after {
  568. content: '';
  569. position: absolute;
  570. left: -16px;
  571. top: 22px;
  572. width: 14px;
  573. border-top: 1px solid var(--tblr-border-color);
  574. }
  575. .tipitaka-tree__node {
  576. display: inline-flex;
  577. align-items: center;
  578. flex-wrap: wrap;
  579. gap: 10px;
  580. padding: 7px 12px;
  581. border-radius: 8px;
  582. border: 1px solid var(--tblr-border-color);
  583. background: var(--tblr-bg-surface);
  584. }
  585. .tipitaka-tree__toggle {
  586. width: 20px;
  587. height: 20px;
  588. padding: 0;
  589. border: 0;
  590. background: none;
  591. color: var(--tblr-secondary);
  592. font-size: 12px;
  593. cursor: pointer;
  594. }
  595. .tipitaka-tree__name {
  596. font-weight: 700;
  597. }
  598. .tipitaka-tree__count {
  599. font-size: 12px;
  600. color: var(--tblr-secondary);
  601. }
  602. .tipitaka-tree__progress {
  603. width: 110px;
  604. }
  605. .tipitaka-tree__level-0 > .tipitaka-tree__node {
  606. background: var(--tblr-dark, #1d273b);
  607. border-color: var(--tblr-dark, #1d273b);
  608. color: #fff;
  609. }
  610. .tipitaka-tree__level-0 > .tipitaka-tree__node .tipitaka-tree__toggle,
  611. .tipitaka-tree__level-0 > .tipitaka-tree__node .tipitaka-tree__count,
  612. .tipitaka-tree__level-0 > .tipitaka-tree__node .ui-progress__label {
  613. color: #cfd6e0;
  614. }
  615. .tipitaka-tree__level-1 > .tipitaka-tree__node {
  616. background: #f3e2c7;
  617. border-color: #c4761c;
  618. }
  619. .tipitaka-tree__level-2 > .tipitaka-tree__node {
  620. background: var(--tblr-primary-lt, #e8f0fa);
  621. border-color: var(--tblr-primary);
  622. }
  623. .tipitaka-tree__cards {
  624. display: grid;
  625. grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  626. gap: 10px;
  627. padding: 8px 0 4px 26px;
  628. }
  629. .tipitaka-tree__root > li > .tipitaka-tree__cards:only-of-type {
  630. padding-left: 0;
  631. }
  632. .tipitaka-tree__card {
  633. background: var(--tblr-bg-surface);
  634. border: 1px solid var(--tblr-border-color);
  635. border-radius: 8px;
  636. padding: 8px 12px;
  637. }
  638. .tipitaka-tree__card-title {
  639. font-weight: 600;
  640. font-size: 13px;
  641. margin-bottom: 4px;
  642. }
  643. .tipitaka-tree__card ol {
  644. margin: 0;
  645. padding: 0;
  646. list-style: none;
  647. }
  648. .tipitaka-tree__card li {
  649. border-top: 1px dotted var(--tblr-border-color);
  650. }
  651. .tipitaka-tree__card li:first-child {
  652. border-top: 0;
  653. }
  654. .tipitaka-tree__work {
  655. display: flex;
  656. align-items: center;
  657. gap: 0.5rem;
  658. padding: 4px 0;
  659. font-size: 13px;
  660. color: var(--tblr-body-color);
  661. text-decoration: none;
  662. }
  663. a.tipitaka-tree__work:hover {
  664. color: var(--tblr-primary);
  665. text-decoration: none;
  666. }
  667. .tipitaka-tree__work-title {
  668. flex: 1;
  669. min-width: 0;
  670. overflow-wrap: anywhere;
  671. }
  672. .tipitaka-tree__work-progress {
  673. width: 90px;
  674. flex: none;
  675. }
  676. .tipitaka-tree__card li.is-missing .tipitaka-tree__work {
  677. color: var(--tblr-disabled-color, #aab);
  678. }
  679. .tipitaka-tree__work-missing {
  680. font-size: 11px;
  681. }
  682. .tipitaka-tree li.collapsed > ul,
  683. .tipitaka-tree li.collapsed > .tipitaka-tree__cards {
  684. display: none;
  685. }
  686. /* ══════════════════════════════════════════
  687. 三藏首页 hero:底图是深色檀木(hero-tipitaka.jpg),
  688. Tabler 给 h1 单独设了标题色,会盖掉 .hero-content 继承的白色,这里显式改回白字
  689. ══════════════════════════════════════════ */
  690. .hero-section--dark .hero-title,
  691. .hero-section--dark .hero-subtitle {
  692. color: #fff;
  693. }
  694. .tipitaka-channel-row__progress {
  695. width: 140px;
  696. flex: none;
  697. }
  698. /* 分类页左栏:顶级加粗;当前路径上的祖先加粗;下一级字号更小、颜色更浅、缩进并带竖线与圆点 */
  699. .tipitaka-side-tree > li > a {
  700. font-weight: 600;
  701. }
  702. /* 叠两个类:.wiki-cat-list 的 margin/padding: 0 加载在后,同优先级会盖掉缩进 */
  703. .wiki-cat-list.tipitaka-side-tree__children {
  704. margin: 2px 0 6px 0.75rem;
  705. padding-left: 0.5rem;
  706. border-left: 2px solid var(--tblr-border-color);
  707. }
  708. .tipitaka-side-tree .tipitaka-side-tree__children > li > a {
  709. font-weight: 400;
  710. font-size: 0.75rem;
  711. color: var(--tblr-secondary);
  712. padding: 3px 8px;
  713. }
  714. .tipitaka-side-tree .tipitaka-side-tree__children > li > a::before {
  715. content: '';
  716. flex: none;
  717. width: 4px;
  718. height: 4px;
  719. margin-right: 6px;
  720. border-radius: 50%;
  721. background: currentColor;
  722. opacity: 0.6;
  723. }
  724. .tipitaka-side-tree .tipitaka-side-tree__children > li > a.is-open {
  725. font-weight: 600;
  726. color: var(--tblr-body-color);
  727. }
  728. .tipitaka-side-tree .tipitaka-side-tree__children > li > a.active {
  729. color: var(--tblr-primary);
  730. font-weight: 600;
  731. }