|
|
@ -48,9 +48,6 @@ p, ul { |
|
|
|
margin: 20px auto; |
|
|
|
line-height: 1.3em; |
|
|
|
} |
|
|
|
p, ul { |
|
|
|
font-size: 120%; |
|
|
|
} |
|
|
|
li { |
|
|
|
margin-top: 3px; |
|
|
|
} |
|
|
@ -77,7 +74,7 @@ html.night a { |
|
|
|
background-size: 2px; |
|
|
|
} |
|
|
|
.project, .donation-method { |
|
|
|
flex: 1 0 400px; |
|
|
|
flex: 1 1 400px; |
|
|
|
padding: 10px; |
|
|
|
padding-bottom: 30px; |
|
|
|
margin: 10px; |
|
|
@ -132,14 +129,18 @@ header { |
|
|
|
justify-content: space-between; |
|
|
|
flex-wrap: wrap; |
|
|
|
} |
|
|
|
header h1 { |
|
|
|
display: none; |
|
|
|
color: white; |
|
|
|
font-size: 2em; |
|
|
|
} |
|
|
|
header span { |
|
|
|
display: inline-block; |
|
|
|
} |
|
|
|
header a { |
|
|
|
color: white; |
|
|
|
display: inline-block; |
|
|
|
padding: 5px 15px; |
|
|
|
} |
|
|
|
padding: 5px 15px;} |
|
|
|
header span:not(#theme-control), header a { |
|
|
|
height: 100%; |
|
|
|
} |
|
|
@ -161,13 +162,31 @@ html.night header a:hover { |
|
|
|
background-color: #0008; |
|
|
|
} |
|
|
|
|
|
|
|
#lynnesoft { |
|
|
|
.lynnesoft { |
|
|
|
background: center/contain url('/assets/img/lynnesoft.png') no-repeat; |
|
|
|
height: 32px; |
|
|
|
height: 30px; |
|
|
|
width: 32px; |
|
|
|
display: inline-block; |
|
|
|
vertical-align: top; |
|
|
|
} |
|
|
|
.lynnesoft.mobile { |
|
|
|
display: none; |
|
|
|
margin: 0 auto; |
|
|
|
} |
|
|
|
|
|
|
|
#hamburger { |
|
|
|
display: none; |
|
|
|
color: mediumpurple; |
|
|
|
font-size: 2em; |
|
|
|
position: fixed; |
|
|
|
top: 10px; |
|
|
|
left: 10px; |
|
|
|
z-index: 1; |
|
|
|
transition: 0.2s all; |
|
|
|
} |
|
|
|
#hamburger.active { |
|
|
|
color: white; |
|
|
|
} |
|
|
|
|
|
|
|
#theme-control { |
|
|
|
color: white; |
|
|
@ -224,18 +243,94 @@ html.night #theme-control::before { |
|
|
|
|
|
|
|
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { |
|
|
|
#main { |
|
|
|
width: 95%; |
|
|
|
width: 90%; |
|
|
|
} |
|
|
|
ul { |
|
|
|
padding-left: 15px; |
|
|
|
} |
|
|
|
p, ul { |
|
|
|
line-height: 1.6em; |
|
|
|
} |
|
|
|
#screenshots a { |
|
|
|
max-width: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.lynnesoft.desktop { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
.lynnesoft.mobile { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
#hamburger { |
|
|
|
display: inline-block; |
|
|
|
touch-action: manipulation; |
|
|
|
} |
|
|
|
header { |
|
|
|
flex-direction: column; |
|
|
|
flex-wrap: nowrap; |
|
|
|
overflow-y:scroll; |
|
|
|
padding: 0; |
|
|
|
position: fixed; |
|
|
|
width: 100vw; |
|
|
|
height: 100vh; |
|
|
|
top: 0; |
|
|
|
left: -100vw; |
|
|
|
justify-content: start; |
|
|
|
transition: 0.2s all; |
|
|
|
/* background: 50% calc(100% - 5px) / 32px 32px url('/assets/img/lynnesoft-square-small.png') mediumpurple no-repeat; */ |
|
|
|
} |
|
|
|
h1 { |
|
|
|
margin-top: 0; |
|
|
|
header.active { |
|
|
|
left: 0; |
|
|
|
} |
|
|
|
#screenshots a { |
|
|
|
max-width: 100%; |
|
|
|
html.night header { |
|
|
|
background: black; |
|
|
|
} |
|
|
|
} |
|
|
|
header h1 { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
header span { |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
header span:not(#theme-control), header a { |
|
|
|
height: unset; |
|
|
|
} |
|
|
|
header a { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
header > span { |
|
|
|
padding-bottom: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
#theme-control { |
|
|
|
width: max-content; |
|
|
|
margin: 0 auto; |
|
|
|
display: block; |
|
|
|
touch-action: manipulation; |
|
|
|
} |
|
|
|
|
|
|
|
#main.active { |
|
|
|
pointer-events: none; |
|
|
|
opacity: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.project, .donation-method { |
|
|
|
margin: 10px 0; |
|
|
|
} |
|
|
|
.project { |
|
|
|
padding-bottom: unset; |
|
|
|
} |
|
|
|
.project p { |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
.project .footer { |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
.project .footer a { |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
margin: 3px 0; |
|
|
|
} |
|
|
|
.project .footer a:not(:last-child)::after { |
|
|
|
content: ""; |
|
|
|
} |
|
|
|
} |