17th-Ranger-Battalion-ORG/17th-Site-Front-End-V2
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

I dont know what this change does but it affects pingable text box

Browse Source
This commit is contained in:
ajdj100
2024-01-13 13:21:49 -05:00
parent d8b9948cb5
commit cb0d09436c
1 changed files with 10 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
17th Website/src/components/inputs/pingableTextBox.vue
View File

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