Widget:StartseitenSuche: Unterschied zwischen den Versionen
Aus MediaWiki
KKeine Bearbeitungszusammenfassung |
KKeine Bearbeitungszusammenfassung |
||
| (11 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
<includeonly> | <includeonly> | ||
<div id="chat-widget"> | <div id="chat-widget"> | ||
<div id="chat-messages"></div> | <div id="chat-messages"></div> | ||
<div id="chat-sources-panel"></div> | <div id="chat-sources-panel"></div> | ||
<form id="chat-form"> | <form id="chat-form"> | ||
<input type="text" id="chat-input" placeholder="Stelle | <input type="text" id="chat-input" placeholder="Stelle mir deine Frage …" autocomplete="off" /> | ||
<button type="submit" id="chat-send">Fragen</button> | <button type="submit" id="chat-send">Fragen</button> | ||
</form> | </form> | ||
| Zeile 15: | Zeile 14: | ||
<style> | <style> | ||
.overlay-container { | |||
position: relative; | |||
width: 100%; | |||
min-height: 400px; | |||
padding: 24px; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
overflow: hidden; | |||
border-radius: 12px; | |||
background-color: #2f3e46; | |||
background-image: url("/w/images/a/a9/Schloss-Muenster-Philipp-Foelting-CC-BY-SA.jpg"); | |||
background-size: cover; | |||
background-position: center; | |||
background-repeat: no-repeat; | |||
box-sizing: border-box; | |||
} | |||
.overlay-container::before { | |||
content: ""; | |||
position: absolute; | |||
inset: 0; | |||
background: rgba(0, 0, 0, 0.38); | |||
z-index: 1; | |||
} | |||
.overlay-content { | |||
position: relative; | |||
z-index: 2; | |||
width: 100%; | |||
max-width: 860px; | |||
padding: 0px; | |||
border-radius: 12px; | |||
background: rgba(255, 255, 255, 0.92); | |||
backdrop-filter: blur(4px); | |||
-webkit-backdrop-filter: blur(4px); | |||
box-sizing: border-box; | |||
} | |||
#chat-widget { | #chat-widget { | ||
max-width: 800px; | max-width: 800px; | ||
| Zeile 22: | Zeile 60: | ||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
} | } | ||
#chat-messages { | #chat-messages { | ||
min-height: 120px; | min-height: 120px; | ||
| Zeile 43: | Zeile 71: | ||
} | } | ||
#chat-messages:empty::before { | #chat-messages:empty::before { | ||
content: "Stelle eine Frage und erhalte Antworten basierend auf dem Münster Wiki und ausgewählten | content: "Stelle eine Frage und erhalte Antworten basierend auf dem Münster Wiki und ausgewählten Web-Inhalten für Münster. Beachte: KI-Suche kann Fehler machen. Prüfe deine Ergebnisse sorgfältig. Verwende keine personenbezogenen Daten."; | ||
display: block; | display: block; | ||
text-align: center; | text-align: center; | ||
| Zeile 324: | Zeile 352: | ||
html += '<div class="chat-sources-list" id="' + listId + '">'; | html += '<div class="chat-sources-list" id="' + listId + '">'; | ||
sources.forEach(function(s) { | sources.forEach(function(s) { | ||
var pct = Math.round((s. | var pct = Math.round((s.score || 0) * 100); | ||
var | var url = s.url || ''; | ||
var title = ''; | |||
if (url) { | |||
var seg = url.split('/').pop(); | |||
try { seg = decodeURIComponent(seg); } catch (e) {} | |||
title = seg.replace(/_/g, ' '); | |||
} | |||
html += '<div class="chat-source-item">' | html += '<div class="chat-source-item">' | ||
+ '<h5><a href="' + | + '<h5><a href="' + escapeHtml(url) + '">' + escapeHtml(title) + '</a></h5>' | ||
+ '<p class="chat-source-snippet">' + escapeHtml(truncate(s. | + '<p class="chat-source-snippet">' + escapeHtml(truncate(s.content || '', 150)) + '</p>' | ||
+ '<div class="chat-source-meta">Relevanz: ' + pct + '% · ' + escapeHtml(s.source || '') + '</div>' | + '<div class="chat-source-meta">Relevanz: ' + pct + '% · ' + escapeHtml(s.source || '') + '</div>' | ||
+ '</div>'; | + '</div>'; | ||
| Zeile 420: | Zeile 454: | ||
})(); | })(); | ||
</script> | </script> | ||
</includeonly> | </includeonly> | ||
