From 22292e10ede5d564c10ab3db0a5d4946b5e7d284 Mon Sep 17 00:00:00 2001
From: Eric Bus <eric.bus@websight.nl>
Date: Mon, 25 Nov 2024 20:03:11 +0100
Subject: [PATCH] fix: add banner styling

---
 resources/assets/sass/components/_header.scss |   4 +-
 .../assets/sass/components/_sidebar.scss      |   7 ++
 resources/views/home.blade.php                | 118 +++++++++---------
 resources/views/layouts/sidebar.blade.php     |   7 +-
 resources/views/news.blade.php                |  10 +-
 resources/views/podcastitem.blade.php         |  38 +++---
 resources/views/podcastlist.blade.php         |   4 +-
 resources/views/podcastseries.blade.php       |  34 ++---
 resources/views/programlist.blade.php         |  46 ++++---
 ...bar.blade.php => banner_sidebar.blade.php} |   2 +-
 10 files changed, 148 insertions(+), 122 deletions(-)
 rename resources/views/widgets/{add_sidebar.blade.php => banner_sidebar.blade.php} (58%)

diff --git a/resources/assets/sass/components/_header.scss b/resources/assets/sass/components/_header.scss
index a3651da0..1b8d2e7e 100644
--- a/resources/assets/sass/components/_header.scss
+++ b/resources/assets/sass/components/_header.scss
@@ -7,7 +7,7 @@
       height: 95px;
     }
   }
-  .advertisement {
+  ins[data-revive-zoneid] {
     float: right;
     width: 728px;
     height: 90px;
@@ -25,7 +25,7 @@
     .logo {
       float: none;
     }
-    .advertisement {
+    ins[data-revive-zoneid] {
       float: none;
     }
   }
diff --git a/resources/assets/sass/components/_sidebar.scss b/resources/assets/sass/components/_sidebar.scss
index 2f0fa0f3..c14c61ec 100644
--- a/resources/assets/sass/components/_sidebar.scss
+++ b/resources/assets/sass/components/_sidebar.scss
@@ -1,3 +1,10 @@
+ins[data-revive-zoneid="2"] {
+  width: 100%;
+  height: 275px;
+  margin: 11px auto 50px auto;
+  background-color: #efefef;
+}
+
 @media (max-width: 768px) {
   .sidebar {
     width: 100%;
diff --git a/resources/views/home.blade.php b/resources/views/home.blade.php
index f7fdb831..50826e8d 100644
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@@ -48,19 +48,19 @@
                                 </div>
                             </div>
                         @endif
-                            @if($item = next($news))
-                                <div class="post large d-block d-md-none">
-                                    <a href="{{url($item->url)}}" title="{{$item->title}}">
-                                        @if($item->video)
-                                            <span class="icon video"></span>
-                                        @elseif($item->images && count($item->images) > 1)
-                                            <span class="icon gallery"></span>
-                                        @endif
-                                        <img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
-                                             alt='img'>
-                                    </a>
-                                    <div class="slider_content_box">
-                                        <ul class="post_details simple">
+                        @if($item = next($news))
+                            <div class="post large d-block d-md-none">
+                                <a href="{{url($item->url)}}" title="{{$item->title}}">
+                                    @if($item->video)
+                                        <span class="icon video"></span>
+                                    @elseif($item->images && count($item->images) > 1)
+                                        <span class="icon gallery"></span>
+                                    @endif
+                                    <img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
+                                         alt='img'>
+                                </a>
+                                <div class="slider_content_box">
+                                    <ul class="post_details simple">
                                         @foreach($item->tags as $tag)
                                             <li class="category">
                                                 <a title="{{$tag->titel}}"
@@ -68,23 +68,23 @@
                                                    class="over_image">{{$tag->titel}}</a>
                                             </li>
                                         @endforeach
-                                        </ul>
-                                        <h2><a href="{{url($item->url)}}"
-                                               title="{{$item->title}}">{!!$item->title!!}</a></h2>
-                                            <?php
-                                            $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
-                                            if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
-                                                $time .= ' | bijgewerkt: '
-                                                    . ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
-                                                    . ' ' . $item->edited->format('H:i') . ' uur';
-                                            }
-                                            ?>
-                                        <span class="post_date" title="{{$time}}">
+                                    </ul>
+                                    <h2><a href="{{url($item->url)}}"
+                                           title="{{$item->title}}">{!!$item->title!!}</a></h2>
+                                        <?php
+                                        $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
+                                        if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
+                                            $time .= ' | bijgewerkt: '
+                                                . ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
+                                                . ' ' . $item->edited->format('H:i') . ' uur';
+                                        }
+                                        ?>
+                                    <span class="post_date" title="{{$time}}">
                                         <i class="fa-regular fa-clock"></i> {{$time}}
                                     </span>
-                                    </div>
                                 </div>
-                            @endif
+                            </div>
+                        @endif
                     </div>
                     <div class="col-8 col-md-6">
                         <div class="row">
@@ -102,16 +102,16 @@
                                     </a>
                                     <div class="slider_content_box">
                                         <ul class="post_details simple">
-                                        @foreach($item->tags as $tag)
-                                            <li class="category">
-                                                <a title="{{$tag->titel}}"
-                                                   href="{{route('nieuws.tag', ['tag' => $tag->slug])}}"
-                                                   class="over_image">{{$tag->titel}}</a>
-                                            </li>
-                                        @endforeach
+                                            @foreach($item->tags as $tag)
+                                                <li class="category">
+                                                    <a title="{{$tag->titel}}"
+                                                       href="{{route('nieuws.tag', ['tag' => $tag->slug])}}"
+                                                       class="over_image">{{$tag->titel}}</a>
+                                                </li>
+                                            @endforeach
                                         </ul>
                                         <h5 class="post_title"><a href="{{url($item->url)}}"
-                                               title="{{$item->title}}">{!!$item->title!!}</a></h5>
+                                                                  title="{{$item->title}}">{!!$item->title!!}</a></h5>
                                             <?php
                                             $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
                                             if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
@@ -136,9 +136,9 @@
         <div class="grey_background">
             <div class="body_container row">
                 @if(!isset($disableBanners) || !$disableBanners)
-                <div class="col-12">
-                    <ins data-revive-zoneid="4" data-revive-id="1f60109562f7b845e90ed597afbbcfa1"></ins>
-                </div>
+                    <div class="col-12">
+                        <ins data-revive-zoneid="4" data-revive-id="1f60109562f7b845e90ed597afbbcfa1"></ins>
+                    </div>
                 @endif
                 <div class="col-12 col-md content_container">
                     <div class="row">
@@ -171,30 +171,32 @@
                             <div class="row">
                                 <div class="col-12 col-md-6">
                                     <a href="{{$url}}" title="{{$podcast->title}}">
-					<img src="{{($hasImage = $podcast->image && $podcast->image->url) ? $imgBase . $podcast->image->url : '/images/noimage.png'}}"/>
-<div class="sentence">
-	<?php
-				$sentence = [];
-                if ($hasImage) {
-					$sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
-				} elseif (isset($podcast->image->title) && $podcast->image->title) {
-					$sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
-				}
-				if (isset($podcast->image->author) && $podcast->image->author) {
-					$sentence[] = '<span class="author">' . $podcast->image->author . '</span>';
-				}
-				$sentence = join('<span class="separator">|</span>', $sentence);
-			?>
-	{!!$sentence!!}
-</div>
+                                        <img src="{{($hasImage = $podcast->image && $podcast->image->url) ? $imgBase . $podcast->image->url : '/images/noimage.png'}}"/>
+                                        <div class="sentence">
+                                                <?php
+                                                $sentence = [];
+                                                if ($hasImage) {
+                                                    $sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
+                                                } elseif (isset($podcast->image->title) && $podcast->image->title) {
+                                                    $sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
+                                                }
+                                                if (isset($podcast->image->author) && $podcast->image->author) {
+                                                    $sentence[] = '<span class="author">' . $podcast->image->author . '</span>';
+                                                }
+                                                $sentence = join('<span class="separator">|</span>', $sentence);
+                                                ?>
+                                            {!!$sentence!!}
+                                        </div>
 
                                     </a>
                                 </div>
                                 <div class="col-12 col-md-6">
-                                    <h2 class="post_title"><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->title!!}</a></h2>
+                                    <h2 class="post_title"><a href="{{$url}}"
+                                                              title="{{$podcast->title}}">{!!$podcast->title!!}</a></h2>
                                     <div class="sub_title">
                                         @if ($podcast->program)
-                                            <a class="program_name" href="{{ route('programma') . $podcast->program->url }}"
+                                            <a class="program_name"
+                                               href="{{ route('programma') . $podcast->program->url }}"
                                                title="{{$podcast->program->name}}">{{$podcast->program->name}}</a>
                                         @endif
                                         <span class="post_date" title="{{Formatter::relativeDate($podcast->created)}}">
@@ -213,11 +215,11 @@
                 <div class="col-12 col-md-auto sidebar">
                     @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_homepage_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                    @include('widgets.banner_sidebar')
 
                     @include('widgets/contact', [])
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_homepage_side2', 'ad_sidebarId' => 'nhgooi_sidebar2'])
+                    @include('widgets.banner_sidebar')
                 </div>
             </div>
         </div>
diff --git a/resources/views/layouts/sidebar.blade.php b/resources/views/layouts/sidebar.blade.php
index a47ad0c4..6ef3d534 100644
--- a/resources/views/layouts/sidebar.blade.php
+++ b/resources/views/layouts/sidebar.blade.php
@@ -1,6 +1,7 @@
 @extends('layouts/master')
 
-@section('content_class')box
+@section('content_class')
+    box
 @endsection
 
 @section('page')
@@ -57,13 +58,13 @@
                         </div>
                     @endif
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                    @include('widgets.banner_sidebar')
 
                     @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
 
                     @include('widgets/contact', [])
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar2 ?? 'nhgooi_section_side2', 'ad_sidebarId' => 'nhgooi_sidebar2'])
+                    @include('widgets.banner_sidebar')
                 @show
             </div>
         </div>
