replace glyphicon edit icon with action button

and make the overview options a local modal
This commit is contained in:
Felix Niklas 2015-01-21 04:17:33 +01:00
parent 77020390ce
commit 28797b8c8c
4 changed files with 28 additions and 13 deletions

View file

@ -482,6 +482,7 @@ class Table extends App.ControllerContent
new App.OverviewSettings(
overview_id: @overview.id
view_mode: @view_mode
container: @el
)
class App.OverviewSettings extends App.ControllerModal

View file

@ -2,9 +2,12 @@
<div class="tableOverview flex scrollable">
<div class="horizontal">
<div class="page-header-title">
<h1><%- @T( @overview.name ) %> <% if @edit: %><small><a href="#" data-type="settings" class="glyphicon glyphicon-edit"></a></small><% end %></h1>
<h1><%- @T( @overview.name ) %></h1>
</div>
<div class="page-header-meta">
<% if @edit: %>
<div class="btn btn--action" data-type="settings"><%- @T('Options') %></div>
<% end %>
<ul class="pagination">
<% for item in @view_modes: %>
<li class="<%= item.class %>">

View file

@ -1,9 +1,10 @@
<div>
<div class="horizontal">
<div class="page-header-title">
<h1 class="can-move"><%- @T( @overview.name ) %> <small><a href="#" data-type="settings" class="glyphicon glyphicon-edit"></a></small></h1>
<h1 class="can-move"><%- @T( @overview.name ) %></h1>
</div>
<div class="page-header-meta horizontal">
<div class="page-header-meta">
<div class="btn btn--action" data-type="settings"><%- @T('Options') %></div>
<div class="pagination-counter">
<span class="pagination-items-range"><%- @items_from %>-<%- @items_till %></span> <%- @T("of") %> <span class="pagination-total-items"><%- @items_total %></span>
</div>

View file

@ -283,8 +283,8 @@ span[data-tooltip]:hover:before {
}
&.btn--action {
padding: 7px 11px 5px;
@extend label;
padding: 7px 11px 5px !important;
}
&.btn--primary {
@ -803,8 +803,8 @@ textarea,
.pagination > li > span {
padding: 0;
width: 31px;
height: 28px;
border-color: #ececec;
height: 31px;
border-color: #e5e5e5;
}
.pagination > .active > a,
@ -818,8 +818,8 @@ textarea,
}
.pagination-counter {
margin-right: 19px;
line-height: 28px;
margin: 0 19px 0 10px;
line-height: 33px;
color: #9c9c9b;
}
@ -840,12 +840,15 @@ textarea,
}
.page-header-meta {
margin-top: 5px;
margin-left: auto;
}
.page-header-meta.horizontal .pagination {
margin-top: 6px;
margin-left: auto;
@extend .horizontal;
@extend .justify;
@extend .self-start;
.btn {
margin: 0 9px 2px;
}
}
.dropdown-menu .count {
@ -5219,6 +5222,13 @@ body.fit {
align-items: flex-end;
}
.self-start {
-webkit-align-self: start;
-moz-align-self: start;
-ms-align-self: start;
align-self: start;
}
.two-columns,
.three-columns,
.wrap {