fixes #5: add tooltips here and there

This commit is contained in:
Davide Alberani 2017-01-17 19:10:30 +01:00
parent 56054be3a6
commit 47d34f805a
2 changed files with 16 additions and 4 deletions

View file

@ -14,6 +14,7 @@
<md-list-item class="attendee-add"> <md-list-item class="attendee-add">
<md-icon>person_add</md-icon> <md-icon>person_add</md-icon>
<md-input-container class="new-attendee"> <md-input-container class="new-attendee">
<label>new attendee</label>
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(group.group, newAttendee)" v-model="newAttendee" class="attendee-add-name" /> <md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(group.group, newAttendee)" v-model="newAttendee" class="attendee-add-name" />
</md-input-container> </md-input-container>
</md-list-item> </md-list-item>
@ -23,7 +24,7 @@
<md-card v-if="addNewGroup" md-with-hover @mouseenter.native="focusToNewGroup()" md-align="start"> <md-card v-if="addNewGroup" md-with-hover @mouseenter.native="focusToNewGroup()" md-align="start">
<md-card-header class="new-group-header"> <md-card-header class="new-group-header">
<div class="md-title"> <div class="md-title">
<md-input-container class="new-group"> <md-input-container class="new-group" md-inline>
<md-icon>create_new_folder</md-icon>&nbsp;&nbsp;<md-input ref="newGroup" v-model="newGroup" @keyup.enter.native="focusToNewAttendee()" class="group-add-name" placeholder="new group" /> <md-icon>create_new_folder</md-icon>&nbsp;&nbsp;<md-input ref="newGroup" v-model="newGroup" @keyup.enter.native="focusToNewAttendee()" class="group-add-name" placeholder="new group" />
</md-input-container> </md-input-container>
</div> </div>
@ -32,7 +33,8 @@
<md-list v-show="newGroup"> <md-list v-show="newGroup">
<md-list-item class="attendee-add"> <md-list-item class="attendee-add">
<md-icon>person_add</md-icon> <md-icon>person_add</md-icon>
<md-input-container md-inline> <md-input-container>
<label>new attendee</label>
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(newGroup, newAttendee)" v-model="newAttendee" class="attendee-add-name" /> <md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(newGroup, newAttendee)" v-model="newAttendee" class="attendee-add-name" />
</md-input-container> </md-input-container>
</md-list-item> </md-list-item>

View file

@ -1,39 +1,49 @@
<template> <template>
<md-toolbar id="toolbar" class="md-dense"> <md-toolbar id="toolbar" class="md-dense">
<span v-if="currentPath == 'user'"> <span v-if="currentPath != 'home' && currentPath != 'day' && currentPath != 'days'">
<md-button class="md-icon-button" @click="goBack()"> <md-button class="md-icon-button" @click="goBack()">
<md-tooltip md-direction="right">back</md-tooltip>
<md-icon>backspace</md-icon>&nbsp; <md-icon>backspace</md-icon>&nbsp;
</md-button> </md-button>
</span> </span>
<span v-else class="button-spacer">&nbsp;</span> <span v-else class="button-spacer">&nbsp;</span>
<h2 id="toolbar-title" class="md-title"><router-link :to="{name: 'home'}" class="home-link">ibt2</router-link></h2> <h2 id="toolbar-title" class="md-title">
<router-link :to="{name: 'home'}" class="home-link">ibt2</router-link>
</h2>
<span v-if="loggedInUser.username"> <span v-if="loggedInUser.username">
<md-button v-if="loggedInUser.isAdmin" id="users-icon" class="md-icon-button" @click="toUsersPage()"> <md-button v-if="loggedInUser.isAdmin" id="users-icon" class="md-icon-button" @click="toUsersPage()">
<md-tooltip md-direction="left">list of users</md-tooltip>
<md-icon>people_outline</md-icon> <md-icon>people_outline</md-icon>
</md-button> </md-button>
<md-button id="logged-in-icon" class="md-icon-button" @click="toUserPage()"> <md-button id="logged-in-icon" class="md-icon-button" @click="toUserPage()">
<md-tooltip md-direction="left">personal page</md-tooltip>
<md-icon>person_pin</md-icon> <md-icon>person_pin</md-icon>
</md-button> </md-button>
<span id="logged-in" class="md-subheading"> <span id="logged-in" class="md-subheading">
<router-link :to="userUrl" class="username-link">{{ loggedInUser.username }}</router-link> <router-link :to="userUrl" class="username-link">{{ loggedInUser.username }}</router-link>
</span> </span>
<md-button id="logout-icon" class="md-icon-button" @click="logout()"> <md-button id="logout-icon" class="md-icon-button" @click="logout()">
<md-tooltip md-direction="left">logout</md-tooltip>
<md-icon>exit_to_app</md-icon> <md-icon>exit_to_app</md-icon>
</md-button> </md-button>
</span> </span>
<span v-else> <span v-else>
<md-button v-show="!showLoginForm" class="md-icon-button" @click="focusToLoginForm()"> <md-button v-show="!showLoginForm" class="md-icon-button" @click="focusToLoginForm()">
<md-tooltip md-direction="left">login or create a new user</md-tooltip>
<md-icon>power_settings_new</md-icon> <md-icon>power_settings_new</md-icon>
</md-button> </md-button>
<span v-show="showLoginForm" id="login-form"> <span v-show="showLoginForm" id="login-form">
<md-input-container id="username-input" class="login-input" md-inline> <md-input-container id="username-input" class="login-input" md-inline>
<md-tooltip md-direction="bottom">login name or create a new user if it doesn't exist</md-tooltip>
<md-input ref="usernameInput" @keyup.enter.native="focusToPassword()" v-model="username" placeholder="username" md-inline /> <md-input ref="usernameInput" @keyup.enter.native="focusToPassword()" v-model="username" placeholder="username" md-inline />
</md-input-container>&nbsp; </md-input-container>&nbsp;
<span id="password-block"> <span id="password-block">
<md-input-container id="password-input" class="login-input" md-has-password md-inline> <md-input-container id="password-input" class="login-input" md-has-password md-inline>
<md-tooltip md-direction="bottom">login password or create a new user if it doesn't exist</md-tooltip>
<md-input ref="passwordInput" @keyup.enter.native="login()" v-model="password" placeholder="password" type="password" md-line /> <md-input ref="passwordInput" @keyup.enter.native="login()" v-model="password" placeholder="password" type="password" md-line />
</md-input-container> </md-input-container>
<md-button id="login-button" class="md-icon-button" @click="login()"> <md-button id="login-button" class="md-icon-button" @click="login()">
<md-tooltip md-direction="left">login or create a new user if it doesn't exist</md-tooltip>
<md-icon>play_circle_outline</md-icon> <md-icon>play_circle_outline</md-icon>
</md-button> </md-button>
</span> </span>