Last active
July 17, 2021 04:33
-
-
Save t-asa2000/4f4a249e43479a359a9348d9028a9c6a to your computer and use it in GitHub Desktop.
t-asa2000's custom CSS applying to 'BusinessPress' theme
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* [Chrome]各種不具合対応 */ | |
img { | |
image-rendering: -webkit-optimize-contrast; | |
} | |
.blocks-gallery-grid, .wp-block-gallery{ | |
width:100%; | |
} | |
/* 色変更 */ | |
.wp-block-table.is-style-stripes tbody tr:nth-child(2n+1),body { | |
background-color: #f4f5f6; | |
/* カスタマイザーの「色」→「薄い背景色」の設定に揃えてください */ | |
} | |
div.site{ | |
background-color:#fff; | |
} | |
/* ヘッダー */ | |
.site-header{ | |
margin-bottom:0; | |
border-bottom:none; | |
} | |
.main-header{ | |
padding:15px 0; | |
backface-visibility:hidden; | |
} | |
.main-header-clone .site-logo{ | |
transform:unset; | |
} | |
.main-header-clone-show{ | |
box-shadow:none; | |
} | |
.home-header-content { | |
padding-bottom: 40px; | |
padding-top: 30px; | |
} | |
.jumbotron{ | |
margin-bottom:4rem; | |
} | |
/* メニュー(SNSアイコン) */ | |
.menu a::before{ | |
vertical-align:sub; | |
} | |
/* メインコンテンツ */ | |
#content { | |
flex-flow: row-reverse; | |
margin-bottom:3rem; | |
} | |
.no-sidebar #content{ | |
max-width:940px; | |
} | |
/* コンテナ */ | |
.no-sidebar .container-wrapper{ | |
padding-bottom:1rem; | |
} | |
/* 人物リスト */ | |
ul.people { | |
list-style: none; | |
font-size: 0.85em; | |
margin:0; | |
display:flex; | |
white-space:nowrap; | |
flex-wrap:wrap; | |
} | |
ul.people li{ | |
margin:0 0.8em 0.8em 0; | |
display:flex; | |
flex-grow:1; | |
flex-basis:250px; | |
} | |
ul.people li img.face{ | |
} | |
ul.people li p.info{ | |
} | |
ul.people li img.face { | |
min-width:110px; | |
max-width:110px; | |
object-fit:cover; | |
width: 110px; | |
height: 110px; | |
border-radius: 4px; | |
margin-right:1.4em; | |
} | |
ul.people li p.info{ | |
margin:0.8em 0; | |
align-self:center; | |
} | |
ul.people li p.info span{ | |
display:block; | |
} | |
ul.people li p.info span.name{ | |
font-weight:700; | |
} | |
/* インデックスバナー */ | |
.no-sidebar .container-wrapper.index-banner{ | |
padding-top: 0; | |
padding-bottom: 0; | |
margin-top: 0; | |
margin-bottom: 3rem; | |
} | |
.wp-block-group.container-content.index-banner { | |
max-width: none; | |
margin: 0; | |
width: 100vw; | |
padding: 0; | |
} | |
.wp-block-soliloquy-soliloquywp.index-banner,.wp-block-image.index-banner{ | |
max-width: 720px; | |
margin: 0 auto !important; | |
width: 100%; | |
} | |
.wp-block-soliloquy-soliloquywp.alignwide.index-banner, | |
.wp-block-image.alignwide.index-banner{ | |
max-width:940px; | |
} | |
.wp-block-soliloquy-soliloquywp.alignfull.index-banner, | |
.wp-block-image.alignfull.index-banner{ | |
max-width:1120px; | |
} | |
/* ページ内ナビゲーション */ | |
ul.page-nav{ | |
display: grid; | |
grid-template-columns: repeat(2,1fr); | |
font-weight: 700; | |
list-style: none; | |
text-align: center; | |
color: #fff; | |
margin: 0; | |
padding: 0; | |
background-color: var(--base-color); | |
} | |
ul.page-nav li,ul.page-nav li a{ | |
padding: 1rem 0; | |
} | |
ul.page-nav li.current{ | |
background-color:rgba(0,0,0,0.5); | |
padding-bottom:0.7rem; | |
border-bottom:0.3rem solid rgba(255,255,255,0.75); | |
} | |
ul.page-nav li a{ | |
display:block; | |
margin: -1rem 0; | |
} | |
/* ホバー効果 */ | |
.hover-effect,.page-nav a{ | |
transition:all .30s ease-in-out; | |
} | |
.hover-effect:hover,.page-nav a:hover,ul.people li:hover{ | |
opacity:0.6; | |
} | |
/* リンクを修飾しない */ | |
a.link-nodeco,.link-nodeco a,.page-nav a{ | |
color:inherit; | |
text-decoration:none; | |
} | |
/* フッター */ | |
.content-area{ | |
margin-bottom:0; | |
} | |
#supplementary{ | |
padding-top:2.5rem; | |
padding-bottom:0; | |
} | |
.site-info{ | |
float:unset; | |
clear:unset; | |
text-align:unset; | |
} | |
.site-credit{ | |
display:none; | |
} | |
/* 782px未満でカラム解除 */ | |
@media screen and (max-width: 781px) { | |
.wp-block-columns{ | |
display:unset; | |
} | |
} | |
/* タブレット */ | |
@media screen and (min-width: 782px) { | |
.top-bar-content, .main-header-content, .home-header-content, .jumbotron-content, .featured-entry-content, .site-content, .footer-widget-content, .site-bottom-content { | |
padding-left: 20px; | |
padding-right: 20px; | |
max-width: unset; | |
} | |
.home-header-content { | |
padding-bottom: 50px; | |
padding-top: 40px; | |
} | |
ul.page-nav{ | |
grid-template-columns:repeat(4,1fr); | |
} | |
.top-bar-content, .main-header-content, .home-header-content, .site-bottom-content { | |
max-width: 1300px; | |
} | |
} | |
/* PC */ | |
@media screen and (min-width: 980px) { | |
.no-sidebar .container-wrapper.index-banner{ | |
margin-top:-3rem; | |
} | |
#content{ | |
margin:3rem auto; | |
} | |
.has-sidebar #primary{ | |
padding-left: 20px; | |
width: max(calc(100% - 340px),calc(70% - 20px)); | |
} | |
#secondary{ | |
border-right:0.5px solid #e6e6e6; | |
padding-right:20px; | |
width:calc(30% - 20px); | |
max-width:300px; | |
} | |
.no-sidebar .alignwide { | |
width: 85vw; | |
margin-left: max(calc( 50% - 85vw / 2 ),calc( 50% - 1300px / 2 )); | |
max-width: 1300px; | |
} | |
.home-header-content { | |
padding-bottom: 90px; | |
padding-top: 70px; | |
} | |
.main-navigation{ | |
line-height:unset; | |
} | |
ul.page-nav{ | |
padding:0 max(28px,calc(50vw - 650px)); | |
grid-template-columns: repeat(6,1fr); | |
} | |
.jumbotron-content, .three-column .site-content, .has-sidebar .site-content, .footer-widget-content { | |
max-width: 1300px; | |
} | |
.main-navigation div.menu > ul > li.page_item_has_children > a::after, .main-navigation ul.menu > li.page_item_has_children > a::after, .main-navigation div.menu > ul > li.menu-item-has-children > a::after, .main-navigation ul.menu > li.menu-item-has-children > a::after { | |
font: normal 14px/1 FontAwesome; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment