Add tims first feedback, some smaller css adjustments
This commit is contained in:
parent
986b529794
commit
d84de5b391
@ -1,5 +1,29 @@
|
|||||||
/* Globals */
|
/* Globals */
|
||||||
|
|
||||||
|
/* milestone */
|
||||||
|
@font-face {
|
||||||
|
font-family: "Milestone";
|
||||||
|
src:
|
||||||
|
url("./fonts/milestone/milestone.otf") format("opentype"),
|
||||||
|
url("./fonts/milestone/milestone.woff") format("woff"),
|
||||||
|
url("./fonts/milestone/milestone.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
.font-milestone {
|
||||||
|
font-family: "Milestone", "serif";
|
||||||
|
}
|
||||||
|
|
||||||
|
/* oleo-script-regular - latin */
|
||||||
|
@font-face {
|
||||||
|
font-family: "Oleo Script";
|
||||||
|
src:
|
||||||
|
url("./fonts/oleo-script/oleo-script-v14-latin-regular.woff") format("woff"),
|
||||||
|
url("./fonts/oleo-script/oleo-script-v14-latin-regular.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
.font-oleo {
|
||||||
|
font-family: "Oleo Script", "serif";
|
||||||
|
}
|
||||||
|
|
||||||
/* Custom default button */
|
/* Custom default button */
|
||||||
.btn-secondary,
|
.btn-secondary,
|
||||||
.btn-secondary:hover,
|
.btn-secondary:hover,
|
||||||
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
clubhaus/homepage/static/homepage/background.jpg
Normal file
BIN
clubhaus/homepage/static/homepage/background.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 211 KiB |
@ -26,12 +26,15 @@
|
|||||||
|
|
||||||
{% block extra_header_block %}{% endblock %}
|
{% block extra_header_block %}{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-dark h-100"> <!-- d-flex h-100 text-center text-white bg-dark -->
|
<body class="bg-dark h-100">
|
||||||
|
|
||||||
<div class="d-flex h-100 flex-column"> <!-- d-flex w-100 h-100 p-3 mx-auto flex-column -->
|
<div class="d-flex h-100 flex-column">
|
||||||
<header class="d-flex w-100 p-3 mx-auto flex-column text-white text-center">
|
<header class="container d-flex w-100 p-3 mx-auto flex-column text-white text-center">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="float-md-start mb-0">Clubhaus Schornbach</h3>
|
<h3 class="float-md-start mb-0 font-oleo">
|
||||||
|
<a class="text-white text-decoration-none"
|
||||||
|
href="{% url 'index' %}">Clubhaus Schornbach</a>
|
||||||
|
</h3>
|
||||||
<nav class="nav nav-masthead justify-content-center float-md-end">
|
<nav class="nav nav-masthead justify-content-center float-md-end">
|
||||||
<a class="nav-link fw-bold py-1 px-0 {% if request.path == '/' %}active{% endif %}"
|
<a class="nav-link fw-bold py-1 px-0 {% if request.path == '/' %}active{% endif %}"
|
||||||
href="{% url 'index' %}">Home</a>
|
href="{% url 'index' %}">Home</a>
|
||||||
@ -45,11 +48,11 @@
|
|||||||
|
|
||||||
{% block main %}{% endblock %}
|
{% block main %}{% endblock %}
|
||||||
|
|
||||||
<footer class="d-flex w-100 p-3 mx-auto flex-column text-white text-center text-white-50">
|
<footer class="container d-flex w-100 p-3 mx-auto flex-column text-white text-center text-white-50">
|
||||||
<p>
|
<p>
|
||||||
Clubhaus Schornbach 2007 - {% now 'Y' %}
|
Clubhaus Schornbach 2007 - {% now 'Y' %}
|
||||||
<br>
|
<br>
|
||||||
<a>Impressum</a>
|
<a class="link-secondary" href="{% url 'impressum' %}">Impressum</a>
|
||||||
</p>
|
</p>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
{% block extra_header_block %}
|
{% block extra_header_block %}
|
||||||
<style>
|
<style>
|
||||||
.cus-bg-image {
|
.cus-bg-image {
|
||||||
background-image: url("{% static 'homepage/web-party.jpg' %}");
|
background-image: url("{% static 'homepage/background.jpg' %}");
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
@ -35,7 +35,7 @@
|
|||||||
<div class="container py-4 text-white">
|
<div class="container py-4 text-white">
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<h1 class="display-1 fw-bold">{{ next_event.name }} Event</h1>
|
<h1 class="display-1 fw-bold fst-italic">{{ next_event.name }}</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- countdown -->
|
<!-- countdown -->
|
||||||
@ -61,12 +61,12 @@
|
|||||||
<!-- links -->
|
<!-- links -->
|
||||||
<div class="row justify-content-center my-5">
|
<div class="row justify-content-center my-5">
|
||||||
<div class="col-auto display-6 m-2">
|
<div class="col-auto display-6 m-2">
|
||||||
<a href="#info">
|
<a href="https://open.spotify.com/playlist/00FYaeOKftIb4zWDEShmtD?si=78a7ac31b6f84992" target="_blank">
|
||||||
<span class="badge rounded-pill text-bg-dark"><i class="bi-spotify"></i> Playlist</span>
|
<span class="badge rounded-pill text-bg-dark"><i class="bi-spotify"></i> Playlist</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-auto display-6 m-2">
|
<div class="col-auto display-6 m-2">
|
||||||
<a href="#info">
|
<a href="https://www.wetter.com/deutschland/schorndorf/DE0009600.html" target="_blank">
|
||||||
<span class="badge rounded-pill text-bg-dark"><i class="bi-cloud"></i> Wetter</span>
|
<span class="badge rounded-pill text-bg-dark"><i class="bi-cloud"></i> Wetter</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -13,7 +13,8 @@
|
|||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block main %}
|
{% block main %}
|
||||||
<div class="d-flex h-100 mx-3">
|
<div class="d-flex flex-column h-100 mx-3">
|
||||||
<main class="d-flex flex-grow-1 w-100 my-5 mx-auto bg-logo" style="max-width: 42rem"></main>
|
<main class="d-flex row flex-grow-1 w-100 mt-5 mb-4 mx-auto bg-logo" style="max-width: 42rem"></main>
|
||||||
|
<div class="d-flex mb-3 mt-0 mx-auto flex-column text-white text-center display-3 font-milestone">The Original</div>
|
||||||
</div>
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
@ -3,23 +3,41 @@
|
|||||||
|
|
||||||
{% block site_name %}Tobacco Card{% endblock %}
|
{% block site_name %}Tobacco Card{% endblock %}
|
||||||
|
|
||||||
|
{% block extra_header_block %}
|
||||||
|
<style>
|
||||||
|
.indigo-800 {
|
||||||
|
background-color: #290661;
|
||||||
|
}
|
||||||
|
|
||||||
|
.red-700 {
|
||||||
|
background-color: #841f29;
|
||||||
|
}
|
||||||
|
|
||||||
|
.red-800 {
|
||||||
|
background-color: #58151c;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block extra_scripts_block %}
|
{% block extra_scripts_block %}
|
||||||
<script defer src="{% static 'homepage/assets/masonry/masonry.pkgd.min.js' %}"></script>
|
<script defer src="{% static 'homepage/assets/masonry/masonry.pkgd.min.js' %}"></script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block main %}
|
{% block main %}
|
||||||
<main class="container text-white w-100">
|
<main class="container d-flex flex-grow-1 flex-column text-white w-100">
|
||||||
<div class="row text-center mb-3">
|
<div class="row text-center mb-3">
|
||||||
<h1>Tabacco Card</h1>
|
<h1 class="fst-italic">Tobacco Card</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row m-0" data-masonry='{"percentPosition": true }'>
|
<div class="w-100 row m-0" data-masonry='{"percentPosition": true }'>
|
||||||
{% for tobacco in tobaccos %}
|
{% for tobacco in tobaccos %}
|
||||||
<div class="col-sm-6 col-lg-4 col-sm-12 mb-4 text-center">
|
<div class="col-sm-6 col-lg-4 col-sm-12 mb-4 text-center">
|
||||||
<div class="card {% if tobacco.in_stock %} bg-success {% else %} bg-secondary text-decoration-line-through {% endif %}">
|
<div class="card {% if tobacco.in_stock %} bg-success {% else %} red-700 text-decoration-line-through {% endif %}">
|
||||||
<div class="card-body">
|
<div class="card-header">
|
||||||
<h5 class="card-title">{{ tobacco.name }}</h5>
|
<h4 class="align-baseline">{{ tobacco.name }}</h4>
|
||||||
<h6 class="card-subtitle mb-2">{{ tobacco.category.name }}</h6>
|
<h6 class="card-subtitle mb-2">{{ tobacco.category.name }}</h6>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
<p class="card-text">{{ tobacco.description }}</p>
|
<p class="card-text">{{ tobacco.description }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user