therwi/sunkkoma
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Hide overflowing elements when userfinder is active. Don't scroll on button presses. Make buttons slightly bigger and more spaced out.

Browse source
This commit is contained in:
shpuld 2017-11-08 11:26:42 +02:00
parent e74e725750
commit bfa04bfb11
3 changed files with 18 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/user_finder/user_finder.vue
View file

@ -1,14 +1,14 @@
<template>
<span>
<span class="user-finder-container">
<span class="finder-error base05" v-if="error">
<i class="icon-cancel user-finder-icon" @click="dismissError"/>
Error fetching user
</span>
<i class="icon-spin4 user-finder-icon animate-spin-slow" v-if="loading" />
<a href="#" v-if="hidden"><i class="icon-user-plus user-finder-icon" @click.prevent="toggleHidden"/></a>
<a href="#" v-if="hidden"><i class="icon-user-plus user-finder-icon" @click.prevent.stop="toggleHidden"/></a>
<span v-else>
<input class="user-finder-input base03-border" @keyup.enter="findUser(username)" v-model="username" placeholder="Find user" id="user-finder-input" type="text"/>
<i class="icon-cancel user-finder-icon" @click="toggleHidden"/>
<i class="icon-cancel user-finder-icon" @click.prevent.stop="toggleHidden"/>
</span>
</span>
</template>
@ -16,8 +16,12 @@
<script src="./user_finder.js"></script>
<style lang="scss">
.user-finder-container {
height: 21px;
max-width: 100%;
}
.user-finder-icon {
margin-right: 0.25em;
}
.user-finder-input {
@ -25,6 +29,7 @@
border-style: solid;
border-color: inherit;
border-radius: 5px;
max-width: 80%;
padding: 0.1em 0.2em 0.2em 0.2em;
}