<?php
/**
* Template Name: 100% Width - Menu
* A full-width template.
*
* @package Avada
* @subpackage Templates
*/
// Do not allow directly accessing this file.
if ( ! defined( 'ABSPATH' ) ) {
exit( 'Direct script access denied.' );
}
?>
<?php get_header(); ?>
<section id="content" class="full-width">
<div class="img_top_menu"></div>
<div id="blocco_centrale">
<!--Inicio Repeater Categoria-->
<?php if(have_rows('categoria' , 'option')): while(have_rows('categoria' , 'option')) : the_row(); ?>
<div class="blocco_menu">
<!-- Grupo Título -->
<?php if(have_rows('gruppo_titolo')): while(have_rows('gruppo_titolo')) : the_row(); ?>
<div class="blocco_titolo">
<div class="titolo_categoria">
<h2><?php the_sub_field('titolo_categoria'); ?></h2>
<h3><?php the_sub_field('sub_titolo_categoria'); ?></h3>
</div>
<img src="<?php the_sub_field('img_categoria'); ?>" alt="">
</div>
<div class="blocco_lista">
<!-- Início repeater produtos -->
<?php if(have_rows('items_categoria' , 'option')): while(have_rows('items_categoria' , 'option')) : the_row(); ?>
<h2><?php the_sub_field('nome_item'); ?> · €<?php the_sub_field('prezzo_item'); ?></h2><sup><?php the_sub_field('allerg_item'); ?></sup>
<p><?php the_sub_field('descrizione_item'); ?></p>
<?php endwhile; else : endif; ?>
<!-- Final repeater produtos -->
<?php endwhile; else : endif; ?>
<!-- Final Grupo Título -->
</div>
</div>
<?php endwhile; else : endif; ?>
<!-- Final Repeater Categoria -->
</div>
</section>
<?php get_footer(); ?>
#main{
padding-right: 0!important;
padding-left: 0!important;
}
.fusion-row{
max-width: inherit!important;
}
.img_top_menu{
width: 100%;
height: 500px;
background-image: url('http://streetburguerferrara.local/wp-content/uploads/2020/09/BANNER_TOP-e1601384845664.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
margin-bottom: 50px
}
#blocco_centrale{
width: 1024px;
background-color: #000;
margin: auto;
}
#blocco_centrale:after {
content: '';
display: block;
clear: both;
}
.blocco_menu{
width: 500px;
margin: 0 6px 15px;
position: relative;
float: left;
}
#blocco_centrale .blocco_menu .blocco_titolo{
overflow: hidden;
width: 100%;
background-color: #fff;
text-align: center;
}
#blocco_centrale .blocco_menu .blocco_titolo h2{
text-transform: uppercase;
font-family: "Din Condensed Bold"!important;
font-size: 40px;
color: #000;
margin: 0;
padding-top: 20px;
}
#blocco_centrale .blocco_menu .blocco_titolo h3{
text-transform: uppercase;
font-family: "Din Condensed Bold"!important;
font-size: 20px;
line-height: 10px;
color: #000;
margin: 0;
}
#blocco_centrale .blocco_menu .blocco_titolo img{
display: block;
float: left;
width: 20%;
padding: 20px;
}
#blocco_centrale .blocco_menu .blocco_titolo .titolo_categoria{
width: 75%;
float: left;
}
#blocco_centrale .blocco_menu .blocco_lista {
overflow: hidden;
border: #fff solid;
border-width: 0px 5px 5px 5px;
padding: 15px;
}
#blocco_centrale .blocco_menu .blocco_lista h2 {
text-transform: uppercase;
font-family: "Din Condensed Bold"!important;
font-size: 30px;
color: #fff;
margin: 0;
display: inline-block;
}
#blocco_centrale .blocco_menu .blocco_lista sup{
font-family: "Din Condensed Bold"!important;
font-size: 15px;
color: #fff;
margin: 0;
padding-left: 5px;
}
#blocco_centrale .blocco_menu .blocco_lista p{
font-family: "helvetica neue";
font-size: 20px;
color: #fff;
margin: 0;
line-height:20px
}
$('#blocco_centrale').isotope({
itemSelector: '.blocco_menu',
layoutMode: 'masonry',
});
This Pen doesn't use any external CSS resources.