diff --git a/resources/views/news.blade.php b/resources/views/news.blade.php
index 67f771c1..48dd93f2 100644
--- a/resources/views/news.blade.php
+++ b/resources/views/news.blade.php
@@ -14,9 +14,9 @@
         <div class="grey_background">
             <div class="body_container row">
                 @if(!isset($disableBanners) || !$disableBanners)
-                <div class="col-12">
-                    <ins data-revive-zoneid="5" data-revive-id="1f60109562f7b845e90ed597afbbcfa1"></ins>
-                </div>
+                    <div class="col-12">
+                        <ins data-revive-zoneid="5" data-revive-id="1f60109562f7b845e90ed597afbbcfa1"></ins>
+                    </div>
                 @endif
                 <div class="col-12 col-md content_container">
                     <div class="row">
@@ -43,7 +43,7 @@
 
                     @include('widgets/contact', [])
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_article_side' ?? false, 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                    @include('widgets.banner_sidebar')
 
                     <div class="podcast_items">
                         <h4 class="box_header small"><span>Fragment gemist</span></h4>
@@ -52,7 +52,7 @@
                         </div>
                     </div>
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_article_side2' ?? false, 'ad_sidebarId' => 'nhgooi_sidebar2'])
+                    @include('widgets.banner_sidebar')
                 </div>
             </div>
         </div>
diff --git a/resources/views/podcastitem.blade.php b/resources/views/podcastitem.blade.php
index 9d008889..e4299615 100644
--- a/resources/views/podcastitem.blade.php
+++ b/resources/views/podcastitem.blade.php
@@ -3,13 +3,13 @@
 @include('widgets/mediaplayer')
 
 @section('title')
