From 2a09178d5de9a4d53fdbb2e69cab8fe7ff6651fc Mon Sep 17 00:00:00 2001 From: horus Date: Tue, 7 May 2019 18:05:13 +0200 Subject: Improves mimicing of WP. (site) --- site/public/css/fk-custom.css | 183 ++++++++++++++++++++++ site/resources/views/fk-offer.blade.php | 142 +++++++++++++---- site/resources/views/layouts/fk-base.blade.php | 27 ++-- site/resources/views/snippets/fk-navbar.blade.php | 61 ++++++++ 4 files changed, 372 insertions(+), 41 deletions(-) create mode 100644 site/public/css/fk-custom.css create mode 100644 site/resources/views/snippets/fk-navbar.blade.php (limited to 'site') diff --git a/site/public/css/fk-custom.css b/site/public/css/fk-custom.css new file mode 100644 index 0000000..9a58e37 --- /dev/null +++ b/site/public/css/fk-custom.css @@ -0,0 +1,183 @@ +html { + position: relative; + min-height: 100%; +} +body > .container { + padding: 30px 15px 0; +} + +.card-img-right { + height: 100%; + border-radius: 0 3px 3px 0; +} +.custom-flex-child { + min-width: 0; +} +.h3-truncate { + min-width: 0; +} +.custom-flex-child > .h3-truncate > .hide-overflow{ + overflow: hidden; + text-overflow: ellipsis !important; +} +.custom-flex-child > .hide-overflow{ + overflow: hidden; + text-overflow: ellipsis !important; +} +.hide-overflow{ + overflow: hidden; + text-overflow: ellipsis !important; +} +.footer-col { + padding-right: 20px; + padding-left: 20px; +} +.w-55 { + width: 55% !important; +} +.h-40 { + height: 40% !important; +} +.h-45 { + height: 45% !important; +} +.text-small { + font-size: 80%; +} +.mt-10 { + margin-top: 10px; +} +.mt-20 { + margin-top: 20px; +} +.text-dotted { + text-decoration: underline dotted; +} +.off-badge { + color: white; + font-size: 150%; + padding-right: 10px; + padding-left:10px; + opacity: 0.9; +} +.off-badge-small { + font-size: 120%; +} +.text-large { + font-size: 120%; +} +.img-grey { + opacity: 0.7; + filter: grayscale(100%); +} +.u { + text-decoration: underline; +} +.card { + /* + background-color: #d1d8e0; + box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); + box-shadow: 0 .25rem .75rem #d1d8e0; + border: 0.5px solid #d1d8e0 !important; + box-shadow: 1rem 1rem 1rem #d1d8e0 !important; + + box-shadow: 1rem 1rem 1rem #aaa !important; + box-shadow: .5rem .5rem 1rem #aaa, 1rem 1rem 1rem #aaa !important; + + border-top: 2px solid white; + */ + box-shadow: 0rem 0rem .1rem .01rem #d1d8e0, 1rem 1rem 1rem #d1d8e0 !important; + border-left: 3px solid white; +} +.card:hover { + box-shadow: 0.5rem 0.5rem 0.5rem #aaa !important; + transition: box-shadow .1s cubic-bezier(.4,0,1,1); + + will-change: box-shadow,transform; + /* + border-left: 4px solid #d1d8e0; + border-left: 4px solid #12CBC4; + border-left: 3px solid #142639 ; + border-left: 4px solid white; + */ + border-left: 3px solid #1289A7; + /* + border-top: 4px solid #1289A7; + border-top: 2px solid #1289A7; + */ +} +.card-link { + position: relative; +} + +footer { + /* + background-color: #d1d8e0 !important; + box-shadow: -0.5rem 0 .1rem .15rem #d1d8e0; + box-shadow: 0 -0.5rem .1rem .05rem #d1d8e0; + */ + box-shadow: 0 -0.2rem .1rem .05rem #d1d8e0; +} +.jumbotron.box-shadow { + box-shadow: 0rem 0rem .5rem .15rem #d1d8e0, 1rem 1rem 1rem #d1d8e0 !important; +} +.text-fade-out { + position: absolute; + bottom: 45%; + left: 0; + width: 100%; + text-align: center; + margin: 0; padding: 8px 0; + background-image: linear-gradient(to bottom, transparent, white); +} +/* + * Not used. + */ +.created_at { + bottom: 5px; + /* + margin-top: 200%; + */ + position: absolute; + background-color: #d1d8e0 !important; + color: #142639 !important; + padding-left:5px; + padding-right: 5px; + opacity: 0.9; +} +.footer-link { + padding-left: 0px !important; +} +.navbar-small { + font-size: 70% !important; +} +.search-btn-bg-white { + /* + */ + background-color: rgba(255,255,255,0.05)!important; +} +.search-btn-bg-white:hover { + background-color: rgba(255,255,255,.15)!important; +} +.s-link:hover { + color: inherit; +} + +.flex-auto { + -ms-flex: 0 0 auto; + -webkit-box-flex: 0; + flex: 0 0 auto; +} + +.h-250 { height: 250px; } +@media (min-width: 768px) { + .h-md-250 { height: 250px; } +} + +.border-top { border-top: 1px solid #e5e5e5; } +.border-bottom { border-bottom: 1px solid #e5e5e5; } +.border-white { border: 1px solid white; } + +.ml-10 { + margin-left: 10px !important; +} diff --git a/site/resources/views/fk-offer.blade.php b/site/resources/views/fk-offer.blade.php index 10f50a1..ad9b88c 100644 --- a/site/resources/views/fk-offer.blade.php +++ b/site/resources/views/fk-offer.blade.php @@ -1,4 +1,4 @@ -@extends('layouts.base') +@extends('layouts.fk-base') @section('header') {{ ucfirst($title) }} @@ -9,7 +9,39 @@ @endsection @section('content') + +
+ +
+
+ +
+
+
+

{{ $header }}

+
+
+
+ +

{{ ucfirst($spirit_type) }} ({{$count}} Angebote)

@@ -17,6 +49,7 @@

Zurück zur Übersicht...

+ */ ?> count() ) { @@ -31,22 +64,88 @@ if ( !$data->count() ) { } else { /* Liste Angebote */ +//@include('snippets.sortbuttons') +$css_border_left = ""; + +foreach( $data as $offer) { ?> -@include('snippets.sortbuttons') -"> +
+
+
+

+ + {{ ucfirst($offer->spirit_type) }} {{ $offer->shop }} + +

+
+
+

{{ $offer->procent}} %

+
+ +
+
+
+

+ {{ ucfirst($offer->spirit_type) }} {{ $offer->shop }} +

+
+
+ +

{{ $offer->name }}

+ +
+

+ Alter Preis: {{ TF::fF($offer->original_price) }} € +
+ Neuer Preis: {{ TF::fF($offer->discounted_price) }} € +
+ {{ TF::fF($offer->base_price ) }} € / Liter +

+

+ Alkohol: {{ TF::fF($offer->abv) }} % +
+ Volumen: {{ TF::fF($offer->volume) }} Liter +
+ Versand: {{ TF::fF($offer->shipping_costs) }} € +
+
+

+
+
+
+
+ Zum Shop +
+
+

+ Preis vom {{ strftime("%d. %B", $offer->created_at) }} +

+
+ - -
+ Detailansicht -
+ +
+
+ +
+
+ +name }}" data-track-content data-content-name="{{ ucfirst($spirit_type) }}" data-content-piece="{{ $offer->name }}" data-content-target="{{ $offer->url }}">
@@ -163,29 +262,8 @@ if ( !$data->count() ) {
- - - - - - - {{ $data->appends(Input::except('page'))->links() }} diff --git a/site/resources/views/layouts/fk-base.blade.php b/site/resources/views/layouts/fk-base.blade.php index ac72844..14352a1 100644 --- a/site/resources/views/layouts/fk-base.blade.php +++ b/site/resources/views/layouts/fk-base.blade.php @@ -3,9 +3,11 @@ + + @yield('header') | {{ env("APP_BRANDING") }} @@ -21,12 +23,19 @@ - - - + + + @@ -68,17 +77,17 @@ if ( "" != env('PIWIK_URL') && "" != env('PIWIK_ID') ) { } ?> - @include('snippets.navbar') + @include('snippets.fk-navbar') @yield('content') @include('snippets.fk-footer') - - - - - + + + + + @yield('scripts') diff --git a/site/resources/views/snippets/fk-navbar.blade.php b/site/resources/views/snippets/fk-navbar.blade.php new file mode 100644 index 0000000..2b91217 --- /dev/null +++ b/site/resources/views/snippets/fk-navbar.blade.php @@ -0,0 +1,61 @@ +
+ + + + + +
+
+
+
+
+

+

Supermarkt-Spirituosen im Test

+
+
+ + +
+
+
+
-- cgit v1.2.3