Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

style calendar list

Browse source
This commit is contained in:
Felix Niklas 2015-09-17 14:19:30 +02:00
parent f08e6341c6
commit fbcbfd4a55
2 changed files with 74 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
app/assets/javascripts/app/views/calendar/index.jst.eco
View file

@ -19,42 +19,47 @@
<div class="action" data-id="<%- calendar.id %>"> <div class="action" data-id="<%- calendar.id %>">
<div class="action-flow"> <div class="action-flow">
<div class="action-block"> <div class="action-block">
<h3><span title="Last iCal Feed sync at: <%= calendar.last_sync %>: <%= calendar.last_log %>"><%- @Icon('status', 'ok inline') %></span> <%= calendar.name %></h3> <h2><span title="Last iCal Feed sync at: <%= calendar.last_sync %>: <%= calendar.last_log %>"><%- @Icon('status', 'ok inline') %></span> <%= calendar.name %></h2>
<%- @T('Timezone') %>: <%= calendar.timezone %>
</div> </div>
<div class="action-block"> <div class="action-separator"></div>
<%- @T('Business Hours') %>:<br> <div class="action-flow">
<table class="table table-fluid"> <div class="action-row">
<tr> <div class="label"><%- @T('Timezone') %></div> <%= calendar.timezone %>
<td><%- @T('Monday') %></td><td><% if _.isEmpty(calendar.business_hours['mon']): %>-<% else: %><% for from, till of calendar.business_hours['mon']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </div>
</tr> <div class="action-block">
<tr> <div class="label"><%- @T('Business Hours') %></div>
<td><%- @T('Tuesday') %></td><td><% if _.isEmpty(calendar.business_hours['tue']): %>-<% else: %><% for from, till of calendar.business_hours['tue']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> <table class="table table-fluid">
</tr> <tr>
<tr> <td><%- @T('Monday') %></td><td><% if _.isEmpty(calendar.business_hours['mon']): %>-<% else: %><% for from, till of calendar.business_hours['mon']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<td><%- @T('Wednesday') %></td><td><% if _.isEmpty(calendar.business_hours['wed']): %>-<% else: %><% for from, till of calendar.business_hours['wed']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </tr>
</tr> <tr>
<tr> <td><%- @T('Tuesday') %></td><td><% if _.isEmpty(calendar.business_hours['tue']): %>-<% else: %><% for from, till of calendar.business_hours['tue']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<td><%- @T('Thursday') %></td><td><% if _.isEmpty(calendar.business_hours['thu']): %>-<% else: %><% for from, till of calendar.business_hours['thu']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </tr>
</tr> <tr>
<tr> <td><%- @T('Wednesday') %></td><td><% if _.isEmpty(calendar.business_hours['wed']): %>-<% else: %><% for from, till of calendar.business_hours['wed']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<td><%- @T('Friday') %></td><td><% if _.isEmpty(calendar.business_hours['fri']): %>-<% else: %><% for from, till of calendar.business_hours['fri']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </tr>
</tr> <tr>
<tr> <td><%- @T('Thursday') %></td><td><% if _.isEmpty(calendar.business_hours['thu']): %>-<% else: %><% for from, till of calendar.business_hours['thu']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<td><%- @T('Saturday') %></td><td><% if _.isEmpty(calendar.business_hours['sat']): %>-<% else: %><% for from, till of calendar.business_hours['sat']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </tr>
</tr> <tr>
<tr> <td><%- @T('Friday') %></td><td><% if _.isEmpty(calendar.business_hours['fri']): %>-<% else: %><% for from, till of calendar.business_hours['fri']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<td><%- @T('Sunday') %></td><td><% if _.isEmpty(calendar.business_hours['sun']): %>-<% else: %><% for from, till of calendar.business_hours['sun']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td> </tr>
</tr> <tr>
</table> <td><%- @T('Saturday') %></td><td><% if _.isEmpty(calendar.business_hours['sat']): %>-<% else: %><% for from, till of calendar.business_hours['sat']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
</div> </tr>
<div class="action-block"> <tr>
<%- @T('Public Holidays') %>: <td><%- @T('Sunday') %></td><td><% if _.isEmpty(calendar.business_hours['sun']): %>-<% else: %><% for from, till of calendar.business_hours['sun']: %><%= from %>-<%= till %> </td><td><% end %><% end %></td>
<table class="table table-fluid"> </tr>
<% for holiday, meta of calendar.public_holidays_preview: %> </table>
<tr <% if !meta.active: %>class="is-inactive"<% end %>><td><%- @Tdate(holiday) %></td><td><%= meta.summary %></td></tr> </div>
<% end %> <div class="action-block">
</table> <div class="label"><%- @T('Public Holidays') %></div>
<table class="table table-fluid">
<% for holiday, meta of calendar.public_holidays_preview: %>
<tr <% if !meta.active: %>class="is-inactive"<% end %>><td><%- @Tdate(holiday) %></td><td><%= meta.summary %></td></tr>
<% end %>
</table>
</div>
</div> </div>
</div> </div>
<div class="action-controls"> <div class="action-controls">

39
app/assets/stylesheets/zammad.css.scss
View file

@ -581,14 +581,14 @@ table {
.table > tbody > tr > td { .table > tbody > tr > td {
padding: 9px; padding: 9px;
border: none; border: none;
box-shadow: 0 1px rgba(0,0,0,.02); box-shadow: 0 1px rgba(0,0,0,.03);
} }
.table-hover > tbody > tr:hover > td { .table-hover > tbody > tr:hover > td {
background: white; background: white;
box-shadow: box-shadow:
0 1px rgba(0,0,0,.02), 0 1px rgba(0,0,0,.03),
0 -1px rgba(0,0,0,.02); 0 -1px rgba(0,0,0,.03);
} }
.table-hover > tbody > tr:hover > th { .table-hover > tbody > tr:hover > th {
@ -1861,7 +1861,8 @@ ol.tabs li {
fill: $ok-color; fill: $ok-color;
&.inline { &.inline {
margin: 2px 2px 0 0; margin-top: -3px;
vertical-align: middle;
} }
&.ok { &.ok {
@ -6099,11 +6100,38 @@ output {
.action-flow { .action-flow {
display: flex; display: flex;
flex-wrap: wrap;
}
.action-separator {
width: 1px;
background: hsl(0,0%,97%);
margin: 0 10px;
}
.table {
margin-left: -9px;
margin-right: -9px;
} }
.action-block, .action-block,
.action-controls { .action-controls,
.action-row {
padding: 10px; padding: 10px;
h2:first-child,
h3:first-child {
margin-top: 0;
}
h2:only-child,
h3:only-child {
margin-bottom: 0;
}
}
.action-row {
flex-basis: 100%;
} }
h3 { h3 {
@ -6124,6 +6152,7 @@ output {
.action-controls { .action-controls {
display: flex; display: flex;
margin-left: auto; margin-left: auto;
align-self: flex-end;
.btn { .btn {
align-self: center; align-self: center;