change css, add folder open

NINAnor · Dec 13, 2023 · 3cc147d · 3cc147d
1 parent 0db70d0
commit 3cc147d
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 5 deletions.
diff --git a/src/app.css b/src/app.css
@@ -23,7 +23,7 @@ body {
 #sidebar {
     width: 400px;
     overflow-y: auto;
-    padding: 1rem;
+    padding: 0.5rem;
 }
 
 .maplibregl-popup {

diff --git a/src/components/Layers.jsx b/src/components/Layers.jsx
@@ -36,7 +36,7 @@ function Group({ node, style, dragHandle }) {
   return (
     <div style={style} ref={dragHandle}>
       <div style={{ display: 'flex' }}>
-        <div onClick={() => node.toggle()} style={{ flexGrow: 1 }}><i className="fas fa-folder"></i> {node.data.name}</div>
+        <div onClick={() => node.toggle()} style={{ flexGrow: 1 }}><i className={`fas fa-folder${node.isOpen ? '-open' : '' }`}></i> {node.data.name}</div>
         {node.data.download && (<div><a href={node.data.download} download><i className="fas fa-download"></i></a></div>)}
       </div>
     </div>
@@ -61,7 +61,7 @@ export default function Layers() {
   }
 
   return (
-    <div style={{ marginLeft: '0.5rem' }}>
+    <div>
       <h5>Kartlag</h5>
       <Tree
         initialData={data.layers}
@@ -70,6 +70,11 @@ export default function Layers() {
         disableDrop
         disableMultiSelection
         openByDefault
+        width={400}
+        height={window.innerHeight * 0.7}
+        indent={10}
+        rowHeight={30}
+        overscanCount={1}
       >
         {Child}
       </Tree>

diff --git a/src/components/Metadata.jsx b/src/components/Metadata.jsx
@@ -12,8 +12,8 @@ export default function Metadata() {
   }
 
   return (
-    <div style={{ marginLeft: '0.5rem' }}>
-      <h3>{style ? style.name : ''}</h3>
+    <div>
+      <h3 style={{ marginTop: '0'}}>{style ? style.name : ''}</h3>
       <p>{data.subtitle}</p>
       <details>
         <summary>Beskrivelse</summary>