Simon/Assistent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified: templates/chat.html

Browse Source
This commit is contained in:
SimolZimol
2025-06-19 17:53:48 +02:00
parent 97e477b36f
commit fdce5a853c
1 changed files with 74 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
templates/chat.html
View File

@@ -171,33 +171,77 @@
background: #ff4d4d;
color: #fff;
}
.btn-group {
position: relative;
.icon-btn {
background: #23272f;
border: 2px solid #00aaff;
border-radius: 50%;
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.2s, border-color 0.2s;
margin-bottom: 8px;
margin-top: 8px;
box-shadow: 0 2px 8px #00aaff22;
}
.arrow {
font-size: 0.8em;
margin-left: 4px;
.icon-btn:hover {
background: #00aaff;
border-color: #0078fe;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #181a20;
min-width: 160px;
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
z-index: 1;
border-radius: 8px;
margin-top: 4px;
}
.dropdown-content a {
color: #e3e3e3;
padding: 12px 16px;
text-decoration: none;
.icon-btn svg {
display: block;
font-size: 0.95em;
}
.dropdown-content a:hover {
background-color: #00aaff;
#tools-btn[title]:hover:after {
content: attr(title);
position: absolute;
right: 60px;
background: #23272f;
color: #00aaff;
padding: 4px 10px;
border-radius: 6px;
font-size: 0.95em;
white-space: nowrap;
box-shadow: 0 2px 8px #00aaff22;
z-index: 10;
}
#export-dialog {
display:none;
background:#23272f;
border:2px solid #00aaff;
border-radius:12px;
padding:24px;
margin:18px 24px;
box-shadow: 0 4px 24px #00aaff22;
position: absolute;
top: 90px;
right: 0;
max-width: 400px;
z-index: 100;
}
#export-dialog input {
background: #181a20;
color: #e3e3e3;
border: 1px solid #353b48;
border-radius: 6px;
padding: 8px;
width: 90%;
margin: 8px 0;
}
#export-dialog button {
background: #00aaff;
color: #fff;
border: none;
border-radius: 8px;
padding: 7px 18px;
font-size: 1em;
margin-right: 8px;
cursor: pointer;
margin-top: 8px;
}
#export-dialog button:hover {
background: #0078fe;
}
@media (max-width: 600px) {
#container { max-width: 100%; border-radius: 0; }
@@ -213,7 +257,13 @@
<h1>AI Vertriebsassistent</h1>
<p>Erstellt von Simon Giehl &ndash; Ihr smarter KI-Partner für Kunden- und Vertriebsinfos</p>
</div>
<div style="display:flex; justify-content:flex-end; padding: 0 24px;">
<div style="display:flex; justify-content:flex-end; align-items:center; gap:12px; padding: 0 24px;">
<button id="tools-btn" class="icon-btn" onclick="showExportDialog()" title="Tools">
<svg width="22" height="22" viewBox="0 0 20 20" fill="none">
<circle cx="10" cy="10" r="9" stroke="#00aaff" stroke-width="2" fill="#23272f"/>
<path d="M7 13l6-6M8 7h5v5" stroke="#00aaff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</button>
<button id="clear-btn" onclick="clearChat()">Kontext löschen</button>
</div>
<div id="export-dialog" style="display:none; background:#23272f; border:1px solid #00aaff; border-radius:8px; padding:18px; margin:18px 24px;">
@@ -226,14 +276,7 @@
<div id="chat"></div>
<div id="input-area">
<input id="input" type="text" placeholder="Nachricht eingeben..." autocomplete="off">
<div class="btn-group">
<button id="send-btn" onclick="send()">Senden</button>
<button id="dropdown-btn" onclick="toggleDropdown()" aria-label="Tools"><span class="arrow">&#9660;</span></button>
<div id="dropdown-menu" class="dropdown-content">
<a href="#" onclick="showExportDialog();toggleDropdown();return false;">Export/Tabellen-Tool</a>
<!-- Weitere Optionen hier -->
</div>
</div>
<button id="send-btn" onclick="send()">Senden</button>
</div>
<div id="footer">
&copy; 2025 Simon Giehl &ndash; AI Vertriebsassistent. Alle Rechte vorbehalten.
@@ -431,24 +474,6 @@
document.getElementById('export-result').textContent = err.message;
});
}
function toggleDropdown() {
const menu = document.getElementById('dropdown-menu');
menu.style.display = menu.style.display === 'block' ? 'none' : 'block';
}
// Schließe das Dropdown-Menü, wenn außerhalb geklickt wird
window.onclick = function(event) {
if (!event.target.matches('#dropdown-btn')) {
const dropdowns = document.getElementsByClassName('dropdown-content');
for (let i = 0; i < dropdowns.length; i++) {
const openDropdown = dropdowns[i];
if (openDropdown.style.display === 'block') {
openDropdown.style.display = 'none';
}
}
}
}
</script>
</body>
</html>