Commit 16014207 authored by Karl Hasselbring's avatar Karl Hasselbring
Browse files

Ausklappbare Quicktips sind jetzt mit einem Pfeil gekennzeichnet

parent 6f3459e0
...@@ -19,11 +19,11 @@ $(document).ready(function () { ...@@ -19,11 +19,11 @@ $(document).ready(function () {
loadQuicktips(search, locale, sprueche); // load the quicktips loadQuicktips(search, locale, sprueche); // load the quicktips
}); });
function readLocaleFromUrl(defaultLocale) { function readLocaleFromUrl (defaultLocale) {
return location.pathname.substr(1, location.pathname.indexOf('/meta', 0) - 1) || 'de'; return location.pathname.substr(1, location.pathname.indexOf('/meta', 0) - 1) || 'de';
} }
function getURLParameter(name) { function getURLParameter (name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null; return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
} }
...@@ -588,7 +588,7 @@ function getQuicktips (search, locale, blacklist, loadedHandler) { ...@@ -588,7 +588,7 @@ function getQuicktips (search, locale, blacklist, loadedHandler) {
title: $(this).children('title').text(), title: $(this).children('title').text(),
text: $(this).children('text').text(), text: $(this).children('text').text(),
url: $(this).children('url').text() url: $(this).children('url').text()
} };
}).toArray() }).toArray()
}; };
}).toArray(); }).toArray();
...@@ -637,6 +637,7 @@ function createQuicktips (quicktips, sprueche) { ...@@ -637,6 +637,7 @@ function createQuicktips (quicktips, sprueche) {
} else { } else {
headlineElem.text(quicktip.title); headlineElem.text(quicktip.title);
} }
headlineElem.append('<i class="quicktip-extender fa fa-chevron-circle-down" aria-hidden="true"></i>');
summaryElem summaryElem
.append(headlineElem) .append(headlineElem)
.append('<p>' + quicktip.summary + '</p>'); .append('<p>' + quicktip.summary + '</p>');
...@@ -652,7 +653,7 @@ function createQuicktips (quicktips, sprueche) { ...@@ -652,7 +653,7 @@ function createQuicktips (quicktips, sprueche) {
detailElem detailElem
.append(detailHeadlineElem) .append(detailHeadlineElem)
.append('<p>' + detail.text + '</p>'); .append('<p>' + detail.text + '</p>');
mainElem.append(detailElem); mainElem.append(detailElem);
}); });
} else { } else {
mainElem = $('<div class="quicktip-summary">'); mainElem = $('<div class="quicktip-summary">');
......
...@@ -640,10 +640,22 @@ a { ...@@ -640,10 +640,22 @@ a {
* </...> * </...>
*/ */
@keyframes quicktip-extender-turn {
from {
transform: rotate(0deg);
}
to {
transform: rotate(180deg);
}
}
#quicktips { #quicktips {
display: flex; display: flex;
flex-direction: column; flex-direction: column; // border: 2px solid #ccc;
// border: 2px solid #ccc; details[open=""] .quicktip-extender {
animation-name: quicktip-extender-turn;
animation-fill-mode: forwards;
}
.quicktip { .quicktip {
margin: 10px 0px; margin: 10px 0px;
padding-left: 10px; padding-left: 10px;
...@@ -652,8 +664,14 @@ a { ...@@ -652,8 +664,14 @@ a {
h1 { h1 {
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
display: flex;
justify-content: space-between;
.quicktip-extender {
margin-left: 10px;
color: #777;
font-size: 20px;
}
} }
p {}
} }
.quicktip-detail { .quicktip-detail {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
......
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