Skip to content

GitLab

Commit 6207abef authored by Karl Hasselbring's avatar Karl Hasselbring
Browse files

Hilfeseite um Beispiel für aktuelle Ergebnisversion erweitert 

Tooltips css hinzugefügt und in Hilfe für Beispielergebnis verwendet
parent b15992d1
Hide whitespace changes
Inline Side-by-side
resources/assets/less/metager/general.less
View file @ 6207abef
......@@ -211,4 +211,29 @@ label a {
button {
border: none;
}
/* Tooltips */
*[data-tooltip]:hover {
position: relative;
&:after {
content: attr(data-tooltip);
position: absolute;
top: 100%;
left: 0;
color: black;
background-color: white;
border: 2px solid @metager-orange;
border-radius: 6px;
padding: 3px 8px;
width: 200px;
white-space: pre-wrap;
font-size: 15px;
font-weight: normal;
text-decoration: none;
text-align: center;
pointer-events: none;
}
}
\ No newline at end of file
resources/assets/less/metager/result.less
View file @ 6207abef
......@@ -165,6 +165,7 @@
}
&>.result-toggle:checked + .options {
max-height: 150px;
overflow: initial;
}
li {
font-size: 14px;
......
resources/assets/less/metager/specific.less
View file @ 6207abef
......@@ -223,4 +223,22 @@ main {
border-top: 1px dashed black;
width: 50%;
margin-top: 16px;
}
.fake-result {
*:hover {
overflow: visible !important;
}
.result-footer {
align-items: center;
}
.open-result-options label {
padding: 10px;
border: 2px dashed red;
border-radius: 100%;
color: black;
font-size: 14px;
text-decoration: none;
font-weight: normal;
}
}
\ No newline at end of file
resources/assets/less/metager/variables.less
View file @ 6207abef
@metager-orange: rgb(255,128,0);
// General
@color-white: white;
@color-almost-white: mix(@color-white, @color-black, 90%);
......@@ -14,14 +15,14 @@
@brand-warning: #f0ad4e;
@brand-danger: #d9534f;
@body-bg: rgb(250, 250, 250);
@input-border-focus: rgb(255, 128, 0);
@input-border-focus: @metager-orange;
@font-family-sans-serif: "Liberation Sans",
"Helvetica Neue",
Helvetica,
Arial,
sans-serif;
// Global textual link color.
@link-color: rgb(255,128,0);
@link-color: @metager-orange;
// static-pages.less
@static-pages-color-white: @color-white;
@static-pages-color-almost-white: @color-almost-white;
......@@ -45,7 +46,7 @@ sans-serif;
//
@result-page-body-background-color: @background-color;
@result-page-a-hover-color: red;
@result-page-a-visited-color: rgb(255,128,0);
@result-page-a-visited-color: @metager-orange;
@result-page-product-shop-color: green;
// start-page.less
@focus-hover-focus-edit-background-color: #e3e3e3;
......@@ -72,7 +73,7 @@ sans-serif;
@metager-navbar-toggle-border-color: @static-pages-color-almost-white;
@metager-navbar-toggle-visited-color: @static-pages-color-grey;
@metager-navbar-toggle-hover-background-color: @static-pages-color-almost-white;
@toggle-nav-hide-or-metager-navbar-toggle-background-color: rgb(255, 128, 0);
@toggle-nav-hide-or-metager-navbar-toggle-background-color: @metager-orange;
@more-information-ul-li-color: @static-pages-color-grey;
@more-information-h2-color: @static-pages-color-grey;
@div-right-background-color: @static-pages-color-almost-white;
......
resources/lang/de/hilfe.php
View file @ 6207abef
......@@ -46,9 +46,8 @@ return [
"domains.blacklist.example.4" => "Sie erhalten nun weiterhin Ergebnisse von beispielsweise en.wikipedia.org, solange diese zu Ihrer Suche passen",
"domains.blacklist.example.5" => "Sie schließen generell alle Ergebnisse von allen Wikipedia-Domains aus",
"domains.blacklist.example.6" => "<i>meine suche</i> -site:*.wikipedia.org",
"domains.showcase.explanation.1" => "Zusätzlich bieten wir Ihnen die Möglichkeit Subdomains beziehungsweise Top-Level-Domains direkt auf der Ergebnisseite auszuschließen. Bei jedem unserer Ergebnisse erscheint dieses kleine Symbol für die Optionen:",
"domains.showcase.explanation.2" => "Wenn Sie auf dieses Symbol klicken, erscheint folgendes Menü:",
"domains.showcase.menu.1" => "Mit diesem Menü lassen sich:",
"domains.showcase.explanation.1" => 'Zusätzlich bieten wir Ihnen die Möglichkeit Subdomains beziehungsweise Top-Level-Domains direkt auf der Ergebnisseite auszuschließen. Bei jedem unserer Ergebnisse erscheint dieser "Mehr"-Knopf für die Optionen:',
"domains.showcase.menu.1" => "Wenn Sie auf dieses Symbol klicken, erscheint ein Menü mit folgenden Optionen:",
"domains.showcase.menu.2" => "Ergebnisse zwischenspeichern zum weiteren filtern (siehe <a href=\"#searchinsearch\"> hier</a>)",
"domains.showcase.menu.3" => "Eine neue Suche nur auf der Domain des Ergebnisses (de.wikipedia.de) starten",
"domains.showcase.menu.4" => "Eine Suche ohne Ergebnisse der Subdomain (de.wikipedia.de) starten",
......
resources/views/hilfe.blade.php
View file @ 6207abef
......@@ -38,7 +38,7 @@
</div>
</div>
<h2>{!! trans('hilfe.sucheingabe.title') !!}</h2>
<p>{!! trans('hilfe.sucheingabe.hint') !!}</p>
<div class="alert alert-warning" role="alert">{!! trans('hilfe.sucheingabe.hint') !!}</div>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">{!! trans('hilfe.stopworte.title') !!}</h3>
......@@ -99,40 +99,7 @@
<div class="well well-sm">{!! trans('hilfe.domains.blacklist.example.6') !!}</div></li>
</ul>
<p>{!! trans('hilfe.domains.showcase.explanation.1') !!}</p>
<img id="exampleimg" src="/img/blacklist-tutorial-searchexample.png">
<p>{!! trans('hilfe.domains.showcase.explanation.2') !!}<p>
<div id="result_option_showcase" style="margin-top: -300px"></div>
<div style="margin-top: 315px; margin-bottom: 10px;">
<div class="popover fade bottom in" role="tooltip" style="top: auto; left: auto; display: block; position: relative">
<div class="arrow" style="left: 50%;"></div>
<h3 class="popover-title"><i class="fa fa-cog" aria-hidden="true"></i> Optionen</h3>
<div class="popover-content">
<ul class="options-list list-unstyled small">
<li>
<a href="#exampleimg">
<i class="glyphicon glyphicon-floppy-disk"></i>
Ergebnis in Tab speichern.
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia site:de.wikipedia.org')">
Suche auf dieser Domain neu starten
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia -site:de.wikipedia.org')">
de.wikipedia.org ausblenden
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia -site:*.wikipedia.org')">
*.wikipedia.org ausblenden
</a>
</li>
</ul>
</div>
</div>
</div>
@include('parts/fake-result')
<script type="text/javascript">
function setDummySearch(value) {
document.getElementById("dummy_search").innerHTML = value
......
resources/views/parts/fake-result.blade.php 0 → 100644
View file @ 6207abef
<div class="result fake-result" data-count="1">
<div class="result-header">
<h2 class="result-title">
<a href="javascript:void(0);" data-tooltip="Ergebnistitel">
Wikipedia – Die freie Enzyklopädie
</a>
</h2>
<a class="result-link" href="javascript:void(0);" data-tooltip="Ergebnislink">
de.wikipedia.org
</a>
</div>
<div class="result-body">
<div class="result-description" data-tooltip="Zusammenfassung der Ergebnisseite">
Wikipedia ist ein Projekt zum Aufbau einer Enzyklopädie aus freien Inhalten, zu denen du sehr gern beitragen kannst. Seit Mai 2001 sind 2.150.918 Artikel in ...
</div>
</div>
<div class="result-footer">
<a class="result-open" href="javascript:void(0);" data-tooltip="Ergebnis in diesem Tab öffnen">
ÖFFNEN
</a>
<a class="result-open-newtab" href="javascript:void(0);" data-tooltip="Ergebnis in einem neuen Tab öffnen">
IN NEUEM TAB
</a>
<a class="result-open-proxy" href="javascript:void(0);" data-tooltip="Ergebnis anonym (über den MetaGer-Proxy) öffnen">
ANONYM ÖFFNEN
</a>
<div class="open-result-options">
<label for="result-toggle-1" role="button" data-tooltip="Zusätzliche optionen anzeigen">
MEHR
</label>
</div>
</div>
<div class="result-options">
<input type="checkbox" id="result-toggle-1" class="result-toggle" style="display: none">
<div class="options">
<ul class="option-list list-unstyled small">
<li class="">
<a class="saver" href="javascript:setDummySearch('wikipedia site:de.wikipedia.org wurde zum weiteren Filtern gespeichert')" data-tooltip="Ergebnis zum weiteren Filtern speichern">
<i class="fa fa-floppy-o"></i> Ergebnis in Tab speichern.
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia site:de.wikipedia.org')" data-tooltip="Neue auf diese Domain beschränkte Suche starten">
Auf dieser Domain neu suchen
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia -site:de.wikipedia.org')" data-tooltip="Neue Suche ohne diese Subdomain starten">
de.wikipedia.org ausblenden
</a>
</li>
<li>
<a href="javascript:setDummySearch('wikipedia -site:*.wikipedia.org')" data-tooltip="Neue Suche ohne diese Domain starten">
*.wikipedia.org ausblenden
</a>
</li>
</ul>
</div>
</div>
</div>
\ No newline at end of file
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