rulrich/pcs-website-test
1
0
Fork 0
mirror of https://git.bolliret.ch/pcs/pcs-website synced 2026-01-18 16:41:37 +01:00
Code Issues Projects Releases Packages Wiki Activity

Adding image... but CSS sometimes is a bitch

Browse source
This commit is contained in:
Reto Bollinger 2024-11-17 14:20:36 +01:00
parent 589bb4c70b
commit 3d19bf237a
6 changed files with 87 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
lektor/lektordata/project/assets/images/bg_image_welcome_1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 MiB

51
lektor/lektordata/project/assets/static/style.css
View file

@ -40,17 +40,66 @@ th, td {
} }
header, footer, div.page { header, footer, div.page {
position: relative;
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
background: #ececec; background: #ececec;
padding: 20px 30px;
color: #6c7d8c; color: #6c7d8c;
max-width: 1200px;
}
header > div.inner_header, footer > div.inner_footer, div.page > div.inner_page{
padding: 20px 30px;
}
div.inner_page > *{
margin: 0;
} }
div.page h1, div.page h2, div.page h3, div.page h4, div.page h5, div.page h6{ div.page h1, div.page h2, div.page h3, div.page h4, div.page h5, div.page h6{
color: #5d5d5d; color: #5d5d5d;
} }
div.inner_page {
position: relative;
top: 0;
padding: 0;
}
div.bgimage + div.inner_page {
position: absolute;
box-sizing: border-box;
}
.page .bgimage img {
display: block;
width: 100%;
max-width: 1200px; /* corresponds to max height of 450px */
margin: 0 auto;
filter: opacity(50%);
}
page .bgimage {
position: absolute;
box-sizing: border-box;
background: #fff;
}
.bgimage {
background: #fff;
}
/*
.inner_page{
position: absolute;
top: 0;
padding: 0px 30px;
box-sizing: border-box;
}
*/
header, footer { header, footer {
color: #b0b0b0; color: #b0b0b0;
} }

3
lektor/lektordata/project/content/contents.lr
View file

@ -1,5 +1,6 @@
title: Willkommen beim Pistolenclub Stammertal! title: Willkommen beim Pistolenclub Stammertal!
--- ---
body: body:
<div class="image"><img src="/pc-stammertal-logo-minimal.svg"></div> <div class="image"><img src="/pc-stammertal-logo-minimal.svg"></div>
---
_template: title_page.html

4
lektor/lektordata/project/templates/layout.html
View file

@ -10,6 +10,7 @@
<title>{% block title %}Welcome{% endblock %} — PCS</title> <title>{% block title %}Welcome{% endblock %} — PCS</title>
<body> <body>
<header> <header>
<div class="inner_header">
<h1>Pistolenclub Stammertal</h1> <h1>Pistolenclub Stammertal</h1>
<nav> <nav>
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
@ -26,11 +27,14 @@
{% endfor %} {% endfor %}
</ul> </ul>
</nav> </nav>
</div>
</header> </header>
<div class="page"> <div class="page">
{% block body %}{% endblock %} {% block body %}{% endblock %}
</div> </div>
<footer> <footer>
<div class="inner_footer">
&copy; Copyright 2024 by PC Stammertal. &copy; Copyright 2024 by PC Stammertal.
</div>
</footer> </footer>
</body> </body>

2
lektor/lektordata/project/templates/page.html
View file

@ -1,6 +1,8 @@
{% extends "layout.html" %} {% extends "layout.html" %}
{% block title %}{{ this.title }}{% endblock %} {% block title %}{{ this.title }}{% endblock %}
{% block body %} {% block body %}
<div class="inner_page">
<h2>{{ this.title }}</h2> <h2>{{ this.title }}</h2>
{{ this.body }} {{ this.body }}
</div>
{% endblock %} {% endblock %}

9
lektor/lektordata/project/templates/title_page.html Normal file
View file

@ -0,0 +1,9 @@
{% extends "layout.html" %}
{% block title %}{{ this.title }}{% endblock %}
{% block body %}
<div class="bgimage"><img src="/images/bg_image_welcome_1.jpg"></div>
<div class="inner_page">
<h2>{{ this.title }}</h2>
{{ this.body }}
</div>
{% endblock %}