feat: Vollbild-Modus für Chat-Assistent
Neuer Button zwischen Reload und Schließen. Toggled zwischen normalem Fenster und Vollbild. Icon wechselt zwischen Expand/Collapse. Schließen und Reset beenden Vollbild automatisch. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
@@ -4841,6 +4841,19 @@ a.map-popup-article:hover {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Fullscreen */
|
||||||
|
.chat-window.fullscreen {
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
z-index: 10000;
|
||||||
|
}
|
||||||
|
|
||||||
/* Light Theme */
|
/* Light Theme */
|
||||||
[data-theme="light"] .chat-window {
|
[data-theme="light"] .chat-window {
|
||||||
box-shadow: 0 8px 32px rgba(0,0,0,0.12);
|
box-shadow: 0 8px 32px rgba(0,0,0,0.12);
|
||||||
|
|||||||
@@ -595,7 +595,10 @@
|
|||||||
<button class="chat-header-btn chat-reset-btn" id="chat-reset-btn" title="Neuer Chat" aria-label="Neuen Chat starten" style="display:none">
|
<button class="chat-header-btn chat-reset-btn" id="chat-reset-btn" title="Neuer Chat" aria-label="Neuen Chat starten" style="display:none">
|
||||||
<svg viewBox="0 0 24 24" width="15" height="15"><path d="M17.65 6.35A7.958 7.958 0 0012 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08A5.99 5.99 0 0112 18c-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" fill="currentColor"/></svg>
|
<svg viewBox="0 0 24 24" width="15" height="15"><path d="M17.65 6.35A7.958 7.958 0 0012 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08A5.99 5.99 0 0112 18c-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" fill="currentColor"/></svg>
|
||||||
</button>
|
</button>
|
||||||
<button class="chat-header-btn chat-header-close" id="chat-close-btn" title="Schließen" aria-label="Chat schließen">×</button>
|
<button class="chat-header-btn" id="chat-fullscreen-btn" title="Vollbild" aria-label="Vollbild umschalten">
|
||||||
|
<svg viewBox="0 0 24 24" width="15" height="15"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z" fill="currentColor"/></svg>
|
||||||
|
</button>
|
||||||
|
<button class="chat-header-btn chat-header-close" id="chat-close-btn" title="Schließen" aria-label="Chat schließen">×</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="chat-messages" id="chat-messages"></div>
|
<div class="chat-messages" id="chat-messages"></div>
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ const Chat = {
|
|||||||
_isOpen: false,
|
_isOpen: false,
|
||||||
_isLoading: false,
|
_isLoading: false,
|
||||||
_hasGreeted: false,
|
_hasGreeted: false,
|
||||||
|
_isFullscreen: false,
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
const btn = document.getElementById('chat-toggle-btn');
|
const btn = document.getElementById('chat-toggle-btn');
|
||||||
@@ -21,6 +22,9 @@ const Chat = {
|
|||||||
const resetBtn = document.getElementById('chat-reset-btn');
|
const resetBtn = document.getElementById('chat-reset-btn');
|
||||||
if (resetBtn) resetBtn.addEventListener('click', () => this.reset());
|
if (resetBtn) resetBtn.addEventListener('click', () => this.reset());
|
||||||
|
|
||||||
|
const fsBtn = document.getElementById('chat-fullscreen-btn');
|
||||||
|
if (fsBtn) fsBtn.addEventListener('click', () => this.toggleFullscreen());
|
||||||
|
|
||||||
form.addEventListener('submit', (e) => {
|
form.addEventListener('submit', (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.send();
|
this.send();
|
||||||
@@ -74,8 +78,15 @@ const Chat = {
|
|||||||
const btn = document.getElementById('chat-toggle-btn');
|
const btn = document.getElementById('chat-toggle-btn');
|
||||||
if (!win) return;
|
if (!win) return;
|
||||||
win.classList.remove('open');
|
win.classList.remove('open');
|
||||||
|
win.classList.remove('fullscreen');
|
||||||
btn.classList.remove('active');
|
btn.classList.remove('active');
|
||||||
this._isOpen = false;
|
this._isOpen = false;
|
||||||
|
this._isFullscreen = false;
|
||||||
|
const fsBtn = document.getElementById('chat-fullscreen-btn');
|
||||||
|
if (fsBtn) {
|
||||||
|
fsBtn.title = 'Vollbild';
|
||||||
|
fsBtn.innerHTML = '<svg viewBox="0 0 24 24" width="15" height="15"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z" fill="currentColor"/></svg>';
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
reset() {
|
reset() {
|
||||||
@@ -88,6 +99,20 @@ const Chat = {
|
|||||||
this.open();
|
this.open();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
toggleFullscreen() {
|
||||||
|
const win = document.getElementById('chat-window');
|
||||||
|
const btn = document.getElementById('chat-fullscreen-btn');
|
||||||
|
if (!win) return;
|
||||||
|
this._isFullscreen = !this._isFullscreen;
|
||||||
|
win.classList.toggle('fullscreen', this._isFullscreen);
|
||||||
|
if (btn) {
|
||||||
|
btn.title = this._isFullscreen ? 'Vollbild beenden' : 'Vollbild';
|
||||||
|
btn.innerHTML = this._isFullscreen
|
||||||
|
? '<svg viewBox="0 0 24 24" width="15" height="15"><path d="M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z" fill="currentColor"/></svg>'
|
||||||
|
: '<svg viewBox="0 0 24 24" width="15" height="15"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z" fill="currentColor"/></svg>';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
_updateResetBtn() {
|
_updateResetBtn() {
|
||||||
const btn = document.getElementById('chat-reset-btn');
|
const btn = document.getElementById('chat-reset-btn');
|
||||||
if (btn) btn.style.display = this._conversationId ? '' : 'none';
|
if (btn) btn.style.display = this._conversationId ? '' : 'none';
|
||||||
|
|||||||
In neuem Issue referenzieren
Einen Benutzer sperren