go-shiori/shiori
1
1
Fork 0
mirror of https://github.com/go-shiori/shiori.git synced 2025-01-15 20:37:44 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix(frontend): prevent archive header covering up the archive content (#562)

Browse source
This commit is contained in:
sdvcrx 2023-02-22 20:05:55 +08:00 committed by GitHub
parent f6f3faf130
commit 3c1229d6ce
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
internal/view/css/archive.css
View file

@ -1 +1 @@
:root{--main:#F44336;--border:#E5E5E5;--colorLink:#999;--archiveHeaderBg:rgba(255,255,255,0.95)}@media (prefers-color-scheme:dark){:root{--border:#191919;--archiveHeaderBg:rgba(41,41,41,0.95)}}#shiori-archive-header{top:0;left:0;right:0;height:60px;position:fixed;padding:0 16px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-flow:row wrap;-webkit-box-align:center;align-items:center;font-size:16px;border-bottom:1px solid var(--border);background-color:var(--archiveHeaderBg);z-index:9999999999}#shiori-archive-header *{border-width:0;box-sizing:border-box;font-family:"Source Sans Pro",sans-serif;margin:0;padding:0}#shiori-archive-header>*:not(:last-child){margin-right:8px}#shiori-archive-header>.spacer{-webkit-box-flex:1;flex:1}#shiori-archive-header #shiori-logo{font-size:2em;font-weight:100;color:var(--main)}#shiori-archive-header #shiori-logo span{margin-right:8px}#shiori-archive-header a{display:block;color:var(--colorLink);text-decoration:underline}#shiori-archive-header a:hover,#shiori-archive-header a:focus{color:var(--main)}@media (max-width:600px){#shiori-archive-header{font-size:14px;height:50px}#shiori-archive-header #shiori-logo{font-size:1.5em}}
:root{--main:#f44336;--border:#e5e5e5;--colorLink:#999;--archiveHeaderBg:hsla(0,0%,100%,.95)}@media (prefers-color-scheme:dark){:root{--border:#191919;--archiveHeaderBg:rgba(41,41,41,.95)}}#shiori-archive-header{align-items:center;background-color:var(--archiveHeaderBg);border-bottom:1px solid var(--border);box-sizing:border-box;display:flex;flex-flow:row wrap;font-size:16px;height:60px;left:0;padding:0 16px;position:fixed;right:0;top:0;z-index:9999999999}#shiori-archive-header *{border-width:0;box-sizing:border-box;font-family:Source Sans Pro,sans-serif;margin:0;padding:0}#shiori-archive-header>:not(:last-child){margin-right:8px}#shiori-archive-header>.spacer{flex:1}#shiori-archive-header #shiori-logo{color:var(--main);font-size:2em;font-weight:100}#shiori-archive-header #shiori-logo span{margin-right:8px}#shiori-archive-header a{color:var(--colorLink);display:block;text-decoration:underline}#shiori-archive-header a:focus,#shiori-archive-header a:hover{color:var(--main)}@media (max-width:600px){#shiori-archive-header{font-size:14px;height:50px}#shiori-archive-header #shiori-logo{font-size:1.5em}}body{margin-top:60px!important}@media (max-width:600px){body{margin-top:50px!important}}

21
internal/view/less/archive.less
View file

@ -10,11 +10,16 @@
}
}
@header-height: 60px;
@screen-sm-max: 600px;
@screen-sm-header-hight: 50px;
#shiori-archive-header {
top : 0;
left : 0;
right : 0;
height : 60px;
height : @header-height;
box-sizing : border-box;
position : fixed;
padding : 0 16px;
display : flex;
@ -62,12 +67,20 @@
}
}
@media (max-width: 600px) {
@media (max-width: @screen-sm-max) {
font-size: 14px;
height : 50px;
height : @screen-sm-header-hight;
#shiori-logo {
font-size: 1.5em;
}
}
}
}
body {
margin-top: @header-height !important;
@media (max-width: @screen-sm-max) {
margin-top: @screen-sm-header-hight !important;
}
}