malte70/hugo-paper
1
0
Fork 0
Code Activity

fix mobile ui

Browse source
This commit is contained in:
nanxiaobei 2021-08-21 01:30:41 +08:00
parent 445fb2a6aa
commit e2f20b7498
1 changed files with 20 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
assets/app.css
View file

@ -42,8 +42,12 @@ body {
--air: rgba(var(--dark), 0.48);
--fog: rgba(var(--dark), 0.12);
display: flex;
flex-direction: column;
min-height: 100vh;
padding-right: var(--gap);
padding-left: var(--gap);
margin: 0;
padding-inline: var(--gap);
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
'Open Sans', 'Helvetica Neue', sans-serif;
font-size: 2rem;
@ -54,6 +58,11 @@ body {
transition: background 0.4s ease-out;
}
body > * {
width: 100%;
margin-inline: auto;
}
.not-ready,
.not-ready *,
.not-ready *::before {
@ -64,6 +73,10 @@ body {
html {
font-size: 7px;
}
body {
min-height: -webkit-fill-available;
}
}
/* Reset
@ -151,7 +164,6 @@ img {
display: flex;
max-width: var(--wide);
height: var(--header);
margin-inline: auto;
}
.header a {
@ -257,9 +269,8 @@ img {
-------------------------------------------------- */
.main {
max-width: var(--narrow);
min-height: calc(100vh - var(--header) - var(--footer));
padding-block: var(--y-gap);
margin-inline: auto;
padding-top: var(--y-gap);
padding-bottom: var(--y-gap);
}
.page-title {
@ -366,9 +377,10 @@ img {
display: flex;
justify-content: space-between;
margin-top: var(--y-gap);
margin-right: calc(var(--gap) * -1);
margin-left: calc(var(--gap) * -1);
color: var(--white);
background: var(--black);
margin-inline: calc(var(--gap) * -1);
border-radius: 0.5rem;
}
@ -624,16 +636,15 @@ img {
/* Footer
-------------------------------------------------- */
.footer {
position: relative;
display: flex;
align-items: center;
justify-content: center;
max-width: var(--narrow);
min-height: var(--footer);
height: var(--footer);
margin-top: auto;
font-size: 1.6rem;
color: var(--lit);
border-top: 1px solid var(--fog);
margin-inline: auto;
}
.footer p + p::before {