-   @if($podcast)
-     {{ $podcast->title }}
-   @elseif($isPodcast)
-     NH Gooi Podcast
-   @else
-     Fragment gemist
-   @endif
+	@if($podcast)
+		{{ $podcast->title }}
+	@elseif($isPodcast)
+		NH Gooi Podcast
+	@else
+		Fragment gemist
+	@endif
 @endsection
 
 @section('page_class')
@@ -20,11 +20,11 @@
 	<ul class="bread_crumb">
 		<li><a title="Home" href="/">Home</a></li>
 		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
-                @if($isPodcast)
-		<li>NH Gooi podcast</li>
-                @else
-		<li><a title="Home" href="/gemist/fragment">Fragment gemist</a></li>
-	        @endif
+		@if($isPodcast)
+			<li>NH Gooi podcast</li>
+		@else
+			<li><a title="Home" href="/gemist/fragment">Fragment gemist</a></li>
+		@endif
 		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
 		@if($podcast && $podcast->program)
 			<li><a title="{{$podcast->program->name}}"
@@ -88,11 +88,11 @@
 
 @section('content')
 	@if ($podcast)
-		<?php
+			<?php
 			$audioUrl = url($apiUrl . 'podcast/download' . $podcast->url . "?auth=" . $podcast->auth);
 			$streamUrl = url($apiUrl . 'podcast/stream' . $podcast->url . "?auth=" . $podcast->auth);
 			$popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
-		?>
+			?>
 
 		<div class="">
 			<div class="row news_post">
@@ -120,7 +120,8 @@
 								])
 
 								<div class="clearfix">
-									<a class="action_button btn" href="{{$audioUrl}}" title="Download dit fragment als MP3">
+									<a class="action_button btn" href="{{$audioUrl}}"
+									   title="Download dit fragment als MP3">
 										<span>Download fragment</span>
 									</a>
 									<a class="action_button btn player" href="{{$popoutUrl}}" onclick="pause()">
@@ -160,7 +161,8 @@
 						<div data-tabs>
 							<div class="tabs">
 								<h4 data-tab-content-id="tab_more_fragmenten"
-									class="box_header small flex-grow-1 active"><span>Meer {{$isPodcast ? 'afleveringen' : 'fragmenten'}}</span>
+									class="box_header small flex-grow-1 active">
+									<span>Meer {{$isPodcast ? 'afleveringen' : 'fragmenten'}}</span>
 								</h4>
 							</div>
 							<div id="tab_more_fragmenten" class="box tab_content podcast_items active">
@@ -174,8 +176,8 @@
 						</div>
 					@endif
 
-					@include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+					@include('widgets.banner_sidebar')
 				</div>
-		</div>
+			</div>
 	@endif
 @endsection
diff --git a/resources/views/podcastlist.blade.php b/resources/views/podcastlist.blade.php
index 4cd8e5f8..1db892b1 100644
--- a/resources/views/podcastlist.blade.php
+++ b/resources/views/podcastlist.blade.php
@@ -54,7 +54,7 @@
                     </p>
                 @else
                     <p class="page_body">Hele uitzendingen kunt u binnen twee weken terugluisteren via <a
-                                href="{{route('gemist.programma')}}">programma gemist</a>.<br /><br />
+                                href="{{route('gemist.programma')}}">programma gemist</a>.<br/><br/>
                 @endif
 
                 @if(isset($podcasts))
@@ -109,7 +109,7 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>
diff --git a/resources/views/podcastseries.blade.php b/resources/views/podcastseries.blade.php
index 582c69f8..f3cb6241 100644
--- a/resources/views/podcastseries.blade.php
+++ b/resources/views/podcastseries.blade.php
@@ -1,11 +1,11 @@
 @extends('layouts/full')
 
 @section('title')
-   @if(isset($program))
-     {{ $program->name }}
-   @else
-     NH Gooi Podcast
-   @endif
+    @if(isset($program))
+        {{ $program->name }}
+    @else
+        NH Gooi Podcast
+    @endif
 @endsection
 
 @section('page_class')
@@ -40,18 +40,18 @@
                         </div>
                     </div>
                 @endif
