diff --git a/src/assets/i18n/data-protection/data-protection-de.html b/src/assets/i18n/data-protection/data-protection-de.html
index 08ef1cb8ea5c3fbb38261c8bb266b0ebb3891900..991de3611e5ca16b1271f1c378cdc58b6280774e 100644
--- a/src/assets/i18n/data-protection/data-protection-de.html
+++ b/src/assets/i18n/data-protection/data-protection-de.html
@@ -71,11 +71,14 @@
dieser Daten.
Bei Unklarheiten oder Anregungen wende dich an folgende E-Mail-Adresse oder an die im Impressum angegebenen
- Kontaktdaten: <a href = "mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel­@transmit.de</a>
+ Kontaktdaten: <br><a class="info" href="mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel­@transmit.de
+ <span>Öffnet dein Mailprogramm</span></a>
+
</p>
<h3>Verzeichnis von Ver­arbeitungs­tätig­kei­ten</h3>
- <p>Eine Ãœbersicht über die in »frag.jetzt« verarbeiteten personenbezogenen Daten findest du im Projektarchiv unter <a href="https://git.thm.de/arsnova/frag.jetzt">https://git.thm.de/­arsnova/­frag.jetzt</a>.
+ <p>Eine Übersicht über die in »frag.jetzt« verarbeiteten personenbezogenen Daten findest du im <a class="info" href="https://git.thm.de/arsnova/frag.jetzt" target="_blank">Projektarchiv
+ von frag.jetzt<span>Öffnet neues Fenster</span></a>.
</p>
<h3>Änderungen der Daten­schutz­er­klärung</h3>
diff --git a/src/assets/i18n/data-protection/data-protection-en.html b/src/assets/i18n/data-protection/data-protection-en.html
index c904fc919894d4f0cdc78577d4acd080283fb2ec..8f9ef6d0a4fb928beb5900906507fa73f52cfe09 100644
--- a/src/assets/i18n/data-protection/data-protection-en.html
+++ b/src/assets/i18n/data-protection/data-protection-en.html
@@ -48,11 +48,13 @@
</p>
<h3>Right to object and right to information </h3>
-<p>You have the right at any time to free information about your stored personal data, their origin and recipient, the purpose of data processing and a right to correction, blocking or deletion of this data. In case of ambiguities or suggestions, please contact the following e-mail address or the contact details given in the imprint: <a href = "mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel­@transmit.de</a>
+<p>You have the right at any time to free information about your stored personal data, their origin and recipient, the purpose of data processing and a right to correction, blocking or deletion of this data. In case of ambiguities or suggestions, please contact the following e-mail address or the contact details given in the imprint: <a
+ class="info" href="mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel­@transmit.de <span>Opens mail agent</span></a>
+
</p>
<h3>Directory of processing activities </h3>
-<p>You can find an overview of the personal data processed in »frag.jetzt« in the repository at <a href="https://git.thm.de/arsnova/frag.jetzt">git.thm.de/­arsnova/­frag.jetzt</a>.
+<p>You can find an overview of the personal data processed in »frag.jetzt« in the repository in the <a class="info" href="https://git.thm.de/arsnova/frag.jetzt">frag.jetzt repository<span>Opens external link</span></a>.
</p>
<h3>Changes to the Data Protection & Privacy Policy</h3>
diff --git a/src/assets/i18n/demo/demo-de.html b/src/assets/i18n/demo/demo-de.html
index 4b84c09e57d8848bf23ae44040e7ef39dfdcfcd5..e3d510d5969cd829dea32180d1e6fe3f6f622c23 100644
--- a/src/assets/i18n/demo/demo-de.html
+++ b/src/assets/i18n/demo/demo-de.html
@@ -7,8 +7,8 @@
<p>Wem daran liegt, dass seine Vorlesung reflektiert und
hinterfragt wird, braucht ein Tool zum anonymen stillen Fragenstellen.
- Ein solches <a href="https://github.com/thm-projects/frag.jetzt" target="_blank"> Open-Source-Tool</a> steht mit
- »frag.jetzt« kostenlos zur freien Verfügung. Gibt es Bedenken? Ist das Tool barrierefrei, daten­schutz­kon­form,
+ Ein solches <a class="info" href="https://github.com/thm-projects/frag.jetzt" target="_blank">
+ Open-Source-Tool<span>Öffnet neue Seite</span></a>steht mit »frag.jetzt« kostenlos zur freien Verfügung. Gibt es Bedenken? Ist das Tool barrierefrei, daten­schutz­kon­form,
sofort ohne Einarbeitung und ohne technisches Verständnis mit jedem Endgerät nutzbar? Dreimal ja.</p>
<p>Wenn ich »frag.jetzt« anonym und somit ohne soziale Kontrolle verwenden lasse, lade ich dann nicht auch zum
@@ -68,7 +68,7 @@
<p>
Die Nutzung des Smartphones während der Vorlesung bringt natürlich ein hohes Ablenkungsrisiko mit sich.
Wir haben aus unserer langjährigen Erfahrung mit Audience-Response-Systemen im Hörsaal gelernt
- (siehe unser <a href="https://arsnova.thm.de/blog/" target="_blank">ARSnova-Projekt</a>),
+ (siehe unser <a class="info" href="https://arsnova.thm.de/blog/" target="_blank">ARSnova-Projekt<span>Öffnet neue Seite</span></a>),
wie man das Ablenkungsrisiko didaktisch angehen kann:
</p>
@@ -153,7 +153,7 @@
<p tabindex="0">Mit einem Klick auf das Zahnrad-Icon öffnest du die Verwaltungs­optionen:</p>
<ol tabindex="0">
<li>Sitzung: Hier kannst du den Namen der Sitzung ändern und eine Beschreibung hinzufügen.
- Für die Textformatierung steht dir <a href="https://de.wikipedia.org/wiki/Markdown" target="_blank">Markdown</a> zur
+ Für die Textformatierung steht dir <a class="info" href="https://de.wikipedia.org/wiki/Markdown" target="_blank">Markdown<span>Öffnet neue Seite</span></a> zur Verfügung.
Verfügung.
Hier ist auch der Ort, um die Sitzung mit allen Fragen und Bewertungen zu löschen.
</li>
@@ -255,7 +255,7 @@
<p tabindex="0">
Verwende den Sitzungs-Code 11 22 33 44 für Fragen an die Entwickler.
Können wir deine Fragen mit Ja oder Nein beantworten, so erhältst du zeitnah eine Antwort in der App.
- Offene Fragen beantworten wir im <a href="https://arsnova.thm.de/blog/frag-jetzt/" target="_blank">ARSnova-Blog</a>.
+ Offene Fragen beantworten wir im <a class="info" href="https://arsnova.thm.de/blog/frag-jetzt/" target="_blank">ARSnova-Blog<span>Öffnet neue Seite</span></a>.
</p>
<h2 tabindex="0">»Gender«-gerechte Sprache</h2>
@@ -263,13 +263,13 @@
<p tabindex="0">
Screen Reader für Sehbehinderte und Blinde,
wie <a
- href="https://chrome.google.com/webstore/detail/chromevox-classic-extensi/kgejglhpjiefppelpmljglcjbhoiplfn?hl=de"
- target="_blank">ChromeVox</a>
- (»frag.jetzt« wurde hierfür optimiert)
- oder <a href="https://www.nvaccess.org/" target="_blank">NVDA</a>,
+ class="info"
+ href="https://chrome.google.com/webstore/detail/chromevox-classic-extensi/kgejglhpjiefppelpmljglcjbhoiplfn?hl=de" target="_blank">ChromeVox<span>Öffnet neue Seite</span>
+ (»frag.jetzt« wurde hierfür optimiert)</a>
+ oder <a class="info" href="https://www.nvaccess.org/" target="_blank">NVDA<span>Öffnet neue Seite</span></a>,
sprechen »gegenderte« Nomen unverständlich aus.
- Wir verwenden deshalb das <a href="https://de.wikipedia.org/wiki/Generisches_Maskulinum" target="_blank"
- rel="noreferrer">Generische
- Maskulinum</a> für Texte und Labels in der App.
+ Wir verwenden deshalb das Wir verwenden deshalb das <a class="info" href="https://de.wikipedia.org/wiki/Generisches_Maskulinum"
+ rel="noreferrer" target="_blank">Generische
+ Maskulinum <span>Öffnet neue Seite</span></a> für Texte und Labels in der App.
</p>
diff --git a/src/assets/i18n/demo/demo-en.html b/src/assets/i18n/demo/demo-en.html
index 82cd911b42ada7149b2b059ae119ffc11b9dbd4c..4561486784dff81394adeb3329025c28fbb1622b 100644
--- a/src/assets/i18n/demo/demo-en.html
+++ b/src/assets/i18n/demo/demo-en.html
@@ -8,8 +8,8 @@
the course of the lecture are forgotten.
<p>Those who want their lecture to be reflected upon and questioned need a
- tool for anonymously asking questions. Such an <a href="https://github.com/thm-projects/frag.jetzt" target="_blank">Open
- Source</a> tool is available free of charge with »frag.jetzt«. Are
+ tool for anonymously asking questions. Such an <a class= info href="https://github.com/thm-projects/frag.jetzt" target="_blank">Open
+ Source<span>Opens new window</span></a> tool is available free of charge with »frag.jetzt«. Are
there any concerns? Is the tool accessible, compliant with the data protection regulations, immediately usable with
any end device without any training or technical understanding? Three times yes.</p>
@@ -76,7 +76,7 @@
<p>
The use of the smartphone during the lecture naturally entails a high risk of distraction.
We have learned from our many years of experience with audience response systems in lecture halls,
- see our <a href="https://arsnova.thm.de/blog/en/homepage/" target="_blank">ARSnova Project</a>,
+ see our <a class="info" href="https://arsnova.thm.de/blog/en/homepage/" target="_blank">ARSnova Project <span>Opens new window</span></a>,
how to didactically approach the risk of distraction:
</p>
@@ -162,7 +162,7 @@
<p tabindex="0">Click on the gearwheel icon to open the management options:</p>
<ol tabindex="0">
<li>Session: Here you can change the name of the session and add a description.
- You can use <a href="https://en.wikipedia.org/wiki/Markdown" target="_blank">Markdown</a> for text formatting.
+ You can use <a class="info" href="https://en.wikipedia.org/wiki/Markdown" target="_blank">Markdown <span>Opens new window</span></a> for text formatting.
This is also the place to delete the session with all questions and ratings.
</li>
<li><p>Questions:</p>
@@ -268,7 +268,7 @@
<p tabindex="0">
Use session key 11 22 33 44 for questions to the developers.
If we can answer yes or no to your questions, you will receive a prompt answer in the app.
- Other qestions will be answered in the <a href="https://arsnova.thm.de/blog/frag-jetzt/" target="_blank">ARSnova
- blog</a>.
+ Other qestions will be answered in the <a class="info" href="https://arsnova.thm.de/blog/frag-jetzt/" target="_blank">ARSnova
+ blog <span>Opens new window</span></a>.
</p>
diff --git a/src/assets/i18n/imprint/imprint-de.html b/src/assets/i18n/imprint/imprint-de.html
index de8cdd6a7037a29ecf47f3623ff0ed7c290f9b69..f5acbcdfcdd43cf188b180e344a6dd92a615b594 100644
--- a/src/assets/i18n/imprint/imprint-de.html
+++ b/src/assets/i18n/imprint/imprint-de.html
@@ -5,7 +5,7 @@
»frag.jetzt« wird vom Land Hessen im Rahmen des <abbr title="Hessisches Ministerium für Wissenschaft und Kunst">
HMWK
</abbr>-Verbundprojekts
- <a href="https://www.digll-hessen.de/de" target="_blank">»Digital gestütztes Lehren und Lernen in Hessen«</a>
+ <a href="https://www.digll-hessen.de/de" class="info" target="_blank">»Digital gestütztes Lehren und Lernen in Hessen« <span>Öffnet neues Fenster</span></a>
(digLL) gefördert.<br>
<br>
</p>
@@ -22,7 +22,7 @@
<p>
<a href="https://arsnova.thm.de/blog/wp-content/uploads/2019/09/Projektantrag-DigLL@THM-frag_jetzt.pdf"
- target="_blank">Projektskizze zu »frag.jetzt«</a>
+ target="_blank" class="info">Projektskizze zu »frag.jetzt« <span>Öffnet neues Fenster</span></a>
</p>
<ars-row [height]="50"></ars-row>
@@ -39,7 +39,7 @@
Konformitätsstatus
</h2>
<p>
- Die <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines (WCAG)</a>
+ Die <a href="https://www.w3.org/WAI/standards-guidelines/wcag/" class="info">Web Content Accessibility Guidelines (WCAG) <span>Öffnet neues Fenster</span></a>
definieren Anforderungen an Designer und Entwickler, um den Zugang für Menschen mit Behinderungen zu verbessern.
Es definiert drei Stufen der Konformität: Level A, Level AA und Level AAA. »frag.jetzt« ist teilweise konform mit
WCAG 2.1 Level AA. Teilkonform bedeutet, dass einige Teile des Inhalts nicht vollständig dem Standard für
@@ -55,15 +55,15 @@
<br>
Telefon: +49 641 309-2450 <br><br>
Mail:
- <a class="email u-email"
+ <a class="email u-email info"
href="mailto:test@test.deklaus.quibeldey-cirkel@transmit.de.klaus.quibeldey-cirkel@transmit.de.">
- klaus.quibeldey-cirkel@transmit.de.
+ klaus.quibeldey-cirkel@transmit.de. <span>Öffnet neues Fenster</span>
</a>
</p>
<ars-row [height]="50"></ars-row>
<h2>Betreiber von »frag.jetzt«</h2>
<p>
- Der Betrieb der <a href="https://github.com/thm-projects/frag.jetzt" target="_blank">Open-Source-Webanwendung</a>
+ Der Betrieb der <a href="https://github.com/thm-projects/frag.jetzt" target="_blank" class="info">Open-Source-Webanwendung <span>Öffnet neues Fenster</span></a>
»frag.jetzt« ist eine kostenlose Dienstleistung
(»Soft­ware as a Service«) der TransMIT-Gesellschaft für
Technologietransfer mbH, Projektbereich für mobile An­wen­dun­gen.<br>
@@ -79,11 +79,11 @@
Wiesenstraße 14<br>
D-35390 Gießen<br>
<br>
- Telefon: <a href="tel:+49 641 309-2450">+49 641 309-2450</a><br>
- Mail: <a href="mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel@transmit.de</a>.<br>
+ Telefon: <a href="tel:+49 641 309-2450" class="info">+49 641 309-2450 <span>Öffnet neues Fenster</span></a><br>
+ Mail: <a href="mailto:klaus.quibeldey-cirkel@transmit.de" class="info">klaus.quibeldey-cirkel@transmit.de <span>Öffnet neues Fenster</span></a>.<br>
<br>
Sitz der Gesellschaft: Gießen<br>
- Website: <a href="https://www.transmit.de">www.transmit.de</a><br>
+ Website: <a href="https://www.transmit.de" class="info">www.transmit.de <span>Öffnet neues Fenster</span></a><br>
Rechtsform: GmbH<br>
Amtsgericht: Gießen HRB 3036<br>
USt-IdNr.: DE 188 685 037<br>
diff --git a/src/assets/i18n/imprint/imprint-en.html b/src/assets/i18n/imprint/imprint-en.html
index 5c6b8e72722046b4edb518522b9bf86b2013facf..6099e3f4c3f3ac5f2eb269ecffa42889a45f7ac1 100644
--- a/src/assets/i18n/imprint/imprint-en.html
+++ b/src/assets/i18n/imprint/imprint-en.html
@@ -7,8 +7,8 @@
<abbr title="Hessisches Ministerium für Wissenschaft und Kunst">
HMWK
</abbr>
- joint project <a href="https://www.digll-hessen.de/de" target="_blank">
- »Digitally supported teaching and learning in the State of Hessen«</a>
+ joint project <a href="https://www.digll-hessen.de/de" target="_blank" class="info">
+ »Digitally supported teaching and learning in the State of Hessen« <span>Opens new window</span></a>
(digLL).<br>
<br>
</p>
@@ -25,7 +25,7 @@
<p>
<a href="https://arsnova.thm.de/blog/wp-content/uploads/2019/09/Projektantrag-DigLL@THM-frag_jetzt.pdf"
- target="_blank">Projektskizze zu »frag.jetzt«</a>
+ target="_blank" class="info">Projektskizze zu »frag.jetzt« <span>Opens new window</span></a>
</p>
<ars-row [height]="50"></ars-row>
@@ -41,7 +41,7 @@
Conformance status
</h2>
<p>
- The <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines (WCAG)</a>
+ The <a href="https://www.w3.org/WAI/standards-guidelines/wcag/" class="info">Web Content Accessibility Guidelines (WCAG) <span>Opens new window</span></a>
defines requirements for designers and developers to improve accessibility for people with disabilities. It
defines three levels of conformance: Level A, Level AA, and Level AAA.frag.jetzt
is partially conformant with WCAG 2.1 level AA. Partially conformant means that
@@ -62,16 +62,16 @@
</li>
<li>
E-mail:
- <a href="mailto:test@test.deklaus.quibeldey-cirkel@transmit.de.klaus.quibeldey-cirkel@transmit.de.">
- klaus.quibeldey-cirkel@transmit.de.
+ <a href="mailto:test@test.deklaus.quibeldey-cirkel@transmit.de.klaus.quibeldey-cirkel@transmit.de." class="info">
+ klaus.quibeldey-cirkel@transmit.de. <span>Opens new window</span>
</a>
</li>
</ul>
<ars-row [height]="50"></ars-row>
<h2>Contact</h2>
<p>
- The operation of the <a href="https://github.com/thm-projects/frag.jetzt" target="_blank">open-source web
- application</a> »frag.jetzt« is a free service
+ The operation of the <a href="https://github.com/thm-projects/frag.jetzt" target="_blank" class="info">open-source web
+ application <span>Opens new window</span></a> »frag.jetzt« is a free service
(»Software as a Service«) of the TransMIT GmbH, project division for mobile applications.<br>
<br>
Kerkrader Straße 3<br>
@@ -87,11 +87,11 @@
D-35390 Gießen<br>
Germany<br>
<br>
- Phone: <a href="tel:+49 641 309-2450">+49 641 309-2450</a><br>
- Mail: <a href="mailto:klaus.quibeldey-cirkel@transmit.de">klaus.quibeldey-cirkel@transmit.de</a>.<br>
+ Phone: <a href="tel:+49 641 309-2450" class="info">+49 641 309-2450 <span>Opens new window</span></a><br>
+ Mail: <a href="mailto:klaus.quibeldey-cirkel@transmit.de" class="info">klaus.quibeldey-cirkel@transmit.de <span>Opens new window</span></a>.<br>
<br>
Company headquarters: Gießen<br>
- Website: <a href="https://www.transmit.de">www.transmit.de</a><br>
+ Website: <a href="https://www.transmit.de" class="info">www.transmit.de <span>Opens new window</span></a><br>
Legal form: GmbH<br>
Local court: Gießen HRB 3036<br>
German VAT no.: DE 188 685 037<br>
diff --git a/src/styles.scss b/src/styles.scss
index 348ef67880966fa92d2e214eb18d8140078a7fc0..f48743caa734bea23b5a68fe1696541103ff7035 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -129,3 +129,29 @@ address {
.mat-card, .mat-dialog-container {
border-radius: 25px !important;
}
+
+a.info {
+ position: relative;
+ z-index: 24;
+ text-decoration: underline;
+}
+
+a.info span {
+ position: absolute;
+ left: -9000px;
+ width: 0;
+ overflow: hidden;
+}
+
+
+a.info:hover span, a.info:focus span, a.info:active span {
+ display: block;
+ position: absolute;
+ top: 1.5em;
+ left: 2em;
+ width: 12em;
+ border: 1px solid var(--on-primary);
+ background-color: var(--primary);
+ color: #000;
+ text-align: center;
+}