Design fixes

- Gap between columns
- Click on icon more closes the menu
- Fixed select height
- Focus input on new user click
- Cursor fix on select

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv) 2018-05-10 17:05:05 +02:00
parent b2389d0f01
commit 170746dada
No known key found for this signature in database
GPG Key ID: 60C25B8C072916CF
6 changed files with 167 additions and 154 deletions

View File

@ -633,7 +633,8 @@ input {
&.multiselect--active {
/* Opened: force display the input */
input.multiselect__input {
opacity: 1 !important;
opacity: 1 !important;
cursor: text !important;
}
}
&.multiselect--disabled,
@ -648,7 +649,7 @@ input {
cursor: pointer;
position: relative;
border-radius: 3px;
height: 38px;
height: 34px;
/* tag wrapper */
.multiselect__tags-wrap {
align-items: center;
@ -707,7 +708,9 @@ input {
height: 100%;
border: none;
/* override hide to force show the placeholder */
display: block !important;
display: block !important;
/* only when not active */
cursor: pointer;
}
}
/* results wrapper */

View File

@ -1281,8 +1281,10 @@ doesnotexist:-o-prefocus, .strengthify-wrapper {
grid-auto-rows: $grid-row-height;
grid-column-gap: 20px;
.row {
// TODO replace with css4 subgrid when available
display: grid;
grid-row-start: span 1;
grid-gap: 3px;
align-items: center;
/* let's define the column until storage path,
what follows will be manually defined */

File diff suppressed because one or more lines are too long

View File

@ -160,7 +160,7 @@ export default {
let disabledUsers = this.users.filter(user => user.enabled !== true);
if (disabledUsers.length===0 && this.$refs.infiniteLoading && this.$refs.infiniteLoading.isComplete) {
// disabled group is empty, redirection to all users
this.$router.push('users');
this.$router.push('/settings/users');
this.$refs.infiniteLoading.$emit('$InfiniteLoading:reset');
}
return disabledUsers;

View File

@ -73,7 +73,7 @@
</div>
<div class="userActions">
<div class="toggleUserActions" v-if="OC.currentUser !== user.id && user.id !== 'admin' && !loading.all">
<div class="icon-more" v-click-outside="hideMenu" @click="showMenu"></div>
<div class="icon-more" v-click-outside="hideMenu" @click="toggleMenu"></div>
<div class="popovermenu" :class="{ 'open': openedMenu }">
<popover-menu :menu="userActions" />
</div>
@ -196,8 +196,8 @@ export default {
},
methods: {
/* MENU HANDLING */
showMenu() {
this.openedMenu = true;
toggleMenu() {
this.openedMenu = !this.openedMenu;
},
hideMenu() {
this.openedMenu = false;

View File

@ -81,6 +81,14 @@ export default {
}
},
methods: {
toggleNewUserMenu() {
this.showConfig.showNewUserForm = !this.showConfig.showNewUserForm;
if (this.showConfig.showNewUserForm) {
Vue.nextTick(() => {
window.newusername.focus();
});
}
},
getLocalstorage(key) {
// force initialization
let localConfig = this.$localStorage.get(key);
@ -287,7 +295,7 @@ export default {
id:'new-user-button',
text: t('settings','New user'),
icon: 'icon-add',
action: () => this.showConfig.showNewUserForm=!this.showConfig.showNewUserForm
action: this.toggleNewUserMenu
},
items: groups
}