From 96036e58bf48244c48d22f4bc07cad0c1d75d980 Mon Sep 17 00:00:00 2001
From: Joe <49767913+joebudi@users.noreply.github.com>
Date: Fri, 5 Feb 2021 10:32:10 +0000
Subject: [PATCH] I emphasized the naming of a query

Label text added and made semi-bold
Removed placeholder text
---
 .../src/components/integration/QueryViewer.svelte | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/components/integration/QueryViewer.svelte b/packages/builder/src/components/integration/QueryViewer.svelte
index 77f6d51476..0f38f7650f 100644
--- a/packages/builder/src/components/integration/QueryViewer.svelte
+++ b/packages/builder/src/components/integration/QueryViewer.svelte
@@ -132,7 +132,8 @@
 
 <header>
   <div class="input">
-    <Input placeholder="✎ Edit Query Name" bind:value={query.name} />
+    <div class="label">Enter query name:</div>
+    <Input outline border bind:value={query.name} />
   </div>
   {#if config}
     <div class="props">
@@ -216,7 +217,9 @@
 
 <style>
   .input {
-    width: 300px;
+    width: 500px;
+    display: flex;
+    align-items: center;
   }
 
   .select {
@@ -288,4 +291,12 @@
     margin-top: -28px;
     z-index: -2;
   }
+
+  .label {
+    font-family: var(--font-sans);
+    color: var(--grey-8);
+    font-size: var(--font-size-s);
+    margin-right: 8px;
+    font-weight: 600;
+  }
 </style>