feat: minor improvements to studio account page

openstream-fm · Jul 3, 2023 · 6bb8f81 · 6bb8f81
1 parent ef33d81
commit 6bb8f81
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 11 deletions.
diff --git a/front/app/src/routes/(root)/(online)/(app)/accounts/[account]/+page.svelte b/front/app/src/routes/(root)/(online)/(app)/accounts/[account]/+page.svelte
@@ -164,15 +164,15 @@
 
   .meter-title {
     font-weight: 600;
-    font-size: 2em;
+    font-size: 1.5em;
     text-align: center;
     overflow: hidden;
     text-overflow: ellipsis;
   }
 
   .meter-text {
     color: #333;
-    font-size: 1.5em;
+    font-size: 1.25em;
   }
 
   .used, .avail {
@@ -193,7 +193,7 @@
   }
 
   .meter-graph {
-    max-width: 15rem;
+    max-width: 12rem;
     margin: 0 auto;
   }
 
@@ -236,13 +236,9 @@
   .stations {
     margin-top: 2rem;
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
     gap: 1rem;
   }
-  
-  .station {
-    background: #ddd;
-  }
 </style>
 
 <svelte:head>

diff --git a/front/app/src/routes/(root)/(online)/(app)/accounts/[account]/account-station-item.svelte b/front/app/src/routes/(root)/(online)/(app)/accounts/[account]/account-station-item.svelte
@@ -43,15 +43,17 @@
 
 <style>
   .station {
-    border-top: 1px var(--red) solid;
+    /* border-top: 1px var(--red) solid; */
     display: flex;
     flex-direction: row;
     align-items: center;
     background: #fff;
     box-shadow: var(--some-shadow);
+    border-radius: 0.35rem;
   }
 
   .pic {
+    flex: none;
     width: min(30%, 8rem);
     aspect-ratio: 1;
     margin: 1rem 2rem 1rem 1rem;
@@ -63,6 +65,12 @@
   
   .name {
     font-size: 1.1rem;
+    margin-inline-end: 1rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
   }
 
   .now-playing {

diff --git a/front/share/src/Map/StationSelector.svelte b/front/share/src/Map/StationSelector.svelte
@@ -20,8 +20,6 @@
 <script lang="ts">
   export let data: Data;
 
-  $: console.log({ data });
-
 	import type { Stats } from "$share/Map/StatsMap.svelte";
 	import { click_out } from "$share/actions";
 	import { _get, _patch, action } from "$share/net.client";