Commit 7bc1c8fe authored by Karl Hasselbring's avatar Karl Hasselbring
Browse files

Ergebnisseite sieht wieder annehmbar aus

parent 69570a7b
......@@ -27,9 +27,6 @@ body {
display: flex;
flex-direction: column;
margin: 0;
&>div {
padding-top: 50px;
}
}
.wrapper {
......
......@@ -216,12 +216,6 @@ nav .input-group {
height: 100%;
}
.content-wrapper {
padding: 0px;
padding-top: 52px;
background-color: white;
}
#helpButton {
color: black;
}
......@@ -317,7 +311,6 @@ a {
.mg-logo {
color: #ff8000;
font-family: Liberation Sans, sans-serif;
padding: 5px 30px 0px 0px;
}
#header-searchbar {
......@@ -727,12 +720,12 @@ a {
border-bottom: 1px solid #ddd;
h2 {
margin: 10px 0px;
font-size: 17px;
font-size: 16px;
font-weight: bold;
}
p {
display: none;
font-size: 15px;
font-size: 14px;
}
}
.gefVon {
......@@ -778,3 +771,91 @@ a {
}
}
}
/* New result style */
@result-width: 700px;
@quicktip-width: 500px;
html,
body,
.content-wrapper {
width: 100%;
}
.content-wrapper {
display: flex;
flex-direction: column;
}
#header-logo a h1 {
margin: 0px;
}
#research-bar {
padding: 10px;
border-bottom: 2px solid rgb(255, 128, 0);
display: flex;
justify-content: center;
#header-searchbar {
margin-left: 10px;
}
@media (max-width: @screen-xs-max) {
flex-direction: column;
}
}
.resultpage-container {
width: @result-width + @quicktip-width;
align-self: center;
@media (max-width: (@result-width + @quicktip-width - 1px)) {
width: @result-width;
#quicktips {
display: none;
}
}
@media (max-width: @result-width) {
width: 100%;
}
display: flex;
justify-content: center;
#results {
max-width: @result-width;
width: 100%;
}
#quicktips {
padding-left: 50px;
width: @quicktip-width;
}
}
.result {
.result-title a {
color: black;
font-size: 18px;
font-weight: bold;
}
.result-header {
display: flex;
>* {
white-space: nowrap;
}
>*:not(:first-child) {
margin-left: 5px;
}
.result-link {
overflow: auto;
a {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
}
}
}
@media (max-width: @screen-xs-max) {
// mobile
}
\ No newline at end of file
.searchbar {
display: flex;
align-items: stretch;
justify-content: center;
font-size: 16px;
background-color: white;
.search-focus-selector {
......@@ -16,7 +17,7 @@
-moz-appearance: none;
appearance: none;
background-color: transparent;
padding-right: 35px;
padding: 0px 35px 0px 5px;
font-family: FontAwesome, sans-serif;
border: none;
&>option {
......@@ -73,6 +74,10 @@
.search-input-submit {
flex-grow: 1;
display: flex;
max-width: 600px;
@media (max-width: @screen-xs-max) {
max-width: initial;
}
}
.search-input {
flex-grow: 1;
......@@ -178,7 +183,7 @@
}
.resultpage-searchbar {
padding: 5px;
padding: 5px 45px 5px 5px;
:first-child {
border-left: none;
}
......
......@@ -8,26 +8,16 @@
</div>
</div>
@endif
<div class="content-wrapper container">
<header id="research" class="row">
<nav class="navbar navbar-default navbar-fixed-top navbar-resultpage">
<div class="container">
<div class="row" id="logo-searchbar-container">
<div class="content-wrapper">
<header id="research-bar">
<div id="header-logo">
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}"><h1 class="mg-logo">MetaGer</h1></a>
</div>
<div id="header-searchbar">
@include('parts.searchbar', ['class' => 'resultpage-searchbar', 'request' => Request::method()])
</div>
</div>
</div>
</nav>
</header>
<main id="main-content-tabs" class="row">
<div>
<div class="row">
<main class="resultpage-container">
@yield('results')
</div>
</div>
</main>
</div>
\ No newline at end of file
<div class="result row" data-count="{{ $result->number }}">
<div class="resultInformation col-xs-12 col-sm-11">
<div class="col-xs-10 col-sm-11" style="padding:0; ">
<p class="title">
<a class="title" href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ strip_tags($result->gefVon) }}" data-count="{{ $result->number }}" rel="noopener">
<div class="result" data-count="{{ $result->number }}">
<h2 class="result-title">
<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ strip_tags($result->gefVon) }}" data-count="{{ $result->number }}" rel="noopener">
{!! $result->titel !!}
</a>
</p>
<div class="link">
<div>
<div class="link-link">
</h2>
<div class="result-header">
<div class="result-link">
<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ strip_tags($result->gefVon) }}" data-count="{{ $result->number }}" rel="noopener">
{{ $result->anzeigeLink }}
</a>
</div>
<div class="options">
<div class="result-options">
<a class="dropdown-opener" href="javascript:void(0);">
<i class="fa fa-caret-down option-opener-icon" aria-hidden="true"></i>
</a>
......@@ -50,9 +47,8 @@
</ul>
</div>
</div>
</div>
<span class="hoster">
von {!! $result->gefVon !!}
<span class="result-hoster">
<span>von {!! $result->gefVon !!}</span>
</span>
@if( isset($result->partnershop) && $result->partnershop === TRUE )
<span class="partnershop-info">
......@@ -60,14 +56,14 @@
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/partnershops") }}" target="_blank" rel="noopener">{!! trans('result.options.4') !!}</a>
</span>
@endif
<a class="proxy" onmouseover="$(this).popover('show');" onmouseout="$(this).popover('hide');" data-toggle="popover" data-placement="auto right" data-container="body" data-content="@lang('result.proxytext')" href="{{ $result->proxyLink }}" target="{{ $metager->getNewtab() }}" rel="noopener">
<a class="result-proxy" onmouseover="$(this).popover('show');" onmouseout="$(this).popover('hide');" data-toggle="popover" data-placement="auto right" data-container="body" data-content="@lang('result.proxytext')" href="{{ $result->proxyLink }}" target="{{ $metager->getNewtab() }}" rel="noopener">
<img src="/img/proxyicon.png" alt="" />
{!! trans('result.options.5') !!}
<span>{!! trans('result.options.5') !!}</span>
</a>
</div>
</div>
<div>
@if( isset($result->logo) )
<div class="col-xs-2 col-sm-1" style="padding: 0;">
<div>
<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ strip_tags($result->gefVon) }}" data-count="{{ $result->number }}">
<img src="{{ $metager->getImageProxyLink($result->logo) }}" alt="" />
</a>
......@@ -88,5 +84,4 @@
@endif
@endif
</div>
</div>
......@@ -25,7 +25,7 @@
@include('modals.create-focus-modal')
@include('layouts.researchandtabs')
@else
<div class="tab-content container-fluid">
<div class="resultpage-container">
@yield('results')
</div>
@endif
......
@extends('layouts.resultPage')
@section('results')
{{-- Show all errors --}}
@if(sizeof($errors) > 0)
<div class="alert alert-danger">
<ul>
......@@ -10,6 +11,7 @@
</ul>
</div>
@endif
{{-- Show all warnings --}}
@if(sizeof($warnings) > 0)
<div class="alert alert-warning">
<ul>
......@@ -19,40 +21,41 @@
</ul>
</div>
@endif
@if($metager->showQuicktips())
<div class="col-xs-12 col-md-8 resultContainer">
@else
<div class="col-xs-12 col-md-12 resultContainer">
@endif
<div id="results">
{{-- Show initial products or ads --}}
@if($metager->hasProducts())
@if( $metager->getFokus() !== "produktsuche" && !$apiAuthorized)
@include('layouts.products', ['products' => $metager->getProducts()])
@endif
@else
@for($i = 0; $i <= 2; $i++)
@include('layouts.ad', ['ad' => $metager->popAd()])
@endfor
@endif
{{-- Show map --}}
@if($metager->getMaps())
<div class="result row" id="map">
<div class="resultInformation col-xs-12 col-sm-11">
<div class="result" id="map">
<iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" scrolling="no" tabindex="-1" style="width: 100%; height:0; border:0;"></iframe>
</div>
</div>
@endif
{{-- Create results and ongoing ads --}}
@foreach($metager->getResults() as $result)
@if($result->number % 7 === 0)
@include('layouts.ad', ['ad' => $metager->popAd()])
@endif
@include('layouts.result', ['result' => $result])
@endforeach
{{-- Show pagination --}}
<nav class="mg-pager" aria-label="...">
<div @if($metager->getPage() === 1) class="disabled" @endif><a href="@if($metager->getPage() === 1) # @else javascript:history.back() @endif">{{ trans('results.zurueck') }}</a></div>
<div @if($metager->nextSearchLink() === "#") class="disabled" @endif><a href="{{ $metager->nextSearchLink() }}">{{ trans('results.weiter') }}</a></div>
<div @if($metager->getPage() === 1) class="disabled" @endif>
<a @if($metager->getPage() !== 1) href="javascript:history.back()" @endif>{{ trans('results.zurueck') }}</a>
</div>
<div @if($metager->nextSearchLink() === "#") class="disabled" @endif>
<a @if($metager->nextSearchLink() !== "#") href="{{ $metager->nextSearchLink() }}" @endif>{{ trans('results.weiter') }}</a>
</div>
</nav>
</div>
@if( $metager->showQuicktips() )
<div class="col-md-4 hidden-xs hidden-sm" id="quicktips"></div>
<div id="quicktips"></div>
@endif
@endsection
@if( sizeof($errors) > 0 )
{{-- Show all errors --}}
@if(sizeof($errors) > 0)
<div class="alert alert-danger">
<ul>
@foreach($errors as $error)
......@@ -7,7 +8,8 @@
</ul>
</div>
@endif
@if( sizeof($warnings) > 0)
{{-- Show all warnings --}}
@if(sizeof($warnings) > 0)
<div class="alert alert-warning">
<ul>
@foreach($warnings as $warning)
......@@ -16,7 +18,8 @@
</ul>
</div>
@endif
<div class="col-xs-12 col-md-8">
<div id="results">
{{-- Show initial products or ads --}}
@if($metager->hasProducts())
@if( $metager->getFokus() !== "produktsuche" && !$apiAuthorized)
@include('layouts.products', ['products' => $metager->getProducts()])
......@@ -26,27 +29,29 @@
@include('layouts.ad', ['ad' => $metager->popAd()])
@endfor
@endif
{{-- Show map --}}
@if($metager->getMaps())
<div class="result row" id="map">
<div class="resultInformation col-xs-12 col-sm-11">
<iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" style="width: 100%; height:0; border:0;"></iframe>
</div>
<div class="result" id="map">
<iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" scrolling="no" tabindex="-1" style="width: 100%; height:0; border:0;"></iframe>
</div>
@endif
{{-- Create results and ongoing ads --}}
@foreach($metager->getResults() as $result)
@if($result->number % 7 === 0)
@include('layouts.ad', ['ad' => $metager->popAd()])
@endif
@include('layouts.result', ['result' => $result])
@endforeach
<nav aria-label="...">
<ul class="pager">
<li @if($metager->getPage() === 1) class="disabled" @endif><a href="@if($metager->getPage() === 1) # @else javascript:history.back() @endif">{{ trans('results.zurueck') }}</a></li>
<li @if($metager->nextSearchLink() === "#") class="disabled" @endif><a href="{{ $metager->nextSearchLink() }}">{{ trans('results.weiter') }}</a></li>
</ul>
{{-- Show pagination --}}
<nav class="mg-pager" aria-label="...">
<div @if($metager->getPage() === 1) class="disabled" @endif>
<a @if($metager->getPage() !== 1) href="javascript:history.back()" @endif>{{ trans('results.zurueck') }}</a>
</div>
<div @if($metager->nextSearchLink() === "#") class="disabled" @endif>
<a @if($metager->nextSearchLink() !== "#") href="{{ $metager->nextSearchLink() }}" @endif>{{ trans('results.weiter') }}</a>
</div>
</nav>
</div>
@if( $metager->showQuicktips() )
<div class="col-md-4 hidden-xs hidden-sm" id="quicktips"></div>
<div id="quicktips"></div>
@endif
\ No newline at end of file
</div>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment