Merge pull request #155 from alberanid/master

improve GUI buttons
This commit is contained in:
Davide Alberani 2016-07-17 11:44:36 +02:00 committed by GitHub
commit 9b03d72caa
6 changed files with 33 additions and 19 deletions

View file

@ -55,18 +55,18 @@
<p ng-if="ticket.company || ticket.job_title"><i ng-if="ticket.job_title">{{ticket.job_title}}</i><span ng-if="ticket.company && ticket.job_title">&nbsp;@&nbsp;</span><i ng-if="ticket.company">{{ticket.company}}</i></p>
</td>
<td class="text-center">
<button class="btn btn-link" reset-focus name="switch-attended" ng-click="setTicketAttributeAndRefocus(ticket, 'attended', !ticket.attended)"><span class="fa fa-lg {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span></button>
<button class="btn btn-link" reset-focus name="switch-attended" ng-click="setTicketAttributeAndRefocus(ticket, 'attended', !ticket.attended)"><span class="fa {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span></button>
</td>
<td class="text-center" ng-repeat="col in customFields">
<span ng-if="col.type == 'boolean'">
<button class="btn btn-link" ng-click="setTicketAttribute(ticket, col.key, !ticket[col.key])"><span class="fa fa-lg {{(ticket[col.key]) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span></button>
<button class="btn btn-link" ng-click="setTicketAttribute(ticket, col.key, !ticket[col.key])"><span class="fa {{(ticket[col.key]) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span></button>
</span>
<span ng-if="col.type != 'boolean'">
{{ticket[col.key]}}
</span>
</td>
<td class="text-center">
<button ng-click="deleteTicket(ticket)" type="button" class="btn btn-link fa fa-lg fa-trash"></button>
<button ng-click="deleteTicket(ticket)" type="button" class="btn btn-link fa fa-trash"></button>
</td>
</tr>
</tbody>
@ -94,7 +94,7 @@
{{person.email}}
</td>
<td class="text-left">
<button reset-focus ng-click="addTicket(person)" type="button" class="btn btn-link fa fa-plus-circle vcenter"></button>
<button reset-focus ng-click="addTicket(person)" type="button" class="btn btn-link fa fa-user-plus vcenter"></button>
</td>
</tr>
</tbody>

View file

@ -32,29 +32,34 @@
<tr>
<th><strong>{{'Event' | translate}}</strong></th>
<th ng-if="hasPermission('event|update')" class="hcenter"><strong>{{'Attendees / Registered' | translate}}</strong></th>
<th><strong>{{'Actions' | translate}}</strong></th>
<th class="hcenter"><strong>{{'Actions' | translate}}</strong></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="event in events | splittedFilter:query | orderBy:eventsOrderProp">
<td>
<span>
<strong>
<td class="vtop">
<span class="vtop">
<h2 class="vtop">
<a ui-sref="event.edit({id: event._id})" ng-if="hasPermission('event|update')">{{event.title}}</a>
<a ui-sref="event.view({id: event._id})" ng-if="!hasPermission('event|update')">{{event.title}}</a>
</strong>
</h2>
</span>
<p><span ng-if="event['begin-date']">{{'Begins:' | translate}} {{event['begin-date'] | date:'fullDate'}} {{event['begin-time'] | date:'HH:mm'}}<br/></span>
<span ng-if="event['end-date']">{{'Ends:' | translate}} {{event['end-date'] | date:'fullDate' }} {{event['end-time'] | date:'HH:mm'}}</span></p>
<div ng-if="event.tagline"><em>{{event.tagline}}</em></div>
<div ng-if="event.summary"><em>{{event.summary}}</em></div>
<div ng-if="event['begin-date'] || event['end-date'] || event.where" class="top5">
<div ng-if="event.where">{{event.where}}</div>
<span ng-if="event['begin-date']">{{'Begins:' | translate}} {{event['begin-date'] | date:'fullDate'}} {{event['begin-time'] | date:'HH:mm'}}<br/></span>
<span ng-if="event['end-date']">{{'Ends:' | translate}} {{event['end-date'] | date:'fullDate' }} {{event['end-time'] | date:'HH:mm'}}</span>
</div>
</td>
<td ng-if="hasPermission('event:tickets-all|read')" class="hcenter">
<p><span ng-init="attendeesNr = ((event.tickets || []) | attendeesFilter).length">{{attendeesNr}}</span> / {{((event.tickets || []) | registeredFilter).length}} ({{((attendeesNr / ((event.tickets || []) | registeredFilter).length * 100) || 0).toFixed()}}%)</p>
</td>
<td>
<button ng-if="hasPermission('event:tickets-all|create')" ng-click="$state.go('event.ticket.new', {id: event._id})" class="btn btn-link fa fa-user-plus" type="button" title="{{'Join this event' | translate}}"></button>
<button ng-if="hasPermission('ticket|update')" ng-click="$state.go('event.tickets', {id: event._id})" class="btn btn-link fa fa-ticket" type="button" title="{{'Manage tickets' | translate}}"></button>
<button ng-if="hasPermission('event|update')" ng-click="$state.go('event.edit', {id: event._id})" type="button" class="btn btn-link fa fa-cog fa-lg" title="{{'Edit' | translate}}"></button>
<button ng-if="hasPermission('event|delete')" ng-click="deleteEvent(event._id)" type="button" class="btn btn-link fa fa-trash fa-lg" title="{{'Delete' | translate}}"></button>
<div ng-if="hasPermission('event:tickets-all|create')" class="top5 hcenter"><button ng-click="$state.go('event.ticket.new', {id: event._id})" class="min150 btn btn-success" type="button" title="{{'Join this event' | translate}}"><span class="fa fa-user-plus vcenter"></span> {{'Join this event' | translate}}</button></div>
<div ng-if="hasPermission('ticket|update')" class="top5 hcenter"><button ng-click="$state.go('event.tickets', {id: event._id})" class="min150 btn btn-primary" type="button" title="{{'Manage tickets' | translate}}"><span class="fa fa-ticket"></span> {{'Manage tickets' | translate}}</button></div>
<div ng-if="hasPermission('event|update')" class="top5 hcenter"><button ng-click="$state.go('event.edit', {id: event._id})" type="button" class="min150 btn btn-warning" title="{{'Edit event' | translate}}"><span class="fa fa-cog"></span> {{'Edit event' | translate}}</button></div>
<div ng-if="hasPermission('event|delete')" class="top5 hcenter bottom5"><button ng-click="deleteEvent(event._id)" type="button" class="min150 btn btn-danger" title="{{'Delete event' | translate}}"><span class="fa fa-trash"></span> {{'Delete event' | translate}}</button></div>
</td>
</tr>
</tbody>

View file

@ -35,7 +35,7 @@
<a ui-sref="event.view({id: ticket.event_id})">{{ticket.event_title}}</a>
</td>
<td class="text-center">
<span class="fa fa-lg {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span>
<span class="fa {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span>
</td>
</tr>
</tbody>

View file

@ -63,7 +63,7 @@
</td>
<td><strong>{{ticket.event_title}}</strong></td>
<td class="text-center">
<span class="fa fa-lg {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span>
<span class="fa {{(ticket.attended) && 'fa-check-circle text-success' || 'fa-times-circle text-danger'}}"></span>
</td>
</tr>
</tbody>

View file

@ -45,7 +45,7 @@
</span>
</td>
<td>
<button ng-if="hasPermission('user|delete')" ng-click="deleteUser(user._id)" type="button" class="btn btn-link fa fa-trash fa-lg" title="{{'Delete' | translate}}"></button>
<button ng-if="hasPermission('user|delete')" ng-click="deleteUser(user._id)" type="button" class="btn btn-danger" title="{{'Delete' | translate}}"><span class="fa fa-trash"></span> {{'Delete' | translate}}</button>
</td>
</tr>
</tbody>

View file

@ -33,6 +33,11 @@ input[type=text].form-control, input[type=search].form-control {
.top15 { margin-top: 15px; }
.top20 { margin-top: 20px; }
.top30 { margin-top: 30px; }
.bottom5 { margin-bottom: 5px; }
.bottom10 { margin-bottom: 10px; }
.bottom15 { margin-bottom: 15px; }
.bottom20 { margin-bottom: 20px; }
.bottom30 { margin-bottom: 30px; }
/* minimum widths for various input groups */
.min50 { min-width: 50px; }
@ -49,13 +54,17 @@ input[type=text].form-control, input[type=search].form-control {
text-align: center;
}
/* vertically center */
/* vertical alignment */
.vcenter {
vertical-align: middle;
display: inline-block !important;
float: none;
}
.vtop {
vertical-align: top !important;
}
/* pop-up message */
.eventman-message {
position: fixed;