「MediaWiki:Common.css」の版間の差分

MediaWiki:Common.css (ソースを閲覧)

2026年8月26日 (水) 02:19時点における版

3,404 バイト追加、 2026年8月26日 (水)

編集の要約なし

ド馬

ビューロクラット、インターフェース管理者、管理者

2,719

回編集

@@ 1,279行目: / 1,279行目: @@
      color: var(--ts-muted);
      font-size: .82rem;
+}
+/* =========================================================
+  転スラWiki 年表
+  ========================================================= */
+.ts-chronology {
+    --chron-blue: #36c;
+    --chron-blue-dark: #2a4b8d;
+    --chron-border: #c8ccd1;
+    --chron-border-light: #eaecf0;
+    --chron-text: #202122;
+    --chron-subtext: #54595d;
+    --chron-muted: #72777d;
+    --chron-bg: #f8f9fa;
+    --chron-bg-blue: #f4f7fc;
+    width: 100%;
+    color: var(--chron-text);
+    box-sizing: border-box;
+}
+/* =========================================================
+  時代セクション
+  ========================================================= */
+.ts-chron-section {
+    margin: 25px 0 32px;
+}
+.ts-chron-section-title {
+    margin: 0 0 14px !important;
+    padding: 4px 0 7px 10px !important;
+    border: 0 !important;
+    border-left: 4px solid var(--chron-blue) !important;
+    border-bottom: 1px solid var(--chron-border) !important;
+    color: var(--chron-text);
+    font-size: 1.2rem !important;
+    font-weight: 700 !important;
+    line-height: 1.4 !important;
+}
+/* =========================================================
+  年表本体
+  ========================================================= */
+.ts-chron-list {
+    position: relative;
+    margin: 0;
+    padding: 2px 0;
+}
+/*
+ * 年代と出来事の間を通る縦線
+ */
+.ts-chron-list::before {
+    content: "";
+    position: absolute;
+    top: 8px;
+    bottom: 8px;
+    left: 130px;
+    width: 1px;
+    background: #a7b9d8;
+}
+/* =========================================================
+件の出来事
+  ========================================================= */
+.ts-chron-entry {
+    position: relative;
+    display: grid;
+    grid-template-columns: 112px minmax(0, 1fr);
+    column-gap: 40px;
+    min-width: 0;
+    padding: 11px 0 14px;
+}
+/*
+ * タイムライン上の丸
+ */
+.ts-chron-entry::before {
+    content: "";
+    position: absolute;
+    top: 17px;
+    left: 126px;
+    width: 7px;
+    height: 7px;
+    border: 2px solid #fff;
+    border-radius: 50%;
+    background: var(--chron-blue);
+    box-shadow: 0 0 0 1px var(--chron-blue);
+    z-index: 1;
+}
+/* =========================================================
+  年代
+  ========================================================= */
+.ts-chron-date {
+    padding-top: 1px;
+    color: var(--chron-blue-dark);
+    font-size: .84rem;
+    font-weight: 600;
+    line-height: 1.5;
+    text-align: right;
+}
+/* =========================================================
+  出来事本文
+  ========================================================= */
+.ts-chron-body {
+    min-width: 0;
+    padding: 0 0 13px;
+    border-bottom: 1px solid var(--chron-border-light);
+}
+.ts-chron-entry:last-child .ts-chron-body {
+    border-bottom: 0;
+}
+.ts-chron-event {
+    margin: 0 0 4px;
+    color: var(--chron-text);
+    font-size: .98rem;
+    font-weight: 700;
+    line-height: 1.5;
+}
+.ts-chron-event a {
+    color: var(--chron-blue-dark);
+}
+.ts-chron-summary {
+    color: var(--chron-subtext);
+    font-size: .88rem;
+    line-height: 1.7;
+}
+.ts-chron-summary p {
+    margin: 0;
+}
+/* =========================================================
+  「詳細を見る」
+  ========================================================= */
+.ts-chron-detail {
+    margin-top: 6px;
+    font-size: .8rem;
+}
+.ts-chron-detail a {
+    color: var(--chron-blue);
 }