-                    @if($podcasts)
+                @if($podcasts)
 
-                        <div class="page_layout clearfix">
-                            <div class="grid" id="items">
-                                @include('partial/podcastdirectitems', ['podcasts' => array_slice($podcasts, 0, 2), 'isPodcast' => $isPodcast])
-                            </div><!--/.row-->
-                        </div>
-                    @else
-                        <div class="box full-width">
-                            <p class="page_body">Er zijn geen items beschikbaar.</p>
-                        </div>
-                    @endif
+                    <div class="page_layout clearfix">
+                        <div class="grid" id="items">
+                            @include('partial/podcastdirectitems', ['podcasts' => array_slice($podcasts, 0, 2), 'isPodcast' => $isPodcast])
+                        </div><!--/.row-->
+                    </div>
+                @else
+                    <div class="box full-width">
+                        <p class="page_body">Er zijn geen items beschikbaar.</p>
+                    </div>
+                @endif
             </div>
             <div class="col-12 col-md-auto sidebar">
 
@@ -73,7 +73,7 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>
diff --git a/resources/views/programlist.blade.php b/resources/views/programlist.blade.php
index 270b11e9..e96afe30 100644
--- a/resources/views/programlist.blade.php
+++ b/resources/views/programlist.blade.php
@@ -1,10 +1,12 @@
 @extends('layouts/full')
 
 @section('title')
-  Programma gemist
+    Programma gemist
 @endsection
 
-@section('page_class')news_post post_container @endsection
+@section('page_class')
+    news_post post_container
+@endsection
 
 @section('breadcrumb')
     @if(isset($program))
@@ -51,7 +53,8 @@
                            class="btn btn-info">Programmainfo</a>
                     </p>
                 @else
-                    <p class="page_body">U kunt programma's terugluisteren tot twee weken na uitzending. Items blijven onbeperkt beschikbaar via <a href="{{route('gemist.fragment')}}">fragment gemist</a>.<br /><br />
+                    <p class="page_body">U kunt programma's terugluisteren tot twee weken na uitzending. Items blijven
+                        onbeperkt beschikbaar via <a href="{{route('gemist.fragment')}}">fragment gemist</a>.<br/><br/>
                 @endif
 
                 @if(isset($programs))
@@ -106,20 +109,31 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>
-<style>
-    @keyframes tilt-shaking {
-        0% { transform: rotate(0deg); }
-        25% { transform: rotate(5deg); }
-        50% { transform: rotate(0deg); }
-        75% { transform: rotate(-5deg); }
-        100% { transform: rotate(0deg); }
-    }
-    .post_container .post_tags li a {
-        animation: tilt-shaking 1s linear infinite;
-    }
-</style>
+    <style>
+        @keyframes tilt-shaking {
+            0% {
+                transform: rotate(0deg);
+            }
+            25% {
+                transform: rotate(5deg);
+            }
+            50% {
+                transform: rotate(0deg);
+            }
+            75% {
+                transform: rotate(-5deg);
+            }
+            100% {
+                transform: rotate(0deg);
+            }
+        }
+
+        .post_container .post_tags li a {
+            animation: tilt-shaking 1s linear infinite;
+        }
+    </style>
 @endsection
diff --git a/resources/views/widgets/add_sidebar.blade.php b/resources/views/widgets/banner_sidebar.blade.php
similarity index 58%
rename from resources/views/widgets/add_sidebar.blade.php
rename to resources/views/widgets/banner_sidebar.blade.php
index 5bf35ecb..bfbd619f 100644
--- a/resources/views/widgets/add_sidebar.blade.php
+++ b/resources/views/widgets/banner_sidebar.blade.php
@@ -1,3 +1,3 @@
-@if ($ad_sidebar && (!isset($disableBanners) || !$disableBanners))
+@if (!isset($disableBanners) || !$disableBanners)
     <ins data-revive-zoneid="2" data-revive-id="1f60109562f7b845e90ed597afbbcfa1"></ins>
 @endif