From e1ad4ffa93231e82044414a88d2ce48e593013a9 Mon Sep 17 00:00:00 2001 From: Martin Edenhofer Date: Wed, 17 Oct 2012 18:08:03 +0200 Subject: [PATCH] Moved to bootstrap 2.1.1. --- .../app/views/agent_ticket_create.jst.eco | 10 +- .../app/views/generic/attribute.jst.eco | 5 +- .../javascripts/app/views/navigation.jst.eco | 4 +- app/assets/stylesheets/bootstrap.css | 318 +++++++++++++----- app/assets/stylesheets/zzz.css | 39 ++- 5 files changed, 265 insertions(+), 111 deletions(-) diff --git a/app/assets/javascripts/app/views/agent_ticket_create.jst.eco b/app/assets/javascripts/app/views/agent_ticket_create.jst.eco index 9a836d7a4..e4876dfd2 100644 --- a/app/assets/javascripts/app/views/agent_ticket_create.jst.eco +++ b/app/assets/javascripts/app/views/agent_ticket_create.jst.eco @@ -3,14 +3,10 @@
-
- -
+
-
-
+
+
diff --git a/app/assets/javascripts/app/views/generic/attribute.jst.eco b/app/assets/javascripts/app/views/generic/attribute.jst.eco index 8374db770..e44ff80f7 100644 --- a/app/assets/javascripts/app/views/generic/attribute.jst.eco +++ b/app/assets/javascripts/app/views/generic/attribute.jst.eco @@ -1,7 +1,6 @@
- -
+ +
<%- @item %><% if @attribute.note: %><% end %> <% if @attribute.help: %><%- @T( @attribute.help ) + ' ' %><% end %><%- @attribute.link %> diff --git a/app/assets/javascripts/app/views/navigation.jst.eco b/app/assets/javascripts/app/views/navigation.jst.eco index d489fab47..b9312466e 100644 --- a/app/assets/javascripts/app/views/navigation.jst.eco +++ b/app/assets/javascripts/app/views/navigation.jst.eco @@ -15,7 +15,7 @@ <% if item.navheader: %> <% end %> -
  • <%- @T( item.name ) %><% if item['count'] isnt undefined: %> (<%= item['count'] %>)<% end %>
  • +
  • <%- @T( item.name ) %><% if item['count'] isnt undefined: %><%= item['count'] %><% end %>
  • <% end %> @@ -42,7 +42,7 @@ <% if item.navheader: %> <% end %> -
  • <%- @T( item.name ) %><% if item['count'] isnt undefined: %> (<%= item['count'] %>)<% end %>
  • +
  • <%- @T( item.name ) %><% if item['count'] isnt undefined: %><%= item['count'] %>)<% end %>
  • <% end %> diff --git a/app/assets/stylesheets/bootstrap.css b/app/assets/stylesheets/bootstrap.css index 0664207ae..9fa6f766f 100644 --- a/app/assets/stylesheets/bootstrap.css +++ b/app/assets/stylesheets/bootstrap.css @@ -1,5 +1,5 @@ /*! - * Bootstrap v2.1.0 + * Bootstrap v2.1.1 * * Copyright 2012 Twitter, Inc * Licensed under the Apache License v2.0 @@ -67,6 +67,7 @@ sub { } img { + width: auto\9; height: auto; max-width: 100%; vertical-align: middle; @@ -215,6 +216,7 @@ a:hover { [class*="span"] { float: left; + min-height: 1px; margin-left: 20px; } @@ -583,7 +585,7 @@ p { .lead { margin-bottom: 20px; - font-size: 20px; + font-size: 21px; font-weight: 200; line-height: 30px; } @@ -608,6 +610,22 @@ cite { color: #999999; } +.text-warning { + color: #c09853; +} + +.text-error { + color: #b94a48; +} + +.text-info { + color: #3a87ad; +} + +.text-success { + color: #468847; +} + h1, h2, h3, @@ -725,9 +743,24 @@ dd { margin-left: 10px; } +.dl-horizontal { + *zoom: 1; +} + +.dl-horizontal:before, +.dl-horizontal:after { + display: table; + line-height: 0; + content: ""; +} + +.dl-horizontal:after { + clear: both; +} + .dl-horizontal dt { float: left; - width: 120px; + width: 160px; overflow: hidden; clear: left; text-align: right; @@ -736,7 +769,7 @@ dd { } .dl-horizontal dd { - margin-left: 130px; + margin-left: 180px; } hr { @@ -945,8 +978,9 @@ input[type="color"], } input, -textarea { - width: 210px; +textarea, +.uneditable-input { + width: 206px; } textarea { @@ -1039,7 +1073,7 @@ input[type="file"] { select { width: 220px; background-color: #ffffff; - border: 1px solid #bbb; + border: 1px solid #cccccc; } select[multiple], @@ -1301,14 +1335,17 @@ input[type="checkbox"][readonly] { .control-group.warning select, .control-group.warning textarea { color: #c09853; +} + +.control-group.warning input, +.control-group.warning select, +.control-group.warning textarea { border-color: #c09853; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } -.control-group.warning .checkbox:focus, -.control-group.warning .radio:focus, .control-group.warning input:focus, .control-group.warning select:focus, .control-group.warning textarea:focus { @@ -1337,14 +1374,17 @@ input[type="checkbox"][readonly] { .control-group.error select, .control-group.error textarea { color: #b94a48; +} + +.control-group.error input, +.control-group.error select, +.control-group.error textarea { border-color: #b94a48; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } -.control-group.error .checkbox:focus, -.control-group.error .radio:focus, .control-group.error input:focus, .control-group.error select:focus, .control-group.error textarea:focus { @@ -1373,14 +1413,17 @@ input[type="checkbox"][readonly] { .control-group.success select, .control-group.success textarea { color: #468847; +} + +.control-group.success input, +.control-group.success select, +.control-group.success textarea { border-color: #468847; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } -.control-group.success .checkbox:focus, -.control-group.success .radio:focus, .control-group.success input:focus, .control-group.success select:focus, .control-group.success textarea:focus { @@ -1397,6 +1440,45 @@ input[type="checkbox"][readonly] { border-color: #468847; } +.control-group.info > label, +.control-group.info .help-block, +.control-group.info .help-inline { + color: #3a87ad; +} + +.control-group.info .checkbox, +.control-group.info .radio, +.control-group.info input, +.control-group.info select, +.control-group.info textarea { + color: #3a87ad; +} + +.control-group.info input, +.control-group.info select, +.control-group.info textarea { + border-color: #3a87ad; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); +} + +.control-group.info input:focus, +.control-group.info select:focus, +.control-group.info textarea:focus { + border-color: #2d6987; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3; + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7ab5d3; +} + +.control-group.info .input-prepend .add-on, +.control-group.info .input-append .add-on { + color: #3a87ad; + background-color: #d9edf7; + border-color: #3a87ad; +} + input:focus:required:invalid, textarea:focus:required:invalid, select:focus:required:invalid { @@ -1503,7 +1585,6 @@ select:focus:required:invalid:focus { .input-prepend .add-on, .input-append .btn, .input-prepend .btn { - margin-left: -1px; vertical-align: top; -webkit-border-radius: 0; -moz-border-radius: 0; @@ -1536,6 +1617,11 @@ select:focus:required:invalid:focus { border-radius: 3px 0 0 3px; } +.input-append .add-on, +.input-append .btn { + margin-left: -1px; +} + .input-append .add-on:last-child, .input-append .btn:last-child { -webkit-border-radius: 0 3px 3px 0; @@ -1706,7 +1792,7 @@ legend + .control-group { .form-horizontal .control-label { float: left; - width: 140px; + width: 160px; padding-top: 5px; text-align: right; } @@ -1714,21 +1800,26 @@ legend + .control-group { .form-horizontal .controls { *display: inline-block; *padding-left: 20px; - margin-left: 160px; + margin-left: 180px; *margin-left: 0; } .form-horizontal .controls:first-child { - *padding-left: 160px; + *padding-left: 180px; } .form-horizontal .help-block { - margin-top: 10px; margin-bottom: 0; } +.form-horizontal input + .help-block, +.form-horizontal select + .help-block, +.form-horizontal textarea + .help-block { + margin-top: 10px; +} + .form-horizontal .form-actions { - padding-left: 160px; + padding-left: 180px; } table { @@ -1853,7 +1944,7 @@ table { .table-bordered colgroup + tbody tr:first-child td:last-child { -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; - -moz-border-right-topleft: 4px; + -moz-border-radius-topleft: 4px; } .table-striped tbody tr:nth-child(odd) td, @@ -1873,145 +1964,145 @@ table [class*=span], margin-left: 0; } -table .span1 { +.table .span1 { float: none; width: 44px; margin-left: 0; } -table .span2 { +.table .span2 { float: none; width: 124px; margin-left: 0; } -table .span3 { +.table .span3 { float: none; width: 204px; margin-left: 0; } -table .span4 { +.table .span4 { float: none; width: 284px; margin-left: 0; } -table .span5 { +.table .span5 { float: none; width: 364px; margin-left: 0; } -table .span6 { +.table .span6 { float: none; width: 444px; margin-left: 0; } -table .span7 { +.table .span7 { float: none; width: 524px; margin-left: 0; } -table .span8 { +.table .span8 { float: none; width: 604px; margin-left: 0; } -table .span9 { +.table .span9 { float: none; width: 684px; margin-left: 0; } -table .span10 { +.table .span10 { float: none; width: 764px; margin-left: 0; } -table .span11 { +.table .span11 { float: none; width: 844px; margin-left: 0; } -table .span12 { +.table .span12 { float: none; width: 924px; margin-left: 0; } -table .span13 { +.table .span13 { float: none; width: 1004px; margin-left: 0; } -table .span14 { +.table .span14 { float: none; width: 1084px; margin-left: 0; } -table .span15 { +.table .span15 { float: none; width: 1164px; margin-left: 0; } -table .span16 { +.table .span16 { float: none; width: 1244px; margin-left: 0; } -table .span17 { +.table .span17 { float: none; width: 1324px; margin-left: 0; } -table .span18 { +.table .span18 { float: none; width: 1404px; margin-left: 0; } -table .span19 { +.table .span19 { float: none; width: 1484px; margin-left: 0; } -table .span20 { +.table .span20 { float: none; width: 1564px; margin-left: 0; } -table .span21 { +.table .span21 { float: none; width: 1644px; margin-left: 0; } -table .span22 { +.table .span22 { float: none; width: 1724px; margin-left: 0; } -table .span23 { +.table .span23 { float: none; width: 1804px; margin-left: 0; } -table .span24 { +.table .span24 { float: none; width: 1884px; margin-left: 0; @@ -2025,10 +2116,30 @@ table .span24 { background-color: #f2dede; } +.table tbody tr.warning td { + background-color: #fcf8e3; +} + .table tbody tr.info td { background-color: #d9edf7; } +.table-hover tbody tr.success:hover td { + background-color: #d0e9c6; +} + +.table-hover tbody tr.error:hover td { + background-color: #ebcccc; +} + +.table-hover tbody tr.warning:hover td { + background-color: #faf2cc; +} + +.table-hover tbody tr.info:hover td { + background-color: #c4e3f3; +} + [class^="icon-"], [class*=" icon-"] { display: inline-block; @@ -2046,8 +2157,14 @@ table .span24 { /* White icons with optional class, or on hover/active states of certain elements */ .icon-white, -.nav > .active > a > [class^="icon-"], -.nav > .active > a > [class*=" icon-"], +.nav-tabs > .active > a > [class^="icon-"], +.nav-tabs > .active > a > [class*=" icon-"], +.nav-pills > .active > a > [class^="icon-"], +.nav-pills > .active > a > [class*=" icon-"], +.nav-list > .active > a > [class^="icon-"], +.nav-list > .active > a > [class*=" icon-"], +.navbar-inverse .nav > .active > a > [class^="icon-"], +.navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], @@ -2759,7 +2876,7 @@ table .span24 { .navbar-fixed-bottom .dropdown .caret { border-top: 0; border-bottom: 4px solid #000000; - content: "\2191"; + content: ""; } .dropup .dropdown-menu, @@ -2783,7 +2900,7 @@ table .span24 { border-radius: 0 6px 6px 6px; } -.dropdown-submenu:hover .dropdown-menu { +.dropdown-submenu:hover > .dropdown-menu { display: block; } @@ -2866,7 +2983,6 @@ table .span24 { position: relative; height: 0; overflow: hidden; - overflow: visible \9; -webkit-transition: height 0.35s ease; -moz-transition: height 0.35s ease; -o-transition: height 0.35s ease; @@ -3030,7 +3146,7 @@ button.close { .btn-mini { padding: 2px 6px; font-size: 11px; - line-height: 16px; + line-height: 17px; } .btn-block { @@ -3047,6 +3163,12 @@ button.close { margin-top: 5px; } +input[type="submit"].btn-block, +input[type="reset"].btn-block, +input[type="button"].btn-block { + width: 100%; +} + .btn-primary.active, .btn-warning.active, .btn-danger.active, @@ -3284,7 +3406,8 @@ input[type="submit"].btn.btn-mini { } .btn-link, -.btn-link:active { +.btn-link:active, +.btn-link[disabled] { background-color: transparent; background-image: none; -webkit-box-shadow: none; @@ -3307,11 +3430,17 @@ input[type="submit"].btn.btn-mini { background-color: transparent; } +.btn-link[disabled]:hover { + color: #333333; + text-decoration: none; +} + .btn-group { position: relative; *margin-left: .3em; font-size: 0; white-space: nowrap; + vertical-align: middle; } .btn-group:first-child { @@ -4018,7 +4147,7 @@ input[type="submit"].btn.btn-mini { *z-index: 2; margin-bottom: 20px; overflow: visible; - color: #555555; + color: #777777; } .navbar-inner { @@ -4037,11 +4166,23 @@ input[type="submit"].btn.btn-mini { -moz-border-radius: 4px; border-radius: 4px; filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0); + *zoom: 1; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065); -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065); } +.navbar-inner:before, +.navbar-inner:after { + display: table; + line-height: 0; + content: ""; +} + +.navbar-inner:after { + clear: both; +} + .navbar .container { width: auto; } @@ -4057,7 +4198,7 @@ input[type="submit"].btn.btn-mini { margin-left: -20px; font-size: 20px; font-weight: 200; - color: #555555; + color: #777777; text-shadow: 0 1px 0 #ffffff; } @@ -4071,7 +4212,7 @@ input[type="submit"].btn.btn-mini { } .navbar-link { - color: #555555; + color: #777777; } .navbar-link:hover { @@ -4087,11 +4228,13 @@ input[type="submit"].btn.btn-mini { .navbar .btn, .navbar .btn-group { - margin-top: 6px; + margin-top: 5px; } -.navbar .btn-group .btn { - margin: 0; +.navbar .btn-group .btn, +.navbar .input-prepend .btn, +.navbar .input-append .btn { + margin-top: 0; } .navbar-form { @@ -4182,9 +4325,12 @@ input[type="submit"].btn.btn-mini { } .navbar-fixed-top .navbar-inner, -.navbar-fixed-bottom .navbar-inner, .navbar-static-top .navbar-inner { - border: 0; + border-width: 0 0 1px; +} + +.navbar-fixed-bottom .navbar-inner { + border-width: 1px 0 0; } .navbar-fixed-top .navbar-inner, @@ -4233,6 +4379,7 @@ input[type="submit"].btn.btn-mini { .navbar .nav.pull-right { float: right; + margin-right: 0; } .navbar .nav > li { @@ -4242,7 +4389,7 @@ input[type="submit"].btn.btn-mini { .navbar .nav > li > a { float: none; padding: 10px 15px 10px; - color: #555555; + color: #777777; text-decoration: none; text-shadow: 0 1px 0 #ffffff; } @@ -4372,8 +4519,8 @@ input[type="submit"].btn.btn-mini { } .navbar .nav li.dropdown > .dropdown-toggle .caret { - border-top-color: #555555; - border-bottom-color: #555555; + border-top-color: #777777; + border-bottom-color: #777777; } .navbar .nav li.dropdown.open > .dropdown-toggle .caret, @@ -4599,12 +4746,12 @@ input[type="submit"].btn.btn-mini { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); } -.pagination li { +.pagination ul > li { display: inline; } -.pagination a, -.pagination span { +.pagination ul > li > a, +.pagination ul > li > span { float: left; padding: 0 14px; line-height: 38px; @@ -4614,36 +4761,36 @@ input[type="submit"].btn.btn-mini { border-left-width: 0; } -.pagination a:hover, -.pagination .active a, -.pagination .active span { +.pagination ul > li > a:hover, +.pagination ul > .active > a, +.pagination ul > .active > span { background-color: #f5f5f5; } -.pagination .active a, -.pagination .active span { +.pagination ul > .active > a, +.pagination ul > .active > span { color: #999999; cursor: default; } -.pagination .disabled span, -.pagination .disabled a, -.pagination .disabled a:hover { +.pagination ul > .disabled > span, +.pagination ul > .disabled > a, +.pagination ul > .disabled > a:hover { color: #999999; cursor: default; background-color: transparent; } -.pagination li:first-child a, -.pagination li:first-child span { +.pagination ul > li:first-child > a, +.pagination ul > li:first-child > span { border-left-width: 1px; -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; } -.pagination li:last-child a, -.pagination li:last-child span { +.pagination ul > li:last-child > a, +.pagination ul > li:last-child > span { -webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; @@ -4679,7 +4826,8 @@ input[type="submit"].btn.btn-mini { display: inline; } -.pager a { +.pager a, +.pager span { display: inline-block; padding: 5px 14px; background-color: #fff; @@ -4694,7 +4842,8 @@ input[type="submit"].btn.btn-mini { background-color: #f5f5f5; } -.pager .next a { +.pager .next a, +.pager .next span { float: right; } @@ -4703,25 +4852,26 @@ input[type="submit"].btn.btn-mini { } .pager .disabled a, -.pager .disabled a:hover { +.pager .disabled a:hover, +.pager .disabled span { color: #999999; cursor: default; background-color: #fff; } -.modal-open .dropdown-menu { +.modal-open .modal .dropdown-menu { z-index: 2050; } -.modal-open .dropdown.open { +.modal-open .modal .dropdown.open { *z-index: 2050; } -.modal-open .popover { +.modal-open .modal .popover { z-index: 2060; } -.modal-open .tooltip { +.modal-open .modal .tooltip { z-index: 2080; } diff --git a/app/assets/stylesheets/zzz.css b/app/assets/stylesheets/zzz.css index 8f73a7438..bedf38f2b 100644 --- a/app/assets/stylesheets/zzz.css +++ b/app/assets/stylesheets/zzz.css @@ -74,10 +74,6 @@ h3 { height: 30px; float: right; } -.pagination a { - padding: 0px 10px; - line-height: 26px; -} .pagination .count { padding: 6px 6px; @@ -87,15 +83,38 @@ h3 { line-height: 17px; } +.pagination ul > li > a, .pagination ul > li > span { + line-height: 26px; + padding: 0 10px; +} + .page-header { margin: 20px 0 20px } +.dropdown-menu { +/* + min-width: 270px; +*/ +} + +.dropdown-menu .count { + float: right; + padding-top: 2px; + margin-left: 10px; +} + .form-horizontal .help-inline, .form-horizontal .help-block { font-size: 12px; margin-top: 4px; } +.form-horizontal .control-label { + width: 130px; +} +.form-horizontal .controls { + margin-left: 150px; +} /* replace music icon with attachment */ .icon-attachment { @@ -142,22 +161,12 @@ form { clear: right; } -/* -.dropdown-menu { - min-width: 220px; -} -*/ - footer { // margin-top: 17px; padding-top: 17px; border-top: 1px solid #EEE; } -.form-horizontal .controls { - margin-left: 150px; -} - .search-query { width: 160px; } @@ -293,8 +302,8 @@ footer { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; - } + .noty_bar.noty_theme_twitter { font-size: 14px; line-height: 14px;