- 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:
@@ -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() {
|
||||
|
||||
Reference in New Issue
Block a user