From 30d5f7d3d36e4353de9867ef4aeaa6d9b9fddd92 Mon Sep 17 00:00:00 2001
From: JFH <20402845+jfhenon@users.noreply.github.com>
Date: Thu, 12 Aug 2021 09:30:52 +0200
Subject: [PATCH] fix top toolbar css

---
 src/editor/components/seSpinInput.js |  7 +++----
 src/editor/panels/TopPanel.js        | 15 ++++++---------
 src/editor/svgedit.css               |  3 ++-
 3 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/src/editor/components/seSpinInput.js b/src/editor/components/seSpinInput.js
index 67fb5657..8e25fa95 100644
--- a/src/editor/components/seSpinInput.js
+++ b/src/editor/components/seSpinInput.js
@@ -13,13 +13,12 @@ template.innerHTML = `
     right: -4px;
   }
   span {
-    bottom: -3px;
+    bottom: -0.5em;
     right: -4px;
     position: relative;
-    margin-left: 4px;
-    margin-right: 4px;
+    margin-left: -4px;
+    margin-right: 1px;
     color: #fff;
-    vertical-align: ;
   }
   elix-number-spin-box {
     background-color: var(--input-color);
diff --git a/src/editor/panels/TopPanel.js b/src/editor/panels/TopPanel.js
index 4d969bd6..942950d8 100644
--- a/src/editor/panels/TopPanel.js
+++ b/src/editor/panels/TopPanel.js
@@ -797,12 +797,11 @@ class TopPanel {
           </div>
           <div class="toolset">
             <se-input id="elem_class" data-attr="class" size="10" label="class" title="${i18next.t('properties.class')}"></se-input>
-          </div>
-          <se-spin-input size="3" id="angle" min=-180 max=180 step=5 src="${imgPath}/angle.svg"
+            <se-spin-input size="3" id="angle" min=-180 max=180 step=5 src="${imgPath}/angle.svg"
             title="${i18next.t('properties.angle')}"></se-spin-input>
           <se-spin-input size="2" id="blur" min=0 max=100 step=5 src="${imgPath}/blur.svg"
             title="${i18next.t('properties.blur')}"></se-spin-input>
-          <se-list id="tool_position" title="${i18next.t('tools.align_to_page')}" label="" width="22px" height="24px">
+          <se-list id="tool_position" title="${i18next.t('tools.align_to_page')}" label="" width="22px" height="22px">
             <se-list-item id="tool_posleft" value="l">
               <img title="${i18next.t('tools.align_left')}" src="${imgPath}/align_left.svg" height="22px">
             </se-list-item>
@@ -822,7 +821,9 @@ class TopPanel {
               <img title="${i18next.t('tools.align_bottom')}" src="${imgPath}/align_bottom.svg" height="22px">
             </se-list-item>
           </se-list>
-          <div id="xy_panel" class="toolset">
+   
+          </div>
+        <div id="xy_panel" class="toolset">
             <se-spin-input id="selected_x" data-attr="x" size="4" type="text" label="x" title="${i18next.t('properties.pos_x')}">
             </se-spin-input>
             <se-spin-input id="selected_y" data-attr="y" size="4" type="text" label="y" title="${i18next.t('properties.pos_y')}">
@@ -947,11 +948,7 @@ class TopPanel {
         <!-- formerly gsvg_panel -->
         <div id="container_panel">
           <div class="tool_sep"></div>
-          <!-- Add viewBox field here? -->
-          <label id="group_title" title="${i18next.t('ui.group_identify_label')}">
-            <span>label</span>
-            <input id="g_title" data-attr="title" size="10" type="text" />
-          </label>
+          <se-input id="g_title" data-attr="title" label="${i18next.t('ui.label')}"></se-input> 
         </div> <!-- container_panel -->
         <div id="use_panel">
           <se-button id="tool_unlink_use" title="${i18next.t('tools.tool_unlink_use')}"
diff --git a/src/editor/svgedit.css b/src/editor/svgedit.css
index 94e22ac1..2515180b 100644
--- a/src/editor/svgedit.css
+++ b/src/editor/svgedit.css
@@ -507,7 +507,8 @@ input[type=text] {
 
 .tool_sep {
   border-left: 1px outset #EEE;
-  margin: 6px 2px;
+  margin: 5px 1px;
+  height: 30px;
 }
 
 .width_label {