osm-labo/templates/admin/wiki_create_french.html.twig
2025-08-31 12:49:29 +02:00

115 lines
No EOL
4 KiB
Twig

{% extends 'base.html.twig' %}
{% block title %}Créer une traduction française pour {{ key }}{% endblock %}
{% block stylesheets %}
{{ parent() }}
<style>
.iframe-container {
display: flex;
flex-direction: row;
height: calc(100vh - 200px);
min-height: 600px;
margin-bottom: 20px;
}
.iframe-container iframe {
flex: 1;
border: 1px solid #dee2e6;
height: 100%;
}
.iframe-container .iframe-separator {
width: 10px;
background-color: #f8f9fa;
border: 1px solid #dee2e6;
display: flex;
justify-content: center;
align-items: center;
}
.iframe-container .iframe-separator::after {
content: "⟺";
font-size: 20px;
color: #6c757d;
}
.iframe-header {
background-color: #f8f9fa;
padding: 10px;
border: 1px solid #dee2e6;
border-bottom: none;
font-weight: bold;
text-align: center;
}
@media (max-width: 768px) {
.iframe-container {
flex-direction: column;
height: auto;
}
.iframe-container iframe {
height: 500px;
}
.iframe-container .iframe-separator {
height: 10px;
width: 100%;
}
.iframe-container .iframe-separator::after {
content: "⟻⟼";
}
}
</style>
{% endblock %}
{% block body %}
<div class="container-fluid mt-4">
{% include 'admin/_wiki_navigation.html.twig' %}
<h1>Créer une traduction française pour "{{ key }}"</h1>
<p class="lead">Utilisez cette page pour traduire la page wiki en français. La page anglaise est affichée à gauche pour référence, et le formulaire d'édition de la page française est à droite.</p>
<div class="alert alert-info">
<i class="bi bi-info-circle"></i> Conseils pour la traduction :
<ul>
<li>Conservez la structure de la page anglaise (sections, sous-sections, etc.)</li>
<li>Traduisez le contenu en français en adaptant les exemples au contexte français si nécessaire</li>
<li>N'hésitez pas à consulter d'autres pages françaises pour vous inspirer du style et de la terminologie</li>
</ul>
</div>
<div class="row">
<div class="col-md-6">
<div class="iframe-header">
<i class="bi bi-flag-fill"></i> Version anglaise (référence)
</div>
</div>
<div class="col-md-6">
<div class="iframe-header">
<i class="bi bi-translate"></i> <a href="{{ french_edit_url }}">Création de la version française</a>
</div>
</div>
</div>
<div class="iframe-container">
<iframe src="{{ english_url }}" title="Version anglaise"></iframe>
<div class="iframe-separator"></div>
<iframe src="{{ french_edit_url }}" title="Édition française"></iframe>
</div>
<div class="mt-3">
<a href="{{ path('app_admin_wiki') }}" class="btn btn-secondary">
<i class="bi bi-arrow-left"></i> Retour à la liste des pages wiki
</a>
<a href="{{ english_url }}" target="_blank" class="btn btn-outline-primary">
<i class="bi bi-box-arrow-up-right"></i> Ouvrir la version anglaise dans un nouvel onglet
</a>
<a href="{{ french_edit_url }}" target="_blank" class="btn btn-outline-info">
<i class="bi bi-box-arrow-up-right"></i> Ouvrir l'éditeur français dans un nouvel onglet
</a>
</div>
</div>
{% endblock %}