Change digitizing text title + add hint

nboisteault · Oct 20, 2023 · bc1e7f0 · bc1e7f0
1 parent b57aadd
commit bc1e7f0
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 14 deletions.
diff --git a/assets/src/components/Digitizing.js b/assets/src/components/Digitizing.js
@@ -168,19 +168,19 @@ export default class Digitizing extends HTMLElement {
                 </div>
             </div>
             <form class="digitizing-text-tools ${mainLizmap.digitizing.editedFeatures.length ? '' : 'hide'}">
-                <fieldset>
-                    <legend>${lizDict['digitizing.toolbar.text']}</legend>
-                    <textarea placeholder="${lizDict['digitizing.toolbar.newText']}" .value=${mainLizmap.digitizing.editedFeatureText} @input=${ event=> mainLizmap.digitizing.editedFeatureText = event.target.value}></textarea>
-                    <div class='digitizing-text-rotation'>
-                        <label for="textRotation">${lizDict['digitizing.toolbar.textRotation']}</label>
-                        <div class="input-append">
-                            <input id="textRotation" type="number" class="input-mini" .value=${mainLizmap.digitizing.editedFeatureTextRotation} @input=${ event => { mainLizmap.digitizing.editedFeatureTextRotation = parseInt(event.target.value) }}>
-                            <span class="add-on">°</span>
-                        </div>
+                <details>
+                    <summary>${lizDict['digitizing.toolbar.text']}</summary>${lizDict['digitizing.toolbar.text.hint']}
+                </details>
+                <textarea placeholder="${lizDict['digitizing.toolbar.newText']}" .value=${mainLizmap.digitizing.editedFeatureText} @input=${ event=> mainLizmap.digitizing.editedFeatureText = event.target.value}></textarea>
+                <div class='digitizing-text-rotation'>
+                    <label for="textRotation">${lizDict['digitizing.toolbar.textRotation']}</label>
+                    <div class="input-append">
+                        <input id="textRotation" type="number" class="input-mini" .value=${mainLizmap.digitizing.editedFeatureTextRotation} @input=${ event => { mainLizmap.digitizing.editedFeatureTextRotation = parseInt(event.target.value) }}>
+                        <span class="add-on">°</span>
                     </div>
-                    <label for="textScale">${lizDict['digitizing.toolbar.textScale']}</label>
-                    <input id="textScale" type="number" min="1" class="input-mini" .value=${mainLizmap.digitizing.editedFeatureTextScale} @input=${ event => { mainLizmap.digitizing.editedFeatureTextScale = parseInt(event.target.value) }}>
-                </fieldset>
+                </div>
+                <label for="textScale">${lizDict['digitizing.toolbar.textScale']}</label>
+                <input id="textScale" type="number" min="1" class="input-mini" .value=${mainLizmap.digitizing.editedFeatureTextScale} @input=${ event => { mainLizmap.digitizing.editedFeatureTextScale = parseInt(event.target.value) }}>
             </form>
         </div>`;
 

diff --git a/lizmap/modules/view/locales/en_US/dictionnary.UTF-8.properties b/lizmap/modules/view/locales/en_US/dictionnary.UTF-8.properties
@@ -198,7 +198,8 @@ digitizing.toolbar.point=Point
 digitizing.toolbar.line=Line
 digitizing.toolbar.polygon=Polygon
 digitizing.toolbar.freehand=Free hand
-digitizing.toolbar.text=Text
+digitizing.toolbar.text=Object labelling
+digitizing.toolbar.text.hint=You can change the label text content, size and rotation for the selected objects.
 digitizing.toolbar.newText=New text
 digitizing.toolbar.textRotation=Rotation
 digitizing.toolbar.textScale=Size

diff --git a/lizmap/www/assets/css/map.css b/lizmap/www/assets/css/map.css
@@ -2672,7 +2672,7 @@ input[type="color"].digitizing-color{
   font-size: x-large;
 }
 
-.digitizing-constraints details {
+lizmap-digitizing details {
   padding: 5px;
   cursor: pointer;
   font-size: 14px;