ピン留めを小さなパネルにするUserCSS
from ピン留め用UserCSS
ピン留めを小さなパネルにするUserCSS
/arpla/ピン留めを小さなパネルにするUserCSS
code:style.css
.page-list > .grid li.pin {
height: 32px;
width: 100%;
margin-bottom: 5px;
}
code:style.css!
@media (hover: none) {
/* ピン留めするカードの数が偶数である限りは秩序が保たれる脆弱なCSS */
.page-list ul.grid {
grid-template-columns: repeat(6, 1Fr);
}
.page-list > .grid li.pin {
grid-column: 2 span;
}
.page-list > .grid li:not(.pin):nth-child(odd) {
grid-column: 1 / 4;
}
.page-list > .grid li:not(.pin):nth-child(even) {
grid-column: 4 / 7;
}
}
code:style.css
.page-list > .grid li.page-list-item.pin a {
background-color: var(--card-bg);
border-radius: 7px;
margin: none;
box-shadow: none;
}
.page-list > .grid li.page-list-item a .header.pinned {
border-top:none;
padding: 6px 5px;
}
.page-list > .grid li.page-list-item.pin a .title {
font-size: 12px;
color: var(--card-title-color);
max-height: 20px;
text-align: center;
}
code:style.css
.page-list > .grid li.page-list-item.pin a .content :is(.description,.icon) {display: none;}
.page-list > .grid li.page-list-item a .pin {background: none;}