古き良きシカゴ・スピリットのタブ

このページはコンポーネントページです

Wiki内で使用されているコンポーネントページです。このページを編集することはできません。
編集が必要だと思われる場合は、このページのディスカッションか、サイトスタッフまでご連絡ください。

詳しくはカテゴリ運用ポリシーを参照してください。

クレジット

タイトル: 古き良きシカゴ・スピリットのタブ
原題: Old timey Chicago Spirit tabs
著作権者: PeppersGhost
翻訳責任者: takion00
作成年: 2018
翻訳年: 2026
初訳時参照リビジョン: rev.17
元記事リンク: Old timey Chicago Spirit tabs

これは、PeppersGhostによって作成された古き良きタブスタイル構文です。

このコンポーネントを使用するには、以下のコードを記事の最上部に挿入してください:

[[include :scp-jp:component:chicago-spirit]]

このテーマスタイル構文は、Wikidotのタブを古い金属枠のファイリングタブのように見せるために設計されています。主にシカゴ・スピリットの記事での使用を想定していますが、どんな用途にも使えます。

例:

無題

Lorem ipsum dolar sit

無題

Lorem ipsum dolar sit

@import url('https://fonts.googleapis.com/css2?family=Rubik+Distressed&display=swap');
 
.CS-title {
    font-family: 'Rubik Distressed' , sans-serif;
}
 
/* YUI-TABS */
/* This is the parent class for most of the tab module.  */
.yui-navset .yui-content{
    background-color: #ededed;
    padding: 2px 20px 0 20px;
    border-width: 15px 1px 1px 1px;
    border-color: #291f1f;
}
 
/* This section affects unselected tabs. */
#page-content .yui-navset .yui-nav a,
#page-content .yui-navset .yui-navset-top .yui-nav a {
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
    background: url(https://scp-jp-storage.wdfiles.com/local--files/file%3A9466112-144-s0wx/yuitabs8.png) center center / auto 48px no-repeat;
    background-size: contain;
    border-width: 0;
    padding: 2px 20px  0px 20px;
    margin-top: 10px;
    margin-bottom: -0.35rem;
    border-top: none;
}
 
/* This section affects the currently selected tab. */
#page-content .yui-navset .yui-nav .selected a,
#page-content .yui-navset .yui-nav .selected a:focus, /* no focus effect for selected */
#page-content .yui-navset .yui-nav .selected a:hover { /* no hover effect for selected */
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
    background: url(https://scp-jp-storage.wdfiles.com/local--files/file%3A9466112-145-mtys/yuitabs7.png) center center / auto 48px no-repeat; /* selected tab background */
    background-size: contain;
    color:#000;
    border-width: 0;
    padding: 2px 20px 0px 20px;
    margin-top: 10px;
    border-top: none;
}
 
/* This section affects tabs you are hovering over. */
#page-content .yui-navset .yui-nav a:hover,
#page-content .yui-navset .yui-nav a:focus {
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
    background: url(https://scp-jp-storage.wdfiles.com/local--files/file%3A9466112-145-mtys/yuitabs7.png) center center / auto 48px no-repeat; /* selected tab background */
    background-size: contain;
    text-decoration: none;
    border-width: 0;
    padding: 2px 20px 0px 20px;
    margin-top: 10px;
    border-top: none;
}
 
/* This removes the border around tab images. */
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border-color: #291f1f;
}
.yui-navset li {
    line-height: normal;
}
.yui-navset .yui-nav a em, .yui-navset .yui-navset-top .yui-nav a em {
    border-color: unset;
    border-width: 0;
    bottom: 0;
    left: 0;
    margin-bottom: 0.3rem;
    padding: 0.25em 0.75em;
    position: relative;
    right: 0;
    top: -1px;
}