From cb0d09436c62a31f0e4ad90cdde6c8acf11c2bff Mon Sep 17 00:00:00 2001
From: ajdj100 <AJCampbell@conestogac.on.ca>
Date: Sat, 13 Jan 2024 13:21:49 -0500
Subject: [PATCH] I dont know what this change does but it affects pingable
 text box

---
 .../src/components/inputs/pingableTextBox.vue      | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/17th Website/src/components/inputs/pingableTextBox.vue b/17th Website/src/components/inputs/pingableTextBox.vue
index dcdeeb5..e1b6242 100644
--- a/17th Website/src/components/inputs/pingableTextBox.vue	
+++ b/17th Website/src/components/inputs/pingableTextBox.vue	
@@ -38,6 +38,8 @@ export default {
             } else if(this.search.length > 0) {
                 this.filter();
                 this.isOpen = true;
+            } else if (this.results.length <= 2) {
+                this.isOpen(false);
             } else {
                 this.isOpen = false;
             }
@@ -90,9 +92,10 @@ export default {
 <template>
     <div class="relative">
         <input type="text" v-model="search" @input="onchange" @keydown.down="bumpDown" @keydown.up="bumpUp"
-            @keydown.enter="select" @keydown.tab="select" :class="{}"
-            class="bg-gray-light rounded-md text-white focus:outline-none p-1 px-2"/>
-        <ul id="results" v-show="isOpen">
+            @keydown.enter="select" @keydown.tab="select" spellcheck="false"
+            class="bg-gray-light rounded-md text-white focus:outline-none p-1 px-2" 
+            :class="{'outline outline-1 outline-blue':items.includes(search), 'outline outline-1 outline-red-500':!items.includes(search) && search != ''}"/>
+        <ul id="results" v-show="isOpen" class="shadow-2xl">
             <li class="result" v-for="(result, i) in results" :key="i" @click="setResult(result)"
                 :class="{ 'is-active': i === arrowCounter }">
                 {{ result }}
@@ -106,11 +109,13 @@ export default {
     position: absolute;
     padding: 0;
     margin: 0;
-    border: 1px solid #eeeeee;
+    /* border: 1px solid #eeeeee; */
     height: max-content;
     /* min-height: 1em;
     max-height: 6em; */
     overflow: auto;
+    border-radius: 5px;
+    
 }
 
 .result {
@@ -118,6 +123,7 @@ export default {
     text-align: left;
     padding: 4px 2px;
     cursor: pointer;
+    background-color: #272731;
 }
 
 .result.is-active,