Skip to content

GitLab

Commit 116c94de authored by Karl Hasselbring's avatar Karl Hasselbring
Browse files

Designänderungen an Startseite 

Kartendesign für Ergebnisseite
parent 407d5a59
Hide whitespace changes
Inline Side-by-side
public/css/theme.css.php
View file @ 116c94de
......@@ -21,7 +21,6 @@ input[type=text]:focus, textarea:focus, input[type=email]:focus, input[type=tel]
#mglogo > a {
color: rgb(255,128,0);
font-size: 90px;
}
.logo h1{
......
resources/assets/less/metager/result-page.less
View file @ 116c94de
......@@ -8,6 +8,7 @@
body {
&#resultBody {
background-image: inherit;
background-color: #FAFAFA;
}
&.quicktips {
background-color: @quicktip-background-color;
......@@ -356,21 +357,27 @@ p.mg-logo {
@result-width: 700px;
@quicktip-width: 500px;
@results-margin-left: 50px;
#resultpage-container {
width: @result-width + @quicktip-width;
align-self: center;
@media (max-width: (@result-width + @quicktip-width - 1px)) {
align-self: left;
display: flex;
justify-content: left;
margin-left: @results-margin-left;
background-color: #FAFAFA;
@media (max-width: (2 * @results-margin-left + @result-width + @quicktip-width - 1px)) {
width: @result-width;
#additions-container {
display: none;
float: right;
}
}
@media (max-width: @result-width) {
@media (max-width: (2 * @results-margin-left + @result-width - 1px)) {
width: 100%;
justify-content: center;
margin: 0px;
padding: 0px 8px;
}
display: flex;
justify-content: center;
#results-container {
max-width: @result-width;
width: 100%;
......
resources/assets/less/metager/result.less
View file @ 116c94de
/* Ergebnis */
@result-font-large: 18px;
@result-font-medium: 16px;
@result-font-small: 14px;
.result {
margin-top: 20px;
margin-bottom: 20px;
padding-bottom: 20px;
padding-left: 4px;
padding-right: 4px;
margin: 8px 0px 8px 0px;
padding: 15px;
width: 100%;
border: 1px solid #ccc;
@media(max-width: @screen-xs-max) {
box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
}
.result-title {
margin: 0px;
overflow: hidden;
......@@ -14,10 +18,11 @@
white-space: nowrap;
a,
a:active,
a:hover,
a:focus,
a:visited {
color: black;
font-size: 18px;
font-size: @result-font-large;
font-weight: bold;
text-decoration: none;
}
......@@ -25,77 +30,31 @@
.result-header {
display: flex;
>*:not(:first-child) {
margin-left: 10px;
margin-left: 15px;
}
.result-link {
overflow: auto;
a {
a,
a:active,
a:hover,
a:focus,
a:visited {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
}
.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;
}
}
}
.result-hoster {
font-size: 13px;
color: @result-hoster-color;
white-space: nowrap;
a {
color: @result-hoster-a-color;
}
}
.partnershop-info {
font-size: 13px;
margin-top: 0;
margin-left: 10px;
}
.result-proxy, .result-proxy a {
font-size: 13px;
margin-top: 0;
white-space: nowrap;
img {
margin-bottom: 0px;
margin-right: 2px
color: #333;
font-size: @result-font-small;
text-decoration: none;
}
}
}
.result-body {
margin-top: 20px;
.result-description {
margin-bottom: 3px;
color: @result-description-color;
font-size: 16px;
font-size: @result-font-medium;
line-height: 1.3;
clear: both;
.date {
......@@ -122,6 +81,78 @@
max-width: 100%;
}
}
.result-footer {
margin-top: 25px;
display: flex;
flex-wrap: wrap;
&>* {
margin: 10px;
}
.result-open a {
color: #ff8000;
}
.result-open-newtab a {
&,
&:active,
&:hover,
&:focus,
&:visited {
color: black;
font-size: @result-font-small;
text-decoration: none;
}
}
.result-open-proxy,
.result-open-proxy a {
&,
&:active,
&:hover,
&:focus,
&:visited {
color: black;
font-size: @result-font-small;
text-decoration: none;
}
white-space: nowrap;
img {
margin-bottom: 0px;
margin-right: 2px
}
}
.result-options {
margin-left: auto;
.option-opener-icon {
display: block;
font-size: @result-font-small;
color: black;
}
.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;
}
}
}
}
&.ad .ad-label {
border: green solid 1px;
padding: 1px;
......
resources/assets/less/metager/searchbar.less
View file @ 116c94de
......@@ -12,6 +12,9 @@
display: flex;
align-items: center;
position: relative;
@media(max-width: @screen-xs-max) {
display: none;
}
&>button {
border: none;
border-right: 1px solid rgb(170, 170, 170);
......@@ -292,6 +295,6 @@ div:hover>.searchbar-tooltip {
width: 100%;
height: 60px;
@media (max-width: @screen-xs-max) {
height: 141.6px;
height: 100px;
}
}
\ No newline at end of file
resources/assets/less/metager/start-page.less
View file @ 116c94de
/* Startseite */
@search-bar-width: 1000px;
#mglogo {
font-size: 90px;
@media(max-width: @screen-xs-max) {
font-size: 50px;
}
}
.mg-panel {
flex-grow: 1;
display: flex;
......@@ -71,52 +78,49 @@
}
}
#sponsors {
#more-information {
flex-grow: 2;
margin-top: 50px;
text-align: center;
ul {
padding: 0px;
text-align: right;
li.sponsor {
display: flex;
justify-content: space-between;
a {
margin-left: 10px;
color: inherit;
font-size: 16px;
}
padding-top: 50px;
display: flex;
@media(max-width: @screen-xs-max) {
flex-direction: column;
}
#about-us {
max-width: 500px;
margin-right: 50px;
@media(max-width: @screen-xs-max) {
margin: 0px 8px;
}
h2 {
font-size: 21px;
}
p {
text-align: justify;
font-size: 15px;
}
}
h2 {
font-size: 20px;
}
}
#about-us a:visited {
color: @link-color;
}
#more-information {
box-shadow: none;
margin-top: 5%;
text-align: center;
-moz-box-shadow: none;
ul {
padding: 0;
}
ul li {
color: @more-information-ul-li-color;
}
&>div {
font-size: 15px;
}
h2 {
color: @more-information-h2-color;
font-size: 25px;
}
a:hover {
text-decoration: underline;
#sponsors {
@media(max-width: @screen-xs-max) {
margin: 0px 5px;
}
h2 {
font-size: 21px;
}
ul {
padding: 0px;
text-align: left;
li.sponsor {
a {
color: inherit;
display: flex;
justify-content: space-between;
font-size: 15px;
i {
margin-left: 10px;
}
}
}
}
}
}
......
resources/lang/de/titles.php
View file @ 116c94de
<?php
return [
'index' => 'MetaGer, mehr als eine Suchmaschine: unabhängig, transparent, demokratisch, quellcode-offen, datensicher, privatsphären-geschützt ',
'index' => 'MetaGer - Mehr als eine Suchmaschine',
'impressum' => 'Impressum - MetaGer',
'about' => 'Über Uns - MetaGer',
'team' => 'Team - MetaGer',
......
resources/views/index.blade.php
View file @ 116c94de
......@@ -6,7 +6,7 @@
@include('modals.create-focus-modal')
@include('modals.plugin-modal')
<h1 id="mglogo">
<a class="hidden-xs" href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}">MetaGer</a>
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}">MetaGer</a>
</h1>
@include('parts.searchbar', ['class' => 'startpage-searchbar'])
<script type="text/javascript" src="{{ elixir('js/scriptStartPage.js') }}"></script>
......@@ -14,19 +14,25 @@
@endsection
@section('optionalContent')
<div id="sponsors">
<h2>{{ trans('index.sponsors.head.2') }}</h2>
<ul class="startpage">
<li class="sponsor">
<p>@lang('index.sponsors.woxikon')</p><a href="http://www.tagesgeld.jetzt" target="_blank" rel="noopener"><i class="fa fa-external-link"></i></a>
</li>
<li class="sponsor">
<p>@lang('index.sponsors.seo')</p><a href="http://www.gutschein-magazin.de/" target="_blank" rel="noopener"><i class="fa fa-external-link"></i></a>
</li>
<li class="sponsor">
<p>@lang('index.sponsors.gutscheine')</p><a href="https://www.semtrix.de/suchmaschinenoptimierung/" target="_blank" rel="noopener"><i class="fa fa-external-link"></i></a>
</li>
</ul>
<div id="more-information">
<div id="about-us">
<h2>Besser&nbsp;suchen, schneller&nbsp;finden</h2>
<p>MetaGer ist die einzige Suchmaschine, die nicht profitgetrieben, sondern gemeinnützig arbeitet. Wir speichern keine persönlichen Daten und bevorzugen keine Ergebnisse für Geld.</p>
<p>Mit MetaGer bewahren Sie einen neutralen Blick auf’s Web!</p>
</div>
<div id="sponsors">
<h2>{{ trans('index.sponsors.head.2') }}</h2>
<ul class="startpage">
<li class="sponsor">
<a href="http://www.tagesgeld.jetzt" target="_blank" rel="noopener"><p>@lang('index.sponsors.woxikon')</p> <i class="fa fa-external-link"></i></a>
</li>
<li class="sponsor">
<a href="http://www.gutschein-magazin.de/" target="_blank" rel="noopener"><p>@lang('index.sponsors.seo')</p> <i class="fa fa-external-link"></i></a>
</li>
<li class="sponsor">
<a href="https://www.semtrix.de/suchmaschinenoptimierung/" target="_blank" rel="noopener"><p>@lang('index.sponsors.gutscheine')</p> <i class="fa fa-external-link"></i></a>
</li>
</ul>
</div>
</div>
<div></div>
@endsection
resources/views/layouts/indexPage.blade.php
View file @ 116c94de
@extends('layouts.staticPages', ['page' => 'startpage'])
@section('homeIcon')
<a class="navbar-brand visible-xs" href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}">
<div class="logo">
<h1>MetaGer</h1>
</div>
</a>
@endsection
resources/views/layouts/result.blade.php
View file @ 116c94de
......@@ -10,9 +10,60 @@
{{ $result->anzeigeLink }}
</a>
</div>
@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>
</span>
@endif
</div>
<div class="result-body">
@if( isset($result->logo) )
<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="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>
{!! $result->descr !!}
</div>
@else
@if( $metager->getFokus() == "nachrichten" )
<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="result-description">
{{ $result->descr }}
</div>
@endif
@endif
</div>
<div class="result-footer">
<div class="result-open">
<a href="{{ $result->link }}" target="_self" data-hoster="{{ strip_tags($result->gefVon) }}" rel="noopener">
<span>ÖFFNEN</span>
</a>
</div>
<div class="result-open-newtab">
<a href="{{ $result->link }}" target="_blank" data-hoster="{{ strip_tags($result->gefVon) }}" rel="noopener">
<span>IN NEUEM TAB</span>
</a>
</div>
<div class="result-open-proxy">
<a 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="" />
<span>ANONYM ÖFFNEN</span>
</a>
</div>
<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>
<i class="fa fa-chevron-down option-opener-icon" aria-hidden="true"></i>
</a>
<div class="dropdown-content option-content">
<ul class="option-list list-unstyled small">
......@@ -47,47 +98,5 @@
</ul>
</div>
</div>
<span class="result-hoster">
von {!! $result->gefVon !!}
</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>
</span>
@endif
<span class="result-proxy">
<a 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="" />
<span>{!! trans('result.options.5') !!}</span>
</a>
</span>
</div>
<div class="result-body">
@if( isset($result->logo) )
<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="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>
{!! $result->descr !!}
</div>
@else
@if( $metager->getFokus() == "nachrichten" )
<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="result-description">
{{ $result->descr }}
</div>
@endif
@endif
</div>
</div>
resources/views/parts/footer.blade.php
View file @ 116c94de
@if ($type === 'startpage' || $type === 'subpage')
<footer class="{{ $id }} noprint">
<div class="imagebox">
<a href="https://www.suma-ev.de/" >
<img src="/img/suma_ev_logo-m1-greyscale.png" alt="SUMA-EV Logo">
</a>
</div>
<div id="info">
<span><a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "kontakt") }}">{{ trans('staticPages.nav5') }}</a> - <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "impressum") }}">{{ trans('staticPages.nav8') }}</a></span>
<span class="hidden-xs">{{ trans('staticPages.sumaev.1') }}<a href="https://www.suma-ev.de/">{{ trans('staticPages.sumaev.2') }}</a></span>
</div>
<div class="imagebox">
<a href="https://www.uni-hannover.de/">
<img src="/img/luh_metager.png" alt="LUH Logo">
</a>
</div>
</footer>
@elseif ($type === 'resultpage')
<footer class="footer-resultpage">
......
resources/views/parts/searchbar.blade.php
View file @ 116c94de
......@@ -21,11 +21,11 @@
</div>
</div>
<select id="focus-select" name="focus" style="font-family: FontAwesome, sans-serif;">
<option value="web" style="font-family: FontAwesome, sans-serif;" selected>&#xf0ac; Websuche</option>
<option value="nachrichten" style="font-family: FontAwesome, sans-serif;">&#xf0a1; Nachrichtensuche</option>
<option value="wissenschaft" style="font-family: FontAwesome, sans-serif;">&#xf15c; Wissenschaftssuche</option>
<option value="produktsuche" style="font-family: FontAwesome, sans-serif;">&#xf07a; Produktsuche</option>
<option value="maps" style="font-family: FontAwesome, sans-serif;">&#xf279; Kartensuche</option>
<option value="web" style="font-family: FontAwesome, sans-serif;" selected>&#xf0ac; Web</option>
<option value="nachrichten" style="font-family: FontAwesome, sans-serif;">&#xf0a1; Nachrichten</option>
<option value="wissenschaft" style="font-family: FontAwesome, sans-serif;">&#xf15c; Wissenschaft</option>
<option value="produktsuche" style="font-family: FontAwesome, sans-serif;">&#xf07a; Produkte</option>
<option value="maps" style="font-family: FontAwesome, sans-serif;">&#xf279; Karten</option>
</select>
<div class="search-option-frame hide">
<div class="searchbar-options-arrow"></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