- Translations completed for Front-End, Configs (e.g. Forms) and free text.

- Allowed_languages and default_language now part of Tenant Make iso Tenant
- Introduction of Translation into Traicie Selection Specialist
This commit is contained in:
Josako
2025-06-30 14:20:17 +02:00
parent 4338f09f5c
commit fbc9f44ac8
34 changed files with 1206 additions and 220 deletions

View File

@@ -7,13 +7,17 @@
<!-- CSS -->
<link rel="stylesheet" href="{{ url_for('static', filename='assets/css/chat.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='assets/css/language-selector.css') }}">
<!-- Vue.js -->
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<!-- Vue.js (productie versie) -->
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
<!-- Markdown parser for explanation text -->
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<!-- Translation support -->
<script src="{{ url_for('static', filename='assets/js/translation.js') }}"></script>
<!-- Custom theme colors from tenant settings -->
<style>
:root {
@@ -28,106 +32,12 @@
--markdown-background-color: {{ customisation.markdown_background_color|default('transparent') }};
--markdown-text-color: {{ customisation.markdown_text_color|default('#ffffff') }};
}
body, html {
margin: 0;
padding: 0;
height: 100%;
font-family: Arial, sans-serif;
}
.app-container {
display: flex;
height: 100vh;
width: 100%;
}
.sidebar {
width: 300px;
background-color: var(--sidebar-background);
color: white;
padding: 20px;
display: flex;
flex-direction: column;
overflow-y: auto;
}
.sidebar-logo {
text-align: center;
margin-bottom: 20px;
}
.sidebar-logo img {
max-width: 100%;
max-height: 100px;
}
.sidebar-make-name {
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
text-align: center;
}
.sidebar-explanation {
margin-top: 20px;
overflow-y: auto;
background-color: var(--markdown-background-color);
color: var(--markdown-text-color);
padding: 10px;
border-radius: 5px;
}
/* Ensure all elements in the markdown content inherit the text color */
.sidebar-explanation * {
color: inherit;
}
/* Style links in the markdown content */
.sidebar-explanation a {
color: var(--primary-color);
text-decoration: underline;
}
/* Style lists in markdown content */
.sidebar-explanation ul,
.sidebar-explanation ol {
padding-left: 20px;
margin: 10px 0;
}
.sidebar-explanation li {
margin-bottom: 5px;
}
.sidebar-explanation ul li {
list-style-type: disc;
}
.sidebar-explanation ol li {
list-style-type: decimal;
}
.content-area {
flex: 1;
background: linear-gradient(135deg, var(--gradient-start-color), var(--gradient-end-color));
overflow-y: auto;
display: flex;
flex-direction: column;
}
.chat-container {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
</style>
{% block head %}{% endblock %}
</head>
<body>
<div id="app" class="app-container">
<div id="app" class="app-container" data-vue-app="true">
<!-- Left sidebar - never changes -->
<div class="sidebar">
<div class="sidebar-logo">
@@ -136,6 +46,7 @@
<div class="sidebar-make-name">
{{ tenant_make.name|default('') }}
</div>
<div id="language-selector-container"></div>
<div class="sidebar-explanation" v-html="compiledExplanation"></div>
</div>
@@ -148,6 +59,19 @@
</div>
<script>
// Maak ondersteunde talen beschikbaar voor de client
window.config = {
supportedLanguages: [
{% for lang_code in config.SUPPORTED_LANGUAGES %}
{
code: "{{ lang_code }}",
name: "{{ config.SUPPORTED_LANGUAGE_DETAILS[config.SUPPORTED_LANGUAGES_FULL[loop.index0]]['iso 639-1'] }}",
flag: "{{ config.SUPPORTED_LANGUAGE_DETAILS[config.SUPPORTED_LANGUAGES_FULL[loop.index0]]['flag'] }}"
}{% if not loop.last %},{% endif %}
{% endfor %}
]
};
// Create Vue app and make it available globally
window.__vueApp = Vue.createApp({
data() {