From 092d2bdeefb18f8439a22399fa241430e32b59e1 Mon Sep 17 00:00:00 2001
From: Oceanity <github@oceanity.net>
Date: Mon, 15 Jul 2024 13:21:48 -0400
Subject: [PATCH] Fixed up menu position and some styles on input fields (#76)

---
 src/firebot/effects/spotifyCancelUserQueuesEffect.ts |  3 ++-
 .../effects/spotifyChangePlaybackVolumeEffect.ts     |  4 ++--
 .../effects/spotifyFindAndEnqueueTrackEffect.ts      | 12 ++++++------
 src/firebot/effects/spotifySeekToPositionEffect.ts   |  6 +++++-
 4 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/firebot/effects/spotifyCancelUserQueuesEffect.ts b/src/firebot/effects/spotifyCancelUserQueuesEffect.ts
index f12d3c7..88d9d83 100644
--- a/src/firebot/effects/spotifyCancelUserQueuesEffect.ts
+++ b/src/firebot/effects/spotifyCancelUserQueuesEffect.ts
@@ -40,7 +40,8 @@ export const SpotifyCancelUserQueuesEffect: Firebot.EffectType<EffectParams> = {
         <firebot-input
           input=title="Username"
           model="effect.username"
-          placeholder-text="Username of user to cancel queues for, or blank to effect entire queue" />
+          placeholder-text="Username of user to cancel queues for, or blank to effect entire queue"
+          menu-position="under" />
       </eos-container>
       <eos-container header="Tracks to Cancel" pad-top="true">
         <dropdown-select options="amountOptions" selected="effect.amount"></dropdown-select>
diff --git a/src/firebot/effects/spotifyChangePlaybackVolumeEffect.ts b/src/firebot/effects/spotifyChangePlaybackVolumeEffect.ts
index b537846..eed116b 100644
--- a/src/firebot/effects/spotifyChangePlaybackVolumeEffect.ts
+++ b/src/firebot/effects/spotifyChangePlaybackVolumeEffect.ts
@@ -31,9 +31,9 @@ export const SpotifyChangePlaybackVolumeEffect: Firebot.EffectType<EffectParams>
     optionsTemplate: `
         <eos-container header="Playback Volume" pad-top="true">
           <firebot-input 
-            input-title="Volume"
             model="effect.volume" 
-            placeholder-text="Enter number between 0 - 100" />
+            placeholder-text="Enter number between 0 - 100"
+            menu-position="under" />
         </eos-container>
       `,
 
diff --git a/src/firebot/effects/spotifyFindAndEnqueueTrackEffect.ts b/src/firebot/effects/spotifyFindAndEnqueueTrackEffect.ts
index cb13e42..1d355bc 100644
--- a/src/firebot/effects/spotifyFindAndEnqueueTrackEffect.ts
+++ b/src/firebot/effects/spotifyFindAndEnqueueTrackEffect.ts
@@ -51,15 +51,15 @@ export const SpotifyFindAndEnqueueTrackEffect: Firebot.EffectType<EffectParams>
     optionsTemplate: `
         <eos-container header="Queued By (Optional)" pad-top="true">
           <firebot-input 
-            input-title="Queued by"
             model="effect.queuedBy" 
-            placeholder-text="Username of user who queued the track" />
+            placeholder-text="Username of user who queued the track"
+            menu-position="under" />
         </eos-container>
-        <eos-container header="Track Info" pad-top="true">
-          <firebot-input 
-            input-title="Search"
+        <eos-container header="Search" pad-top="true">
+          <firebot-input
             model="effect.query" 
-            placeholder-text="Search query or link to track to add to your Spotify Queue" />
+            placeholder-text="Search query or link to track to add to your Spotify Queue"
+            menu-position="under" />
           <div style="display: flex; flex-direction: column; margin: 15px 0 0px;">
             <firebot-checkbox
               label="Exclude explicit tracks"
diff --git a/src/firebot/effects/spotifySeekToPositionEffect.ts b/src/firebot/effects/spotifySeekToPositionEffect.ts
index 1216697..485c7e8 100644
--- a/src/firebot/effects/spotifySeekToPositionEffect.ts
+++ b/src/firebot/effects/spotifySeekToPositionEffect.ts
@@ -29,7 +29,11 @@ export const SpotifySeekToPositionEffect: Firebot.EffectType<EffectParams> = {
 
   optionsTemplate: `
     <eos-container header="Seek Position" pad-top="true">
-      <input ng-model="effect.seekPosition" class="form-control" type="text" placeholder="Seek position (Number in miliseconds)" replace-variables menu-position="below">
+      <firebot-input
+        model="effect.seekPosition"
+        input-title="Seek position"
+        placeholder-text="Enter position in miliseconds"
+        menu-position="under" />
     </eos-container>
   `,