0x2620/event-timeline
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

rounded corners

Browse source
This commit is contained in:
j 2022-04-29 13:22:10 +01:00
parent 272a7b4bb1
commit 23cf039072
2 changed files with 38 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
app/static/css/partials/_layout.scss
View file

@ -9,38 +9,6 @@
p { p {
} }
#about, #imprint {
max-width: 800px;
margin: auto;
line-height: 1.33em;
.start {
font-size: 20px;
text-align: center;
}
.reference {
color: #333;
font-size: 11px;
line-height: 1em;
margin-top: 64px;
}
.row {
display: flex;
flex-direction: row;
gap: 20px;
.block {
width: 100%
}
}
}
#about {
img {
width: 100%;
margin: auto;
}
}
#contact { #contact {
.content { .content {
padding-top: 64px; padding-top: 64px;
@ -135,7 +103,7 @@ p {
display: inherit; display: inherit;
} }
#title { #title, #about, #imprint {
background-image: url("/media/image/birds_medium.jpg"); background-image: url("/media/image/birds_medium.jpg");
background-size: cover; background-size: cover;
&.active { &.active {
@ -144,7 +112,6 @@ p {
.content { .content {
margin: auto; margin: auto;
margin-top: 256px;
.start { .start {
font-size: 36px; font-size: 36px;
display: block; display: block;
@ -154,6 +121,13 @@ p {
} }
} }
.reference {
color: #333;
font-size: 11px;
line-height: 1em;
margin-top: 64px;
}
.credit { .credit {
position: fixed; position: fixed;
left: 5px; left: 5px;
@ -161,8 +135,33 @@ p {
color: #000; color: #000;
} }
} }
@media screen and (max-width: 799px) {
#title { #title {
.content {
margin-top: 256px;
}
}
#about, #imprint {
.content {
max-width: 800px;
margin: auto;
color: #ddd;
background-color: rgba(1,1,1, 0.5);
border-radius: 10px;
padding: 16px;
font-size: 20px;
h2,p {
color: #ddd;
}
p {
font-size: 20px;
}
}
}
@media screen and (max-width: 799px) {
#title, #about {
.content { .content {
margin-top: 64px; margin-top: 64px;
text-align: center; text-align: center;

12
app/templates/timeline.html
View file

@ -46,18 +46,18 @@
</div> </div>
</div> </div>
<div id="about" class="page tl-timeline"> <div id="about" class="page tl-timeline">
<br> <div class="content">
<br>
{{ about.body | safe }} {{ about.body | safe }}
</div> </div>
</div>
<div id="timeline" class="page"> <div id="timeline" class="page">
<div id="tl"></div> <div id="tl"></div>
</div> </div>
<div id="imprint" class="page tl-timeline"> <div id="imprint" class="page tl-timeline">
<br> <div class="content">
<br>
{{ imprint.body | safe }} {{ imprint.body | safe }}
</div> </div>
</div>
<div id="contact" class="page tl-timeline"> <div id="contact" class="page tl-timeline">
<div class="content"> <div class="content">
<form class="contact-form" action="/disabled" method="post"> <form class="contact-form" action="/disabled" method="post">
@ -138,10 +138,6 @@
}) })
active.classList.add('active') active.classList.add('active')
} }
document.querySelector('#about a[href="#title"]').addEventListener('click', event => {
openPage('#timeline')
load_timeline()
})
function hashchange(event) { function hashchange(event) {
console.log('hc', document.location.hash.slice(1).length, document.location.hash.slice(1)) console.log('hc', document.location.hash.slice(1).length, document.location.hash.slice(1))
var page var page