rlm@46: /* rlm@46: * Ext JS Library 2.1 rlm@46: * Copyright(c) 2006-2008, Ext JS, LLC. rlm@46: * licensing@extjs.com rlm@46: * rlm@46: * http://extjs.com/license rlm@46: */ rlm@46: rlm@46: .x-btn{ rlm@46: font:normal 11px tahoma, verdana, helvetica; rlm@46: cursor:pointer; rlm@46: white-space: nowrap; rlm@46: } rlm@46: .x-btn button{ rlm@46: border:0 none; rlm@46: background:transparent; rlm@46: font:normal 11px tahoma,verdana,helvetica; rlm@46: padding-left:3px; rlm@46: padding-right:3px; rlm@46: cursor:pointer; rlm@46: margin:0; rlm@46: overflow:visible; rlm@46: width:auto; rlm@46: -moz-outline:0 none; rlm@46: outline:0 none; rlm@46: } rlm@46: * html .ext-ie .x-btn button { rlm@46: width:1px; rlm@46: } rlm@46: .ext-gecko .x-btn button { rlm@46: padding-left:0; rlm@46: padding-right:0; rlm@46: } rlm@46: .ext-ie .x-btn button { rlm@46: padding-top:2px; rlm@46: } rlm@46: /* rlm@46: Predefined css class for buttons with only icon. Add this class (x-btn-icon) and a class with a background-image rlm@46: to your button for a button with just an icon. rlm@46: e.g. rlm@46: .my-class .x-btn-text { background-image: url(foo.gif); } rlm@46: */ rlm@46: rlm@46: .x-btn-icon .x-btn-center .x-btn-text{ rlm@46: background-position: center; rlm@46: background-repeat: no-repeat; rlm@46: height: 16px; rlm@46: width: 16px; rlm@46: cursor:pointer; rlm@46: white-space: nowrap; rlm@46: padding:0; rlm@46: } rlm@46: .x-btn-icon .x-btn-center{ rlm@46: padding:1px; rlm@46: } rlm@46: .x-btn em { rlm@46: font-style:normal; rlm@46: font-weight:normal; rlm@46: } rlm@46: /* rlm@46: Button class for icon and text. Add this class (x-btn-text-icon) and a class with a background-image rlm@46: to your button for both text and icon. rlm@46: */ rlm@46: rlm@46: .x-btn-text-icon .x-btn-center .x-btn-text{ rlm@46: background-position: 0 2px; rlm@46: background-repeat: no-repeat; rlm@46: padding-left:18px; rlm@46: padding-top:3px; rlm@46: padding-bottom:2px; rlm@46: padding-right:0; rlm@46: } rlm@46: rlm@46: .x-btn-left, .x-btn-right{ rlm@46: font-size:1px; rlm@46: line-height:1px; rlm@46: } rlm@46: .x-btn-left{ rlm@46: width:3px; rlm@46: height:21px; rlm@46: background:url(../images/default/button/btn-sprite.gif) no-repeat 0 0; rlm@46: } rlm@46: .x-btn-right{ rlm@46: width:3px; rlm@46: height:21px; rlm@46: background:url(../images/default/button/btn-sprite.gif) no-repeat 0 -21px; rlm@46: } rlm@46: .x-btn-left i, .x-btn-right i{ rlm@46: display:block; rlm@46: width:3px; rlm@46: overflow:hidden; rlm@46: font-size:1px; rlm@46: line-height:1px; rlm@46: } rlm@46: .x-btn-center{ rlm@46: background:url(../images/default/button/btn-sprite.gif) repeat-x 0 -42px; rlm@46: vertical-align: middle; rlm@46: text-align:center; rlm@46: padding:0 5px; rlm@46: cursor:pointer; rlm@46: white-space:nowrap; rlm@46: } rlm@46: .x-btn-over .x-btn-left{ rlm@46: background-position:0 -63px; rlm@46: } rlm@46: .x-btn-over .x-btn-right{ rlm@46: background-position:0 -84px; rlm@46: } rlm@46: .x-btn-over .x-btn-center{ rlm@46: background-position:0 -105px; rlm@46: } rlm@46: .x-btn-click .x-btn-center, .x-btn-menu-active .x-btn-center{ rlm@46: background-position:0 -126px; rlm@46: } rlm@46: .x-btn-disabled *{ rlm@46: color:gray !important; rlm@46: cursor:default !important; rlm@46: } rlm@46: .x-btn-menu-text-wrap .x-btn-center { rlm@46: padding:0 3px; rlm@46: } rlm@46: .ext-gecko .x-btn-menu-text-wrap .x-btn-center { rlm@46: padding:0 1px; rlm@46: } rlm@46: .x-btn-menu-arrow-wrap .x-btn-center { rlm@46: padding:0; rlm@46: } rlm@46: .x-btn-menu-arrow-wrap .x-btn-center button { rlm@46: width:12px !important; rlm@46: height:21px; rlm@46: padding:0 !important; rlm@46: display:block; rlm@46: background:transparent url(../images/default/button/btn-arrow.gif) no-repeat left 3px; rlm@46: } rlm@46: .x-btn-with-menu .x-btn-center { rlm@46: padding-right:2px !important; rlm@46: } rlm@46: .x-btn-with-menu .x-btn-center em { rlm@46: display:block; rlm@46: background:transparent url(../images/default/toolbar/btn-arrow.gif) no-repeat right 0; rlm@46: padding-right:10px; rlm@46: } rlm@46: rlm@46: .x-btn-text-icon .x-btn-with-menu .x-btn-center em { rlm@46: display:block; rlm@46: background:transparent url(../images/default/toolbar/btn-arrow.gif) no-repeat right 3px; rlm@46: padding-right:10px; rlm@46: } rlm@46: rlm@46: /* Toggle button styles */ rlm@46: .x-btn-pressed .x-btn-left{ rlm@46: background: url(../images/default/button/btn-sprite.gif) no-repeat 0 -63px; rlm@46: } rlm@46: .x-btn-pressed .x-btn-right{ rlm@46: background: url(../images/default/button/btn-sprite.gif) no-repeat 0 -84px; rlm@46: } rlm@46: .x-btn-pressed .x-btn-center{ rlm@46: background: url(../images/default/button/btn-sprite.gif) repeat-x 0 -126px; rlm@46: }