Oneric/akkoma-fe
1
0
Fork 0
forked from AkkomaGang/akkoma-fe
Code Pull requests Activity

Merge branch 'fix/polish-user-finder-and-nav-buttons' into 'develop'

Browse source 
Fix/polish user finder and nav buttons

See merge request pleroma/pleroma-fe!132
This commit is contained in:
lambda 2017-11-08 10:44:24 +00:00
commit 37f5e0d8b6
3 changed files with 18 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/App.scss
View file

@ -69,6 +69,12 @@ button{
flex: 1; flex: 1;
line-height: 21px; line-height: 21px;
height: 21px; height: 21px;
overflow: hidden;
.nav-icon {
font-size: 1.1em;
margin-left: 0.4em;
}
} }
.gaps > .item { .gaps > .item {

6
src/App.vue
View file

@ -6,9 +6,9 @@
<router-link :to="{ name: 'root'}">{{sitename}}</router-link> <router-link :to="{ name: 'root'}">{{sitename}}</router-link>
</div> </div>
<div class='item right'> <div class='item right'>
<user-finder></user-finder> <user-finder class="nav-icon"></user-finder>
<router-link :to="{ name: 'settings'}"><i class="icon-cog"></i></router-link> <router-link :to="{ name: 'settings'}"><i class="icon-cog nav-icon"></i></router-link>
<a href="#" v-if="currentUser" @click.prevent="logout"><i class="icon-logout" title="Logout" ></i></a> <a href="#" v-if="currentUser" @click.prevent="logout"><i class="icon-logout nav-icon" title="Logout" ></i></a>
</div> </div>
</div> </div>
</nav> </nav>

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

@ -1,14 +1,14 @@
<template> <template>
<span> <span class="user-finder-container">
<span class="finder-error base05" v-if="error"> <span class="finder-error base05" v-if="error">
<i class="icon-cancel user-finder-icon" @click="dismissError"/> <i class="icon-cancel user-finder-icon" @click="dismissError"/>
Error fetching user Error fetching user
</span> </span>
<i class="icon-spin4 user-finder-icon animate-spin-slow" v-if="loading" /> <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> <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"/> <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>
</span> </span>
</template> </template>
@ -16,8 +16,12 @@
<script src="./user_finder.js"></script> <script src="./user_finder.js"></script>
<style lang="scss"> <style lang="scss">
.user-finder-container {
height: 21px;
max-width: 100%;
}
.user-finder-icon { .user-finder-icon {
margin-right: 0.25em;
} }
.user-finder-input { .user-finder-input {
@ -25,6 +29,7 @@
border-style: solid; border-style: solid;
border-color: inherit; border-color: inherit;
border-radius: 5px; border-radius: 5px;
max-width: 80%;
padding: 0.1em 0.2em 0.2em 0.2em; padding: 0.1em 0.2em 0.2em 0.2em;
} }