MickSlash
/
Cocktail-DB
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

CSS Cocktail Google Font

master
Michael Vignotto 2020-06-03 19:02:32 +02:00
parent 4b6ebdc3fa
commit 5c449851ac
2 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
cocktail_list/templates/cocktail.html
View File

@ -5,6 +5,7 @@
<link rel="stylesheet" href="{% static 'css/cocktail.css' %}"> <link rel="stylesheet" href="{% static 'css/cocktail.css' %}">
<link href="https://fonts.googleapis.com/css2?family=Faster+One&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Faster+One&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap" rel="stylesheet">
{% endblock css %} {% endblock css %}
@ -15,7 +16,7 @@ COCKTAIL | {{ cocktail.nome_cocktail }}
{% block content %} {% block content %}
<div class="card mt-3"> <div class="card mt-3">
<div class="card-header"> <div class="card-header">
<h3 class="card-title text-center">{{ cocktail.nome_cocktail }}</h3> <h3 class="card-title text-center text-on-header">{{ cocktail.nome_cocktail }}</h3>
</div> </div>
<div class="row no-gutters"> <div class="row no-gutters">
<div class="col-md-5"> <div class="col-md-5">
@ -23,7 +24,7 @@ COCKTAIL | {{ cocktail.nome_cocktail }}
</div> </div>
<div class="col-md-7"> <div class="col-md-7">
<div class="card-body"> <div class="card-body">
<h5 class="card-text text-center">INGREDIENTI : </h5> <h5 class="card-text text-center text-on-header">INGREDIENTI : </h5>
<hr> <hr>
<ul> <ul>
{% for ingredienti in cocktail.ingredienti.all %} {% for ingredienti in cocktail.ingredienti.all %}
@ -32,13 +33,13 @@ COCKTAIL | {{ cocktail.nome_cocktail }}
</ul> </ul>
<hr> <hr>
<h5 class="card-text text-center">PREPARAZIONE : </h5> <h5 class="card-text text-center text-on-header">PREPARAZIONE : </h5>
<p class="card-text text-center text-on-body">{{ cocktail.preparazione }}</p> <p class="card-text text-center text-on-body">{{ cocktail.preparazione }}</p>
<hr> <hr>
<h5 class="card-text text-center">STORIA : </h5> <h5 class="card-text text-center text-on-header">STORIA : </h5>
<p class="card-text text-center text-on-body">{{ cocktail.storia }}</p> <p class="card-text text-center text-on-body">{{ cocktail.storia }}</p>
<hr> <hr>
<h5 class="card-text text-center">CURIOSITÁ : </h5> <h5 class="card-text text-center text-on-header">CURIOSITÁ : </h5>
<p class="card-text text-center text-on-body">{{ cocktail.curiositá }}</p> <p class="card-text text-center text-on-body">{{ cocktail.curiositá }}</p>
</div> </div>
</div> </div>

8
static-storage/css/cocktail.css
View File

@ -1,6 +1,12 @@
.text-on-body{ .text-on-header{
color: black; color: black;
font-family: 'Pacifico', cursive; font-family: 'Pacifico', cursive;
font-size: 20px; font-size: 20px;
text-transform: uppercase;
}
.text-on-body{
color: black;
font-family: 'Indie Flower', cursive;
font-size: 25px;
} }