resources/css/structure/toolbar.css

   1 /*!
   2  * Ext JS Library 3.2.1
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7 .x-toolbar{
   8     border-style:solid;
   9     border-width:0 0 1px 0;
  10     display: block;
  11         padding:2px;
  12     background:repeat-x top left;
  13     position:relative;
  14     left:0;
  15     top:0;
  16     zoom:1;
  17     overflow:hidden;
  18 }
  19
  20 .x-toolbar-left {
  21     width: 100%;
  22 }
  23
  24 .x-toolbar .x-item-disabled .x-btn-icon {
  25     opacity: .35;
  26     -moz-opacity: .35;
  27     filter: alpha(opacity=35);
  28 }
  29
  30 .x-toolbar td {
  31         vertical-align:middle;
  32 }
  33
  34 .x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{
  35         white-space: nowrap;
  36 }
  37
  38 .x-toolbar .x-item-disabled {
  39         cursor:default;
  40         opacity:.6;
  41         -moz-opacity:.6;
  42         filter:alpha(opacity=60);
  43 }
  44
  45 .x-toolbar .x-item-disabled * {
  46         cursor:default;
  47 }
  48
  49 .x-toolbar .x-toolbar-cell {
  50     vertical-align:middle;
  51 }
  52
  53 .x-toolbar .x-btn-tl, .x-toolbar .x-btn-tr, .x-toolbar .x-btn-tc, .x-toolbar .x-btn-ml, .x-toolbar .x-btn-mr,
  54 .x-toolbar .x-btn-mc, .x-toolbar .x-btn-bl, .x-toolbar .x-btn-br, .x-toolbar .x-btn-bc
  55 {
  56         background-position: 500px 500px;
  57 }
  58
  59 /* These rules are duplicated from button.css to give priority of x-toolbar rules above */
  60 .x-toolbar .x-btn-over .x-btn-tl{
  61         background-position: -6px 0;
  62 }
  63
  64 .x-toolbar .x-btn-over .x-btn-tr{
  65         background-position: -9px 0;
  66 }
  67
  68 .x-toolbar .x-btn-over .x-btn-tc{
  69         background-position: 0 -9px;
  70 }
  71
  72 .x-toolbar .x-btn-over .x-btn-ml{
  73         background-position: -6px -24px;
  74 }
  75
  76 .x-toolbar .x-btn-over .x-btn-mr{
  77         background-position: -9px -24px;
  78 }
  79
  80 .x-toolbar .x-btn-over .x-btn-mc{
  81         background-position: 0 -2168px;
  82 }
  83
  84 .x-toolbar .x-btn-over .x-btn-bl{
  85         background-position: -6px -3px;
  86 }
  87
  88 .x-toolbar .x-btn-over .x-btn-br{
  89         background-position: -9px -3px;
  90 }
  91
  92 .x-toolbar .x-btn-over .x-btn-bc{
  93         background-position: 0 -18px;
  94 }
  95
  96 .x-toolbar .x-btn-click .x-btn-tl, .x-toolbar .x-btn-menu-active .x-btn-tl, .x-toolbar .x-btn-pressed .x-btn-tl{
  97         background-position: -12px 0;
  98 }
  99
 100 .x-toolbar .x-btn-click .x-btn-tr, .x-toolbar .x-btn-menu-active .x-btn-tr, .x-toolbar .x-btn-pressed .x-btn-tr{
 101         background-position: -15px 0;
 102 }
 103
 104 .x-toolbar .x-btn-click .x-btn-tc, .x-toolbar .x-btn-menu-active .x-btn-tc, .x-toolbar .x-btn-pressed .x-btn-tc{
 105         background-position: 0 -12px;
 106 }
 107
 108 .x-toolbar .x-btn-click .x-btn-ml, .x-toolbar .x-btn-menu-active .x-btn-ml, .x-toolbar .x-btn-pressed .x-btn-ml{
 109         background-position: -12px -24px;
 110 }
 111
 112 .x-toolbar .x-btn-click .x-btn-mr, .x-toolbar .x-btn-menu-active .x-btn-mr, .x-toolbar .x-btn-pressed .x-btn-mr{
 113         background-position: -15px -24px;
 114 }
 115
 116 .x-toolbar .x-btn-click .x-btn-mc, .x-toolbar .x-btn-menu-active .x-btn-mc, .x-toolbar .x-btn-pressed .x-btn-mc{
 117         background-position: 0 -3240px;
 118 }
 119
 120 .x-toolbar .x-btn-click .x-btn-bl, .x-toolbar .x-btn-menu-active .x-btn-bl, .x-toolbar .x-btn-pressed .x-btn-bl{
 121         background-position: -12px -3px;
 122 }
 123
 124 .x-toolbar .x-btn-click .x-btn-br, .x-toolbar .x-btn-menu-active .x-btn-br, .x-toolbar .x-btn-pressed .x-btn-br{
 125         background-position: -15px -3px;
 126 }
 127
 128 .x-toolbar .x-btn-click .x-btn-bc, .x-toolbar .x-btn-menu-active .x-btn-bc, .x-toolbar .x-btn-pressed .x-btn-bc{
 129         background-position: 0 -21px;
 130 }
 131
 132 .x-toolbar div.xtb-text{
 133     padding:2px 2px 0;
 134     line-height:16px;
 135     display:block;
 136 }
 137
 138 .x-toolbar .xtb-sep {
 139         background-position: center;
 140         background-repeat: no-repeat;
 141         display: block;
 142         font-size: 1px;
 143         height: 16px;
 144         width:4px;
 145         overflow: hidden;
 146         cursor:default;
 147         margin: 0 2px 0;
 148         border:0;
 149 }
 150
 151 .x-toolbar .xtb-spacer {
 152     width:2px;
 153 }
 154
 155 /* Paging Toolbar */
 156 .x-tbar-page-number{
 157         width:30px;
 158         height:14px;
 159 }
 160
 161 .ext-ie .x-tbar-page-number{
 162     margin-top: 2px;
 163 }
 164
 165 .x-paging-info {
 166     position:absolute;
 167     top:5px;
 168     right: 8px;
 169 }
 170
 171 /* floating */
 172 .x-toolbar-ct {
 173     width:100%;
 174 }
 175
 176 .x-toolbar-right td {
 177     text-align: center;
 178 }
 179
 180 .x-panel-tbar, .x-panel-bbar, .x-window-tbar, .x-window-bbar, .x-tab-panel-tbar, .x-tab-panel-bbar, .x-plain-tbar, .x-plain-bbar {
 181     overflow:hidden;
 182     zoom:1;
 183 }
 184
 185 .x-toolbar-more .x-btn-small .x-btn-text{
 186         height: 16px;
 187         width: 12px;
 188 }
 189
 190 .x-toolbar-more em.x-btn-arrow {
 191     display:inline;
 192     background:transparent;
 193         padding-right:0;
 194 }
 195
 196 .x-toolbar-more .x-btn-mc em.x-btn-arrow {
 197     background-image: none;
 198 }
 199
 200 div.x-toolbar-no-items {
 201     color:gray !important;
 202     padding:5px 10px !important;
 203 }
 204
 205 /* fix ie toolbar form items */
 206 .ext-border-box .x-toolbar-cell .x-form-text {
 207     margin-bottom:-1px !important;
 208 }
 209
 210 .ext-border-box .x-toolbar-cell .x-form-field-wrap .x-form-text {
 211     margin:0 !important;
 212 }
 213
 214 .ext-ie .x-toolbar-cell .x-form-field-wrap {
 215     height:21px;
 216 }
 217
 218 .ext-ie .x-toolbar-cell .x-form-text {
 219     position:relative;
 220     top:-1px;
 221 }
 222
 223 .ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-text, .ext-strict .ext-ie .x-toolbar-cell .x-form-text {
 224     top: 0px;
 225 }
 226
 227 .x-toolbar-right td .x-form-field-trigger-wrap{
 228     text-align: left;
 229 }
 230
 231 .x-toolbar-cell .x-form-checkbox, .x-toolbar-cell .x-form-radio{
 232     margin-top: 5px;
 233 }
 234
 235 .x-toolbar-cell .x-form-cb-label{
 236     vertical-align: bottom;
 237     top: 1px;
 238 }
 239
 240 .ext-ie .x-toolbar-cell .x-form-checkbox, .ext-ie .x-toolbar-cell .x-form-radio{
 241     margin-top: 4px;
 242 }
 243
 244 .ext-ie .x-toolbar-cell .x-form-cb-label{
 245     top: 0;
 246 }