- Introduce cache busting (to circumvent aggressive caching on iOS - but ideal in other contexts as well)

- Change the build process to allow cache busting
- Optimisations to the build process
- Several improvements of UI geared towards mobile experience
-
This commit is contained in:
Josako
2025-09-25 17:28:01 +02:00
parent cc47ce2d32
commit 16ce59ae98
32 changed files with 1538 additions and 899 deletions

View File

@@ -79,6 +79,16 @@
.chat-input-area {
max-width: 100%; /* Op mobiel volledige breedte gebruiken */
/* Respect safe-area at bottom */
padding-bottom: env(safe-area-inset-bottom, 0);
}
/* Prevent iOS focus zoom by ensuring form controls are >= 16px */
input, textarea, select, button,
.chat-input input, .chat-input textarea, .chat-input select, .chat-input button,
.mobile-language-selector :is(select, input, button) {
font-size: 16px;
line-height: 1.4;
}
.chat-input {
@@ -97,6 +107,11 @@
}
}
/* When keyboard is open, allow a bit more space below */
body.keyboard-open .chat-input-area {
padding-bottom: calc(env(safe-area-inset-bottom, 0) + 8px);
}
/* Extra small screens */
@media (max-width: 480px) {
.chat-app-container {
@@ -251,15 +266,6 @@
margin: 20px 0;
}
.form-message .message-content {
max-width: 90%;
background: white;
border: 1px solid #e9ecef;
border-radius: 12px;
padding: 20px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
/* System messages */
.system-message {
text-align: center;
@@ -437,24 +443,6 @@
opacity: 0.8;
}
/* Mobile responsiveness */
@media (max-width: 768px) {
.message {
padding: 0 15px;
}
/* moved to ChatMessage.vue scoped styles */
.message.user .message-content {
margin-left: 40px;
}
.message.ai .message-content,
.message.bot .message-content {
margin-right: 40px;
}
}
@media (max-width: 480px) {
.message {
padding: 0 10px;