Skip to content
Snippets Groups Projects
Commit 116c94de authored by Karl Hasselbring's avatar Karl Hasselbring
Browse files

Designänderungen an Startseite 

Kartendesign für Ergebnisseite
parent 407d5a59
No related branches found
No related tags found
4 merge requests!1262WIP: Resolve "Spendenseite Texte anpassen",!1207WIP: Resolve "Rechtschreibfehler",!1198Meta ger redesign,!1131Meta ger redesign
Hide whitespace changes
Inline Side-by-side
Showing
with 236 additions and 195 deletions
public/css/theme.css.php
+ 0
− 1
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
+ 12
− 5
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
+ 94
− 63
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
+ 4
− 1
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
+ 47
− 43
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
+ 1
− 1
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
+ 21
− 15
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
+ 0
− 8
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
+ 52
− 43
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
+ 0
− 10
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
+ 5
− 5
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>
......
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