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

some sidebar work

Browse source
This commit is contained in:
Felix Niklas 2014-07-07 19:18:51 +02:00
parent a73c4bd586
commit 8158e1ce9e
18 changed files with 167 additions and 164 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/assets/images/sprite.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="72px" height="48px" viewBox="0 0 72 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<title>sprite</title>
<description>Created with Sketch (http://www.bohemiancoding.com/sketch)</description>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M12,3 C6.477,3 2,7.477 2,13 C2,18.521 6.477,23 12,23 C17.522,23 22,18.521 22,13 C22,7.477 17.522,3 12,3 L12,3 Z M11.522,4.898 L12.794,4.898 L12.794,7.393 L11.522,7.393 L11.522,4.898 Z M7.719,9.564 L5.953,7.8 L6.852,6.902 L8.617,8.667 L7.719,9.564 L7.719,9.564 Z M8.344,5.812 L9.496,5.277 L10.551,7.538 L9.399,8.074 L8.344,5.812 L8.344,5.812 Z M12.174,20.288 C11.071,20.288 10.174,19.39 10.174,18.286 C10.174,17.422 10.721,16.689 11.487,16.41 L11.487,10.701 L12.758,10.701 L12.758,16.371 C13.578,16.622 14.176,17.384 14.176,18.286 C14.176,19.39 13.28,20.288 12.174,20.288 L12.174,20.288 Z M13.664,7.535 L14.719,5.273 L15.871,5.812 L14.817,8.071 L13.664,7.535 L13.664,7.535 Z M16.459,9.564 L15.559,8.667 L17.324,6.902 L18.223,7.8 L16.459,9.564 L16.459,9.564 Z" id="Dashboard" fill="#F0FAFF" sketch:type="MSShapeGroup"></path>
<path d="M45.3328944,5.60631371 C45.3308944,5.35531371 45.3108944,5.09931371 45.2748944,4.84931371 C45.1998944,4.33731371 44.9348944,4.08931371 44.4168944,4.03431371 C44.2298944,4.01531371 44.0408944,4.00131371 43.8528944,4.00131371 C38.3998944,3.99931371 32.9468944,3.99931371 27.4928944,4.00331371 C27.2408944,4.00331371 26.9868944,4.03431371 26.7368944,4.07631371 C26.3468944,4.13831371 26.1258944,4.39131371 26.0628944,4.77331371 C26.0248944,5.00331371 26.0028944,5.24031371 26.0028944,5.47431371 C25.9988944,9.08131371 25.9998944,12.6893137 26.0008944,16.2963137 C26.0008944,16.3993137 26.0028944,16.5033137 26.0088944,16.6063137 C26.0568944,17.4113137 26.3448944,17.7043137 27.1528944,17.7193137 C28.2258944,17.7383137 29.2558944,17.7353137 30.3288944,17.7413137 C30.5548944,17.7433137 30.9998944,17.7413137 30.9998944,17.7413137 L30.9998944,18.0913137 C30.9998944,19.4193137 31.0418944,20.7463137 31.0458944,22.0763137 C31.0468944,22.3303137 30.9908944,22.6423137 31.2978944,22.7743137 C31.5978944,22.9033137 31.7948944,22.6513137 31.9848944,22.4773137 C33.6498944,20.9623137 35.3178944,19.4493137 36.9758944,17.9273137 C37.1278944,17.7883137 37.2808944,17.7383137 37.4818944,17.7393137 C39.5168944,17.7433137 41.5518944,17.7433137 43.5848944,17.7413137 C43.8398944,17.7413137 44.0958944,17.7313137 44.3488944,17.7083137 C44.9518944,17.6563137 45.2058944,17.4173137 45.2928944,16.8213137 C45.3188944,16.6363137 45.3328944,16.4463137 45.3328944,16.2593137 C45.3348944,12.7093137 45.3358944,9.15831371 45.3328944,5.60631371 L45.3328944,5.60631371 Z M28.9998944,7.86431371 L37.9998944,7.86431371 L37.9998944,9.86431371 L28.9998944,9.86431371 L28.9998944,7.86431371 Z M28.9998944,10.8643137 L41.9998944,10.8643137 L41.9998944,12.8643137 L28.9998944,12.8643137 L28.9998944,10.8643137 Z" id="Tickets" fill="#F0FAFF" sketch:type="MSShapeGroup"></path>
<path d="M54.131,9.224 L49.078,9.224 C48.805,9.224 48.176,9.876 48.176,10.151 L48.176,15.224 L50.176,15.224 L50.176,20.224 L53.176,20.224 L53.176,15.224 L54.176,15.224 L54.176,9.996 C54.176,9.798 54.352,9.224 54.131,9.224 Z M51.606,8.236 C52.693,8.236 53.576,7.352 53.576,6.267 C53.576,5.181 52.693,4.296 51.606,4.296 C50.52,4.296 49.635,5.181 49.635,6.267 C49.635,7.352 50.52,8.236 51.606,8.236 Z M71.16,9.224 L66.113,9.224 C65.84,9.224 65.176,9.877 65.176,10.151 L65.176,15.224 L67.176,15.224 L67.176,20.224 L70.176,20.224 L70.176,15.224 L71.176,15.224 L71.176,10.151 C71.176,9.877 71.435,9.224 71.16,9.224 Z M68.637,8.239 C69.723,8.239 70.605,7.355 70.605,6.271 C70.605,5.185 69.723,4.3 68.637,4.3 C67.553,4.3 66.668,5.185 66.668,6.271 C66.668,7.355 67.553,8.239 68.637,8.239 Z M60.107,6.739 C61.77,6.739 63.119,5.388 63.119,3.728 C63.119,2.065 61.77,0.714 60.107,0.714 C58.447,0.714 57.096,2.065 57.096,3.728 C57.096,5.388 58.447,6.739 60.107,6.739 Z M63.695,8.224 L56.518,8.224 C56.012,8.224 55.176,8.737 55.176,9.245 L55.176,16.224 L57.176,16.224 L57.176,24.224 L62.176,24.224 L62.176,16.224 L64.176,16.224 L64.176,9.245 C64.176,8.737 64.203,8.224 63.695,8.224 Z" id="Customers" fill="#F0FAFF" sketch:type="MSShapeGroup"></path>
<path d="M5.92009147,43.374 C3.47609147,43.358 1.50109147,41.359 1.51609147,38.916 C1.53409147,36.491 3.51809147,34.516 5.94709147,34.516 L5.97609147,34.516 C7.15809147,34.523 8.26709147,34.992 9.09709147,35.834 C9.92809147,36.674 10.3820915,37.791 10.3750915,38.974 C10.3650915,40.15 9.90309147,41.258 9.06709147,42.087 C8.23309147,42.917 7.12309147,43.374 5.94909147,43.374 L5.92009147,43.374 M5.98309147,33 L5.94509147,33 C2.68109147,33 0.0220914661,35.636 9.14660647e-05,38.907 C-0.0179085339,42.191 2.62309147,44.869 5.90709147,44.89 L5.94909147,44.89 C7.03809147,44.89 8.06209147,44.596 8.94009147,44.08 L12.5530915,47.695 L12.6450915,47.783 C12.7820915,47.92 12.9600915,47.988 13.1390915,47.988 C13.3180915,47.988 13.4970915,47.92 13.6330915,47.783 L14.7970915,46.622 C15.0690915,46.348 15.0690915,45.905 14.7970915,45.633 L14.7060915,45.54 L11.0880915,41.924 C11.5930915,41.058 11.8830915,40.056 11.8900915,38.983 C11.9140915,35.699 9.26709147,33.022 5.98309147,33" id="Search" fill-opacity="0.5" fill="#ECECEC" sketch:type="MSShapeGroup"></path>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 5.4 KiB

2
app/assets/javascripts/app/controllers/navigation.js.coffee
View file

@ -1,4 +1,6 @@
class App.Navigation extends App.Controller
className: 'navigation flex vertical'
constructor: ->
super
@render()

1
app/assets/javascripts/app/controllers/notify.js.coffee
View file

@ -1,5 +1,4 @@
class App.Notify extends Spine.Controller
className: 'container'
events:
'click .alert': 'destroy'

8
app/assets/javascripts/app/lib/app_post/interface_handle.js.coffee
View file

@ -22,13 +22,13 @@ class App.Run extends App.Controller
App.Auth.loginCheck()
# start navbars
@setupWidget( 'Navigations', 'nav', @el.find('nav') )
@setupWidget( 'Navigations', 'nav', @el.find('#nav') )
# start widgets
@setupWidget( 'Widgets', 'widget', @el.find('section') )
@setupWidget( 'Widgets', 'widget', @el )
# start widgets
@setupWidget( 'Footers', 'footer', @el.find('footer') )
# @setupWidget( 'Footers', 'footer', @el.find('footer') )
# bind to fill selected text into
App.ClipBoard.bind( @el )
@ -47,7 +47,7 @@ class App.Run extends App.Controller
App.Event.trigger( event + ':ready')
class App.Content extends App.Controller
className: 'content'
className: 'content flex'
constructor: ->
super

4
app/assets/javascripts/app/views/agent_ticket_create.jst.eco
View file

@ -1,4 +1,4 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
<div class="widgets">
<div class="customer_info"></div>
@ -7,7 +7,7 @@
</div>
</div>
<div class="main">
<div class="main flex">
<div class="page-header">
<h1><%- @T( 'New Ticket' ) %> <small>(<%- @T( @title ) %>)<% if @admin: %> <a href="#" data-type="settings" class="glyphicon glyphicon-edit"></a><% end %></small></h1>

4
app/assets/javascripts/app/views/agent_ticket_view.jst.eco
View file

@ -1,4 +1,4 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar"></div>
<div class="main"></div>
<div class="main flex"></div>
</div>

4
app/assets/javascripts/app/views/customer_ticket_create.jst.eco
View file

@ -1,7 +1,7 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
</div>
<div class="main">
<div class="main flex">
<div class="ticket-create">
<div class="page-header clearfix">

16
app/assets/javascripts/app/views/dashboard.jst.eco
View file

@ -1,23 +1,13 @@
<div class="content-two">
<div class="horizontal reverse">
<div class="sidebar">
<div class="side-overviews" id="sortable-sidebar"></div>
</div>
<div class="main">
<div class="main flex">
<div class="page-header">
<h1><%- @T( @head ) %> <small><!--<a href="#" data-type="settings" class="glyphicon glyphicon-edit">--></a></small></h1>
</div>
<div class="span9">
<!--
<div class="row">
<div class="span9">
<h2>Network</h2>
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
</div>
<div class="container-fluid main-overviews" id="sortable">
</div>
-->
<div class="main-overviews" id="sortable"></div>
</div>
</div>

4
app/assets/javascripts/app/views/generic/admin_level2/index.jst.eco
View file

@ -1,4 +1,4 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
<ul class="nav nav-pills nav-stacked">
@ -10,7 +10,7 @@
</ul>
</div>
<div class="main">
<div class="main flex">
<div class="page-header">
<h1><%- @T( @page.head ) %> <small><%- @T( @page.sub_head ) %></small></h1>

4
app/assets/javascripts/app/views/generic/content_two.jst.eco
View file

@ -1,6 +1,6 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
</div>
<div class="main">
<div class="main flex">
</div>
</div>

4
app/assets/javascripts/app/views/generic/content_two_title.jst.eco
View file

@ -1,7 +1,7 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
</div>
<div class="main">
<div class="main flex">
<div class="page-header">
<h1><%- @T( @head ) %> <small><%- @T( @sub_head ) %></small></h1>
</div>

4
app/assets/javascripts/app/views/generic/navbar_l2.jst.eco
View file

@ -1,4 +1,4 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar <%= @className %>">
<% if @groups: %>
@ -15,5 +15,5 @@
<% end %>
</div>
<div class="main"></div>
<div class="main flex"></div>
</div>

65
app/assets/javascripts/app/views/navigation.jst.eco
View file

@ -1,38 +1,38 @@
<div class="navbar navbar-inverse">
<a class="navbar-brand" href="#/"><%- @C( 'product_name' ) %></a>
<ul class="nav navbar-nav">
<% for item in @navbar_left: %>
<% if item.child: %>
<li class="dropdown <% if @open_tab[item.target] : %>open<% end %>">
<a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%- @T( item.name ) %> <b class="caret"></b></a>
<ul class="dropdown-menu">
<% for item in item.child: %>
<% if item.divider: %>
<li class="divider"></li>
<% end %>
<% if item.navheader: %>
<li class="dropdown-header"><%- @T( item.navheader ) %></li>
<% end %>
<li class="<% if @active_tab[item.target] : %>active<% end %>"><a href="<%= item.target %>"><%- @T( item.name ) %><% if item['count'] isnt undefined: %><span class="badge count"><%= item['count'] %></span><% end %></a></li>
<form class="search horizontal">
<input id="global-search" class="flex" type="search" autocomplete="off">
<div class="logo" title="<%- @C( 'product_name' ) %>"></div>
<ul id="global-search-result" class="dropdown-menu"></ul>
</form>
<ul class="nav navbar-nav">
<li class="dashboard active"><a href="#">Dashboard</a></li>
<% for item in @navbar_left: %>
<% if item.child: %>
<li class="dropdown <% if @open_tab[item.target] : %>open<% end %>">
<a href="<%= item.target %>" class="dropdown-toggle" data-toggle="dropdown"><%- @T( item.name ) %> <b class="caret"></b></a>
<ul class="dropdown-menu">
<% for item in item.child: %>
<% if item.divider: %>
<li class="divider"></li>
<% end %>
</ul>
</li>
<% else: %>
<li class="<% if @active_tab[item.target] : %>active<% end %>"><a href="<%= item.target %>"><%- @T( item.name ) %></a></li>
<% end %>
<% if item.navheader: %>
<li class="dropdown-header"><%- @T( item.navheader ) %></li>
<% end %>
<li class="<% if @active_tab[item.target] : %>active<% end %>"><a href="<%= item.target %>"><%- @T( item.name ) %><% if item['count'] isnt undefined: %><span class="badge count"><%= item['count'] %></span><% end %></a></li>
<% end %>
</ul>
</li>
<% else: %>
<li class="overviews <% if @active_tab[item.target] : %>active<% end %>"><a href="<%= item.target %>"><%- @T( item.name ) %></a></li>
<% end %>
<% end %>
<li class="customers"><a href="#">Customers</a></li>
</ul>
<div class="tabs flex"></div>
<!-- <div class="spinner"></div> -->
</ul>
<div class="spinner"/>
<% if !_.isEmpty(@user): %>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<form class="navbar-form">
<input id="global-search" class="form-control" type="search" value="<%= @search %>" placeholder="<%- @Ti( 'Search' ) %>" autocomplete="off"/>
</form>
<ul id="global-search-result" class="dropdown-menu"></ul>
</li>
<ul class="nav navbar-nav">
<li class="bell"><a href="#bell" class="glyphicon glyphicon-bell"></a></li>
@ -63,5 +63,4 @@
<li><a href="#login"><%- @T( 'Sign in' ) %></a></li>
</ul>
-->
<% end %>
</div>
<% end %>

4
app/assets/javascripts/app/views/ticket_zoom.jst.eco
View file

@ -1,9 +1,9 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
<div class="widgets"></div>
<div class="action"></div>
</div>
<div class="main">
<div class="main flex">
<div class="page-header ticket-zoom clearfix">
<div class="page-header-title">

4
app/assets/javascripts/app/views/user_zoom.jst.eco
View file

@ -1,9 +1,9 @@
<div class="content-two">
<div class="horizontal">
<div class="sidebar">
<div class="widgets"></div>
<div class="action"></div>
</div>
<div class="main">
<div class="main flex">
<div class="page-header user-zoom clearfix">
<div class="page-header-title">

184
app/assets/stylesheets/zzz.css.erb
View file

@ -14,7 +14,7 @@ body {
.spinner {
float: left;
background:url("/assets/images/spinner.gif") no-repeat;
background: url("/assets/images/spinner.gif") no-repeat;
background-position: center center;
padding: 44px 10px 0 10px;
width: 10px;
@ -113,14 +113,7 @@ table th, table td {
left: 0;
}
.content-two {
top: 78px;
bottom: 0;
left: 0;
right: 0;
position: fixed;
z-index: -5000;
}
.content-two .sidebar {
padding: 8px 10px 42px;
@ -300,22 +293,13 @@ table th, table td {
border-right: 1px solid #563d7c;
}
#global-search {
width: 150px;
border-radius: 8px;
background-color: #f4f4f4;
}
#global-search:focus {
width: 200px;
background-color: #ffffff;
}
#task {
position: fixed;
display: table;
width: 100%;
min-width: 1000px;
top: 46px;
display: none;
}
#task > .taskbar {
@ -450,10 +434,10 @@ label {
.content {
overflow: auto;
padding: 10px;
}
.content.fit {
padding: 10px;
background: #2c2d36;
z-index: 1;
}
@ -1039,76 +1023,6 @@ footer {
color: #bbb;
}
.navbar {
min-height: 46px;
min-width: 1000px;
}
.navbar-form {
margin-top: 6px;
margin-bottom: 6px;
padding: 0;
}
.navbar-brand {
height: auto;
line-height: 18px;
font-weight: 200;
padding-top: 13px;
padding-bottom: 13px;
}
.navbar-nav > li > a {
line-height: 18px;
padding-top: 13px;
padding-bottom: 13px;
}
.navbar .bell {
display: none;
}
.navbar .bell.show {
display: block;
}
.navbar .bell.show a {
color: #fff;
}
.nav.navbar-nav.navbar-right {
padding-right: 15px;
}
.nav.nav-tabs.nav-stacked > li > a > span {
visibility: hidden;
}
.nav.nav-tabs.nav-stacked > li > a:hover > span {
visibility: visible;
}
.nav-sub{
margin-left: 12px;
font-size: 12px;
}
.nav.nav-pills > li > a > span.local {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: block;
margin-right: 22px;
}
.nav.nav-pills > li > a > span.badge {
margin-top: -18px;
}
.nav.nav-pills li .glyphicon {
display: none;
}
.nav.nav-pills li:hover .glyphicon, .nav li:focus .glyphicon {
display: inline-block;
text-decoration: none;
}
.customer-info {
width: 100%;
padding-top: 7px;
@ -1214,3 +1128,93 @@ footer {
background: #419ed7;
border-color: #419ed7;
}
.logo {
width: 41px;
height: 36px;
background: url(<%= asset_path "logo.svg" %>);
}
.navigation {
width: 260px;
background: #26272e;
}
.navigation .navbar-nav,
.navigation .navbar-nav > li {
float: none;
}
.nav > li.active > a,
.nav > li > a:hover,
.nav > li > a:focus {
background: none;
color: #F0FAFF;
}
.nav > li.active > a:before,
.nav > li > a:hover:before,
.nav > li > a:focus:before {
opacity: 1;
}
.navbar-nav > li > a {
padding: 11px 15px;
color: rgba(240, 250, 255, .25);
border-bottom: 1px solid rgba(240, 250, 255, .05);
}
.navbar-nav > li.active a {
background: #389ed9;
}
li.dashboard a:before,
li.overviews a:before,
li.customers a:before {
content: '';
width: 24px;
height: 25px;
margin-right: 15px;
display: inline-block;
background: url(<%= asset_path "sprite.svg" %>) no-repeat;
vertical-align: bottom;
opacity: .25;
}
li.overviews a:before {
background-position: -24px 0;
}
li.customers a:before {
background-position: -48px 0;
}
.search {
padding: 10px;
border-bottom: 1px solid rgba(240, 250, 255, .05);
}
.search input {
padding: 5px 10px 5px 33px;
margin-right: 10px;
width: 100px;
height: 30px;
color: #ECECEC;
line-height: 20px;
background: #31373b url(<%= asset_path "sprite.svg" %>) no-repeat 10px -26px;
outline: none;
border: none;
border-radius: 15px;
}
.sidebar {
width: 270px;
padding: 10px 20px;
background: white;
border-right: 1px solid #e6e6e6;
}
.main {
padding: 10px 20px;
background: #f8f9fa;
}

6
app/views/init/index.html.erb
View file

@ -1,7 +1,5 @@
<div id="app" class="fit">
<nav></nav>
<section class="fit"></section>
<footer></footer>
<div id="app" class="fit horizontal">
<div id="nav" class="vertical"></div>
</div>
<div id="splash">
<div class="logo">booting...</div>

1
config/environments/development.rb
View file

@ -34,7 +34,6 @@ Zammad::Application.configure do
config.middleware.use(Rack::LiveReload,
:min_delay => 500, # default 1000
:max_delay => 10_000, # default 60_000
:live_reload_port => 67789, # default 35729
:source => :vendored
)
end