ページのデザイン
#UserCSS
タイトル
code:style.css
.line.line-title .text{
text-align: center;
font-weight: bold;
letter-spacing: 0.06em;
text-indent: 0.06em;
}
画像，ビデオ
code:style.css
.line img.image,.video-player video,.iframe-video-player iframe{
display: block !important;
margin: 0 auto;
border-radius: 8px;
border: 2px solid #efefef;
}
.video-player video{
max-height: 360px;
}
.line img.icon {
border-radius: 2px;
margin-left: 2px;
transform: translateY(2px);
}
ページメニュー
code:style.css
.expandable-menu{
background-color: #f7f7f7;
z-index: 2;
max-width: calc(100% - 85px);
}
.expandable-menu .page-menu .tool-btn i::before{color: #646262; }
.expandable-menu .toggle-button{
color: #646262;
opacity: 1;
}
.page-menu.xs{margin-bottom: -0.5em;}
@media (max-width: 767px){
.app:has(.expandable-menu .toggle-button.open) .quick-launch .btn.project-home{
width: 41px;
color: transparent;
border-radius: 50%;
}
.app:has(.expandable-menu .toggle-button.open) .quick-launch .btn.project-home::after{
content: "";
position: absolute;
left: 0;
background-image: url(https://i.gyazo.com/03f922af4c0eb1659d4630db6b619aac.png);
background-size: 100%;
background-position: center;
height: 100%;
width: 100%;
transition: cubic-bezier(0.4, 0, 0.2, 1) 0.7s;
}
.app:has(.expandable-menu .toggle-button.open) .quick-launch .btn.project-home:hover::after{
background-size: 110%;
transition: cubic-bezier(0.4, 0, 0.2, 1) 0.15s;
}
}
.related-page-list .grid li{margin: 0 14.4px 15.4px 0;}
.grid li.relation-label a {border-radius: 5px;}