94 lines
2.6 KiB
CSS
94 lines
2.6 KiB
CSS
/* head_63.css - rail (odd: fold list on mobile) */
|
|
.__PFX__-h63-rail{
|
|
--h-accent: var(--secondary-color);
|
|
border-bottom:1px solid var(--border-color);
|
|
background:var(--bg-soft-color);
|
|
}
|
|
.__PFX__-h63-rail{
|
|
display:grid;
|
|
grid-template-columns:180px 1fr;
|
|
gap:10px;
|
|
padding:10px 12px;
|
|
}
|
|
.__PFX__-h63-side{
|
|
background:var(--bg-color);
|
|
border:1px solid var(--border-color);
|
|
border-radius:14px;
|
|
padding:10px;
|
|
}
|
|
.__PFX__-h63-logo{
|
|
display:block;
|
|
text-decoration:none;
|
|
color:var(--text-color);
|
|
font-weight:900;
|
|
font-size:18px;
|
|
margin-bottom:8px;
|
|
}
|
|
.__PFX__-h63-home{display:flex;flex-direction:column;gap:8px;}
|
|
.__PFX__-h63-home a{
|
|
text-decoration:none;
|
|
font-size:12px;
|
|
color:var(--text-color);
|
|
background:var(--bg-soft-color);
|
|
border:1px solid var(--border-color);
|
|
border-radius:12px;
|
|
padding:8px 10px;
|
|
}
|
|
.__PFX__-h63-home a.active{
|
|
background:var(--primary-color);
|
|
border-color:var(--primary-color);
|
|
font-weight:800;
|
|
}
|
|
.__PFX__-h63-fold{
|
|
margin-top:8px;
|
|
width:100%;
|
|
border:1px solid var(--border-color);
|
|
background:var(--bg-color);
|
|
color:var(--text-color);
|
|
border-radius:12px;
|
|
padding:8px 10px;
|
|
cursor:pointer;
|
|
}
|
|
.__PFX__-h63-main{min-width:0;display:flex;flex-direction:column;gap:10px;}
|
|
.__PFX__-h63-search{
|
|
display:flex;
|
|
gap:6px;
|
|
padding:4px 6px 4px 10px;
|
|
border:1px solid var(--border-color);
|
|
border-radius:999px;
|
|
background:var(--bg-color);
|
|
}
|
|
.__PFX__-h63-search input{flex:1;min-width:0;border:none;outline:none;background:transparent;color:var(--text-color);font-size:13px;}
|
|
.__PFX__-h63-btn{border:none;border-radius:999px;background:var(--h-accent);color:var(--text-color);padding:6px 10px;cursor:pointer;font-size:12px;}
|
|
.__PFX__-h63-nav{}
|
|
.__PFX__-h63-list{
|
|
margin:0;
|
|
padding:0;
|
|
list-style:none;
|
|
display:grid;
|
|
grid-template-columns:repeat(5,minmax(0,1fr));
|
|
gap:8px;
|
|
}
|
|
.__PFX__-h63-list a{
|
|
display:block;
|
|
text-decoration:none;
|
|
font-size:12px;
|
|
text-align:center;
|
|
padding:8px 6px;
|
|
border-radius:12px;
|
|
background:var(--bg-color);
|
|
border:1px solid var(--border-color);
|
|
color:var(--text-color);
|
|
}
|
|
.__PFX__-h63-list a.active{background:var(--primary-color);border-color:var(--primary-color);font-weight:800;}
|
|
@media (max-width:860px){
|
|
.__PFX__-h63-rail{grid-template-columns:1fr;}
|
|
.__PFX__-h63-home{flex-direction:row;flex-wrap:wrap;}
|
|
.__PFX__-h63-list{grid-template-columns:repeat(3,minmax(0,1fr));}
|
|
.__PFX__-h63-nav{display:none;}
|
|
body.__PFX__-h63-open .__PFX__-h63-nav{display:block;}
|
|
}
|
|
@media (min-width:861px){
|
|
.__PFX__-h63-fold{display:none;}
|
|
}
|