master
parent
4860e58647
commit
05514be64a
|
|
@ -2,7 +2,88 @@
|
|||
@extends('template.'.config('settings.template').'.content.master')
|
||||
@section('content')
|
||||
|
||||
<div class="card text-bg-dark border-0" style="border-radius:0; box-shadow:none;">
|
||||
|
||||
<style>
|
||||
|
||||
.block {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.img-parallax {
|
||||
width: 100vmax;
|
||||
z-index: -1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
|
||||
<div class="block" style="height: 500px;">
|
||||
<img src="{{$cover}}" data-speed="-1" class="img-parallax" alt="{{config('settings.name')}} Cover" />
|
||||
|
||||
<!--<x-img src="{{$cover}}" data-speed="-1" class="img-parallax" alt="{{config('settings.name')}} Cover" />-->
|
||||
|
||||
|
||||
<div class="card-img-overlay d-none d-lg-flex align-items-center" styles="border-radius:0; background: radial-gradient(rgba(0,0,0,.5) 20%,rgba(0,0,0,.1)); box-shadow:inset 0 0 3px 1px rgba(0,0,0,.1), inset 0 0 25px 2px rgba(0,0,0,.2);">
|
||||
<div class="container p-3 rounded" style="width: 55vw; border-radius:0; background: radial-gradient({{$_primary_ci_color}}50,{{$_primary_ci_color}}30); box-shadow:inset 0 0 3px 1px {{$_primary_ci_color}}10, inset 0 0 25px 2px rgba(0,0,0,.2);">
|
||||
<h1 class="card-title text-white mb-5 text-center text-uppercase">{{config('settings.name')}}</h1>
|
||||
<p class="card-text my-2 text-white fs-5">{{config('settings.description')}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
$('.img-parallax').each(function() {
|
||||
var $image = $(this);
|
||||
var $imageParent = $(this).parent();
|
||||
|
||||
function parallaxImg () {
|
||||
var speed = $image.data('speed');
|
||||
var imageY = $imageParent.offset().top;
|
||||
var winY = $(this).scrollTop();
|
||||
var winH = $(this).height();
|
||||
var parentH = $imageParent.innerHeight();
|
||||
// The next pixel to show on screen
|
||||
var winBottom = winY + winH;
|
||||
|
||||
// If block is shown on screen
|
||||
if (winBottom > imageY && winY < imageY + parentH) {
|
||||
// Number of pixels shown after block appear
|
||||
var imgBottom = ((winBottom - imageY) * speed);
|
||||
// Max number of pixels until block disappear
|
||||
var imgTop = winH + parentH;
|
||||
// Percentage between start showing until disappearing
|
||||
var imgPercent = ((imgBottom / imgTop) * 100) + (50 - (speed * 50));
|
||||
}
|
||||
|
||||
$image.css({ top: imgPercent + '%', transform: 'translate(-50%, -' + imgPercent + '%)' });
|
||||
}
|
||||
|
||||
$(document).on({
|
||||
scroll: function () {
|
||||
parallaxImg();
|
||||
}, ready: function () {
|
||||
parallaxImg();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="card text-bg-dark border-0 d-none" style="border-radius:0; box-shadow:none;">
|
||||
<x-img src="{{$cover}}" style="object-fit:cover; aspect-ratio:3/1;" class="img-fluid shadow-lg" alt="{{config('settings.name')}} Cover" />
|
||||
<div class="card-img-overlay d-none d-lg-flex align-items-center" styles="border-radius:0; background: radial-gradient(rgba(0,0,0,.5) 20%,rgba(0,0,0,.1)); box-shadow:inset 0 0 3px 1px rgba(0,0,0,.1), inset 0 0 25px 2px rgba(0,0,0,.2);">
|
||||
<div class="container p-3 rounded" style="width: 55vw; border-radius:0; background: radial-gradient({{$_primary_ci_color}}50,{{$_primary_ci_color}}30); box-shadow:inset 0 0 3px 1px {{$_primary_ci_color}}10, inset 0 0 25px 2px rgba(0,0,0,.2);">
|
||||
|
|
@ -13,8 +94,6 @@
|
|||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="container d-lg-none">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
|
|
@ -25,11 +104,6 @@
|
|||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@if($type->get("Ankündigung")->status)
|
||||
@php($leistungen = filterByContentType("Ankündigung"))
|
||||
@if($leistungen->isNotEmpty())
|
||||
|
|
@ -66,23 +140,12 @@
|
|||
</h5>
|
||||
{{ $content->ankundigung }}
|
||||
</div>
|
||||
|
||||
@endisset
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@endforeach
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</diw>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
|
|
@ -122,9 +185,6 @@
|
|||
|
||||
@endforeach
|
||||
|
||||
|
||||
|
||||
|
||||
@if($leistungen->count() > 3)
|
||||
|
||||
<div class="col-12 text-center mt-3">
|
||||
|
|
@ -148,10 +208,6 @@
|
|||
@endif
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@if($type->get("News")->status)
|
||||
@php($news = filterByContentType("News"))
|
||||
@if($news->isNotEmpty())
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
@extends('template.'.config('settings.template').'.content.master')
|
||||
@section('content')
|
||||
<x-img src="{{ $list->image }}" class="img-fluid" alt=""/>
|
||||
|
||||
|
||||
|
||||
|
|
@ -15,6 +14,96 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
.block {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.block h2 {
|
||||
position: relative;
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 10vw;
|
||||
color: white;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.img-parallax {
|
||||
width: 100vmax;
|
||||
z-index: -1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
|
||||
<div class="block">
|
||||
<img src="https://unsplash.it/1920/1920/?image=1003" data-speed="-1" class="img-parallax">
|
||||
<h2>Parallax 1</h2>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
$('.img-parallax').each(function() {
|
||||
var $image = $(this);
|
||||
var $imageParent = $(this).parent();
|
||||
|
||||
function parallaxImg () {
|
||||
var speed = $image.data('speed');
|
||||
var imageY = $imageParent.offset().top;
|
||||
var winY = $(this).scrollTop();
|
||||
var winH = $(this).height();
|
||||
var parentH = $imageParent.innerHeight();
|
||||
// The next pixel to show on screen
|
||||
var winBottom = winY + winH;
|
||||
|
||||
// If block is shown on screen
|
||||
if (winBottom > imageY && winY < imageY + parentH) {
|
||||
// Number of pixels shown after block appear
|
||||
var imgBottom = ((winBottom - imageY) * speed);
|
||||
// Max number of pixels until block disappear
|
||||
var imgTop = winH + parentH;
|
||||
// Percentage between start showing until disappearing
|
||||
var imgPercent = ((imgBottom / imgTop) * 100) + (50 - (speed * 50));
|
||||
}
|
||||
|
||||
$image.css({ top: imgPercent + '%', transform: 'translate(-50%, -' + imgPercent + '%)' });
|
||||
}
|
||||
|
||||
$(document).on({
|
||||
scroll: function () {
|
||||
parallaxImg();
|
||||
}, ready: function () {
|
||||
parallaxImg();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<x-img src="{{ $list->image }}" class="img-fluid rounded" alt=""/>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
@if(count($contents) > 0)
|
||||
|
||||
@foreach($contents as $index => $content)
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4 mb-4" data-aos="fade-up" data-aos-delay="{{$index * 250}}">
|
||||
|
|
@ -57,6 +146,19 @@
|
|||
|
||||
|
||||
@endforeach
|
||||
@else
|
||||
|
||||
<script src="http://lumino.xps/admin-assets/libs/lottie-player.js"></script>
|
||||
<div class="col-12 text-center" style="margin-bottom: 30vh; margin-top: 5vh;">
|
||||
<lottie-player src="http://lumino.xps/admin-assets/animations/no-results.json" background="transparent" speed="1" style="width: 200px; height: 200px; margin: 0 auto;" loop="" autoplay=""></lottie-player>
|
||||
|
||||
<i>
|
||||
Derzeit keine Inhalte in {{ $list->name }} veröffentlicht.
|
||||
</i>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -33,6 +33,10 @@
|
|||
Werden Sie Teil unseres Teams und gestalten Sie Ihre Karriere bei {{$_legal_name}}!
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
@if(count($contents) > 0)
|
||||
|
||||
@foreach($contents as $content)
|
||||
|
||||
<div class="col-12 my-3">
|
||||
|
|
@ -85,6 +89,19 @@
|
|||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
@else
|
||||
|
||||
<script src="http://lumino.xps/admin-assets/libs/lottie-player.js"></script>
|
||||
<div class="col-12 text-center" style="margin-bottom: 30vh; margin-top: 5vh;">
|
||||
<lottie-player src="http://lumino.xps/admin-assets/animations/no-results.json" background="transparent" speed="1" style="width: 200px; height: 200px; margin: 0 auto;" loop="" autoplay=""></lottie-player>
|
||||
|
||||
<i>
|
||||
Derzeit keine Inhalte in {{ $list->name }} veröffentlicht.
|
||||
</i>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,34 +16,36 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
@if(count($contents) > 0)
|
||||
|
||||
@foreach($contents as $content)
|
||||
<div class="col-12 col-md-6 col-lg-4 mb-4">
|
||||
|
||||
|
||||
|
||||
|
||||
<a href="{{ $content->path }}" class="text-decoration-none">
|
||||
<div class="card h-100 shadow-lg mb-4" id="news-{{$content->id}}">
|
||||
|
||||
<img src="{{ $content->image() }}" class="card-img-top">
|
||||
|
||||
<div class="card-body">
|
||||
<h3 class="h5 mb-3">{{$content->title}} </h3>
|
||||
|
||||
|
||||
{!! Str::limit($content->kurzbeschreibung, 180) !!}
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
@else
|
||||
|
||||
<script src="http://lumino.xps/admin-assets/libs/lottie-player.js"></script>
|
||||
<div class="col-12 text-center" style="margin-bottom: 30vh; margin-top: 5vh;">
|
||||
<lottie-player src="http://lumino.xps/admin-assets/animations/no-results.json" background="transparent" speed="1" style="width: 200px; height: 200px; margin: 0 auto;" loop="" autoplay=""></lottie-player>
|
||||
|
||||
<i>
|
||||
Derzeit keine {{ $list->name }} veröffentlicht.
|
||||
</i>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue