slightly more styling on home scopes

enjalot · Jan 26, 2024 · 25422ee · 25422ee
1 parent 2e236e1
commit 25422ee
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/web/src/components/Home.css b/web/src/components/Home.css
@@ -16,3 +16,14 @@
   background-color: #f9f9f9;
   cursor: pointer;
 }
+
+.home .scope-links {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+.home .scope-link {
+  padding: 12px;
+
+
+}
diff --git a/web/src/components/Home.jsx b/web/src/components/Home.jsx
@@ -119,13 +119,15 @@ function Home() {
         {datasets.map(dataset => (
           <li key={dataset.id}>
             <Link to={`/datasets/${dataset.name}/setup`}>Setup {dataset.name}</Link>
+            <div className="scope-links">
             {scopes[dataset.id] && scopes[dataset.id].map && scopes[dataset.id]?.map((scope,i) => (
-              <div key={i} >
+              <div className="scope-link" key={i} >
                 <Link to={`/datasets/${dataset.name}/explore/${scope.id}`}>Explore {scope.name} - {scope.label}<br></br>
                 <img width="120px" src={`${apiUrl}/files/${dataset.id}/clusters/${scope.cluster}.png`} />
                 </Link><br></br>
               </div>
             ))}
+            </div>
           </li>
         ))}
       </ul>