Commit 90a1581b authored by Dominik Hebeler's avatar Dominik Hebeler
Browse files

Merge branch '589-umsetzung-erstes-neudesign-fur-ergebnisseite' into 'MetaGer-Redesign'

Resolve "Umsetzung erstes Neudesign für Ergebnisseite"

See merge request !1049
parents 13f7a60f 6f991b86
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
@lsprev-or-lsnext-i-background-color: @result-page-color-black; @lsprev-or-lsnext-i-background-color: @result-page-color-black;
body { body {
background-image: inherit; background-image: inherit;
background-color: @body-background-color; background-color: white;
} }
footer { footer {
...@@ -48,7 +48,6 @@ footer { ...@@ -48,7 +48,6 @@ footer {
#map, #map,
#map div { #map div {
display: flex; display: flex;
margin: 0;
} }
.nav-tabs>li>a { .nav-tabs>li>a {
...@@ -208,10 +207,7 @@ nav .input-group { ...@@ -208,10 +207,7 @@ nav .input-group {
.content-wrapper { .content-wrapper {
padding: 0px; padding: 0px;
padding-top: 52px; padding-top: 52px;
background-color: @content-wrapper-background-color; background-color: white;
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.3);
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.3);
} }
#helpButton { #helpButton {
...@@ -300,15 +296,12 @@ a { ...@@ -300,15 +296,12 @@ a {
} }
.result { .result {
margin-bottom: 10px; margin-top: 10px;
margin-bottom: 30px;
width: 100%; width: 100%;
&>.number {
font-size: 15px;
line-height: 1;
text-align: right;
}
&>.resultInformation { &>.resultInformation {
border-radius: 5px; border-radius: 5px;
padding-left: 0px;
&>.save { &>.save {
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -324,7 +317,7 @@ a { ...@@ -324,7 +317,7 @@ a {
.title { .title {
color: @result-title-color; color: @result-title-color;
text-decoration: none; text-decoration: none;
font-size: 14px; font-size: 18px;
font-weight: bold; font-weight: bold;
margin-bottom: 0; margin-bottom: 0;
white-space: nowrap; white-space: nowrap;
...@@ -334,7 +327,7 @@ a { ...@@ -334,7 +327,7 @@ a {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.link { .link {
font-size: 13px; font-size: 16px;
margin: 0; margin: 0;
line-height: 1.5; line-height: 1.5;
&>div { &>div {
...@@ -365,7 +358,7 @@ a { ...@@ -365,7 +358,7 @@ a {
.description { .description {
margin-bottom: 3px; margin-bottom: 3px;
color: @result-description-color; color: @result-description-color;
font-size: 14px; font-size: 16px;
line-height: 1.3; line-height: 1.3;
clear: both; clear: both;
.date { .date {
...@@ -377,7 +370,7 @@ a { ...@@ -377,7 +370,7 @@ a {
} }
img { img {
margin: 5px; margin: 5px;
margin-left: 0; margin-left: 0px;
margin-right: 15px; margin-right: 15px;
height: auto; height: auto;
width: auto; width: auto;
...@@ -386,11 +379,19 @@ a { ...@@ -386,11 +379,19 @@ a {
border: solid 1px @result-description-img-border-color; border: solid 1px @result-description-img-border-color;
} }
} }
&.ad .description { &.ad {
max-width: 115ch; .ad-label {
overflow: hidden; border: green solid 1px;
text-overflow: ellipsis; padding: 1px;
white-space: nowrap; color: green;
border-radius: 4px;
}
.description {
max-width: 115ch;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
} }
.hoster { .hoster {
font-size: 13px; font-size: 13px;
...@@ -479,15 +480,6 @@ a { ...@@ -479,15 +480,6 @@ a {
} }
} }
#quicktips iframe {
width: 100%;
height: 800px;
background-color: transparent;
border: 0px none transparent;
padding: 0px;
overflow: hidden;
}
.js-only { .js-only {
display: none; display: none;
} }
...@@ -618,14 +610,14 @@ a { ...@@ -618,14 +610,14 @@ a {
} }
} }
@media(max-width: @screen-xs-max) { .resultContainer {
.resultContainer { margin: 0px;
padding-left: 0; padding: 0px;
padding-right: 0; @media(max-width: @screen-xs-max) {
padding-right: 0px;
} }
} }
/* /*
* <div id="quicktips"> * <div id="quicktips">
* <div class="quicktip" type="TYPE"> * <div class="quicktip" type="TYPE">
...@@ -642,8 +634,7 @@ a { ...@@ -642,8 +634,7 @@ a {
#quicktips { #quicktips {
display: flex; display: flex;
flex-direction: column; flex-direction: column; // border: 2px solid #ccc;
// border: 2px solid #ccc;
.quicktip { .quicktip {
margin: 10px 0px; margin: 10px 0px;
padding-left: 10px; padding-left: 10px;
...@@ -657,21 +648,24 @@ a { ...@@ -657,21 +648,24 @@ a {
} }
.quicktip-summary { .quicktip-summary {
h1 { h1 {
font-size: 16px; font-size: 18px;
font-weight: bold; font-weight: bold;
} }
p {
font-size: 16px;
}
} }
.quicktip-detail { .quicktip-detail {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
h2 { h2 {
margin: 10px 0px; margin: 10px 0px;
font-size: 14px; font-size: 16px;
font-weight: bold; font-weight: bold;
} }
p { p {
display: none; display: none;
font-size: 12px; font-size: 14px;
} }
} }
.gefVon { .gefVon {
......
<?php <?php
return [ return [
'werbung' => 'Werbung',
'von' => 'Werbung von', 'von' => 'Werbung von',
]; ];
<?php <?php
return [ return [
'von' => 'Advertisement by',
]; ];
<?php <?php
return [ return [
"von" => "Reclamo de:"
]; ];
\ No newline at end of file
@if(isset($ad) && !$apiAuthorized) @if(isset($ad) && !$apiAuthorized)
<div class="result ad row"> <div class="result ad row">
<div class="number col-sm-1"></div>
<div class="resultInformation col-sm-10"> <div class="resultInformation col-sm-10">
<p class="title"> <p class="title">
<a class="title" href="{{ $ad->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ $ad->gefVon }}" data-count="0"> <a class="title" href="{{ $ad->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ $ad->gefVon }}" data-count="0">
...@@ -12,7 +11,7 @@ ...@@ -12,7 +11,7 @@
{{ $ad->anzeigeLink }} {{ $ad->anzeigeLink }}
</a> </a>
<span class="hoster"> <span class="hoster">
{!! trans('ad.von') !!} {!! $ad->gefVon !!} <span class="ad-label">{!! trans('ad.werbung') !!}</span> {!! trans('ad.von') !!} {!! $ad->gefVon !!}
</span> </span>
</p> </p>
<p class="description"> <p class="description">
......
...@@ -17,12 +17,11 @@ ...@@ -17,12 +17,11 @@
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}"><h1>M<span class="hidden-xs">eta</span>G<span class="hidden-xs">er</span></h1></a> <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}"><h1>M<span class="hidden-xs">eta</span>G<span class="hidden-xs">er</span></h1></a>
</div> </div>
<div class="col-xs-9 dense-col"> <div class="col-xs-9 dense-col">
<form method="{{ Request::method() }}" accept-charset="UTF-8" class="form" id="submitForm"> <form method="{{ Request::method() }}" accept-charset="UTF-8" class="form search-bar-input" id="submitForm">
<div class="input-group"> <div class="input-group">
<input autocomplete="off" class="form-control" form="submitForm" id="eingabeTop" name="eingabe" placeholder="Suchbegriffe erweitern/verändern, oder völlig neue Suche:" tabindex="1" type="text" value="{{ $eingabe }}" required /> <input autocomplete="off" class="form-control" form="submitForm" id="eingabeTop" name="eingabe" placeholder="Suchbegriffe erweitern/verändern, oder völlig neue Suche:" tabindex="1" type="text" value="{{ $eingabe }}" required />
<div class="input-group-addon"> <div class="input-group-addon">
<button type='submit' form="submitForm" id='search'><i class="fa fa-search" aria-hidden="true"></i> <button type='submit' form="submitForm" id='search'><i class="fa fa-search" aria-hidden="true"></i></button>
</button>
</div> </div>
</div> </div>
@foreach( $metager->request->all() as $key => $value) @foreach( $metager->request->all() as $key => $value)
...@@ -35,168 +34,12 @@ ...@@ -35,168 +34,12 @@
</div> </div>
</div> </div>
</nav> </nav>
<ul id="foki" class=" resultpage-foki nav nav-tabs" role="tablist">
@if( $metager->getFokus() === "web" )
<li id="webTabSelector" role="presentation" data-loaded="1" class="active tab-selector">
<a aria-controls="web" data-href="#web" href="#web">
<i class="fa fa-globe" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.web') }}</span>
</a>
</li>
@else
<li data-loaded="0" id="webTabSelector" class="tab-selector" role="presentation">
<a aria-controls="web" data-href="{!! $metager->generateSearchLink('web') !!}" href="{!! $metager->generateSearchLink('web', false) !!}">
<i class="fa fa-globe" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.web') }}</span>
</a>
</li>
@endif
@if( $metager->getFokus() === "nachrichten" )
<li id="nachrichtenTabSelector" role="presentation" data-loaded="1" class="active tab-selector">
<a aria-controls="nachrichten" data-href="#nachrichten" href="#nachrichten">
<i class="fa fa-bullhorn" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.nachrichten') }}</span>
</a>
</li>
@else
<li data-loaded="0" id="nachrichtenTabSelector" class="tab-selector" role="presentation" >
<a aria-controls="nachrichten" data-href="{!! $metager->generateSearchLink('nachrichten') !!}" href="{!! $metager->generateSearchLink('nachrichten', false) !!}">
<i class="fa fa-bullhorn" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.nachrichten') }}</span>
</a>
</li>
@endif
@if( $metager->getFokus() === "wissenschaft" )
<li id="wissenschaftTabSelector" role="presentation" data-loaded="1" class="active tab-selector">
<a aria-controls="wissenschaft" data-href="#wissenschaft" href="#wissenschaft">
<i class="fa fa-file-text" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.wissenschaft') }}</span>
</a>
</li>
@else
<li data-loaded="0" id="wissenschaftTabSelector" class="tab-selector" role="presentation">
<a aria-controls="wissenschaft" data-href="{!! $metager->generateSearchLink('wissenschaft') !!}" href="{!! $metager->generateSearchLink('wissenschaft', false) !!}">
<i class="fa fa-file-text" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.wissenschaft') }}</span>
</a>
</li>
@endif
@if( $metager->getFokus() === "produktsuche" )
<li id="produktsucheTabSelector" role="presentation" data-loaded="1" class="active tab-selector">
<a aria-controls="produktsuche" data-href="#produktsuche" href="#produktsuche">
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.produkte') }}</span>
</a>
</li>
@else
<li data-loaded="0" id="produktsucheTabSelector" class="tab-selector" role="presentation" >
<a aria-controls="produktsuche" data-href="{!! $metager->generateSearchLink('produktsuche') !!}" href="{!! $metager->generateSearchLink('produktsuche', false) !!}">
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.produkte') }}</span>
</a>
</li>
@endif
{{-- Fix for older Versions --}}
@if( $metager->getFokus() === "angepasst" )
<li id="angepasstTabSelector" role="presentation" data-loaded="1" class="active tab-selector">
<a aria-controls="angepasst" data-href="#angepasst" href="#angepasst">
<i class="fa fa-cog" aria-hidden="true"></i>
<span class="hidden-xs">{{ trans('index.foki.angepasst') }}</span>
</a>
</li>
@endif
<li id="mapsTabSelector" role="presentation" class="tab-selector">
<a href="https://maps.metager.de/map/{{ $metager->getQ() }}/-6.781309835595698/44.85855550132342/33.9779675081543/58.25372144666716" target="_blank">
<i class="fa fa-map-marker" aria-hidden="true"></i>
<span class="hidden-xs">{!! trans('index.foki.maps') !!}</span>
</a>
</li>
</ul>
</header> </header>
<main id="main-content-tabs" class="tab-content row"> <main id="main-content-tabs" class="row">
<div>
@if( $metager->getFokus() === "web" ) <div class="row">
<div role="tabpanel" class="tab-pane active" id="web"> @yield('results')
<div class="row">
@yield('results')
</div>
</div>
@else
<div role="tabpanel" class="tab-pane" id="web">
<div class="loader">
<img src="/img/ajax-loader.gif" alt="" />
</div>
</div>
@endif
@if( $metager->getFokus() === "bilder" )
<div role="tabpanel" class="tab-pane active" id="bilder">
<div class="row">
@yield('results')
</div>
</div>
@else
<div role="tabpanel" class="tab-pane" id="bilder">
<div class="loader">
<img src="/img/ajax-loader.gif" alt="" />
</div>
</div>
@endif
@if( $metager->getFokus() === "nachrichten" )
<div role="tabpanel" class="tab-pane active" id="nachrichten">
<div class="row">
@yield('results')
</div>
</div>
@else
<div role="tabpanel" class="tab-pane" id="nachrichten">
<div class="loader">
<img src="/img/ajax-loader.gif" alt="" />
</div>
</div> </div>
@endif </div>
@if( $metager->getFokus() === "wissenschaft" )
<div role="tabpanel" class="tab-pane active" id="wissenschaft">
<div class="row">
@yield('results')
</div>
</div>
@else
<div role="tabpanel" class="tab-pane" id="wissenschaft">
<div class="loader">
<img src="/img/ajax-loader.gif" alt="" />
</div>
</div>
@endif
@if( $metager->getFokus() === "produktsuche" )
<div role="tabpanel" class="tab-pane active" id="produktsuche">
<div class="row">
@yield('results')
</div>
</div>
@else
<div role="tabpanel" class="tab-pane" id="produktsuche">
<div class="loader">
<img src="/img/ajax-loader.gif" alt="" />
</div>
</div>
@endif
@if( $metager->getFokus() === "angepasst" )
<div role="tabpanel" class="tab-pane active" id="angepasst">
<div class="row">
@yield('results')
</div>
</div>
@endif
</main> </main>
</div> </div>
<div class="result row" data-count="{{ $result->number }}"> <div class="result row" data-count="{{ $result->number }}">
<div class="number col-sm-1 hidden-xs" style="color:{{ $result->color }}">
{{ $result->number }})
</div>
<div class="resultInformation col-xs-12 col-sm-11"> <div class="resultInformation col-xs-12 col-sm-11">
<div class="col-xs-10 col-sm-11" style="padding:0; "> <div class="col-xs-10 col-sm-11" style="padding:0; ">
<p class="title"> <p class="title">
......
...@@ -36,7 +36,6 @@ ...@@ -36,7 +36,6 @@
@endif @endif
@if($metager->getMaps()) @if($metager->getMaps())
<div class="result row" id="map"> <div class="result row" id="map">
<div class="number col-sm-1 hidden-xs"></div>
<div class="resultInformation col-xs-12 col-sm-11"> <div class="resultInformation col-xs-12 col-sm-11">
<iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" scrolling="no" tabindex="-1" style="width: 100%; height:0; border:0;"></iframe> <iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" scrolling="no" tabindex="-1" style="width: 100%; height:0; border:0;"></iframe>
</div> </div>
......
...@@ -28,7 +28,6 @@ ...@@ -28,7 +28,6 @@
@endif @endif
@if($metager->getMaps()) @if($metager->getMaps())
<div class="result row" id="map"> <div class="result row" id="map">
<div class="number col-sm-1 hidden-xs"></div>
<div class="resultInformation col-xs-12 col-sm-11"> <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> <iframe class="" src="https://maps.metager.de/metager/{{ $metager->getQ() }}" style="width: 100%; height:0; border:0;"></iframe>
</div> </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