Pressroom template verwijderd, website naar root van repo
This commit is contained in:
227
resources/views/radioschedule.blade.php
Normal file
227
resources/views/radioschedule.blade.php
Normal file
@@ -0,0 +1,227 @@
|
||||
<?php
|
||||
$pixelsPerHour = 30;
|
||||
$border = 1;
|
||||
$margin = 2;
|
||||
?>
|
||||
|
||||
@extends('layouts/full')
|
||||
|
||||
@section('title')
|
||||
Radioprogrammering
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<nav>
|
||||
<ul class="pager">
|
||||
<li class="action_button previous-week"><a href="{{route('radio.gids', ($shift - 1))}}">← Week eerder</a></li>
|
||||
<li class="action_button current-week"><a href="{{route('radio.gids')}}">Deze week</a></li>
|
||||
<li class="action_button next-week"><a href="{{route('radio.gids', ($shift + 1))}}">Week later →</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div id="loading" style="display: none; height: 300px;">
|
||||
<div class="progress progress-striped active">
|
||||
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
|
||||
<b>Programmaschema ophalen...</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id='schedule'>
|
||||
@include('partial/radioscheduleweek', ['schedule' => $schedule])
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
<ul class="pager">
|
||||
<li class="action_button previous-week"><a href="{{route('radio.gids', ($shift - 1))}}">← Week eerder</a></li>
|
||||
<li class="action_button current-week"><a href="{{route('radio.gids')}}">Deze week</a></li>
|
||||
<li class="action_button next-week"><a href="{{route('radio.gids', ($shift + 1))}}">Week later →</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
@endsection
|
||||
|
||||
@push('styles')
|
||||
<style>
|
||||
.pager {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.pager .previous-week,
|
||||
.pager .current-week,
|
||||
.pager .next-week {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.pager .current-week {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pager .next-week {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) { /* smaller than desktop */
|
||||
.schedule {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.schedule .time-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schedule .date-header {
|
||||
font-size: 150%;
|
||||
font-weight: bold;
|
||||
height: auto;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.schedule a.program {
|
||||
/* override the style="height.." */
|
||||
height: auto !important;
|
||||
margin-left: 15px !important;
|
||||
margin-bottom: 3px !important;
|
||||
}
|
||||
|
||||
.schedule .program .program-content {
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.schedule .program.non-stop .program-title {
|
||||
background-color: #8F9BA6;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) { /* desktop */
|
||||
.schedule {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.schedule .date-header {
|
||||
height: 3em;
|
||||
text-align: center;
|
||||
font-size: 120%;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.schedule .program .program-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schedule .program .program-title {
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.schedule .program.non-stop .program-title {
|
||||
background-color: transparent;
|
||||
color: #8F9BA6;
|
||||
}
|
||||
}
|
||||
|
||||
.schedule {
|
||||
color: black;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.schedule .time-header {
|
||||
height: {{$pixelsPerHour}}px;
|
||||
}
|
||||
|
||||
.schedule .timeslots {
|
||||
width: 80px;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
.schedule .date-column {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.schedule a.program {
|
||||
display: block;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
margin: {{$margin}}px;
|
||||
border: solid {{$border}}px #03A6E0;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.schedule a.program:hover {
|
||||
color: white;
|
||||
background-color: #71c1de;
|
||||
}
|
||||
|
||||
.schedule .program.current {
|
||||
border-color: #BD0013;
|
||||
}
|
||||
|
||||
.schedule .program .program-times {
|
||||
text-align: center;
|
||||
margin: 3px;
|
||||
}
|
||||
|
||||
.schedule .program.current .program-title {
|
||||
background-color: #71c1de;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.schedule .program.non-stop {
|
||||
border-color: #6C757D;
|
||||
}
|
||||
|
||||
|
||||
.schedule .program.special {
|
||||
color: #03A6E0;
|
||||
}
|
||||
|
||||
.schedule .program .current-marker {
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.schedule .program .current-marker span {
|
||||
padding: 3px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
background-color: #BD0013;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.schedule .program .program-title {
|
||||
padding: 5px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
background-color: #03A6E0;
|
||||
}
|
||||
|
||||
.schedule .program .program-content {
|
||||
margin: 3px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.schedule .program hr {
|
||||
margin: 3px;
|
||||
border: none;
|
||||
border-top: 1px solid #03A6E0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
@push('scripts')
|
||||
<script type="text/javascript">
|
||||
function scrollToMiddle($elt) {
|
||||
if($elt.length == 0) { return; }
|
||||
var elem_position = $elt.offset().top;
|
||||
var window_height = $(window).height();
|
||||
var y = elem_position - window_height / 2;
|
||||
window.scrollTo(0,y);
|
||||
}
|
||||
|
||||
$(function() { scrollToMiddle($(".current-marker")); });
|
||||
</script>
|
||||
@endpush
|
||||
Reference in New Issue
Block a user