Modificato CSS Homepage

cocktail/templates/base.html

@@ -29,6 +29,10 @@
         </form>
       </div>
     </div>
+    {% block beforecontent %}
+      
+    {% endblock beforecontent %}
+
     <div class="container">
         {% block content %}
           

cocktail_list/templates/homepage.html

@@ -5,8 +5,16 @@
 <link rel="stylesheet" href="{% static 'css/style.css' %}">
 <link rel="stylesheet" href="{% static 'css/navbar_style.css' %}">
 <link href="https://fonts.googleapis.com/css2?family=Faster+One&display=swap" rel="stylesheet">  
+<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@900&display=swap" rel="stylesheet">
 {% endblock css %}
 
+{% block beforecontent %}
+<div class="contained-img-bar">
+  <div class="text-contained-img-bar">In totale nel nostro Salone Bar abbiamo {{ lista_cocktail.count }} cocktails</div>
+</div>
+{% endblock beforecontent %}
+
+
 {% block content %}
 <!-- CAROUSEL CHE NON MI PIACE -->
 <!-- <div id="carousel-cocktail" class="carousel slide" data-ride="carousel">
@@ -46,7 +54,7 @@
 </div>
 </div> -->
 <!-- <h1 class="text-center">In totale nel nostro Salone Bar abbiamo {{ lista_cocktail.count }} <i class="fas fa-cocktail"></i> </h1> -->
-<div class="card mt-3">
+<div class="card mt-2 mt-lg-1">
   <div class="card-header">  <h1 class="text-center text-muted">LISTA COCKTAILS : </h1></div>
 </div>
 {% for cocktail in lista_cocktail %}
@@ -69,8 +77,4 @@
   <div class="row"> 
   {% endif %}
   {% endfor %}
-  <div class="contained-img-bar mt-2">
-    <div class="text-contained-img-bar">In totale nel nostro Salone Bar abbiamo {{ lista_cocktail.count }} cocktails</div>
-  </div>
-
 {% endblock content %}

static-storage/css/style.css

@@ -40,6 +40,7 @@ a:hover{
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
+    font-family: 'Orbitron', sans-serif;
 }
 
 #color-for-glass{
@@ -53,6 +54,7 @@ a:hover{
     width: 100%;
 }
 
+
 @media screen and (max-width:600px){
     h1 {
         font-size: 1.5rem!important;