Commit 332f4ff4 authored by Karl Hasselbring's avatar Karl Hasselbring

Refactoring: Result Style sortiert

parent e6c4a777
/* Ergebnis */
.result {
margin-top: 20px;
margin-bottom: 40px;
margin-top: 30px;
margin-bottom: 30px;
padding-bottom: 30px;
width: 100%;
.result-title a {
color: black;
font-size: 18px;
font-weight: bold;
.result-title {
margin: 0px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
a,
a:active,
a:focus,
a:visited {
color: black;
font-size: 18px;
font-weight: bold;
text-decoration: none;
}
}
.result-header {
display: flex;
>* {
white-space: nowrap;
}
>*:not(:first-child) {
margin-left: 5px;
margin-left: 10px;
}
.result-link {
overflow: auto;
......@@ -26,162 +34,111 @@
display: block;
}
}
}
.result-information {
border-radius: 5px;
padding-left: 0px;
&>.save {
position: absolute;
top: 0;
right: 10px;
cursor: pointer;
}
}
&>.remover {
cursor: pointer;
text-align: right;
color: #777;
}
.title {
color: @result-title-color;
text-decoration: none;
font-size: 18px;
font-weight: bold;
margin-bottom: 0;
white-space: nowrap;
line-height: 1.1;
max-width: 115ch;
overflow: hidden;
text-overflow: ellipsis;
}
.link {
font-size: 16px;
margin: 0;
line-height: 1.5;
&>div {
white-space: nowrap;
.result-options {
.option-opener-icon {
display: block;
font-size: 16px;
color: #2A2ADE;
}
.option-content {
background-color: white;
z-index: 1000;
position: absolute;
border: grey solid 1px;
color: black;
font-size: 16px;
border-radius: 5px;
hr {
margin: 5px;
}
li {
padding: 5px
}
li:not(.option-title):hover {
background-color: #e0e0e0;
}
a,
a:hover,
a:focus,
a:visited {
color: black;
display: block;
}
}
}
&>span {
.result-hoster {
font-size: 13px;
color: @result-hoster-color;
white-space: nowrap;
margin: 0 5px;
}
.options {
color: @result-link-options-color;
float: left;
}
.options>a {
color: @result-link-options-a-color;
display: block;
padding-left: 8px;
padding-right: 5px;
}
}
.link-link {
white-space: nowrap;
max-width: 60%;
overflow: hidden;
text-overflow: ellipsis;
float: left;
}
.description {
margin-bottom: 3px;
color: @result-description-color;
font-size: 16px;
line-height: 1.3;
clear: both;
.date {
font-weight: bold;
}
p {
margin: 0;
margin-bottom: 4px;
a {
color: @result-hoster-a-color;
}
}
img {
margin: 5px;
margin-left: 0px;
margin-right: 15px;
height: auto;
width: auto;
max-width: 120px;
max-height: 200px;
border: solid 1px @result-description-img-border-color;
.partnershop-info {
font-size: 13px;
margin-top: 0;
margin-left: 10px;
}
}
&.ad {
.ad-label {
border: green solid 1px;
padding: 1px;
color: green;
border-radius: 4px;
}
.description {
max-width: 115ch;
overflow: hidden;
text-overflow: ellipsis;
.result-proxy {
font-size: 13px;
margin-top: 0;
white-space: nowrap;
img {
margin-bottom: 0px;
margin-right: 2px
}
}
}
.hoster {
font-size: 13px;
margin: 0;
color: @result-hoster-color;
margin-right: 10px;
white-space: nowrap;
a {
color: @result-hoster-a-color;
}
}
.options {
.option-opener-icon {
display: block;
.result-body {
.result-description {
margin-bottom: 3px;
color: @result-description-color;
font-size: 16px;
color: #2A2ADE;
}
.option-content {
background-color: white;
z-index: 1000;
position: absolute;
border: grey solid 1px;
color: black;
font-size: 16px;
border-radius: 5px;
hr {
margin: 5px;
}
li {
padding: 5px
line-height: 1.3;
clear: both;
.date {
font-weight: bold;
}
li:not(.option-title):hover {
background-color: #e0e0e0;
p {
margin: 0;
margin-bottom: 4px;
}
a,
a:hover,
a:focus,
a:visited {
color: black;
display: block;
img {
margin: 5px;
margin-left: 0px;
margin-right: 15px;
height: auto;
width: auto;
max-width: 120px;
max-height: 200px;
border: solid 1px @result-description-img-border-color;
}
}
}
.proxy {
font-size: 13px;
margin-top: 0;
white-space: nowrap;
img {
margin-bottom: 0px;
margin-right: 2px
.result-image>img {
height: 100px;
padding: 10px;
max-width: 100%;
}
}
.partnershop-info {
font-size: 13px;
margin-top: 0;
margin-left: 10px;
&.ad .ad-label {
border: green solid 1px;
padding: 1px;
color: green;
border-radius: 4px;
}
.result-image>img {
height: 100px;
padding: 10px;
.result-information {
border-radius: 5px;
padding-left: 0px;
&>.save {
position: absolute;
top: 0;
right: 10px;
cursor: pointer;
}
}
.image>img {
max-width: 100%;
&>.remover {
cursor: pointer;
text-align: right;
color: #777;
}
}
\ No newline at end of file
......@@ -2,5 +2,5 @@
return [
'werbung' => 'Werbung',
'von' => 'Werbung von',
'von' => 'von',
];
@if(isset($ad) && !$apiAuthorized)
<div class="result ad row">
<div class="result-information col-sm-10">
<p class="title">
<a class="title" href="{{ $ad->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ $ad->gefVon }}" data-count="0">
{{ $ad->titel }}
</a>
</p>
<p class="link">
<div class="result ad">
<h2 class="result-title">
<a class="title" href="{{ $ad->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ $ad->gefVon }}" data-count="0">
{{ $ad->titel }}
</a>
</h2>
<div class="result-header">
<div class="result-link">
<a href="{{ $ad->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ $ad->gefVon }}" data-count="0">
{{ $ad->anzeigeLink }}
</a>
<span class="hoster">
<span class="ad-label">{!! trans('ad.werbung') !!}</span> {!! trans('ad.von') !!} {!! $ad->gefVon !!}
</span>
</p>
<p class="description">
{{ $ad->descr }}
</p>
</div>
<span class="result-hoster">
<span class="ad-label">{!! trans('ad.werbung') !!}</span> {!! trans('ad.von') !!} {!! $ad->gefVon !!}
</span>
</div>
<div class="result-description">
{{ $ad->descr }}
</div>
</div>
@endif
......@@ -52,8 +52,8 @@
</span>
@if( isset($result->partnershop) && $result->partnershop === TRUE )
<span class="partnershop-info">
<img src="/img/boosticon.png" height="13" alt="">
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/partnershops") }}" target="_blank" rel="noopener">{!! trans('result.options.4') !!}</a>
<img src="/img/boosticon.png" height="13" alt="">
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/partnershops") }}" target="_blank" rel="noopener">{!! trans('result.options.4') !!}</a>
</span>
@endif
<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">
......@@ -61,16 +61,16 @@
<span>{!! trans('result.options.5') !!}</span>
</a>
</div>
<div>
<div class="result-body">
@if( isset($result->logo) )
<div>
<div class="result-logo">
<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>
</div>
@endif
@if( $result->image !== "" )
<div class="description">
<div class="result-image result-description">
<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" data-hoster="{{ strip_tags($result->gefVon) }}" data-count="{{ $result->number }}" rel="noopener">
<img src="{{ $metager->getImageProxyLink($result->image) }}" align="left" width="120px" height="60px" alt="" />
</a>
......@@ -78,9 +78,13 @@
</div>
@else
@if( $metager->getFokus() == "nachrichten" )
<div class="description"><span class="date">{{ isset($result->additionalInformation["date"])?date("Y-m-d H:i:s", $result->additionalInformation["date"]):"" }}</span> {{ $result->descr }}</div>
<div class="result-description">
<span class="date">{{ isset($result->additionalInformation["date"])?date("Y-m-d H:i:s", $result->additionalInformation["date"]):"" }}</span> {{ $result->descr }}
</div>
@else
<div class="description">{{ $result->descr }}</div>
<div class="result-description">
{{ $result->descr }}
</div>
@endif
@endif
</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