Disable symbol input. Move from grids to flexbox.

sebinside · Jan 17, 2024 · 7ea1054 · 7ea1054
1 parent 3a14ad4
commit 7ea1054
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/StreamAwesome/src/components/MainSettings.vue b/StreamAwesome/src/components/MainSettings.vue
@@ -8,12 +8,12 @@ const iconStore = useIconsStore()
 </script>
 
 <template>
-  <div class="grid grid-cols-3 gap-4">
-    <div style="max-width: 256px">
+  <div class="flex flex-row flex-wrap">
+    <div style="max-width: 256px" class="mr-7">
       <IconCanvas :icon="iconStore.currentIcon" class="mb-5 mt-5" />
       <IconSettings :icon="iconStore.currentIcon" />
     </div>
-    <div class="col-span-2">
+    <div class="flex-grow">
       <IconBrowser />
     </div>
   </div>

diff --git a/StreamAwesome/src/components/settings/IconSettings.vue b/StreamAwesome/src/components/settings/IconSettings.vue
@@ -28,10 +28,11 @@ function udpateHue(hue: number) {
       >Symbol:
     </label>
     <input
+      disabled
       id="iconSymbol"
       type="text"
       v-model="currentIcon.symbol"
-      class="block w-full rounded-lg border border-gray-300 bg-gray-50 p-2.5 text-sm text-gray-900 dark:border-gray-600 dark:bg-gray-700 dark:text-white dark:placeholder-gray-400"
+      class="block w-full rounded-lg border border-gray-300 bg-gray-50 p-2.5 text-sm text-gray-900 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-400 dark:placeholder-gray-400"
     />
   </div>
   <div class="mt-5">