Move folder indicator to the right (#339)

alineacms · Nov 30, 2023 · b393b74 · b393b74
1 parent f80d5aa
commit b393b74
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 14 deletions.
diff --git a/src/dashboard/view/EntryTree.module.scss b/src/dashboard/view/EntryTree.module.scss
@@ -142,7 +142,7 @@
       align-items: center;
       justify-content: center;
       width: 20px;
-      margin-right: 4px;
+      margin-left: auto;
       height: 20px;
       flex-shrink: 0;
       color: hsla(var(--alinea-negative), 0.5);

diff --git a/src/dashboard/view/EntryTree.tsx b/src/dashboard/view/EntryTree.tsx
@@ -71,30 +71,31 @@ function EntryTreeItem({item, data}: EntryTreeItemProps) {
     >
       <button
         className={styles.tree.item.label()}
+        title={selectedEntry(locale, itemData).title}
         style={{paddingLeft: px((item.getItemMeta().level + 1) * 12)}}
       >
-        {item.isFolder() ? (
+        <span className={styles.tree.item.icon()}>
+          <Icon
+            icon={
+              isUntranslated ? IcRoundTranslate : icon ?? IcOutlineDescription
+            }
+          />
+        </span>
+
+        <span className={styles.tree.item.label.itemName()}>
+          {selectedEntry(locale, itemData).title}
+        </span>
+
+        {item.isFolder() && (
           <span className={styles.tree.item.arrow()}>
             {item.isExpanded() ? (
               <Icon icon={IcRoundKeyboardArrowDown} size={18} />
             ) : (
               <Icon icon={IcRoundKeyboardArrowRight} size={18} />
             )}
           </span>
-        ) : (
-          <span className={styles.tree.item.icon()}>
-            <Icon
-              icon={
-                isUntranslated ? IcRoundTranslate : icon ?? IcOutlineDescription
-              }
-            />
-          </span>
         )}
 
-        <span className={styles.tree.item.label.itemName()}>
-          {selectedEntry(locale, itemData).title}
-        </span>
-
         {/*isUntranslated && (
             <span className={styles.tree.status()}>
               <Icon icon={IcRoundTranslate} />