NH_Gooi/nhgooi.nl
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Style the job pages

Browse Source 
Style the image page
Small fixes
This commit is contained in:
Jorit Tijsen
2024-03-22 15:44:34 +01:00
parent 1d94e7da7f
commit 6041398e10
23 changed files with 608 additions and 606 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/Http/Controllers/JobsController.php
View File

@@ -18,7 +18,7 @@ class JobsController extends Controller
parent::registerView($request, 'nieuws', $id);
$apiResult = $this->API('vacatures/details/' . $id);
$jobsItem = new \Model\JobOpening($apiResult->item);
return view('jobsitem', ['job' => $jobsItem, 'metadata' => $jobsItem->metadata]);
return view('jobsitem', array_merge($this->getSidebareData(), ['job' => $jobsItem, 'metadata' => $jobsItem->metadata]));
}
public function overview(Request $request)
@@ -36,7 +36,7 @@ class JobsController extends Controller
$jobs[] = new \Model\JobOpening($jobsItem);
}
return view('jobslist', ['title' => $title, 'jobs' => $jobs]);
return view('jobslist', array_merge($this->getSidebareData(), ['title' => $title, 'jobs' => $jobs]));
//return view($request->ajax() ? 'partial/jobslist_small' : ($title == null ? 'home' : 'jobslist'), ['title' => $title, 'jobs' => $jobs, 'searchURL' => 'vacatures/zoeken']);
}

56
public/css/style.css vendored
View File

