MediaWiki: Common.css
提供: 羅小黒戦記 FAN WIKI
(同じ利用者による、間の97版が非表示) | |||
1行目: | 1行目: | ||
− | + | /*編集の表示*/ | |
− | body | + | body a#ca-edit{ |
− | + | display: none; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | body.mw-editable a#ca-edit{ | |
− | + | display: inline; | |
− | a | ||
− | |||
} | } | ||
− | + | /*カテゴリの表示*/ | |
− | + | #catlinks { display: block; } | |
− | + | /*カテゴリページ*/ | |
+ | .mw-category-generated h2.typesquare_tags{ | ||
+ | display: none; | ||
} | } | ||
− | + | .mw-category-generated h2{ | |
− | + | font-size: 24px; | |
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | /* | + | |
− | # | + | /*上ナビ*/ |
− | + | #navbar{ | |
− | + | height: 100%; | |
− | + | max-height: fit-content; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | @media (min-width: 990px) { | |
− | + | input#searchInput { width: 200px } | |
} | } | ||
+ | /*右ナビ*/ | ||
+ | #sidebar-right figure{ | ||
+ | width: 100px; | ||
+ | margin-left: auto; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | /********************/ | |
− | |||
+ | /*共通デザイン*/ | ||
+ | body{ | ||
+ | font-family: "Noto Sans JP"; | ||
+ | letter-spacing: 1.5px; | ||
+ | word-break: break-all; | ||
} | } | ||
− | # | + | #footer{ |
− | + | background: #333; | |
} | } | ||
− | # | + | #footer a{ |
− | + | color: #fff; | |
} | } | ||
− | + | a,a:visited { | |
− | # | + | color: #4f97a3; |
− | |||
} | } | ||
− | + | a:hover{ | |
− | + | color: #4f97a3; | |
− | |||
− | |||
− | # | ||
− | |||
} | } | ||
+ | hr{ | ||
+ | margin: 40px 0; | ||
+ | background: #eee; | ||
+ | } | ||
+ | |||
+ | figure img{ | ||
+ | width: 100%; | ||
+ | } | ||
+ | .mw-parser-output img, | ||
+ | .photoBox img{ | ||
+ | width: 100%; | ||
+ | } | ||
− | |||
− | + | .typecate{ | |
− | + | font-size: 18px; | |
− | + | font-weight: bold; | |
− | |||
} | } | ||
+ | #contentSub{ | ||
+ | margin: 20px 0; | ||
− | |||
− | |||
} | } | ||
− | + | /*シェア用リンク*/ | |
− | + | p#sUrl{ | |
− | + | border-top: solid 2px #333; | |
− | + | padding: 40px 0 0 25px; | |
− | margin: | + | margin: 60px 0 0 0; |
} | } | ||
− | + | p#sUrl a{ | |
− | + | color: #333; | |
− | + | font-size: 11px; | |
− | |||
− | |||
} | } | ||
− | + | p#sUrl a:before{ | |
− | + | content: "短縮URL:"; | |
} | } | ||
− | |||
− | |||
+ | /*最終更新日*/ | ||
+ | p#sKousin{ | ||
+ | color: #333; | ||
+ | font-size: 11px; | ||
+ | padding: 20px 0 40px 23px; | ||
+ | margin: 0 0 40px 2px; | ||
+ | border-bottom: 2px solid; | ||
} | } | ||
− | + | /*参考出典*/ | |
− | # | + | h2#tSankou{ |
− | + | margin: 0 0 0 0; | |
+ | font-size: 25px; | ||
} | } | ||
− | /* | + | /*カテゴリ*/ |
− | + | #catlinks{ | |
− | + | border: none; | |
− | + | background: #f6f6f6; | |
− | + | padding: 10px; | |
− | + | margin: 40px 0 0; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
+ | /*twitterBtn*/ | ||
+ | ul.navTwi{ | ||
+ | list-style: none; | ||
+ | margin: 40px 0 20px; | ||
+ | padding: 0; | ||
+ | border-top: 1px solid #eee; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | ul.navTwi li{ | |
− | + | border-bottom: 1px solid #eee; | |
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | ul.navTwi li a{ | |
− | + | display: block; | |
− | + | padding: 20px 0 20px 50px; | |
− | + | color: #333; | |
} | } | ||
− | + | ul.navTwi li a:hover{ | |
− | + | text-decoration: none; | |
− | + | color: #4f97a3; | |
− | + | ||
− | |||
} | } | ||
− | + | ul.navTwi li.btnShare{ | |
− | + | background: no-repeat url("img/icon_share.png") left/46px; | |
− | |||
} | } | ||
− | + | ul.navTwi li.btnTwi{ | |
− | + | background: no-repeat url("img/icon_twitter.png") left/46px; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | ul.navTwi li.btnWarp{ | |
− | + | background: no-repeat url("img/icon_warp.png") left/35px; | |
− | |||
− | |||
− | |||
} | } | ||
− | + | ul.navTwi li.text{ | |
− | + | padding: 20px 0 20px 50px; | |
− | + | color: #333; | |
+ | text-align: center; | ||
} | } | ||
− | /* | + | /*動画*/ |
− | + | .movieBox{ | |
− | + | position: relative; | |
− | + | width: 100%; | |
− | + | padding-top: 56.25%; | |
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | .movieBox iframe { | |
− | + | position: absolute; | |
− | + | top: 0; | |
− | + | right: 0; | |
− | + | width: 100% !important; | |
− | + | height: 100% !important; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
343行目: | 176行目: | ||
list-style: none; | list-style: none; | ||
padding: 15px 0; | padding: 15px 0; | ||
− | margin: | + | margin: 40px 0; |
− | border-top: 1px # | + | border-top: 1px #999 solid; |
− | border-bottom: 1px # | + | border-bottom: 1px #999 solid; |
+ | border-radius: 0; | ||
+ | width: 100%; | ||
+ | display: flex; | ||
+ | } | ||
+ | .pagination > li > a:hover, | ||
+ | .pagination > li > a:visited{ | ||
+ | color: #4f97a3 !important; | ||
} | } | ||
#content ul.pagination li a{ | #content ul.pagination li a{ | ||
− | + | color: #4f97a3 !important; | |
+ | padding: 0 5px 0; | ||
background: none; | background: none; | ||
border: none; | border: none; | ||
+ | display: contents; | ||
} | } | ||
li.pre a:before{ | li.pre a:before{ | ||
− | content: " | + | content: " < "; |
} | } | ||
li.pre{ | li.pre{ | ||
margin: 0; | margin: 0; | ||
width: 50%; | width: 50%; | ||
− | |||
padding: 0 0 0 10px; | padding: 0 0 0 10px; | ||
} | } | ||
li.next{ | li.next{ | ||
+ | width: 50%; | ||
text-align: right; | text-align: right; | ||
padding: 0 10px 0 0; | padding: 0 10px 0 0; | ||
} | } | ||
li.next a:after{ | li.next a:after{ | ||
− | content: " | + | content: " > "; |
} | } | ||
375行目: | 217行目: | ||
} | } | ||
+ | /*データボックス*/ | ||
+ | dl.boxData{ | ||
+ | color: #333; | ||
+ | width: 100%; | ||
+ | overflow: hidden; | ||
+ | border-top: none; | ||
+ | background: #f8f8f8; | ||
+ | border-bottom: 1px dotted #888; | ||
+ | margin: 0 0 40px; | ||
+ | } | ||
+ | dl.boxData dt{ | ||
+ | margin: 0; | ||
+ | width: 25%; | ||
+ | float: left; | ||
+ | padding: 15px 0 0; | ||
+ | border-top: 1px dotted #888; | ||
+ | box-sizing: border-box; | ||
+ | text-align: center; | ||
+ | } | ||
+ | dl.boxData dd{ | ||
+ | margin: 0; | ||
+ | margin-left: 25%; | ||
+ | padding: 10px; | ||
+ | border-top: 1px dotted #888; | ||
+ | background: #fff; | ||
+ | line-height: 2; | ||
+ | } | ||
+ | dl.boxData dd:after{ | ||
+ | display: block; | ||
+ | content: ""; | ||
+ | clear: both; | ||
+ | } | ||
+ | dl.boxData dd hr{ | ||
+ | margin: 4px 0; | ||
+ | } | ||
+ | /*更新履歴*/ | ||
+ | ul.boxNews{ | ||
+ | border-top: 1px dotted #d3d3d3; | ||
+ | list-style: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | ul.boxNews li{ | ||
+ | border-bottom: 1px dotted #d3d3d3; | ||
+ | padding: 10px 0; | ||
+ | } | ||
+ | ul.boxNews li span{ | ||
+ | display: block; | ||
+ | } | ||
+ | /*テキスト装飾*/ | ||
+ | h1{ | ||
+ | text-align: center; | ||
+ | font-size: 32px; | ||
+ | } | ||
+ | .page-header{ | ||
+ | margin-bottom: 40px; | ||
+ | border-bottom: 2px solid #333; | ||
+ | } | ||
+ | h2, .h2 { | ||
+ | border-left: solid 10px #333; | ||
+ | padding: 0px 0 4px 10px; | ||
+ | margin-bottom: 40px; | ||
+ | } | ||
+ | .daiji{ | ||
+ | background: #d8e8bc; | ||
+ | font-weight: normal; | ||
+ | display: inline; | ||
+ | padding: 1px 0 2px 5px; | ||
+ | } | ||
− | + | .s{ | |
− | + | text-align: right; | |
− | + | font-size: 0.5em; | |
− | . | + | } |
− | + | .c{ | |
− | + | text-align: center; | |
− | { | ||
− | |||
− | |||
} | } |
2023年12月14日 (木) 14:26時点における最新版
/*編集の表示*/ body a#ca-edit{ display: none; } body.mw-editable a#ca-edit{ display: inline; } /*カテゴリの表示*/ #catlinks { display: block; } /*カテゴリページ*/ .mw-category-generated h2.typesquare_tags{ display: none; } .mw-category-generated h2{ font-size: 24px; } /*上ナビ*/ #navbar{ height: 100%; max-height: fit-content; } @media (min-width: 990px) { input#searchInput { width: 200px } } /*右ナビ*/ #sidebar-right figure{ width: 100px; margin-left: auto; } /********************/ /*共通デザイン*/ body{ font-family: "Noto Sans JP"; letter-spacing: 1.5px; word-break: break-all; } #footer{ background: #333; } #footer a{ color: #fff; } a,a:visited { color: #4f97a3; } a:hover{ color: #4f97a3; } hr{ margin: 40px 0; background: #eee; } figure img{ width: 100%; } .mw-parser-output img, .photoBox img{ width: 100%; } .typecate{ font-size: 18px; font-weight: bold; } #contentSub{ margin: 20px 0; } /*シェア用リンク*/ p#sUrl{ border-top: solid 2px #333; padding: 40px 0 0 25px; margin: 60px 0 0 0; } p#sUrl a{ color: #333; font-size: 11px; } p#sUrl a:before{ content: "短縮URL:"; } /*最終更新日*/ p#sKousin{ color: #333; font-size: 11px; padding: 20px 0 40px 23px; margin: 0 0 40px 2px; border-bottom: 2px solid; } /*参考出典*/ h2#tSankou{ margin: 0 0 0 0; font-size: 25px; } /*カテゴリ*/ #catlinks{ border: none; background: #f6f6f6; padding: 10px; margin: 40px 0 0; } /*twitterBtn*/ ul.navTwi{ list-style: none; margin: 40px 0 20px; padding: 0; border-top: 1px solid #eee; } ul.navTwi li{ border-bottom: 1px solid #eee; } ul.navTwi li a{ display: block; padding: 20px 0 20px 50px; color: #333; } ul.navTwi li a:hover{ text-decoration: none; color: #4f97a3; } ul.navTwi li.btnShare{ background: no-repeat url("img/icon_share.png") left/46px; } ul.navTwi li.btnTwi{ background: no-repeat url("img/icon_twitter.png") left/46px; } ul.navTwi li.btnWarp{ background: no-repeat url("img/icon_warp.png") left/35px; } ul.navTwi li.text{ padding: 20px 0 20px 50px; color: #333; text-align: center; } /*動画*/ .movieBox{ position: relative; width: 100%; padding-top: 56.25%; } .movieBox iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; } /*ページャー*/ ul.pagination{ list-style: none; padding: 15px 0; margin: 40px 0; border-top: 1px #999 solid; border-bottom: 1px #999 solid; border-radius: 0; width: 100%; display: flex; } .pagination > li > a:hover, .pagination > li > a:visited{ color: #4f97a3 !important; } #content ul.pagination li a{ color: #4f97a3 !important; padding: 0 5px 0; background: none; border: none; display: contents; } li.pre a:before{ content: " < "; } li.pre{ margin: 0; width: 50%; padding: 0 0 0 10px; } li.next{ width: 50%; text-align: right; padding: 0 10px 0 0; } li.next a:after{ content: " > "; } ul.pagination li.next:after{ display: block; content: ""; clear: both; } /*データボックス*/ dl.boxData{ color: #333; width: 100%; overflow: hidden; border-top: none; background: #f8f8f8; border-bottom: 1px dotted #888; margin: 0 0 40px; } dl.boxData dt{ margin: 0; width: 25%; float: left; padding: 15px 0 0; border-top: 1px dotted #888; box-sizing: border-box; text-align: center; } dl.boxData dd{ margin: 0; margin-left: 25%; padding: 10px; border-top: 1px dotted #888; background: #fff; line-height: 2; } dl.boxData dd:after{ display: block; content: ""; clear: both; } dl.boxData dd hr{ margin: 4px 0; } /*更新履歴*/ ul.boxNews{ border-top: 1px dotted #d3d3d3; list-style: none; margin: 0; padding: 0; } ul.boxNews li{ border-bottom: 1px dotted #d3d3d3; padding: 10px 0; } ul.boxNews li span{ display: block; } /*テキスト装飾*/ h1{ text-align: center; font-size: 32px; } .page-header{ margin-bottom: 40px; border-bottom: 2px solid #333; } h2, .h2 { border-left: solid 10px #333; padding: 0px 0 4px 10px; margin-bottom: 40px; } .daiji{ background: #d8e8bc; font-weight: normal; display: inline; padding: 1px 0 2px 5px; } .s{ text-align: right; font-size: 0.5em; } .c{ text-align: center; }