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

CSSing table on page vorstand as well

Browse source
This commit is contained in:
Reto Bollinger 2024-11-27 12:08:19 +01:00
parent fec3a02700
commit 8410fbbfd6
3 changed files with 121 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -247,12 +247,12 @@ div.left_footer, div.middle_footer, div.right_footer {
.termine *{
.termine *, .vorstand *{
box-sizing: border-box;
}
.termine ul {
.termine ul, .vorstand ul {
list-style: none;
padding: 0 0 50px 50px;
margin: 0;
@ -260,35 +260,43 @@ div.left_footer, div.middle_footer, div.right_footer {
width: 1100px;
}
.termine li {
.termine li, .vorstand li {
display: flex;
}
.termine ul > li {
.termine ul > li, .vorstand ul > li {
font-family: "Roboto-Light","Arial",sans-serif;
width: 1000px;
max-width: 1140px;
}
.termine .inner_page > ul > li{
.termine .inner_page > ul > li, .vorstand .inner_page > ul > li {
padding: 10px;
}
.termine ul > li > div, .vorstand ul > li > div {
font-size: 20px;
}
.termine ul > li > div {
width: 470px;
font-size: 20px;
}
.vorstand ul > li > div {
width: 200px;
}
.termine .inner_page > ul > li:nth-child(odd) {
.termine .inner_page > ul > li:nth-child(odd), .vorstand .inner_page > ul > li:nth-child(odd) {
background: #f4f4f4;
}
.termine .inner_page > ul > li:nth-child(even) {
.termine .inner_page > ul > li:nth-child(even), .vorstand .inner_page > ul > li:nth-child(even) {
background: #fff;
}
.termine ul > li > ul {
.termine ul > li > ul, .vorstand ul > li > ul {
display: flex;
padding: 0;
margin: 0;
@ -296,20 +304,32 @@ div.left_footer, div.middle_footer, div.right_footer {
}
.termine ul > li > ul > li {
width: 155px;
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
margin-right: 0;
}
.termine ul > li > ul > li:nth-child(1){
.termine ul > li > ul > li {
width: 155px;
}
.vorstand ul > li > ul > li {
width: 400px;
}
.termine ul > li > ul > li:nth-child(1) {
width: 240px;
}
.termine ul > li > ul > li:nth-child(2){
width: 55px;
.vorstand ul > li > ul > li:nth-child(1) {
width: 400px;
}
.termine ul > li > ul > li > div{
.termine ul > li > ul > li:nth-child(2) {
width: 55px;
}
.vorstand ul > li > ul > li:nth-child(2) {
width: 400px;
}
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
font-size: 20px;
font-weight: normal;
width: auto;
@ -317,38 +337,57 @@ div.left_footer, div.middle_footer, div.right_footer {
@media (min-width: 1025px) and (max-width: 1100px) {
.termine ul {
.termine ul, .vorstand ul {
padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
width: calc(1100vw * 0.091);
}
.termine ul > li {
.termine ul > li, .vorstand ul > li {
width: calc(1000vw * 0.091);
max-width: calc(1140vw * 0.091);
}
.termine .inner_page > ul > li{
.termine .inner_page > ul > li, .vorstand .inner_page > ul > li {
padding: calc(10vw * 0.091);
}
.termine ul > li > div, .vorstand ul > li > div{
font-size: calc(20vw * 0.091);
}
.termine ul > li > div {
width: calc(470vw * 0.091);
font-size: calc(20vw * 0.091);
}
.vorstand ul > li > div {
width: calc(200vw * 0.091);
}
.termine ul > li > ul > li {
width: calc(155vw * 0.091);
}
.vorstand ul > li > ul > li {
width: calc(400vw * 0.091);
}
.termine ul > li > ul > li:nth-child(1){
width: calc(240vw * 0.091);
}
.vorstand ul > li > ul > li:nth-child(1){
width: calc(400vw * 0.091);
}
.termine ul > li > ul > li:nth-child(2){
width: calc(55vw * 0.091);
}
.termine ul > li > ul > li > div{
.vorstand ul > li > ul > li:nth-child(2){
width: calc(400vw * 0.091);
}
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div{
font-size: calc(20vw * 0.091);
}
@ -357,7 +396,7 @@ div.left_footer, div.middle_footer, div.right_footer {
@media (min-width:769px) and (max-width:1024px) {
.termine ul {
.termine ul, .vorstand ul {
display: table;
border-collapse: collapse;
padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
@ -365,13 +404,13 @@ div.left_footer, div.middle_footer, div.right_footer {
width: calc(1000vw * 0.091);
}
.termine ul > li{
.termine ul > li, .vorstand ul > li{
display: table-row;
margin: 0;
}
.termine ul > li > div{
.termine ul > li > div, .vorstand ul > li > div{
width: calc(900vw * 0.091);
max-width: calc(900vw * 0.091);
text-align: left;
@ -382,22 +421,22 @@ div.left_footer, div.middle_footer, div.right_footer {
font-family: "Roboto-Regular","Arial",sans-serif;
}
.termine ul > li > ul {
.termine ul > li > ul, .vorstand ul > li > ul {
display: table-row;
}
.termine ul > li > ul > div{
.termine ul > li > ul > div, .vorstand ul > li > ul > div {
font-weight: normal;
padding: 0;
margin: 0;
text-align: left;
}
.termine ul > li > ul > li {
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
display: table-cell;
}
.termine ul > li > ul > li > div {
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
font-family: "Roboto-Light","Arial",sans-serif;
padding: 0 0 calc(10vw * 0.091) calc(10vw * 0.091);
}
@ -406,11 +445,18 @@ div.left_footer, div.middle_footer, div.right_footer {
.termine ul > li > ul > li:nth-child(2) { width: calc(100vw * 0.091); }
.termine ul > li > ul > li:nth-child(3) { width: calc(450vw * 0.091); }
.vorstand ul > li > ul > li:nth-child(1) { width: calc(550vw * 0.091); }
.vorstand ul > li > ul > li:nth-child(2) { width: calc(350vw * 0.091); }
.termine ul > li > ul > li:nth-child(1) > div{ width: calc(340vw * 0.091); }
.termine ul > li > ul > li:nth-child(2) > div{ width: calc(90vw * 0.091); }
.termine ul > li > ul > li:nth-child(3) > div{ width: calc(440vw * 0.091); }
.termine ul > li > div, .termine ul > li > ul > li > div {
.vorstand ul > li > ul > li:nth-child(1) > div{ width: calc(540vw * 0.091); }
.vorstand ul > li > ul > li:nth-child(2) > div{ width: calc(340vw * 0.091); }
.termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div {
font-size: 2.5vw;
}
}
@ -584,7 +630,7 @@ div.left_footer, div.middle_footer, div.right_footer {
flex-wrap: wrap;
}
.termine ul {
.termine ul, .vorstand ul {
display: table;
border-collapse: collapse;
padding: 0 0 calc(50px * 0.7) calc(50px * 0.7);
@ -592,12 +638,12 @@ div.left_footer, div.middle_footer, div.right_footer {
width: calc(1000px * 0.7);
}
.termine ul > li{
.termine ul > li, .vorstand ul > li {
display: table-row;
margin: 0;
}
.termine ul > li > div{
.termine ul > li > div, .vorstand ul > li > div{
width: 680px;
max-width: 700px;
text-align: left;
@ -608,24 +654,33 @@ div.left_footer, div.middle_footer, div.right_footer {
font-family: "Roboto-Regular","Arial",sans-serif;
}
.termine ul > li > ul {
.termine ul > li > ul, .vorstand ul > li > ul {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-gap: 0;
}
.termine ul > li > ul,{
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
}
.vorstand ul > li > ul {
grid-template-columns: 1fr;
grid-template-rows: auto auto;
grid-gap: 0;
}
.termine ul > li > ul > div{
.termine ul > li > ul > div, .vorstand ul > li > ul > div{
font-weight: normal;
padding: 0;
margin: 0;
text-align: left;
}
.termine ul > li > ul > li {
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
display: table-cell;
}
@ -642,7 +697,13 @@ div.left_footer, div.middle_footer, div.right_footer {
grid-column: span 2;
}
.termine ul > li > ul > li > div {
.vorstand ul > li > ul > li:nth-child(1), .vorstand ul > li > ul > li:nth-child(2){
width: 700px;
grid-column: span 1;
}
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
font-family: "Roboto-Light","Arial",sans-serif;
padding: calc(10px * 0.7) calc(10px * 0.7);
}
@ -654,7 +715,11 @@ div.left_footer, div.middle_footer, div.right_footer {
padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7);
}
.termine ul > li > div, .termine ul > li > ul > li > div {
.vorstand ul > li > ul > li:nth-child(1) > div, .vorstand ul > li > ul > li:nth-child(2) > div{ width: 680px; }
.vorstand ul > li > ul > li:nth-child(2) > div { padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7); }
.termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div {
font-size: 24px;
}

26
lektor/lektordata/project/content/vorstand/contents.lr
View file

@ -4,13 +4,23 @@ title: Vorstand
---
body:
| Name | Funktion(en) | E-Mail-Adresse |
|--|--|--|
| **Ulrich Roland** | Präsident | praesidium@pc-stammertal.ch |
| **Ita Regula** | Kassierin | kasse@pc-stammertal.ch |
| **Arnold Sonja** | Aktuarin | aktuariat@pc-stammertal.ch |
| **Müller Konrad** | 1. Schützenmeister | schiesswesen@pc-stammertal.ch |
| **Bollinger Reto** | Schützenmeister, Beisitz | beisitz@pc-stammertal.ch |
| **Horvath Richard** | Schützenmeister, Fähnrich, Standwart | infrastruktur@pc-stammertal.ch |
* <div>Ulrich Roland</div>&nbsp;
* <div>Präsident</div>&nbsp;
* <div>praesidium@pc-stammertal.ch</div>&nbsp;
* <div>Ita Regula</div>&nbsp;
* <div>Kassierin</div>&nbsp;
* <div>kasse@pc-stammertal.ch</div>&nbsp;
* <div>Arnold Sonja</div>&nbsp;
* <div>Aktuarin</div>&nbsp;
* <div>aktuariat@pc-stammertal.ch</div>&nbsp;
* <div>Müller Konrad</div>&nbsp;
* <div>1. Schützenmeister</div>&nbsp;
* <div>schiesswesen@pc-stammertal.ch</div>&nbsp;
* <div>Bollinger Reto</div>&nbsp;
* <div>Schützenmeister, Beisitz</div>&nbsp;
* <div>beisitz@pc-stammertal.ch</div>&nbsp;
* <div>Horvath Richard</div>&nbsp;
* <div>Schützenmeister, Fähnrich, Standwart</div>&nbsp;
* <div>infrastruktur@pc-stammertal.ch</div>&nbsp;
---
_template: page.html

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

@ -42,6 +42,7 @@
</header>
<div class="page{% if this._path == '/' %} home{% endif
%}{%if this._path == '/termine' %} termine{% endif
%}{%if this._path == '/vorstand' %} vorstand{% endif
%}">
{% block body %}{% endblock %}
</div>