Skip to content

Commit

Permalink
Showing Opening Hours section with MB Views
Browse files Browse the repository at this point in the history
  • Loading branch information
@imcuong98
imcuong98 committed Jan 25, 2022
1 parent 18a58e2 commit 5495291
Show file tree
Hide file tree
Showing 2 changed files with 395 additions and 0 deletions.
81 changes: 81 additions & 0 deletions showing-opening-hours-section-with-MB-Views/style-view.css
View file
@@ -0,0 +1,81 @@
.single .page-header {
display: none;
}

.container.detail-restaurant {
padding: 50px 0;
}

.container.detail-restaurant .featured-image {
width: 100%;
max-height: 600px;
object-fit: cover;
}

.container.detail-restaurant .voucher {
clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 15% 100%, 0% 50%, 15% 0%);
background: rgba(231,57,72,.85);
padding: 5px 20px 5px 30px;
width: max-content;
margin: 20px 0 10px;
color: #fff;
}
.container.detail-restaurant .name-restaurant {
margin: 0;
}

.container.detail-restaurant p {
margin: 0;
}

.group-layout {
display: flex;
}

.group-layout .infor-restaurant {
width: 45%;
}

.container.detail-restaurant .opening-hours {
max-width: 300px;
margin: 0 auto;
width: 100%;
}

.container.detail-restaurant .opening-hours h2 {
margin: 0 0 10px;
text-align: center;
border: 4px solid rgba(231,57,72,.85);
border-right: 0;
border-left: 0;
}

.container.detail-restaurant .detail-schedule .date-time {
display: flex;
width: 100%;
justify-content: space-between;
flex-wrap: wrap;
align-items: baseline;
}

.container.detail-restaurant .detail-schedule .date-time .hour .starting-hour:after{
content: '-';
margin: 0 5px;
}

.container.detail-restaurant .detail-schedule .date-time .hour .time-slot {
display: flex;
}

.container.detail-restaurant .detail-schedule .date-time .date {
font-weight: 700;
font-size: 15px;
}