@@ -145,6 +145,12 @@ div.pp_default .pp_close:hover {
color: #282828;
}
.list {
margin: 0;
padding: 0;
list-style: none;
}
.header {
height: 110px;
}
@@ -690,11 +696,11 @@ div.pp_default .pp_close:hover {
}
.blog_grid .post .slider_content_box .post_date {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -740,6 +746,9 @@ div.pp_default .pp_close:hover {
.box.full-width {
width: calc(100% - 60px);
}
.box.margin_top {
margin-top: 80px;
}
.tabs {
display: flex;
@@ -815,11 +824,11 @@ div.pp_default .pp_close:hover {
}
.blog .post .post_date {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -860,11 +869,11 @@ div.pp_default .pp_close:hover {
}
.radio_box .post_date {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -943,11 +952,11 @@ div.pp_default .pp_close:hover {
}
.featured .sub_title .program_name {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #000;
margin-right: 10px;
text-decoration: none;
@@ -957,11 +966,11 @@ div.pp_default .pp_close:hover {
}
.featured .sub_title .post_date {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -1010,11 +1019,11 @@ div.pp_default .pp_close:hover {
}
.podcast_items ul li .sub_title .program_name {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #000;
margin-right: 10px;
text-decoration: none;
@@ -1024,11 +1033,11 @@ div.pp_default .pp_close:hover {
}
.podcast_items ul li .sub_title .post_date {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -1046,11 +1055,11 @@ div.pp_default .pp_close:hover {
.bread_crumb li {
float: left;
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
margin-right: 5px;
}
@@ -1157,11 +1166,11 @@ div.pp_default .pp_close:hover {
float: left;
margin-right: 10px;
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
}
.post_container .post_body .post_details li a {
@@ -1207,11 +1216,11 @@ div.pp_default .pp_close:hover {
}
#schedule .program-times {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 12px;
color: #666;
display: block;
height: 30px;
@@ -1251,8 +1260,18 @@ div.pp_default .pp_close:hover {
line-height: 1.6;
color: #282828;
}
.page_body.margin_bottom {
margin-bottom: 40px;
}
.action_button {
font-family: Nunito, serif;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
font-size: 14px;
line-height: 1.4;
text-decoration: none;
color: #282828;
}
@@ -1284,6 +1303,18 @@ div.pp_default .pp_close:hover {
color: #1a1a1a;
}
.text_input, .texterea_input {
padding: 13px 5px;
font-family: Montserrat, serif;
font-size: 14px;
font-weight: normal;
line-height: 1.25;
color: #1a1a1a;
border: 1px solid #efefef;
border-radius: 5px;
background-color: #fff;
}
.announcement {
padding: 30px;
border-radius: 3px;
@@ -1308,6 +1339,7 @@ div.pp_default .pp_close:hover {
}
.footer_container .footer_menu {
background-image: linear-gradient(to right, #0102b0, #4090e3);
padding: 15px 0;
}
@media (max-width: 768px) {
.footer_container .footer_menu {
@@ -1461,4 +1493,8 @@ div.pp_default .pp_close:hover {
-webkit-line-clamp: 10;
}
a, a:hover, a:active {
color: #0f259d;
}
/*# sourceMappingURL=style.css.map */

2
public/css/style.css.map
View File

File diff suppressed because one or more lines are too long

2
public/css/style.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
public/css/style.min.css.map
View File

File diff suppressed because one or more lines are too long

11
resources/assets/sass/abstracts/_mixin.scss vendored
View File

@@ -9,14 +9,21 @@
padding: 0;
list-style: none;
}
@mixin font_small {
@mixin font_base {
font-family: Nunito, serif;
font-size: 12px;
font-weight: 500;
line-height: 3.17;
letter-spacing: normal;
text-align: left;
}
@mixin font_normal {
@include font_base;
font-size: 14px;
}
@mixin font_small {
@include font_base;
font-size: 12px;
}
@mixin post_date {
@include font_small;
color: $text-secondary-color;

5
resources/assets/sass/base/_base.scss vendored
View File

@@ -4,6 +4,7 @@
@use "../components/button";
@use "../components/pretty_photo";
@use "../components/cookie";
@use "../components/list";
@use "../layout";
@@ -24,3 +25,7 @@
-webkit-line-clamp: $i;
}
}
a, a:hover, a:active {
color: #0f259d;
}

3
resources/assets/sass/components/_box.scss vendored
View File

@@ -37,6 +37,9 @@
&.full-width {
width: CALC(100% - 60px);
}
&.margin_top {
margin-top: 80px;
}
}
.tabs {
display: flex;

1
resources/assets/sass/components/_footer.scss vendored
View File

@@ -11,6 +11,7 @@
.footer_menu {
background-image: linear-gradient(to right, #0102b0, #4090e3);
padding: 15px 0;
@media (max-width: 768px) {
padding: 60px 30px 30px 30px;
}

12
resources/assets/sass/components/_input.scss vendored
View File

@@ -27,3 +27,15 @@
color: $text-color;
}
}
.text_input, .texterea_input {
padding: 13px 5px;
font-family: Montserrat, serif;
font-size: 14px;
font-weight: normal;
line-height: 1.25;
color: $text-color;
border: 1px solid #efefef;
border-radius: 5px;
background-color: $element-bg;
}

4
resources/assets/sass/components/_list.scss vendored Normal file
View File

@@ -0,0 +1,4 @@
@use '../abstracts/mixin' as *;
.list {
@include reset-list;
}

6
resources/assets/sass/components/_page.scss vendored
View File

@@ -15,8 +15,14 @@
font-size: 15px;
line-height: 1.6;
color: $text-dark-color;
&.margin_bottom {
margin-bottom: 40px;
}
}
.action_button {
@include font_normal;
line-height: 1.4;
text-decoration: none;
color: $text-dark-color;

35
resources/views/app.blade.php
View File

@@ -13,40 +13,25 @@
@endsection
@section('content')
<div class="page_body">
<div class="page_body margin_bottom">
<p>Download de NH Gooi app via de App Store of Google Play.</p>
<div class="row">
<div class="col" style="margin-left: 0">
<div class="animate fadeIn" data-anim-type="fadeIn">
<div class="icon_box icon_position_top no_border"><a class=""
href="https://play.google.com/store/apps/details?id=nl.gooi.app">
<div class="image_wrapper"><img data-lazyloaded="1" data-src="/images/googleplay.jpg"
class="scale-with-grid litespeed-loaded"
alt="Google Play Store" width="318" height="100"
src="/images/googleplay.jpg" data-was-processed="true">
<noscript><img src="/images/google.jpg" class="scale-with-grid" alt="Google Play Store"
width="318" height="100"/></noscript>
</div>
<div class="desc_wrapper"></div>
</a></div>
<div class="icon_box icon_position_top no_border">
<a class="" href="https://play.google.com/store/apps/details?id=nl.gooi.app">
<img data-src="/images/googleplay.jpg" class="scale-with-grid" alt="Google Play Store"
width="318" height="100" src="/images/googleplay.jpg">
</a>
</div>
</div>
<div class="col" style="margin-left: 0">
<div class="animate fadeIn" data-anim-type="fadeIn">
<div class="icon_box icon_position_top no_border"><a class=""
href="https://apps.apple.com/nl/app/nh-gooi/id1585667560">
<div class="image_wrapper"><img data-lazyloaded="1" data-src="/images/apple.jpg"
class="scale-with-grid litespeed-loaded" alt="Apple Store"
width="318" height="100" src="/images/apple.jpg"
data-was-processed="true">
<noscript><img src="/images/apple.jpg" class="scale-with-grid" alt="Apple Store"
width="318" height="100"/></noscript>
</div>
<div class="desc_wrapper"></div>
</a></div>
<div class="icon_box icon_position_top no_border">
<a class="" href="https://apps.apple.com/nl/app/nh-gooi/id1585667560">
<img class="scale-with-grid" alt="Apple Store" width="318" height="100" src="/images/apple.jpg">
</a>
</div>
</div>
</div>

2
resources/views/calendarlist.blade.php
View File

@@ -14,7 +14,7 @@
@if(!count($events))
@section('content')
<div class="page_body">
<div class="page_body margin_bottom">
<p>Er zijn geen items in de regioagenda. Iets te melden? Mail het naar {{Html::mailto("info@nhgooi.nl")}}
.</p>
</div>

113
resources/views/imageslist.blade.php
View File

@@ -1,74 +1,81 @@
@extends('layouts/full')
@section('title')
@if($title) {{$title}} - Beelden @else Beelden @endif
@if($title)
{{$title}} - Beelden
@else
Beelden
@endif
@endsection
@section('breadcrumb')
@if($title)
<ul class="bread_crumb" style="margin-top: -10px; margin-bottom: 4px; ">
<li><a title="Beelden" href="{{route('beelden')}}">Beelden</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li>{{$title}}</li>
</ul>
@endif
@if($title)
<ul class="bread_crumb" style="margin-top: -10px; margin-bottom: 4px; ">
<li><a title="Beelden" href="{{route('beelden')}}">Beelden</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>{{$title}}</li>
</ul>
@endif
@endsection
@section('content')
<p class='bouwmee'>Ook jouw foto op deze pagina? <a href="mailto:beelden@nhgooi.nl">Mail naar beelden@nhgooi.nl!</a></p>
<div class="page_body margin_bottom">
<p class='bouwmee'>Ook jouw foto op deze pagina? <a href="mailto:beelden@nhgooi.nl">Mail naar
beelden@nhgooi.nl!</a></p>
<div id="items">
@include('partial/imageslist_small', ['images' => $images])
</div>
<div id="items">
@include('partial/imageslist_small', ['images' => $images])
</div>
@if(count($images) >= 15)
<div>
<button class="more page_margin_top" type="button" id='meer-beelden'>
<span class="fa-2x fas fa-spinner fa-spin" id="loading"></span>
LAAD MEER BEELDEN
</button>
</div>
@endif
@if(count($images) >= 15)
<div>
<button class="more page_margin_top" type="button" id='meer-beelden'>
<span class="fa-2x fas fa-spinner fa-spin" id="loading"></span>
LAAD MEER BEELDEN
</button>
</div>
@endif
</div>
@endsection
@push('scripts')
<script>
var nextPage = 2;
var isLoading = 0;
var $isLoading = $('#loading').hide();
<script>
var nextPage = 2;
var isLoading = 0;
var $isLoading = $('#loading').hide();
$('#meer-beelden').click(function(e) {
e.preventDefault();
if(!isLoading) {
// Set flag and update UI
isLoading = 1;
$isLoading.show();
var $button = $(this).attr("disabled", "disabled");
$('#meer-beelden').click(function (e) {
e.preventDefault();
if (!isLoading) {
// Set flag and update UI
isLoading = 1;
$isLoading.show();
var $button = $(this).attr("disabled", "disabled");
// Fire request for the next page
$.ajax({ url: document.location.pathname + '?pagina=' + nextPage })
.always(function() {
// Whether success or failure, update the UI again
isLoading = 0;
$isLoading.hide();
$button.removeAttr("disabled");
})
.done(function(data) {
if(!data) {
// When no data was returned, disable the button permanently
page = -1;
$('#items').append("<hr /><p>Er zijn geen beelden (meer).</p>");
$button.remove();
return;
}
// Fire request for the next page
$.ajax({url: document.location.pathname + '?pagina=' + nextPage})
.always(function () {
// Whether success or failure, update the UI again
isLoading = 0;
$isLoading.hide();
$button.removeAttr("disabled");
})
.done(function (data) {
if (!data) {
// When no data was returned, disable the button permanently
page = -1;
$('#items').append("<hr /><p>Er zijn geen beelden (meer).</p>");
$button.remove();
return;
}
$('#items').append(data);
++nextPage;
});
}
});
</script>
$('#items').append(data);
++nextPage;
});
}
});
</script>
@endpush

132
resources/views/jobsitem.blade.php
View File

@@ -4,47 +4,54 @@
{{$job->title}}
@endsection
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li><a title="Vacatures" href="{{route('vacatures')}}">Vacatures</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>{{$job->title}}</li>
</ul>
@endsection
@section('page_class')
news_post post_container
@endsection
@section('container_class')
grey_background
@endsection
@section('content')
<div class="row">
<div class="post single ">
<div class="post_content clearfix">
<div class="content_box">
@if($job->images)
@if(count($job->images) == 1)
<div class="post_image_box">
<a href="{{$imgBase . $job->images[0]->url}}" class="post_image prettyPhoto" rel="prettyPhoto" title="{{$job->images[0]->title}}">
<img src='{{$imgBase . $job->images[0]->url}}' alt='{{$job->images[0]->title}}'>
</a>
<div class="sentence">
<span class="text">{{$job->images[0]->title}}</span>
@if(isset($job->images[0]->author))
<span class="author">{{$job->images[0]->author}}</span>
@endif
</div>
<div class="post_body">
@if($job->images)
@if(count($job->images) == 1)
<div class="post_image_box">
<a href="{{$imgBase . $job->images[0]->url}}" class="post_image prettyPhoto" rel="prettyPhoto"
title="{{$job->images[0]->title}}">
<img src='{{$imgBase . $job->images[0]->url}}' alt='{{$job->images[0]->title}}'>
</a>
<div class="sentence">
<span class="text">{{$job->images[0]->title}}</span>
@if(isset($job->images[0]->author))
<span class="author">{{$job->images[0]->author}}</span>
@endif
</div>
@else
<div class="horizontal_carousel_container thin page_margin_top gallery_control">
<ul class="horizontal_carousel control-for-post-gallery visible-5 autoplay-0 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
@foreach($job->images as $image)
</div>
@else
<div class="horizontal_carousel_container thin page_margin_top gallery_control">
<ul class="horizontal_carousel control-for-post-gallery visible-5 autoplay-0 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
@foreach($job->images as $image)
<li>
<a href="#"><img src='{{$imgBase . $image->url}}'></a>
</li>
@endforeach
</ul>
</div>
<div id="control-by-post-gallery" class="horizontal_carousel_container big margin_top_10">
<ul id="post-gallery" class="horizontal_carousel visible-1 autoplay-0 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
@endforeach
</ul>
</div>
<div id="control-by-post-gallery" class="horizontal_carousel_container big margin_top_10">
<ul id="post-gallery"
class="horizontal_carousel visible-1 autoplay-0 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
@foreach($job->images as $image)
<li>
<a href="{{$imgBase . $image->url}}" data-rel="gallery" title="{{$image->title}}">
@@ -52,57 +59,32 @@
<img src='{{$imgBase . $image->url}}' alt='{{$image->title}}'>
</a>
</li>
</ul>
@endforeach
</div>
@endif
@endif
<div class="text">
{!!$job->content!!}
<hr />
<h4>Interesse?</h4>
<p><a href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst">Meld je nu aan voor een vrijblijvende kennismaking</a> met NH Gooi.</p>
<!-- <a class="read_more" href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst"><span class="arrow"></span><span>Programma &amp; aanmelden</span></a> -->
<p>Je kan ons ook mailen. Stuur een korte introductie met motivatie naar meebouwen@nhgooi.nl en we nemen contact met je op voor een vrijblijvend kennismakingsgesprek.</p>
<a class="read_more" href="mailto:meebouwen@nhgooi.nl?subject=Reactie op vacature voor {{$job->title}}" title="Mail direct je reactie op deze vacature."><span class="arrow"></span><span>Reageer nu!</span></a>
</ul>
@endforeach
</div>
@endif
@endif
{{--
@include('widgets/share')
--}}
<div class="text">
{!!$job->content!!}
</div>
<hr/>
<h2>Interesse?</h2>
<p><a href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst">Meld je nu aan voor een vrijblijvende
kennismaking</a> met NH Gooi.</p>
<!-- <a class="read_more" href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst"><span class="arrow"></span><span>Programma &amp; aanmelden</span></a> -->
<p>Je kan ons ook mailen. Stuur een korte introductie met motivatie naar meebouwen@nhgooi.nl en we nemen
contact met je op voor een vrijblijvend kennismakingsgesprek.</p>
<a class="btn" href="mailto:meebouwen@nhgooi.nl?subject=Reactie op vacature voor {{$job->title}}"
title="Mail direct je reactie op deze vacature.">
<span>Reageer nu!</span>
</a>
</div>
{{--
@include('widgets/share')
--}}
</div>
</div>
<style>
.post.single .content_box {
float: none;
margin-left: 0;
width: auto;
padding: 1em 0;
color: #3E3E3E !important;
line-height: 150%;
}
.content_box .text > * {
margin-left: 0px;
}
.content_box ul br {
display: none;
}
.content_box li {
padding-top: 7px;
padding-bottom: 7px;
margin-top: 0;
background-repeat: no-repeat;
background-position: left 10px;
padding-left: 25px;
background-image: url("/images/icons/other/bullet_style_2.png");
}
</style>
@endsection

405
resources/views/jobslist.blade.php
View File

@@ -1,275 +1,180 @@
@extends('layouts/sidebar')
@section('title')
Vacatures
Vacatures
@endsection
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>Vacatures</li>
</ul>
@endsection
@section('page_class')
news_post post_container
@endsection
@section('container_class')
grey_background
@endsection
@section('content')
@parent
@parent
<div class="vacature_row">
<div class="column_23">
<h3 class="first">Wat doen wij?</h3>
<p>NH Gooi is de streekomroep voor het Gooi. We maken radio- en televisieprogramma’s,
podcasts en een website met nieuws en verhalen uit je achtertuin. Muziek, informatie,
cultuur en ontspanning staan centraal in onze uitzendingen, maar altijd met een link naar
het Gooi. NH Gooi is volop in ontwikkeling en wil haar activiteiten uitbouwen.</p>
<div class="post_body ">
<h2 class="first">Wat doen wij?</h2>
<p>NH Gooi is de streekomroep voor het Gooi. We maken radio- en televisieprogramma’s,
podcasts en een website met nieuws en verhalen uit je achtertuin. Muziek, informatie,
cultuur en ontspanning staan centraal in onze uitzendingen, maar altijd met een link naar
het Gooi. NH Gooi is volop in ontwikkeling en wil haar activiteiten uitbouwen.</p>
<blockquote>
Ik kwam hier als programmeur en nu maak ik met een collega, inmiddels vriend, elke week een
kleinkunstprogramma
<blockquote>
Ik kwam hier als programmeur en nu maak ik met een collega, inmiddels vriend, elke week een
kleinkunstprogramma
<span class="author">—&nbsp;&nbsp;Mischa, programmamaker en technicus</span>
</blockquote>
<span class="author">—&nbsp;&nbsp;Mischa, programmamaker en technicus</span>
</blockquote>
<p>Lijkt het je leuk om mee te bouwen aan de streekomroep van en voor het Gooi? Dan ben je aan het juiste adres. NH Gooi is volop in ontwikkeling en biedt kansen voor iedereen die wil meebouwen aan
onze organisatie. En dat allemaal in het mediacentrum van ons land.</p>
<p>Lijkt het je leuk om mee te bouwen aan de streekomroep van en voor het Gooi? Dan ben je aan het juiste
adres. NH Gooi is volop in ontwikkeling en biedt kansen voor iedereen die wil meebouwen aan
onze organisatie. En dat allemaal in het mediacentrum van ons land.</p>
<p>Wil je programma's maken voor radio en/of televisie, verslaggever worden, podcasts maken? Ben
jij de techneut of ICT-er die zorgt dat alle techniek en verbindingen goed blijven werken? Of vind je
het juist leuk om met een klein team mee te denken en te zorgen dat we nog bekender worden?
Bijna alles is mogelijk en altijd onder begeleiding of samen met anderen.</p>
<p>Wil je programma's maken voor radio en/of televisie, verslaggever worden, podcasts maken? Ben
jij de techneut of ICT-er die zorgt dat alle techniek en verbindingen goed blijven werken? Of vind je
het juist leuk om met een klein team mee te denken en te zorgen dat we nog bekender worden?
Bijna alles is mogelijk en altijd onder begeleiding of samen met anderen.</p>
<p>Wat wij van jou vragen is dat je nieuwsgierig bent, goed kunt samenwerken en graag op zoek gaat
naar de verhalen uit het Gooi. Meer weten?
<a href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst">Schrijf je nu in voor een kennismaking</a> en laat je inspireren, het verplicht je tot niets.</p>
</div>
<div class="column_13">
<div style="border: solid 1px blue; padding: 3px; margin-bottom: 1em;">
<h3 class="first">Maak kennis met ons!</h3>
<!-- <p>Kom op 27 november kennismaken met NH Gooi!</p> -->
<p>Laat je uitnodigen voor een kennismaking</p>
<p>Wat wij van jou vragen is dat je nieuwsgierig bent, goed kunt samenwerken en graag op zoek gaat
naar de verhalen uit het Gooi. Meer weten?
<a href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst">Schrijf je nu in voor een
kennismaking</a> en laat je inspireren, het verplicht je tot niets.</p>
<h2 class="first">Maak kennis met ons!</h2>
<!-- <p>Kom op 27 november kennismaken met NH Gooi!</p> -->
<p>Laat je uitnodigen voor een kennismaking</p>
<a class="read_more" href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst"><span class="arrow"></span><span>Aanmelden</span></a>
<div class="clearfix"></div>
</div>
<a class="btn" style="width: fit-content" href="/vacatures/ontmoet-ons" title="Kennismakingsbijeenkomst">
<span>Aanmelden</span>
</a>
<div class="clearfix"></div>
<h3 class="first">Wie zoeken wij?</h3>
@foreach($jobs as $job)
<a class="read_more" href="{{$job->url}}" title="Reageer direct op de vacature {{$job->title}}"><span class="arrow"></span><span>{{$job->title}}</span></a>
@endforeach
<div class="clearfix"></div>
<div style="margin: 1em; border-bottom: solid 1px #333;"></div>
<h5>Niet wat je zoekt?</h5>
<a class="read_more" href="mailto:meebouwen@nhgooi.nl?subject=Open sollicitatie" title="Mail direct je reactie op deze vacature."><span class="arrow"></span><span>Open sollicitatie</span></a>
<h2 class="first">Wie zoeken wij?</h2>
<ul>
@foreach($jobs as $job)
<li>
<a class="read_more" href="{{$job->url}}" title="Reageer direct op de vacature {{$job->title}}">
<span>{{$job->title}}</span>
</a>
</li>
@endforeach
</ul>
<div class="clearfix"></div>
<div style="margin: 1em; border-bottom: solid 1px #333;"></div>
<h2>Niet wat je zoekt?</h2>
<a class="btn" style="width: fit-content" href="mailto:meebouwen@nhgooi.nl?subject=Open sollicitatie"
title="Mail direct je reactie op deze vacature.">
<span>Open sollicitatie</span>
</a>
<div class="clearfix"></div>
<blockquote>
Je krijgt bij NH Gooi de kans om jezelf te ontwikkelen. Ik mocht al heel snel mijn eigen programma maken
<span class="author">—&nbsp;&nbsp;Yannick, programmamaker</span>
</blockquote>
<h3 class="page_margin_top">Veelgestelde vragen</h3>
<div class="vraag">
<h4 class="vraag-header">Wat kan NH Gooi mij bieden?</h4>
<div class="antwoord">
<ul>
<li>Een baan als vrijwilliger met toekomst. Veel (ex)collega’s zijn in dienst bij landelijke of
regionale omroepen.
</li>
<li>De kans om mee te bouwen aan onze organisatie en programma’s.</li>
<li>Een enthousiast team met veel kennis</li>
<li>Meer plannen dan we op dit moment kunnen uitvoeren</li>
<li>Een organisatie waar je je talenten kan ontdekken</li>
<li>Workshops en bijeenkomsten met collega’s</li>
</ul>
</div>
</div>
</div>
<div class="clearfix"></div>
<blockquote>
Je krijgt bij NH Gooi de kans om jezelf te ontwikkelen. Ik mocht al heel snel mijn eigen programma maken
<span class="author">—&nbsp;&nbsp;Yannick, programmamaker</span>
</blockquote>
<div class="vraag">
<h4 class="vraag-header">Aan welke voorwaarden moet ik voldoen?</h4>
<div class="antwoord">
Je hebt een band met het Gooi.
Je kunt zelfstandig werken
Je bent nieuwsgierig en ondernemend
Je wilt graag bij een omroep werken
</div>
</div>
<div class="vraag">
<h4 class="vraag-header">Kan ik me zonder ervaring ook bij NH Gooi aanmelden?</h4>
<div class="antwoord">
Ja, de wil om te leren en een flinke dosis enthousiasme is genoeg.
</div>
</div>
<h3 class="page_margin_top">Veelgestelde vragen</h3>
<div class="vraag">
<h4 class="vraag-header">Kan ik ook meerdere dingen doen bij NH Gooi?</h4>
<div class="antwoord">
Ja, dat is geen probleem. Bij NH Gooi is (bijna) alles mogelijk. Het belangrijkste is dat je enthousiast
bent en je er echt voor in wil zetten.
</div>
</div>
<div class="vraag">
<button class="vraag-header">Wat kan NH Gooi mij bieden?</button>
<div class="antwoord">
<ul>
<li>Een baan als vrijwilliger met toekomst. Veel (ex)collega’s zijn in dienst bij landelijke of regionale omroepen.</li>
<li>De kans om mee te bouwen aan onze organisatie en programma’s.</li>
<li>Een enthousiast team met veel kennis</li>
<li>Meer plannen dan we op dit moment kunnen uitvoeren</li>
<li>Een organisatie waar je je talenten kan ontdekken</li>
<li>Workshops en bijeenkomsten met collega’s</li>
</ul>
</div>
</div>
<div class="vraag">
<h4 class="vraag-header">Ik vind het leuk om mee richting te geven aan NH Gooi, kan dat ook?</h4>
<div class="antwoord">
Absoluut! Voor de verschillende onderdelen zoeken we ook coördinatoren die mede richting willen geven en
anderen kan ondersteunen en stimuleren.
</div>
</div>
<div class="vraag">
<button class="vraag-header">Aan welke voorwaarden moet ik voldoen?</button>
<div class="antwoord">
Je hebt een band met het Gooi.
Je kunt zelfstandig werken
Je bent nieuwsgierig en ondernemend
Je wilt graag bij een omroep werken
</div>
</div>
<blockquote>
Produceren, presenteren, reportages maken, monteren; ik kon het allemaal leren bij NH Gooi. Wil je iets met
radio, ben je van 'wel vrijwillig, maar niet vrijblijvend?' Dan wil ik graag mijn ervaringen met je delen
<span class="author">—&nbsp;&nbsp;Michel Stoeltie</span>
</blockquote>
<div class="vraag">
<button class="vraag-header">Kan ik me zonder ervaring ook bij NH Gooi aanmelden?</button>
<div class="antwoord">
Ja, de wil om te leren en een flinke dosis enthousiasme is genoeg.
</div>
</div>
<div class="vraag">
<h4 class="vraag-header">Ik ben 62 jaar, kan ik me dan ook aanmelden?</h4>
<div class="antwoord">
Uiteraard, wij hebben collega’s van 18 tot 72 jaar
</div>
</div>
<div class="vraag">
<button class="vraag-header">Kan ik ook meerdere dingen doen bij NH Gooi?</button>
<div class="antwoord">
Ja, dat is geen probleem. Bij NH Gooi is (bijna) alles mogelijk. Het belangrijkste is dat je enthousiast bent en je er echt voor in wil zetten.
</div>
</div>
<div class="vraag">
<h4 class="vraag-header">Ik heb een parttimebaan, kan ik me aanmelden?</h4>
<div class="antwoord">
Ja, als je wilt inzetten voor NH Gooi en we kunnen op je rekenen, dan ben je welkom.
Hoeveel tijd je beschikbaar hebt en wanneer is minder belangrijk.
</div>
</div>
<div class="vraag">
<button class="vraag-header">Ik vind het leuk om mee richting te geven aan NH Gooi, kan dat ook?</button>
<div class="antwoord">
Absoluut! Voor de verschillende onderdelen zoeken we ook coördinatoren die mede richting willen geven en anderen kan ondersteunen en stimuleren.
</div>
</div>
<div class="vraag">
<h4 class="vraag-header">Als ik meedoe, hoeveel uur per week ben ik dan bezig?</h4>
<div class="antwoord">
Of je veel of weinig tijd hebt, dat maakt niet uit. Wel vinden we het belangrijk, als je je in wilt
zetten,
dat we op je kunnen rekenen.
</div>
</div>
<blockquote>
Produceren, presenteren, reportages maken, monteren; ik kon het allemaal leren bij NH Gooi. Wil je iets met radio, ben je van 'wel vrijwillig, maar niet vrijblijvend?' Dan wil ik graag mijn ervaringen met je delen
<span class="author">—&nbsp;&nbsp;Michel Stoeltie</span>
</blockquote>
<div class="vraag">
<button class="vraag-header">Ik ben 62 jaar, kan ik me dan ook aanmelden?</button>
<div class="antwoord">
Uiteraard, wij hebben collega’s van 18 tot 72 jaar
</div>
</div>
<div class="vraag">
<button class="vraag-header">Ik heb een parttimebaan, kan ik me aanmelden?</button>
<div class="antwoord">
Ja, als je wilt inzetten voor NH Gooi en we kunnen op je rekenen, dan ben je welkom.
Hoeveel tijd je beschikbaar hebt en wanneer is minder belangrijk.
</div>
</div>
<div class="vraag">
<button class="vraag-header">Als ik meedoe, hoeveel uur per week ben ik dan bezig?</button>
<div class="antwoord">
Of je veel of weinig tijd hebt, dat maakt niet uit. Wel vinden we het belangrijk, als je je in wilt zetten, dat we op je kunnen rekenen.
</div>
</div>
<div class="vraag">
<button class="vraag-header">Wat kan ik verwachten van de begeleiding?</button>
<div class="antwoord">
Je wordt begeleid door een of meer collega’s van NH Gooi. Dit is afhankelijk wat en hoeveel je voor NH Gooi wilt en kunt doen.
Jouw begeleider
Is jouw vraagbaak en kent de organisatie en weet wie je kunt benaderen voor specifieke vragen
Zet je op het spoor van dingen en mensen die voor jou interessant zijn
Maar is geen persoonlijk assistent.
</div>
</div>
<style>
.vacature_row {
display: flex;
}
.column_13 {
flex: 1 0 33%;
padding: 4px;
}
.column_23 {
flex: 1 1 67%;
padding: 4px;
}
@media screen and (max-width: 479px) {
.vacature_row {
display: block;
}
}
blockquote {
font-size: 120%;
background-color: white;
margin: 0;
}
blockquote .author {
margin-top: 12px;
}
.joblist li, .antwoord li {
padding-top: 7px;
padding-bottom: 7px;
margin-top: 0;
background-repeat: no-repeat;
background-position: left 10px;
padding-left: 25px;
background-image: url("/images/icons/other/bullet_style_2.png");
}
.vraag {
padding: 3px;
margin-top: 3px;
margin-bottom: 3px;
}
.vraag a {
font-size: 150%;
}
.vraag a:before {
}
.vraag .antwoord {
display: none;
font-size: 12px;
color: black;
}
/* Style the buttons that are used to open and close the accordion panel */
.vraag-header {
background-color: #f0f0f0;
color: #444;
cursor: pointer;
padding: 18px;
width: 100%;
text-align: left;
border: none;
border-left: 3px solid #1F3977;
outline: none;
transition: 0.4s;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .vraag-header:hover {
background-color: #c0c0c0;
}
/* Style the accordion panel. Note: hidden by default */
.vraag .antwoord {
padding: 18px 18px;
font-size: 100%;
line-height: 150%;
background-color: white;
display: none;
overflow: hidden;
}
button.vraag-header.active::after {
content: "\2212";
}
button.vraag-header::after {
content: '\002B';
color: #777;
font-weight: bold;
float: right;
margin-left: 5px;
}
.page_header {
display: none;
}
</style>
<script>
var acc = document.getElementsByClassName("vraag-header");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
/* Toggle between adding and removing the "active" class,
to highlight the button that controls the panel */
this.classList.toggle("active");
/* Toggle between hiding and showing the active panel */
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
$(panel).slideUp();
} else {
$(panel).slideDown();
}
});
}
</script>
<div class="vraag">
<h4 class="vraag-header">Wat kan ik verwachten van de begeleiding?</h4>
<div class="antwoord">
Je wordt begeleid door een of meer collega’s van NH Gooi. Dit is afhankelijk wat en hoeveel je voor NH
Gooi
wilt en kunt doen.
Jouw begeleider
Is jouw vraagbaak en kent de organisatie en weet wie je kunt benaderen voor specifieke vragen
Zet je op het spoor van dingen en mensen die voor jou interessant zijn
Maar is geen persoonlijk assistent.
</div>
</div>
</div>
@endsection

259
resources/views/kennismakingsbijeenkomst.blade.php
View File

@@ -1,24 +1,36 @@
@extends('layouts/full')
@section('title')
Meebouwen?
Meebouwen?
@endsection
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li><a title="Vacatures" href="{{route('vacatures')}}">Vacatures</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>Ontmoet ons</li>
</ul>
@endsection
@section('content')
@parent
<div class="page_body margin_bottom">
@if(isset($antispam))
<div style="border: solid 1px blue; padding: 3px; margin-bottom: 1em;">
<p>Oeps, de anti-spam waarde was incorrect! Helaas krijgen we zoveel spam binnen dat we je moeten vragen om een simpele rekensom op te lossen, voordat we je verzoek doorsturen.</p>
</div>
@endif
@if(isset($bevestiging))
<div style="border: solid 1px blue; padding: 3px; margin-bottom: 1em;">
<p>Dank je wel voor je aanmelding! Een bevestiging hiervan is gestuurd naar <code>{{ $bevestiging }}</code>.</p>
</div>
@endif
@if(isset($antispam))
<div style="border: solid 1px blue; padding: 3px; margin-bottom: 1em;">
<p>Oeps, de anti-spam waarde was incorrect! Helaas krijgen we zoveel spam binnen dat we je moeten vragen om
een simpele rekensom op te lossen, voordat we je verzoek doorsturen.</p>
</div>
@endif
@if(isset($bevestiging))
<div style="border: solid 1px blue; padding: 3px; margin-bottom: 1em;">
<p>Dank je wel voor je aanmelding! Een bevestiging hiervan is gestuurd naar <code>{{ $bevestiging }}</code>.
</p>
</div>
@endif
<!--
<!--
<h3 class="page_margin_top">Programma informatiebijeenkomst NH Gooi 27 november 2021</h3>
<table>
<tr>
@@ -50,114 +62,139 @@
-->
<p>
Als je het leuk vindt om met, bij en voor ons aan de slag te gaan en mee te bouwen aan een sterke streekomroep, laat dan hieronder je naam en contactgegevens achter. Geef ons ook alvast wat informatie waar je interesse naar uitgaat en wat je te bieden hebt. We nemen dan binnenkort contact met je op voor een persoonlijke kennismaking.
</p>
<p>
Als je het leuk vindt om met, bij en voor ons aan de slag te gaan en mee te bouwen aan een sterke streekomroep,
laat dan hieronder je naam en contactgegevens achter. Geef ons ook alvast wat informatie waar je interesse naar
uitgaat en wat je te bieden hebt. We nemen dan binnenkort contact met je op voor een persoonlijke kennismaking.
</p>
@if(!isset($bevestiging))
<h4 class="box_header">
Aanmelden
</h4>
@if(!isset($bevestiging))
<h4 class="box_header">
Aanmelden
</h4>
<p>
Er gebeurt veel bij NH Gooi. Van radio en podcasts maken tot ICT en uitzendtechniek en van Tv-interviews produceren tot marketing en communicatie. Maar ook organisatorisch talent kunnen we goed gebruiken. Schrijf daarom zo concreet en volledig mogelijk op wat (op dit moment) je interesse hebt en waar je mogelijk al ervaring mee hebt.
</p>
<p>
Er gebeurt veel bij NH Gooi. Van radio en podcasts maken tot ICT en uitzendtechniek en van Tv-interviews
produceren tot marketing en communicatie. Maar ook organisatorisch talent kunnen we goed gebruiken. Schrijf
daarom zo concreet en volledig mogelijk op wat (op dit moment) je interesse hebt en waar je mogelijk al
ervaring mee hebt.
</p>
<form class="forr margin_top_15" id="form" method="post" action="/vacatures/ontmoet-ons" style="background: none;">
{{ csrf_field() }}
<fieldset style="display: inline;">
<p>Ja, ik maak graag kennis met NH Gooi!</p>
</fieldset>
<fieldset class="">
<div class="block">
<label for="name">Naam</label>
<input class="text_input hint" id="name" name="name" type="text" placeholder="Naam" required="required">
</div>
</fieldset>
<fieldset class="">
<div class="block">
<label for="email">E-mailadres</label>
<input class="text_input hint" id="email" name="email" type="text" placeholder="Emailadres" required="required">
</div>
</fieldset>
<fieldset class="">
<div class="block">
<label for="phone">Telefoonnummer</label>
<input class="text_input hint" id="phone" name="phone" type="text" placeholder="Telefoonnummer" required="required">
</div>
</fieldset>
<fieldset>
<div class="block">
<p style="padding-bottom: 0;">Korte toelichting: wat wil je doen en welke ervaring heb je eventueel al?</p>
</div>
<textarea name="message" placeholder="Toelichting" class="hint"></textarea>
</fieldset>
<fieldset class="">
<div class="block">
<label for="phone">Anti-spam</label>
<input class="text_input hint" id="antispam" name="antispam" type="text" placeholder="Uitkomst van de som" required="required">
<p style="">Helaas krijgen we ook veel spam binnen. Vul alsjeblieft in getallen in hoeveel <b>twee plus drie</b> is.</p>
</div>
</fieldset>
<fieldset>
<input type="hidden" name="action" value="contact_form">
<input type="submit" name="submit" value="Aanmelden!" class="more active">
</fieldset>
</form>
<p style="color: #333; font-size: 80%;">Privacy-statement: bovenstaande informatie wordt alleen gebruikt door geselecteerde medewerkers om contact met je op te nemen over je aanmelding en je informatie te sturen. Je gegevens worden verder niet opgeslagen en na de bijeenkomst danwel je tijdige afmelding verwijderd, tenzij we deze gegevens nog nodig hebben omdat je (vrijwillige) werkzaamheden wilt gaan verrichten bij NH Gooi.</p>
@endif
<form class="forr margin_top_15" id="form" method="post" action="/vacatures/ontmoet-ons"
style="background: none;">
{{ csrf_field() }}
<fieldset style="display: inline;">
<p>Ja, ik maak graag kennis met NH Gooi!</p>
</fieldset>
<fieldset class="">
<div class="block">
<label for="name">Naam</label>
<input class="text_input hint" id="name" name="name" type="text" placeholder="Naam"
required="required">
</div>
</fieldset>
<fieldset class="">
<div class="block">
<label for="email">E-mailadres</label>
<input class="text_input hint" id="email" name="email" type="text" placeholder="Emailadres"
required="required">
</div>
</fieldset>
<fieldset class="">
<div class="block">
<label for="phone">Telefoonnummer</label>
<input class="text_input hint" id="phone" name="phone" type="text" placeholder="Telefoonnummer"
required="required">
</div>
</fieldset>
<fieldset>
<div class="block">
<p style="padding-bottom: 0;">Korte toelichting: wat wil je doen en welke ervaring heb je eventueel
al?</p>
</div>
<textarea class="texterea_input" name="message" placeholder="Toelichting" class="hint"></textarea>
</fieldset>
<fieldset class="">
<div class="block">
<label for="phone">Anti-spam</label>
<input class="text_input hint" id="antispam" name="antispam" type="text"
placeholder="Uitkomst van de som" required="required">
<p style="">Helaas krijgen we ook veel spam binnen. Vul alsjeblieft in getallen in hoeveel <b>twee
plus drie</b> is.</p>
</div>
</fieldset>
<fieldset>
<input type="hidden" name="action" value="contact_form">
<input type="submit" name="submit" value="Aanmelden!" class="more active">
</fieldset>
</form>
<p style="color: #333; font-size: 80%;">Privacy-statement: bovenstaande informatie wordt alleen gebruikt door
geselecteerde medewerkers om contact met je op te nemen over je aanmelding en je informatie te sturen. Je
gegevens worden verder niet opgeslagen en na de bijeenkomst danwel je tijdige afmelding verwijderd, tenzij
we deze gegevens nog nodig hebben omdat je (vrijwillige) werkzaamheden wilt gaan verrichten bij NH Gooi.</p>
@endif
<style>
table { width: 100%; }
td {
border-top: solid 1px #ddd;
vertical-align: top;
color: #444;
line-height: 150%;
}
li {
margin-left: 10px;
padding-top: 2px;
margin-top: 0;
padding-left: 25px;
}
td > ul > li {
background-repeat: no-repeat;
background-position: left 10px;
background-image: url("/images/icons/other/bullet_style_2.png");
}
</div>
fieldset .block {
display: flex;
margin-bottom: 3px;
}
<style>
.page_body table {
width: 100%;
}
fieldset label {
display: block;
flex: 0 1 150px;
margin-top: auto;
margin-bottom: auto;
color: #777;
}
.page_body td {
border-top: solid 1px #ddd;
vertical-align: top;
color: #444;
line-height: 150%;
}
fieldset input {
flex: 1 1;
}
.page_body li {
margin-left: 10px;
padding-top: 2px;
margin-top: 0;
padding-left: 25px;
}
fieldset textarea {
width: 100%;
}
.page_body td > ul > li {
background-repeat: no-repeat;
background-position: left 10px;
background-image: url("/images/icons/other/bullet_style_2.png");
}
@media screen and (max-width: 479px) {
fieldset .block {
flex-wrap: wrap;
margin-top: 15px;
}
.page_body fieldset {
border: none;
}
fieldset label {
}
}
</style>
.page_body fieldset .block {
display: flex;
margin-bottom: 3px;
}
.page_body fieldset label {
display: block;
flex: 0 1 150px;
margin-top: auto;
margin-bottom: auto;
color: #777;
}
.page_body fieldset input {
flex: 1 1;
}
.page_body fieldset textarea {
width: 100%;
}
@media screen and (max-width: 479px) {
.page_body fieldset .block {
flex-wrap: wrap;
margin-top: 15px;
}
.page_body fieldset label {
}
}
</style>
@endsection

2
resources/views/layouts/sidebar.blade.php
View File

@@ -4,7 +4,7 @@
<div class="@yield('container_class')">
<div class="row @yield('page_class')">
<div class="col-12 col-md content_container">
<div class="box full-width">
<div class="box full-width margin_top">
@yield('breadcrumb')
@yield('tags')
<h1 class="page_title">@yield('title')</h1>

75
resources/views/partial/imageslist_small.blade.php
View File

@@ -1,39 +1,38 @@
@foreach($images as $item)
@if($loop->index % 3 == 0)
<div class="row grid">
<ul>
@endif
<li class="post column column_1_3">
<a href="{{$imgBase . $item->images[0]->url}}" class="post_image prettyPhoto" rel="prettyPhoto" title="{{$item->images[0]->title}}">
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}' alt='{{$item->images && count($item->images) ? $item->images[0]->title : $item->title}}'>
</a>
<div class="post_content">
<h5>
<a href="{{url($item->url)}}" title="{{$item->title}}">{{$item->title}}</a>
</h5>
<ul class="post_details simple">
<li class="category">
<!-- <a title="Regio: {{$item->region->title}}" href="{{url('beelden/regio/' . $item->region->slug)}}">{{$item->region->title}}</a> -->
<a title="Regio: {{$item->region->title}}" href=".">{{$item->region->title}}</a>
</li>
@if($item->edited && ($item->edited != $item->published))
<li class="date edited">
{{Formatter::relativeDate($item->edited)}} bijgewerkt om {{$item->published->format('H:i')}}
</li>
@else
<li class="date">
{{Formatter::relativeDate($item->published)}} om {{$item->published->format('H:i')}}
</li>
@endif
</ul>
<p class="block-lead hidden-xs">
{{$item->images[0]->title}} &bull;
{{$item->content}}
</p>
</div>
</li>
@if($loop->index % 3 == 2 || $loop->last)
</ul>
<div class="row blog post_container">
@foreach($images as $item)
<div class="post col-12 col-md-4">
<div class="box">
<a href="{{$imgBase . $item->images[0]->url}}" class="post_image prettyPhoto" rel="prettyPhoto"
title="{{$item->images[0]->title}}">
<img style="width: 100%" src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
alt='{{$item->images && count($item->images) ? $item->images[0]->title : $item->title}}'>
</a>
<div class="post_body">
<h2 class="post_title">
<a href="{{url($item->url)}}" title="{{$item->title}}">{{$item->title}}</a>
</h2>
<ul class="post_details simple clearfix">
<li class="category">
<!-- <a title="Regio: {{$item->region->title}}" href="{{url('beelden/regio/' . $item->region->slug)}}">{{$item->region->title}}</a> -->
<a title="Regio: {{$item->region->title}}" href=".">{{$item->region->title}}</a>
</li>
@if($item->edited && ($item->edited != $item->published))
<li class="date edited">
{{Formatter::relativeDate($item->edited)}} bijgewerkt
om {{$item->published->format('H:i')}}
</li>
@else
<li class="date">
{{Formatter::relativeDate($item->published)}} om {{$item->published->format('H:i')}}
</li>
@endif
</ul>
<p class="block-lead hidden-xs">
{{$item->images[0]->title}} &bull;
{{$item->content}}
</p>
</div>
</div>
</div>
@endforeach
</div>
@endif
@endforeach

8
resources/views/partial/podcastdirectitems.blade.php
View File

@@ -1,10 +1,10 @@
<ul class='blog row'>
<div>
@foreach($podcasts as $podcast)
<?php
$url = route('gemist.fragment') . $podcast->url;
$popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
?>
<li class="box featured">
<div class="box featured">
<div class="row">
<div class="col-12 col-md-6">
<a href="{{$url}}" title="{{$podcast->title}}">
@@ -31,8 +31,8 @@
</a>
</div>
</div>
</li>
</div>
@endforeach
</ul><!--/.row-->
</div><!--/.row-->

2
resources/views/podcastitem.blade.php
View File

@@ -90,7 +90,7 @@
<div class="">
<div class="row news_post">
<div class="col-12 col-md content_container">
<div class="box full-width post single small_image">
<div class="box full-width post single small_image margin_top">
<h1 class="page_title">{{$podcast->title}}</h1>
<div class="post_body">
<ul class="post_details clearfix">

53
resources/views/radioprogram.blade.php
View File

@@ -4,7 +4,9 @@
{{$program->name}}
@endsection
@section('page_class')grey_background page_container @endsection
@section('page_class')
grey_background page_container
@endsection
@section('breadcrumb')
<ul class="bread_crumb">
@@ -23,7 +25,7 @@
@section('sidebar')
@php($now = new \DateTimeImmutable())
<div id="komende_uitzendingen">
<h4 class="box_header"><span>Komende week</span></h4>
<h4 class="box_header extra_small"><span>Komende week</span></h4>
@if(($next = $program->next) && count($next))
<div class="box full-width">
<ul class="blog podcasts">
@@ -34,14 +36,15 @@
@if($n->starts < $now)
<span class="post_date" title="Nu te horen tot {{$n->ends->format('H:i')}} uur.">
<i class="fa-regular fa-clock"></i> Nu te horen tot {{$n->ends->format('H:i')}} uur.
</span> <br />
</span> <br/>
<a href="{{ $player = route('luister.live') }}" target="_radioplayer"
class="action_button"
onclick="window.open('{{$player}}', '_radioplayer','width=400,height=400'); return false;"><span
class="fa fa-play"></span> <span>Luister live</span></a>
@break
@else
<span class="post_date" title="{{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.">
<span class="post_date"
title="{{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.">
<i class="fa-regular fa-clock"></i> {{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.
</span>
@endif
@@ -58,12 +61,14 @@
<div class="clearfix"></div>
<h4 class="box_header"><span>Terugluisteren</span></h4>
<div data-tabs>
<div class="tabs fit_content">
<h4 data-tab-content-id="tab_broadcast" class="box_header active"><span>Uitzending</span></h4>
<h4 data-tab-content-id="tab_fragments" class="box_header"><span>Fragmenten</span></h4>
<div class="tabs">
<h4 data-tab-content-id="tab_broadcast" class="box_header flex-grow-1 extra_small active">
<span>Uitzending</span></h4>
<h4 data-tab-content-id="tab_fragments" class="box_header extra_small"><span>Fragmenten</span></h4>
</div>
<div id="tab_broadcast" class="box tab_content active">
<p class="page_body">U kunt uitzendingen tot twee weken geleden terugluisteren. <a href="#fragmenten">Fragmenten</a> blijven
<p class="page_body">U kunt uitzendingen tot twee weken geleden terugluisteren. <a href="#fragmenten">Fragmenten</a>
blijven
onbeperkt beschikbaar.</p>
@if(($recent = $program->recent) && count($recent))
@@ -73,7 +78,8 @@
<li class="post">
<p class="post_details simple">
<span class="post_title">{{$r->name}}</span>
<span class="post_date" title="{{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur.">
<span class="post_date"
title="{{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur.">
<i class="fa-regular fa-clock"></i> {{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur.
</span>
@if($r->rerun || $r->nonstop)
@@ -91,7 +97,8 @@
</div>
<div id="tab_fragments" class="box tab_content">
<div class="clearfix"></div>
<p class="page_body">Fragmenten uit dit programma, zoals interviews, vindt u onder "Radio &ndash; Fragment gemist".</p>
<p class="page_body">Fragmenten uit dit programma, zoals interviews, vindt u onder "Radio &ndash; Fragment
gemist".</p>
<p>
<a href="{{ route('gemist.programma') . $program->url }}" class="action_button">
<span class="fa fa-list"></span>
@@ -103,20 +110,26 @@
<div id="contact">
@if($program->email)
<h4 class="box_header page_margin_top_section">Contact</h4>
<p><a href="mailto:{{$program->email}}@nhgooi.nl" class="action_button">
<span class="fa fa-envelope"></span>
<span>{{$program->email}}@nhgooi.nl</a>
</a></p>
<div class="box">
<h4 class="box_header page_margin_top_section">Contact</h4>
<p>
<a href="mailto:{{$program->email}}@nhgooi.nl" class="action_button">
<span class="fa fa-envelope"></span>
<span>{{$program->email}}@nhgooi.nl</a>
</a>
</p>
</div>
@endif
</div>
@if(($hosts = $program->hosts) && count($hosts))
<ul class="list">
@foreach($hosts as $host)
<li class="bullet style_2">{{ Html::mailto($host->email . '@nhgooi.nl', $host->name) }}</li>
@endforeach
</ul>
<div id="host" class="box">
<ul class="list">
@foreach($hosts as $host)
<li><i class="fa-solid fa-user-tie"></i> {{ Html::mailto($host->email . '@nhgooi.nl', $host->name, ['class' => 'action_button']) }}</li>
@endforeach
</ul>
</div>
@endif
</div><!--./left_content-->
</div><!--./col-->