Small fixes

public/css/style.css

@@ -295,7 +295,7 @@ div.pp_default .pp_close:hover {
 }
 .top_menu_container ul.right_menu li, .menu_mobile_container ul.right_menu li {
   float: left;
-  padding: 0 19px;
+  padding: 3px 19px;
   margin: 8px;
   border-right: 1px solid rgba(255, 255, 255, 0.2);
   line-height: 2;
@@ -495,7 +495,8 @@ div.pp_default .pp_close:hover {
   padding: 20px;
   min-width: 70vw;
   max-width: 100vw;
-  overflow: hidden;
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 .mobile_menu_container nav ul, .mobile_menu_container nav li, .mobile_menu_container nav li a {
   width: 100%;
@@ -1048,6 +1049,9 @@ div.pp_default .pp_close:hover {
   margin: 10px 0;
 }
 
+.podcast_items .box {
+  margin-bottom: 10px;
+}
 .podcast_items ul {
   margin: 0;
   padding: 0;
@@ -1058,8 +1062,10 @@ div.pp_default .pp_close:hover {
   margin-right: calc(-0.5 * var(--bs-gutter-x));
   margin-left: calc(-0.5 * var(--bs-gutter-x));
 }
-.podcast_items ul li {
+@media (min-width: 768px) {
-  margin-bottom: 25px;
+  .podcast_items ul li {
+    margin-bottom: 25px;
+  }
 }
 .podcast_items ul li h2 {
   margin: 0;
@@ -1140,7 +1146,7 @@ div.pp_default .pp_close:hover {
   }
 }
 
-.page_title {
+.page_title, .page_title2 {
   margin: 17px 0;
   font-family: Montserrat, serif;
   font-size: 30px;
@@ -1150,11 +1156,15 @@ div.pp_default .pp_close:hover {
   color: #282828;
 }
 @media (min-width: 768px) {
-  .page_title {
+  .page_title, .page_title2 {
     font-size: 40px;
   }
 }
 
+.page_title2 {
+  font-size: 30px;
+}
+
 .post_container {
   max-width: 1170px;
   margin: 0 auto;
@@ -1209,7 +1219,7 @@ div.pp_default .pp_close:hover {
 .post_container .post_body .sentence {
   font-size: 12px;
   font-style: italic;
-  line-height: 3.17;
+  line-height: 1.3;
   text-align: right;
   color: #585858;
   display: block;
@@ -1482,13 +1492,22 @@ div.pp_default .pp_close:hover {
   margin-bottom: 20px;
 }
 .footer_container .footer_menu2 li {
-  float: left;
   margin-right: 40px;
   padding: 9px 0;
 }
+@media (min-width: 768px) {
+  .footer_container .footer_menu2 li {
+    float: left;
+  }
+}
 .footer_container .footer_menu2 li:first-child {
   padding: 0;
 }
+@media (max-width: 768px) {
+  .footer_container .footer_menu2 li:first-child {
+    padding: 0 0 15px 0;
+  }
+}
 .footer_container .footer_menu2 li .logo {
   display: block;
   width: 115px;
@@ -1580,4 +1599,10 @@ a, a:hover, a:active {
   color: #0f259d;
 }
 
+@media (min-width: 768px) {
+  .md_padding_top_80 {
+    padding-top: 80px;
+  }
+}
+
 /*# sourceMappingURL=style.css.map */

resources/assets/sass/base/_base.scss

@@ -29,3 +29,9 @@
 a, a:hover, a:active {
   color: #0f259d;
 }
+
+@media (min-width: 768px) {
+  .md_padding_top_80 {
+    padding-top: 80px
+  }
+}

resources/assets/sass/components/_footer.scss

@@ -75,11 +75,16 @@
     margin-bottom: 20px;
 
     li {
-      float: left;
+      @media (min-width: 768px) {
+        float: left;
+      }
       margin-right: 40px;
       padding: 9px 0;
       &:first-child {
         padding: 0;
+        @media (max-width: 768px) {
+          padding: 0 0 15px 0;
+        }
       }
 
       .logo {

resources/assets/sass/components/_menu.scss

@@ -109,7 +109,7 @@
 
     li {
       float: left;
-      padding: 0 19px;
+      padding: 3px 19px;
       margin: 8px;
       border-right: 1px solid rgba(255, 255, 255, 0.2);
       line-height: 2;
@@ -328,7 +328,8 @@
     padding: 20px;
     min-width: 70vw;
     max-width: 100vw;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: auto;
 
     ul, li, li a {
       width: 100%;

resources/assets/sass/components/_page_title.scss

@@ -12,3 +12,8 @@
   text-align: left;
   color: $text-dark-color;
 }
+
+.page_title2 {
+  @extend .page_title;
+  font-size: 30px;
+}

resources/assets/sass/components/_podcast_items.scss

@@ -2,6 +2,10 @@
 @use "../abstracts/variables" as *;
 
 .podcast_items {
+  .box {
+    margin-bottom: 10px;
+  }
+
   ul {
     @include reset-list;
     &.row {
@@ -11,7 +15,9 @@
     }
 
     li {
-      margin-bottom: 25px;
+      @media (min-width: 768px) {
+        margin-bottom: 25px;
+      }
       h2 {
         margin: 0;
 

resources/assets/sass/components/_post.scss

@@ -56,7 +56,7 @@
     .sentence {
       font-size: 12px;
       font-style: italic;
-      line-height: 3.17;
+      line-height: 1.3;
       text-align: right;
       color: $text-description-color;
       display: block;

resources/views/app.blade.php

@@ -12,6 +12,10 @@
     </ul>
 @endsection
 
+@section('page_class')
+    page_container
+@endsection
+
 @section('content')
     <div class="page_body margin_bottom">
         <p>Download de NH Gooi app via de App Store of Google Play.</p>

resources/views/jobsitem.blade.php

@@ -14,7 +14,7 @@
 	</ul>
 @endsection
 
-@section('page_class')
+@section('page_container_class')
 	grey_background
 @endsection
 @section('container_class')

resources/views/jobslist.blade.php

@@ -12,7 +12,7 @@
     </ul>
 @endsection
 
-@section('page_class')
+@section('page_container_class')
     grey_background
 @endsection
 @section('container_class')

resources/views/layouts/master.blade.php

@@ -35,7 +35,7 @@
             <ul class="right_menu">
                 <li>
                     <a class="player with_svg_icon" href="{{url('luister/live')}}">{!!file_get_contents(__DIR__ . '/../../../public/images/icons/radio.svg')!!}</a>
-                    <a class="player" href="{{url('kijk/studio')}}">{!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
+                    <a href="{{url('kijk/studio')}}">{!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
                 </li>
                 <li>
                     <a href="https://wa.me/31888505651" target="_blank">Tip <i class="fa-solid fa-circle-plus"></i></a>
@@ -62,7 +62,7 @@
                     <a class="player with_svg_icon" href="{{url('luister/live')}}">Luister live radio {!!file_get_contents(__DIR__ . '/../../../public/images/icons/radio.svg')!!}</a>
                 </li>
                 <li>
-                    <a class="player with_svg_icon" href="{{url('kijk/studio')}}">Kijk live tv {!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
+                    <a class="with_svg_icon" href="{{url('kijk/studio')}}">Kijk live tv {!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
                 </li>
                 <li>
                     <a href="https://wa.me/31888505651" target="_blank">Tip de streekredactie <i class="fa-solid fa-circle-plus"></i></a>
@@ -86,7 +86,7 @@
 
     <!-- Content -->
 
-    <div class="page @yield('page_class')">
+    <div class="page @yield('page_container_class')">
         <a name="top"></a>
         @if($activeBlog != null)
             <p style="float: left; border: solid 1px #1f3977; border-radius: 10px; padding: 0 10px 0.4em 10px; margin: 10px 0 10px 0; width: 100%;">
@@ -117,7 +117,7 @@
                         <a href="{{url('klachten')}}">Klachtenregeling</a>
                         <a href="{{url('frequenties')}}">Frequenties</a>
                         <a href="{{url('adverteren')}}">Adverteren</a>
-                        <a href="https://nhnieuws.nl/" target="_blank">NH Nieuws</a>
+                        <a href="{{url('vacatures')}}">Vacatures</a>
                     </p>
                 </div>
                 <div class="col-12 col-md-3">
@@ -125,7 +125,6 @@
                     <p class="buttons">
                         <a class="player" href="{{url('luister/live')}}">Luister live</a>
                         <a href="{{url('kijk/live')}}">Kijk live</a>
-                        <a href="/">Uitgelichte video’s</a>
                         <a href="{{url('gemist/fragment')}}">Gemist</a>
                         <a href="{{url('nieuws')}}">Nieuws</a>
                     </p>

resources/views/news.blade.php

@@ -4,7 +4,7 @@
     NH Gooi - Nieuws
 @endsection
 
-@section('page_class')
+@section('page_container_class')
     news
 @endsection
 

resources/views/podcastitem.blade.php

@@ -106,7 +106,7 @@
 							</ul>
 
 							<div class="announcement">
-								<audio controls autoplay="false">
+								<audio controls>
 									<source src="{{$audioUrl}}" type="audio/mpeg"/>
 								</audio>
 								<div class="clearfix">

resources/views/podcastlist.blade.php

@@ -45,7 +45,7 @@
                     </div>
                 </div>
                 @if(isset($program))
-                    <h2>{{$program->name}}</h2>
+                    <h2 class="page_title2">{{$program->name}}</h2>
                     <p class="align-right">
                         <a href="{{route('gemist')}}" title="Alle programma's" class="btn btn-info">&larr; Toon
                             alles</a>

resources/views/podcastseries.blade.php

@@ -26,7 +26,7 @@
 @section('content')
     <div class="">
         <div class="row news_post">
-            <div class="col-12 col-md content_container" style="padding-top:80px">
+            <div class="col-12 col-md content_container md_padding_top_80">
                 @if(isset($program))
                     <div class="box full-width post single">
                         <h1 class="page_title">{{$program->name}}</h1>

resources/views/programlist.blade.php

@@ -43,7 +43,7 @@
                     </div>
                 </div>
                 @if(isset($program))
-                    <h2>{{$program->name}}</h2>
+                    <h2 class="page_title2">{{$program->name}}</h2>
                     <p class="align-right">
                         <a href="{{route('gemist')}}" title="Alle programma's" class="btn btn-info">&larr; Toon
                             alles</a>