ソートメニューを常時展開するUserCSS
#UserCSS
code:style.css
@media(width > 768px) {
/* ホーム画面 */
.quick-launch .right-box {
gap: 1em;
}
.page-sort-menu {
width: 100%;
.tool-btn {
display: none;
}
.dropdown-menu {
z-index: 0;
position: relative;
width: auto;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-end;
background: transparent;
box-shadow: none;
border: none;
column-gap: 1.4em;
margin: 0;
left: -10px;
li > a {
padding: 0;
color: #898484;
&:hover {
background-color: transparent;
}
}
}
.dropdown-header {
display: none;
}
}
/* 関連ページ */
.toolbar {
.page-sort-menu {
.dropdown-menu {
padding: 0;
}
}
}
}
ダークモード
code:style.css
@media (prefers-color-scheme: dark) {
.page-sort-menu {
.dropdown-menu {
li > a {
color: #7f8387;
&:hover {
color: var(--page-text-color);
}
}
}
}