.container.detail-restaurant .detail-schedule {
display: flex;
flex-wrap: wrap;
justify-content: center;
border-bottom: 4px solid rgba(231,57,72,.85);
padding-bottom: 10px;
}
314 changes: 314 additions & 0 deletions showing-opening-hours-section-with-MB-Views/template.php
View file
@@ -0,0 +1,314 @@
<div class="opening-hours">
<h2>
Opening Hours
</h2>
<div class="detail-schedule">
{% set options = post.choose_an_options.value %}
{% if (options == "all_days_are_the_same") %}
{% set all_day_the_same = post.all_days_have_the_same_opening_hours.type_of_opening_hours.value %}
{% if ( all_day_the_same == "enter_hours") %}
<div class="date-time">
<div class="date">
Mon - Sun
</div>
<div class="hour">
{% for clone in post.all_days_have_the_same_opening_hours.choose_time_slots %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Mon - Sun
</div>
<div class="hour">
{{ post.all_days_have_the_same_opening_hours.type_of_opening_hours.label }}
</div>
</div>
{% endif %}
<!-- End "All days are the same" option -->
{% elseif (options == "difference_between_weekdays_and_weekend") %}
{% set weekdays = post.weekdays.type_of_opening_hours_weekdays.value %}
{% set weekend = post.weekend.type_of_opening_hours_weekend.value %}
{% if (weekdays == "enter_hours") %}
<div class="date-time">
<div class="date">
Mon - Fri
</div>
<div class="hour">
{% for clone in post.weekdays.choose_time_slots_weekdays %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_weekdays | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_weekdays | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Mon - Fri
</div>
<div class="hour">
{{ post.weekdays.type_of_opening_hours_weekdays.label }}
</div>
</div>
{% endif %}
<!-- End weekdays -->
{% if (weekend == "enter_hours") %}
<div class="date-time">
<div class="date">
Sat - Sun
</div>
<div class="hour">
{% for clone in post.weekend.choose_time_slots_weekend %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_weekend | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_weekend | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Sat - Sun
</div>
<div class="hour">
{{ post.weekend.type_of_opening_hours_weekend.label }}
</div>
</div>
{% endif %}
<!-- End weekend -->
<!-- End "Difference between weekdays and weekend" option -->
{% else %}
{% set monday = post.monday.type_of_opening_hours_monday.value %}
{% set tuesday = post.tuesday.type_of_opening_hours_tuesday.value %}
{% set wednesday = post.wednesday.type_of_opening_hours_wednesday.value %}
{% set thursday = post.thursday.type_of_opening_hours_thursday.value %}
{% set friday = post.friday.type_of_opening_hours_friday.value %}
{% set saturday = post.saturday.type_of_opening_hours_saturday.value %}
{% set sunday = post.sunday.type_of_opening_hours_sunday.value %}
{% if (monday == "enter_hours") %}
<div class="date-time">
<div class="date">
Monday
</div>
<div class="hour">
{% for clone in post.monday.choose_time_slots_monday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_monday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_monday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Monday
</div>
<div class="hour">
{{ post.monday.type_of_opening_hours_monday.label }}
</div>
</div>
{% endif %}
<!-- End Monday -->
{% if (tuesday == "enter_hours") %}
<div class="date-time">
<div class="date">
Tuesday
</div>
<div class="hour">
{% for clone in post.tuesday.choose_time_slots_tuesday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_tuesday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_tuesday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Tuesday
</div>
<div class="hour">
{{ post.tuesday.type_of_opening_hours_tuesday.label }}
</div>
</div>
{% endif %}
<!-- End Tuesday -->
{% if (wednesday == "enter_hours") %}
<div class="date-time">
<div class="date">
Wednesday
</div>
<div class="hour">
{% for clone in post.wednesday.choose_time_slots_wednesday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_wednesday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_wednesday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Wednesday
</div>
<div class="hour">
{{ post.wednesday.type_of_opening_hours_wednesday.label }}
</div>
</div>
{% endif %}
<!-- End Wednesday -->
{% if (thursday == "enter_hours") %}
<div class="date-time">
<div class="date">
Thursday
</div>
<div class="hour">
{% for clone in post.thursday.choose_time_slots_thursday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_thursday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_thursday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Thursday
</div>
<div class="hour">
{{ post.thursday.type_of_opening_hours_thursday.label }}
</div>
</div>
{% endif %}
<!-- End Thursday -->
{% if (friday == "enter_hours") %}
<div class="date-time">
<div class="date">
Friday
</div>
<div class="hour">
{% for clone in post.friday.choose_time_slots_friday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_friday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_friday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Friday
</div>
<div class="hour">
{{ post.friday.type_of_opening_hours_friday.label }}
</div>
</div>
{% endif %}
<!-- End Friday -->
{% if (saturday == "enter_hours") %}
<div class="date-time">
<div class="date">
Saturday
</div>
<div class="hour">
{% for clone in post.saturday.choose_time_slots_saturday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_saturday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_saturday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Saturday
</div>
<div class="hour">
{{ post.saturday.type_of_opening_hours_saturday.label }}
</div>
</div>
{% endif %}
<!-- End Saturday -->
{% if (sunday == "enter_hours") %}
<div class="date-time">
<div class="date">
Sunday
</div>
<div class="hour">
{% for clone in post.sunday.choose_time_slots_sunday %}
<div class="time-slot">
<p class="starting-hour">
{{ clone.start_time_sunday | date( 'h:i A' ) }}
</p>
<p class="ending-hour">
{{ clone.end_time_sunday | date( 'h:i A' ) }}
</p>
</div>
{% endfor %}
</div>
</div>
{% else %}
<div class="date-time">
<div class="date">
Sunday
</div>
<div class="hour">
{{ post.sunday.type_of_opening_hours_sunday.label }}
</div>
</div>
{% endif %}
<!-- End Sunday -->
{% endif %}
</div>
</div>

0 comments on commit 5495291

Please sign in to comment.