トップページでピン留めしたページを小さく表示する
https://gyazo.com/7c8e4efad73fbf06490e02b59cd1c7a8
トップページでピン留めしたページを小さく表示する
code:style.css
.page-list > .grid li.pin {
height: 32px;
width: 100%;
margin-bottom: 5px;
}
@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;
}
}
.page-list > .grid li.page-list-item.pin a {
background-color: var(--card-bg);
border-radius: 4px;
margin: none;
box-shadow: none;
}
.page-list > .grid li.page-list-item a .header.pinned {
border-top:none;
padding: 6px 2px;
}
.page-list > .grid li.page-list-item.pin a .title {
font-size: 12px;
font-size: clamp(11px, 3vw, 13px);
color: var(--card-title-color);
max-height: 20px;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.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;}
/* 右上角が欠けてしまうのを防ぐ（ドッグイヤー防止）。（2025/05/17）これで合っているのかはわからない */
.grid li.page-list-item.pin::after {display: none;}
https://gyazo.com/43b66e69353ada9bdeefcfd9f6750420
下記の箇所を追加
code:CSS
/* 右上角が欠けてしまうのを防ぐ（ドッグイヤー防止）。（2025/05/17）これで合っているのかはわからない */
.grid li.page-list-item.pin::after {display: none;}
出典：