frontend/src/components/General/RoundedButton.svelte

@@ -7,6 +7,7 @@
     export let icon = ''
     export let tooltip = "Default tooltip"
     export let active = false;
+    export let style = '';
 
     // Import the main colors from the store
     let firstColor, secondColor, thirdColor, fourthColor, okColor, nokColor, whiteColor
@@ -47,7 +48,7 @@
         on:mousedown={emitClick}
         on:mouseenter={toggleTooltip}
         on:mouseleave={toggleTooltip}
-        style='color: {whiteColor}; background-color: { active ? secondColor : thirdColor }; border:none;'><i class='bx { icon}'></i> { text }</button>
+        style='color: {whiteColor}; background-color: { active ? secondColor : thirdColor }; border:none; {style}'><i class='bx { icon}'></i> { text }</button>
 <style>
     button{
         cursor: pointer;

frontend/src/components/Settings/ProjectPropertiesContent.svelte

@@ -3,6 +3,7 @@
     import * as SoftwareVariables from '../../stores.js';
     import Input from "../General/Input.svelte";
     import RoundedButton from '../General/RoundedButton.svelte';
+    import { _ } from 'svelte-i18n'
 
     // Import the main colors from the store
     let firstColor, secondColor, thirdColor, fourthColor, okColor, nokColor, whiteColor
@@ -28,17 +29,17 @@
 
 <div class='flexSettings'>
     <div>
-        <Input label='Nom du show' type='text'/>
-        <Input label='Date du show' type='date'/>
-        <Input label='Statut de la sauvegarde' type='file'/>
-        <Input label="Nombre d'univers DMX" type='number' min='1' max='10'/>
+        <Input label={$_("projectShowNameLabel")} type='text'/>
+        <Input label={$_("projectShowDateLabel")} type='date'/>
+        <Input label={$_("projectSaveLabel")} type='file'/>
+        <Input label={$_("projectUniversesLabel")} type='number' min='1' max='10'/>
     </div>
     <div>
-        <Input label='Statut de la sauvegarde' type='image' src='appicon.png' alt='Photo de profil du show' width='11em'/>
-        <RoundedButton text='Charger une nouvelle image' icon='bxs-image' active/>
+        <Input label={$_("projectAvatarLabel")} type='image' src='appicon.png' alt={$_("projectAvatarLabel")} width='11em'/>
+        <RoundedButton style='display:block;' text={$_("projectLoadAvatarButton")} icon='bxs-image' active/>
     </div>
     <div>
-        <Input label="Commentaires" type='large' width='100%'/>
+        <Input label={$_("projectCommentsLabel")} type='large' width='100%'/>
     </div>
 </div>
 

frontend/src/lang/en.json

@@ -15,5 +15,13 @@
   "projectPropertiesTab": "Project properties",
   "projectPropertiesTooltip": "The project properties",
   "projectInputOutputTab": "Inputs & outputs",
-  "projectInputOutputTooltip": "The input/output hardware definition"
+  "projectInputOutputTooltip": "The input/output hardware definition",
+  
+  "projectShowNameLabel": "Show name",
+  "projectShowDateLabel": "Show date",
+  "projectSaveLabel": "Save status",
+  "projectUniversesLabel": "Number of DMX universes",
+  "projectAvatarLabel": "Show avatar",
+  "projectCommentsLabel": "Comments",
+  "projectLoadAvatarButton": "Load a new avatar"
 }