プロジェクトホームのUserCSS
CSSが崩れた応急処置として一時的にgridに戻しました。 rikku2008.icon
code:style.css
body{ /* カードの下部影 */
--card-box-shadow:none;
--card-box-hover-shadow:none;
}
.page-list ul.grid{
/* display: flex; */
display: grid;
flex-wrap: wrap;
justify-content: space-around;
margin-right: 0;
}
.page-list .grid li{
margin: 0 0 1.4em 0;
box-shadow: none;
}
.related-page-list {
padding: 0 3px;
}
.grid li.page-list-item a{
border-radius: 5px ;
transition: all 100ms cubic-bezier(0.2, 0.91, 0.85, 0.96) 0s;
}
.grid li.page-list-item a:hover{
border-radius: 5px;
}
/* --- アウトライン --- */
.page-list .grid li.page-list-item:not(.pin) a{outline: 3px solid #efefef;} .page-list .grid li.page-list-item:not(.pin) a:hover{outline: 3px solid #f4af7f;} .page-list .grid li.page-list-item a .icon {
position: relative;
padding: 0;
margin: auto;
}
.page-list .grid li.page-list-item a .icon img{
width: auto;
max-height: 90px;
max-width: 90%;
border-radius: 5px;
}
.page-list .grid li.page-list-item a .header{
padding: 13px 10px 8px;
border-top: none;
}
.page-list .grid li.page-list-item a .title{
font-size: 0.9em;
text-align: center;
}
.page-list .grid li.page-list-item a .hover{background: transparent;}
opacity: 0;}
.page-list .grid li.page-list-item:not(.pin) a{outline: 1px solid #374151;} /* サムネアウトライン */ .page-list .grid li.page-list-item:not(.pin) a:hover{outline: 1px solid #5865F2;} /* サムネアウトライン:hover */ .page-list .grid li.page-list-item a .icon img{filter: brightness(0.9);}
/* --- ピンされたページ --- */
.page-list .grid li.pin a .content{background-color: #1f2937 !important;} .page-list .grid li.page-list-item a .header.pinned{background-color: #111827 !important;} .page-list .grid li.page-list-item.unread a{
}
.page-list .grid li.page-list-item.unread a:hover{
}
.page-list .grid li.pin:first-of-type a:hover .content{
background-size: 91%;
transition: cubic-bezier(0.4, 0, 0.2, 1) 0.3s;
}
.page-list .grid li.pin a .content{
background-position: center;
background-size: 100%;
background-repeat: no-repeat;
transition: cubic-bezier(0.4, 0, 0.2, 1) 0.7s;
}
.page-list .grid li.pin a:hover .content{
background-size: 110%;
transition: cubic-bezier(0.4, 0, 0.2, 1) 0.3s;
}