Plugin Directory

Changeset 1067311


Ignore:
Timestamp:
01/13/2015 07:39:07 PM (10 years ago)
Author:
matthewwoodard
Message:

update v1.1

Location:
uniform-js/trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • uniform-js/trunk/css/uniform.agent.css

    r689354 r1067311  
    44Version: 1.0
    55By: Collin Allen
    6 License: Creative Commons Share Alike
     6License: MIT
    77---
    88For use with the Uniform plugin:
     
    1010
    1111*/
    12 
    13 /* Global Declaration */
    14 
    15 div.selector,
    16 div.selector span,
    17 div.checker span,
    18 div.radio span,
    19 div.uploader,
    20 div.uploader span.action,
    21 div.button,
    22 div.button span {
    23   background-image: url(../images/sprite-agent.png);
     12/* General settings */
     13div.selector, div.selector span, div.checker span, div.radio span, div.uploader, div.uploader span.action, div.button, div.button span {
     14  background-image: url("../images/sprite-agent.png");
    2415  background-repeat: no-repeat;
    25   -webkit-font-smoothing: antialiased;
    26 }
    27 
    28 .selector,
    29 .radio,
    30 .checker,
    31 .uploader,
    32 .button,
    33 .selector *,
    34 .radio *,
    35 .checker *,
    36 .uploader *,
    37 .button * {
    38     margin: 0;
    39     padding: 0;
    40 }
    41 
    42 /* INPUT & TEXTAREA */
    43 
    44 input.text,
    45 input.email,
    46 input.password,
     16  -webkit-font-smoothing: antialiased; }
     17div.selector, div.checker, div.button, div.radio, div.uploader {
     18  display: -moz-inline-box;
     19  display: inline-block;
     20  *display: inline;
     21  zoom: 1;
     22  vertical-align: middle;
     23  /* Keeping this as :focus to remove browser styles */ }
     24  div.selector:focus, div.checker:focus, div.button:focus, div.radio:focus, div.uploader:focus {
     25    outline: 0; }
     26div.selector, div.selector *, div.radio, div.radio *, div.checker, div.checker *, div.uploader, div.uploader *, div.button, div.button * {
     27  margin: 0;
     28  padding: 0; }
     29
     30.highContrastDetect {
     31  background: url("../images/bg-input-agent.png") repeat-x 0 0;
     32  width: 0px;
     33  height: 0px; }
     34
     35/* Input & Textarea */
     36input.uniform-input,
     37select.uniform-multiselect,
    4738textarea.uniform {
    48   font-size: 12px;
    49   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     39  padding: 4px;
     40  background: url("../images/bg-input-agent.png") repeat-x 0 0;
     41  outline: 0; }
     42  input.uniform-input.active,
     43  select.uniform-multiselect.active,
     44  textarea.uniform.active {
     45    background: url("../images/bg-input-agent-focus.png") repeat-x 0 0; }
     46
     47/* Remove default webkit and possible mozilla .search styles.
     48 * Keeping this as :active to remove browser styles */
     49div.checker input,
     50input[type="search"],
     51input[type="search"]:active {
     52  -moz-appearance: none;
     53  -webkit-appearance: none; }
     54
     55/* Select */
     56div.selector {
     57  background-position: 0 -160px;
     58  line-height: 32px;
     59  height: 32px;
     60  padding: 0 0 0 12px;
     61  position: relative;
     62  overflow: hidden; }
     63  div.selector span {
     64    text-overflow: ellipsis;
     65    display: block;
     66    overflow: hidden;
     67    white-space: nowrap;
     68    background-position: right 0;
     69    height: 32px;
     70    line-height: 32px;
     71    padding-right: 25px;
     72    cursor: pointer;
     73    width: 100%;
     74    display: block; }
     75  div.selector.fixedWidth {
     76    width: 190px; }
     77    div.selector.fixedWidth span {
     78      width: 153px; }
     79  div.selector select {
     80    opacity: 0;
     81    filter: alpha(opacity=0);
     82    -moz-opacity: 0;
     83    border: none;
     84    background: none;
     85    position: absolute;
     86    height: 25px;
     87    top: 4px;
     88    left: 0px;
     89    width: 100%; }
     90  div.selector.active {
     91    background-position: 0 -192px; }
     92    div.selector.active span {
     93      background-position: right -32px; }
     94  div.selector.hover, div.selector.focus {
     95    background-position: 0 -224px; }
     96    div.selector.hover span, div.selector.focus span {
     97      background-position: right -64px; }
     98    div.selector.hover.active, div.selector.focus.active {
     99      background-position: 0 -256px; }
     100      div.selector.hover.active span, div.selector.focus.active span {
     101        background-position: right -96px; }
     102  div.selector.disabled, div.selector.disabled.active {
     103    background-position: 0 -288px; }
     104    div.selector.disabled span, div.selector.disabled.active span {
     105      background-position: right -128px; }
     106
     107/* Checkbox */
     108div.checker {
     109  position: relative; }
     110  div.checker, div.checker span, div.checker input {
     111    width: 23px;
     112    height: 23px; }
     113  div.checker span {
     114    display: -moz-inline-box;
     115    display: inline-block;
     116    *display: inline;
     117    zoom: 1;
     118    text-align: center;
     119    background-position: 0 -320px; }
     120    div.checker span.checked {
     121      background-position: -92px -320px; }
     122  div.checker input {
     123    opacity: 0;
     124    filter: alpha(opacity=0);
     125    -moz-opacity: 0;
     126    border: none;
     127    background: none;
     128    display: -moz-inline-box;
     129    display: inline-block;
     130    *display: inline;
     131    zoom: 1; }
     132  div.checker.active span {
     133    background-position: -23px -320px; }
     134    div.checker.active span.checked {
     135      background-position: -115px -320px; }
     136  div.checker.hover span, div.checker.focus span {
     137    background-position: -46px -320px; }
     138    div.checker.hover span.checked, div.checker.focus span.checked {
     139      background-position: -138px -320px; }
     140  div.checker.hover.active span, div.checker.focus.active span {
     141    background-position: -69px -320px; }
     142    div.checker.hover.active span.checked, div.checker.focus.active span.checked {
     143      background-position: -161px -320px; }
     144  div.checker.disabled, div.checker.disabled.active {
     145    background-position: -184px -320px; }
     146    div.checker.disabled span.checked, div.checker.disabled.active span.checked {
     147      background-position: -207px -320px; }
     148
     149/* Radio */
     150div.radio {
     151  position: relative; }
     152  div.radio, div.radio span, div.radio input {
     153    width: 23px;
     154    height: 23px; }
     155  div.radio span {
     156    display: -moz-inline-box;
     157    display: inline-block;
     158    *display: inline;
     159    zoom: 1;
     160    text-align: center;
     161    background-position: 0 -343px; }
     162    div.radio span.checked {
     163      background-position: -92px -343px; }
     164  div.radio input {
     165    opacity: 0;
     166    filter: alpha(opacity=0);
     167    -moz-opacity: 0;
     168    border: none;
     169    background: none;
     170    display: -moz-inline-box;
     171    display: inline-block;
     172    *display: inline;
     173    zoom: 1;
     174    text-align: center; }
     175  div.radio.active span {
     176    background-position: -23px -18px -343px; }
     177    div.radio.active span.checked {
     178      background-position: -115px -343px; }
     179  div.radio.hover span, div.radio.focus span {
     180    background-position: -46px -36px -343px; }
     181    div.radio.hover span.checked, div.radio.focus span.checked {
     182      background-position: -138px -343px; }
     183  div.radio.hover.active span, div.radio.focus.active span {
     184    background-position: -69px -343px; }
     185    div.radio.hover.active span.checked, div.radio.focus.active span.checked {
     186      background-position: -161px -343px; }
     187  div.radio.disabled span, div.radio.disabled.active span {
     188    background-position: -184px -343px; }
     189    div.radio.disabled span.checked, div.radio.disabled.active span.checked {
     190      background-position: -207px -343px; }
     191
     192/* Uploader */
     193div.uploader {
     194  background-position: 0 -366px;
     195  height: 32px;
     196  width: 190px;
     197  cursor: pointer;
     198  position: relative;
     199  overflow: hidden; }
     200  div.uploader span.action {
     201    background-position: right -494px;
     202    height: 32px;
     203    line-height: 32px;
     204    width: 90px;
     205    text-align: center;
     206    float: left;
     207    display: inline;
     208    overflow: hidden;
     209    cursor: pointer; }
     210  div.uploader span.filename {
     211    text-overflow: ellipsis;
     212    display: block;
     213    overflow: hidden;
     214    white-space: nowrap;
     215    float: left;
     216    cursor: default;
     217    height: 32px;
     218    margin: 0px 0 0px 4px;
     219    line-height: 32px;
     220    width: 76px;
     221    padding: 0 10px; }
     222  div.uploader input {
     223    opacity: 0;
     224    filter: alpha(opacity=0);
     225    -moz-opacity: 0;
     226    border: none;
     227    background: none;
     228    position: absolute;
     229    top: 0;
     230    right: 0;
     231    float: right;
     232    cursor: default;
     233    width: 100%;
     234    height: 100%; }
     235  div.uploader.active span.action {
     236    background-position: right -558px; }
     237  div.uploader.hover, div.uploader.focus {
     238    background-position: 0 -430px; }
     239    div.uploader.hover span.action, div.uploader.focus span.action {
     240      background-position: right -526px; }
     241    div.uploader.hover.active span.action, div.uploader.focus.active span.action {
     242      background-position: right -590px; }
     243  div.uploader.disabled, div.uploader.disabled.active {
     244    background-position: 0 -398px; }
     245    div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     246      background-position: right -462px; }
     247
     248/* Buttons */
     249div.button {
     250  background-position: 0 -750px;
     251  height: 32px;
     252  cursor: pointer;
     253  position: relative;
     254  /* Keep buttons barely visible so they can get focus */ }
     255  div.button a, div.button button, div.button input {
     256    opacity: 0.01;
     257    filter: alpha(opacity=1);
     258    -moz-opacity: 0.01;
     259    display: block;
     260    top: 0;
     261    left: 0;
     262    right: 0;
     263    bottom: 0;
     264    position: absolute; }
     265  div.button span {
     266    display: -moz-inline-box;
     267    display: inline-block;
     268    *display: inline;
     269    zoom: 1;
     270    line-height: 24px;
     271    text-align: center;
     272    background-position: right -622px;
     273    height: 24px;
     274    margin-left: 13px;
     275    padding: 9px 15px 0 2px; }
     276  div.button.active {
     277    background-position: 0 -782px; }
     278    div.button.active span {
     279      background-position: right -654px;
     280      cursor: default; }
     281  div.button.hover, div.button.focus {
     282    background-position: 0 -814px; }
     283    div.button.hover span, div.button.focus span {
     284      background-position: right -686px; }
     285  div.button.disabled, div.button.disabled.active {
     286    background-position: 0 -846px; }
     287    div.button.disabled span, div.button.disabled.active span {
     288      background-position: right -718px;
     289      cursor: default; }
     290
     291input.uniform-input,
     292select.uniform-multiselect,
     293textarea.uniform {
     294  font-size: 14px;
     295  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    50296  font-weight: normal;
    51   padding: 3px;
    52   color: #777;
    53   background: url('../images/bg-input-focus.png') repeat-x 0px 0px;
    54   background: url('../images/bg-input.png') repeat-x 0px 0px;
    55   border-top: solid 1px #aaa;
    56   border-left: solid 1px #aaa;
    57   border-bottom: solid 1px #ccc;
    58   border-right: solid 1px #ccc;
     297  color: #ffffff;
     298  background-color: #434343;
     299  border-top: solid 1px #1a1a1a;
     300  border-left: solid 1px #1a1a1a;
     301  border-bottom: solid 1px #1c1c1c;
     302  border-right: solid 1px #1c1c1c;
    59303  -webkit-border-radius: 3px;
    60304  -moz-border-radius: 3px;
    61   border-radius: 3px;
    62   outline: 0;
    63 }
    64 
    65 input.text:focus,
    66 input.email:focus,
    67 input.password:focus,
    68 textarea.uniform:focus {
    69   -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    70   -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    71   box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    72   border-color: #999;
    73   background: url('../images/bg-input-focus.png') repeat-x 0px 0px;
    74 }
    75 
    76 /* SPRITES */
    77 
    78 /* Select */
    79 
    80 div.selector {
    81   background-position: -483px -160px;
    82   line-height: 32px;
    83     height: 32px;
    84 }
    85 
    86 div.selector span {
    87   background-position: right 0px;
    88   height: 32px;
    89     line-height: 32px;
    90 }
    91 
    92 div.selector select {
    93   /* change these to adjust positioning of select element */
    94   top: 0px;
    95     left: 0px;
    96 }
    97 
    98 div.selector:active,
    99 div.selector.active {
    100     background-position: -483px -192px;
    101 }
    102 
    103 div.selector:active span,
    104 div.selector.active span {
    105     background-position: right -32px;
    106 }
    107 
    108 div.selector.focus, div.selector.hover, div.selector:hover {
    109     background-position: -483px -224px;
    110 }
    111 
    112 div.selector.focus span, div.selector.hover span, div.selector:hover span {
    113     background-position: right -64px;
    114 }
    115 
    116 div.selector.focus:active,
    117 div.selector.focus.active,
    118 div.selector:hover:active,
    119 div.selector.active:hover {
    120     background-position: -483px -256px;
    121 }
    122 
    123 div.selector.focus:active span,
    124 div.selector:hover:active span,
    125 div.selector.active:hover span,
    126 div.selector.focus.active span {
    127     background-position: right -96px;
    128 }
    129 
    130 div.selector.disabled,
    131 div.selector.disabled:active,
    132 div.selector.disabled.active {
    133     background-position: -483px -288px;
    134 }
    135 
    136 div.selector.disabled span,
    137 div.selector.disabled:active span,
    138 div.selector.disabled.active span {
    139   background-position: right -128px;
    140 }
    141 
    142 /* Checkbox */
    143 
    144 div.checker {
    145   width: 23px;
    146   height: 23px;
    147 }
    148 
    149 div.checker input {
    150   width: 23px;
    151   height: 23px;
    152 }
    153 
    154 div.checker span {
    155   background-position: 0px -320px;
    156   height: 23px;
    157   width: 23px;
    158 }
    159 
    160 div.checker:active span,
    161 div.checker.active span {
    162     background-position: -23px -320px;
    163 }
    164 
    165 div.checker.focus span,
    166 div.checker:hover span {
    167     background-position: -46px -320px;
    168 }
    169 
    170 div.checker.focus:active span,
    171 div.checker:active:hover span,
    172 div.checker.active:hover span,
    173 div.checker.focus.active span {
    174     background-position: -69px -320px;
    175 }
    176 
    177 div.checker span.checked {
    178     background-position: -92px -320px;
    179 }
    180 
    181 div.checker:active span.checked,
    182 div.checker.active span.checked {
    183     background-position: -115px -320px;
    184 }
    185 
    186 div.checker.focus span.checked,
    187 div.checker:hover span.checked {
    188     background-position: -138px -320px;
    189 }
    190 
    191 div.checker.focus:active span.checked,
    192 div.checker:hover:active span.checked,
    193 div.checker.active:hover span.checked,
    194 div.checker.active.focus span.checked {
    195     background-position: -161px -320px;
    196 }
    197 
    198 div.checker.disabled span,
    199 div.checker.disabled:active span,
    200 div.checker.disabled.active span {
    201     background-position: -184px -320px;
    202 }
    203 
    204 div.checker.disabled span.checked,
    205 div.checker.disabled:active span.checked,
    206 div.checker.disabled.active span.checked {
    207     background-position: -207px -320px;
    208 }
    209 
    210 /* radio */
    211 
    212 div.radio {
    213   width: 23px;
    214   height: 23px;
    215 }
    216 
    217 div.radio input {
    218   width: 23px;
    219   height: 23px;
    220 }
    221 
    222 div.radio span {
    223   height: 23px;
    224   width: 23px;
    225   background-position: 0px -343px;
    226 }
    227 
    228 div.radio:active span,
    229 div.radio.active span {
    230     background-position: -23px -343px;
    231 }
    232 
    233 div.radio.focus span,
    234 div.radio:hover span {
    235     background-position: -46px -343px;
    236 }
    237 
    238 div.radio.focus:active span,
    239 div.radio:active:hover span,
    240 div.radio.active:hover span,
    241 div.radio.active.focus span {
    242     background-position: -69px -343px;
    243 }
    244 
    245 div.radio span.checked {
    246     background-position: -92px -343px;
    247 }
    248 
    249 div.radio:active span.checked,
    250 div.radio.active span.checked {
    251     background-position: -115px -343px;
    252 }
    253 
    254 div.radio.focus span.checked, div.radio:hover span.checked {
    255     background-position: -138px -343px;
    256 }
    257 
    258 div.radio.focus:active span.checked,
    259 div.radio:hover:active span.checked,
    260 div.radio.focus.active span.checked,
    261 div.radio.active:hover span.checked {
    262     background-position: -161px -343px;
    263 }
    264 
    265 div.radio.disabled span,
    266 div.radio.disabled:active span,
    267 div.radio.disabled.active span {
    268     background-position: -184px -343px;
    269 }
    270 
    271 div.radio.disabled span.checked,
    272 div.radio.disabled:active span.checked,
    273 div.radio.disabled.active span.checked {
    274     background-position: -207px -343px;
    275 }
    276 
    277 /* uploader */
    278 
    279 div.uploader {
    280   background-position: 0px -366px;
    281   height: 32px;
    282 }
    283 
    284 div.uploader span.action {
    285   background-position: right -494px;
    286   height: 24px;
    287   line-height: 24px;
    288 }
    289 
    290 div.uploader span.filename {
    291   height: 24px;
    292   /* change this line to adjust positioning of filename area */
    293   margin: 4px 0px 4px 4px;
    294   line-height: 24px;
    295 }
    296 
    297 div.uploader.focus,
    298 div.uploader.hover,
    299 div.uploader:hover {
    300   background-position: 0px -430px;
    301 }
    302 
    303 div.uploader.focus span.action,
    304 div.uploader.hover span.action,
    305 div.uploader:hover span.action {
    306   background-position: right -526px;
    307 }
    308 
    309 div.uploader.active span.action,
    310 div.uploader:active span.action {
    311   background-position: right -558px;
    312 }
    313 
    314 div.uploader.focus.active span.action,
    315 div.uploader:focus.active span.action,
    316 div.uploader.focus:active span.action,
    317 div.uploader:focus:active span.action {
    318   background-position: right -590px;
    319 }
    320 
    321 div.uploader.disabled {
    322   background-position: 0px -398px;
    323 }
    324 
    325  div.uploader.disabled span.action {
    326   background-position: right -462px;
    327 }
    328 
    329 /* PRESENTATION */
     305  border-radius: 3px; }
     306  input.uniform-input.hover, input.uniform-input.focus,
     307  select.uniform-multiselect.hover,
     308  select.uniform-multiselect.focus,
     309  textarea.uniform.hover,
     310  textarea.uniform.focus {
     311    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     312    -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     313    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     314    border-color: #999;
     315    background-color: #575757; }
     316
     317div.button span {
     318  color: #ffffff;
     319  font-weight: bold;
     320  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
     321  font-size: 13px;
     322  letter-spacing: 1px;
     323  text-transform: uppercase; }
     324div.button.disabled span, div.button.disabled.active span {
     325  color: #bbb; }
    330326
    331327/* Select */
    332328div.selector {
    333   margin-bottom: 20px;
    334   width: 190px;
    335329  font-weight: bold;
    336330  color: #464545;
    337   font-size: 14px;
    338 }
    339 
    340 div.selector select {
    341   width: 190px;
    342   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    343     font-size: 1em;
    344     border: solid 1px #fff;
    345 }
    346 
    347 div.selector span {
    348   padding: 0px 25px 0px 2px;
    349   cursor: pointer;
    350 }
    351 
    352 div.selector span {
    353   color: #ffffff;
    354   width: 158px;
    355   text-shadow: rgba(0,0,0,0.5) 0px -1px 0px;
    356 }
    357 
    358 div.selector.disabled span {
    359     color: #bbb;
    360 }
    361 
    362 /* BUTTONS */
    363 
    364 /* BUTTONS */
    365 
    366 div.button {
    367   background-position: 0px -530px;
    368 }
    369 
    370 div.button span {
    371   background-position: right -655px;
    372   color: #fff
    373 }
    374 
    375 div.button.focus,
    376 div.button:focus,
    377 div.button:hover,
    378 div.button.hover {
    379   background-position: 0px -499px;
    380   cursor: pointer;
    381 }
    382 
    383 div.button.focus span,
    384 div.button:focus span,
    385 div.button:hover span,
    386 div.button.hover span {
    387   background-position: right -624px;
    388   cursor: pointer;
    389 }
    390 
    391 div.button.active,
    392 div.button:active {
    393   background-position: 0px -563px;
    394 }
    395 
    396 div.button.active span,
    397 div.button:active span {
    398   background-position: right -688px;
    399   color: #999;
    400   cursor: pointer;
    401 }
    402 
    403 div.button.disabled,
    404 div.button:disabled {
    405   background-position: 0px -613px;
    406 }
    407 
    408 div.button.disabled span,
    409 div.button:disabled span {
    410   background-position: right -733px;
    411   color: #bbb;
    412   cursor: default;
    413 }
    414 
    415 /* PRESENTATION */
    416 
    417 /* Button */
    418 
    419 div.button {
    420   height: 30px;
    421 }
    422 
    423 div.button span {
    424   margin-left: 21px;
    425   height: 22px;
    426   padding-top: 8px;
    427   padding-bottom: 8px;
    428   font-weight: bold;
    429   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    430   font-size: 12px;
    431   letter-spacing: 1px;
    432   text-transform: uppercase;
    433   padding-left: 2px;
    434   padding-right: 0px;
    435   color: #fff;
    436 }
    437 
    438 /* checker */
     331  font-size: 14px; }
     332  div.selector span {
     333    padding: 0 25px 0 0;
     334    color: #fff;
     335    font-weight: normal;
     336    text-shadow: 0 1px 0 white; }
     337  div.selector select {
     338    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
     339    font-size: 1em;
     340    border: solid 1px white; }
     341  div.selector.disabled span, div.selector.disabled.active span {
     342    color: #bbb; }
     343
     344/* Checker */
    439345div.checker {
    440   margin-right: 10px;
    441 }
    442 
    443 /* radio */
     346  margin-right: 10px; }
     347
     348/* Radio */
    444349div.radio {
    445   margin-right: 10px;
    446 }
    447 
    448 /* uploader */
     350  margin-right: 10px; }
     351
     352/* Uploader */
    449353div.uploader {
    450   width: 190px;
    451354  margin-bottom: 20px;
    452   cursor: pointer;
    453 }
    454 
    455 div.uploader span.action {
    456   width: 83px;
    457   text-align: center;
    458   text-shadow: rgba(0,0,0,0.5) 0px -1px 0px;
    459   background-color: #1a1a1a;
    460   font-weight: bold;
    461   color: #ffffff;
    462 }
    463 
    464 div.uploader span.filename {
    465   color: #1a1a1a;
    466   width: 82px;
    467   border-right: solid 1px #2e2e2e;
    468   font-size: 90%;
    469   font-size: 11px;
    470 }
    471 
    472 div.uploader input {
    473   width: 190px;
    474 }
    475 
    476  div.uploader.disabled span.action {
    477   color: #aaa;
    478 }
    479 
    480  div.uploader.disabled span.filename {
    481   border-color: #ddd;
    482   color: #aaa;
    483 }
    484 /*
    485 
    486 CORE FUNCTIONALITY
    487 
    488 Not advised to edit stuff below this line
    489 -----------------------------------------------------
    490 */
    491 
    492 .selector select:focus, .radio input:focus, .checker input:focus, uploader input:focus {
    493   outline: 0;
    494 }
    495 
    496 /* Select */
    497 
    498  div.selector {
    499     position: relative;
    500     padding-left: 10px;
    501 }
    502 
    503  div.selector span {
    504     display: block;
    505     float: left;
    506 }
    507 
    508  div.selector select {
    509     position: absolute;
    510     opacity: 0;
    511 }
    512 
    513 /* checker */
    514 
    515  div.checker {
    516     position: relative;
    517     float: left;
    518 }
    519 
    520  div.checker span {
    521     display: block;
    522     float: left;
    523     text-align: center;
    524 }
    525 
    526 div.checker input {
    527   opacity: 0;
    528   display: inline-block;
    529 }
    530 
    531 /* radio */
    532 
    533 div.radio {
    534     position: relative;
    535     float: left;
    536 }
    537 
    538 div.radio span {
    539     display: block;
    540     float: left;
    541     text-align: center;
    542 }
    543 
    544  div.radio input {
    545   opacity: 0;
    546   text-align: center;
    547   display: inline-block;
    548 }
    549 
    550 /* uploader */
    551 
    552 div.uploader {
    553   position: relative;
    554   float: left;
    555   overflow: hidden;
    556 }
    557 
    558 div.uploader span.action {
    559   float: left;
    560   display: inline;
    561   padding: 4px 0px;
    562   overflow: hidden;
    563   cursor: pointer;
    564 }
    565 
    566 div.uploader span.filename {
    567   padding: 0px 10px;
    568   float: left;
    569   display: block;
    570   overflow: hidden;
    571   text-overflow: ellipsis;
    572   white-space: nowrap;
    573 }
    574 
    575 div.uploader input {
    576   opacity: 0;
    577   position: absolute;
    578   top: 0;
    579   right: 0;
    580   bottom: 0;
    581   float: right;
    582 }
     355  cursor: pointer; }
     356  div.uploader span.action {
     357    text-align: center;
     358    text-shadow: #1a1a1a 0px 1px 0px;
     359    background-color: #fff;
     360    font-weight: bold;
     361    color: #ffffff; }
     362  div.uploader span.filename {
     363    color: #777;
     364    font-size: 11px; }
     365  div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     366    color: #aaa; }
     367  div.uploader.disabled span.filename, div.uploader.disabled.active span.filename {
     368    border-color: #ddd;
     369    color: #aaa; }
  • uniform-js/trunk/css/uniform.aristo.css

    r689371 r1067311  
    22
    33Uniform Theme: Aristo
    4 Version: 1.0
     4Version: 1.1
    55By: 280North / Ported by Josh Pyles
    66License: Creative Commons Share Alike
    77---
    88For use with the Uniform plugin:
    9 http://pixelmatrixdesign.com/uniform/
    10 ---
    11 Generated by Uniform Theme Generator:
    12 http://pixelmatrixdesign.com/uniform/themer.html
     9http://uniformjs.com/
    1310
    1411*/
    15 
    16 /* Global Declaration */
    17 
    18 div.selector,
    19 div.selector span,
    20 div.checker span,
    21 div.radio span,
    22 div.uploader,
    23 div.uploader span.action,
    24 div.button,
    25 div.button span {
    26   background-image: url(../images/sprite-aristo.png);
     12/* General settings */
     13div.selector, div.selector span, div.checker span, div.radio span, div.uploader, div.uploader span.action, div.button, div.button span {
     14  background-image: url("../images/sprite-aristo.png");
    2715  background-repeat: no-repeat;
    28   -webkit-font-smoothing: antialiased;
    29 }
    30 
    31 .selector,
    32 .radio,
    33 .checker,
    34 .uploader,
    35 .button,
    36 .selector *,
    37 .radio *,
    38 .checker *,
    39 .uploader *,
    40 .button * {
    41     margin: 0;
    42     padding: 0;
    43 }
     16  -webkit-font-smoothing: antialiased; }
     17div.selector, div.checker, div.button, div.radio, div.uploader {
     18  display: -moz-inline-box;
     19  display: inline-block;
     20  *display: inline;
     21  zoom: 1;
     22  vertical-align: middle;
     23  /* Keeping this as :focus to remove browser styles */ }
     24  div.selector:focus, div.checker:focus, div.button:focus, div.radio:focus, div.uploader:focus {
     25    outline: 0; }
     26div.selector, div.selector *, div.radio, div.radio *, div.checker, div.checker *, div.uploader, div.uploader *, div.button, div.button * {
     27  margin: 0;
     28  padding: 0; }
     29
     30.highContrastDetect {
     31  background: url("../images/bg-input-aristo.png") repeat-x 0 0;
     32  width: 0px;
     33  height: 0px; }
     34
     35/* Input & Textarea */
     36input.uniform-input,
     37select.uniform-multiselect,
     38textarea.uniform {
     39  padding: 4px;
     40  background: url("../images/bg-input-aristo.png") repeat-x 0 0;
     41  outline: 0; }
     42  input.uniform-input.active,
     43  select.uniform-multiselect.active,
     44  textarea.uniform.active {
     45    background: url("../images/bg-input-focus-aristo.png") repeat-x 0 0; }
     46
     47/* Remove default webkit and possible mozilla .search styles.
     48 * Keeping this as :active to remove browser styles */
     49div.checker input,
     50input[type="search"],
     51input[type="search"]:active {
     52  -moz-appearance: none;
     53  -webkit-appearance: none; }
     54
     55/* Select */
     56div.selector {
     57  background-position: 0 -160px;
     58  line-height: 32px;
     59  height: 32px;
     60  padding: 0 0 0 10px;
     61  position: relative;
     62  overflow: hidden; }
     63  div.selector span {
     64    text-overflow: ellipsis;
     65    display: block;
     66    overflow: hidden;
     67    white-space: nowrap;
     68    background-position: right 0;
     69    height: 32px;
     70    line-height: 32px;
     71    padding-right: 25px;
     72    cursor: pointer;
     73    width: 100%;
     74    display: block; }
     75  div.selector.fixedWidth {
     76    width: 190px; }
     77    div.selector.fixedWidth span {
     78      width: 155px; }
     79  div.selector select {
     80    opacity: 0;
     81    filter: alpha(opacity=0);
     82    -moz-opacity: 0;
     83    border: none;
     84    background: none;
     85    position: absolute;
     86    height: 24px;
     87    top: 4px;
     88    left: 0px;
     89    width: 100%; }
     90  div.selector.active {
     91    background-position: 0 -192px; }
     92    div.selector.active span {
     93      background-position: right -32px; }
     94  div.selector.hover, div.selector.focus {
     95    background-position: 0 -224px; }
     96    div.selector.hover span, div.selector.focus span {
     97      background-position: right -64px; }
     98    div.selector.hover.active, div.selector.focus.active {
     99      background-position: 0 -256px; }
     100      div.selector.hover.active span, div.selector.focus.active span {
     101        background-position: right -96px; }
     102  div.selector.disabled, div.selector.disabled.active {
     103    background-position: 0 -288px; }
     104    div.selector.disabled span, div.selector.disabled.active span {
     105      background-position: right -128px; }
     106
     107/* Checkbox */
     108div.checker {
     109  position: relative; }
     110  div.checker, div.checker span, div.checker input {
     111    width: 23px;
     112    height: 23px; }
     113  div.checker span {
     114    display: -moz-inline-box;
     115    display: inline-block;
     116    *display: inline;
     117    zoom: 1;
     118    text-align: center;
     119    background-position: 0 -320px; }
     120    div.checker span.checked {
     121      background-position: -92px -320px; }
     122  div.checker input {
     123    opacity: 0;
     124    filter: alpha(opacity=0);
     125    -moz-opacity: 0;
     126    border: none;
     127    background: none;
     128    display: -moz-inline-box;
     129    display: inline-block;
     130    *display: inline;
     131    zoom: 1; }
     132  div.checker.active span {
     133    background-position: -23px -320px; }
     134    div.checker.active span.checked {
     135      background-position: -115px -320px; }
     136  div.checker.hover span, div.checker.focus span {
     137    background-position: -46px -320px; }
     138    div.checker.hover span.checked, div.checker.focus span.checked {
     139      background-position: -138px -320px; }
     140  div.checker.hover.active span, div.checker.focus.active span {
     141    background-position: -69px -320px; }
     142    div.checker.hover.active span.checked, div.checker.focus.active span.checked {
     143      background-position: -161px -320px; }
     144  div.checker.disabled, div.checker.disabled.active {
     145    background-position: -184px -320px; }
     146    div.checker.disabled span.checked, div.checker.disabled.active span.checked {
     147      background-position: -207px -320px; }
     148
     149/* Radio */
     150div.radio {
     151  position: relative; }
     152  div.radio, div.radio span, div.radio input {
     153    width: 23px;
     154    height: 23px; }
     155  div.radio span {
     156    display: -moz-inline-box;
     157    display: inline-block;
     158    *display: inline;
     159    zoom: 1;
     160    text-align: center;
     161    background-position: 0 -343px; }
     162    div.radio span.checked {
     163      background-position: -92px -343px; }
     164  div.radio input {
     165    opacity: 0;
     166    filter: alpha(opacity=0);
     167    -moz-opacity: 0;
     168    border: none;
     169    background: none;
     170    display: -moz-inline-box;
     171    display: inline-block;
     172    *display: inline;
     173    zoom: 1;
     174    text-align: center; }
     175  div.radio.active span {
     176    background-position: -23px -18px -343px; }
     177    div.radio.active span.checked {
     178      background-position: -115px -343px; }
     179  div.radio.hover span, div.radio.focus span {
     180    background-position: -46px -36px -343px; }
     181    div.radio.hover span.checked, div.radio.focus span.checked {
     182      background-position: -138px -343px; }
     183  div.radio.hover.active span, div.radio.focus.active span {
     184    background-position: -69px -343px; }
     185    div.radio.hover.active span.checked, div.radio.focus.active span.checked {
     186      background-position: -161px -343px; }
     187  div.radio.disabled span, div.radio.disabled.active span {
     188    background-position: -184px -343px; }
     189    div.radio.disabled span.checked, div.radio.disabled.active span.checked {
     190      background-position: -207px -343px; }
     191
     192/* Uploader */
     193div.uploader {
     194  background-position: 0 -366px;
     195  height: 32px;
     196  width: 190px;
     197  cursor: pointer;
     198  position: relative;
     199  overflow: hidden; }
     200  div.uploader span.action {
     201    background-position: right -494px;
     202    height: 32px;
     203    line-height: 32px;
     204    width: 90px;
     205    text-align: center;
     206    float: left;
     207    display: inline;
     208    overflow: hidden;
     209    cursor: pointer; }
     210  div.uploader span.filename {
     211    text-overflow: ellipsis;
     212    display: block;
     213    overflow: hidden;
     214    white-space: nowrap;
     215    float: left;
     216    cursor: default;
     217    height: 24px;
     218    margin: 4px 0 4px 4px;
     219    line-height: 24px;
     220    width: 76px;
     221    padding: 0 10px; }
     222  div.uploader input {
     223    opacity: 0;
     224    filter: alpha(opacity=0);
     225    -moz-opacity: 0;
     226    border: none;
     227    background: none;
     228    position: absolute;
     229    top: 0;
     230    right: 0;
     231    float: right;
     232    cursor: default;
     233    width: 100%;
     234    height: 100%; }
     235  div.uploader.active span.action {
     236    background-position: right -558px; }
     237  div.uploader.hover, div.uploader.focus {
     238    background-position: 0 -430px; }
     239    div.uploader.hover span.action, div.uploader.focus span.action {
     240      background-position: right -526px; }
     241    div.uploader.hover.active span.action, div.uploader.focus.active span.action {
     242      background-position: right -590px; }
     243  div.uploader.disabled, div.uploader.disabled.active {
     244    background-position: 0 -398px; }
     245    div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     246      background-position: right -462px; }
     247
     248/* Buttons */
     249div.button {
     250  background-position: 0 -750px;
     251  height: 32px;
     252  cursor: pointer;
     253  position: relative;
     254  /* Keep buttons barely visible so they can get focus */ }
     255  div.button a, div.button button, div.button input {
     256    opacity: 0.01;
     257    filter: alpha(opacity=1);
     258    -moz-opacity: 0.01;
     259    display: block;
     260    top: 0;
     261    left: 0;
     262    right: 0;
     263    bottom: 0;
     264    position: absolute; }
     265  div.button span {
     266    display: -moz-inline-box;
     267    display: inline-block;
     268    *display: inline;
     269    zoom: 1;
     270    line-height: 22px;
     271    text-align: center;
     272    background-position: right -622px;
     273    height: 22px;
     274    margin-left: 13px;
     275    padding: 5px 15px 5px 2px; }
     276  div.button.active {
     277    background-position: 0 -782px; }
     278    div.button.active span {
     279      background-position: right -654px;
     280      cursor: default; }
     281  div.button.hover, div.button.focus {
     282    background-position: 0 -814px; }
     283    div.button.hover span, div.button.focus span {
     284      background-position: right -686px; }
     285  div.button.disabled, div.button.disabled.active {
     286    background-position: 0 -846px; }
     287    div.button.disabled span, div.button.disabled.active span {
     288      background-position: right -718px;
     289      cursor: default; }
    44290
    45291/* INPUT & TEXTAREA */
    46 
    47 input.text,
    48 input.email,
    49 input.password,
     292input.uniform-input,
     293select.uniform-multiselect,
    50294textarea.uniform {
    51   font-size: 12px;
    52   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     295  font-size: 14px;
     296  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    53297  font-weight: normal;
    54   padding: 5px !important;
    55298  color: #777;
    56   background: #fff url('../images/bg-input-focus.png') repeat-x 0px 0px !important;
    57   background: #fff url('../images/bg-input.png') repeat-x 0px 0px !important;
    58   border-top: solid 1px #aaa;
    59   border-left: solid 1px #aaa;
    60   border-bottom: solid 1px #ccc;
    61   border-right: solid 1px #ccc;
     299  background-color: #a1cbe2;
     300  border-top: solid 1px #aaaaaa;
     301  border-left: solid 1px #aaaaaa;
     302  border-bottom: solid 1px #cccccc;
     303  border-right: solid 1px #cccccc;
    62304  -webkit-border-radius: 3px;
    63305  -moz-border-radius: 3px;
    64   border-radius: 3px;
    65   outline: 0;
    66 }
    67 
    68 input.text:focus,
    69 input.email:focus,
    70 input.password:focus,
    71 textarea.uniform:focus {
    72   -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    73   -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    74   box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    75   border-color: #999;
    76   background: url('../images/bg-input-focus.png') repeat-x 0px 0px;
    77 }
    78 
    79 /* SPRITES */
    80 
    81 /* Select */
    82 
    83 div.selector {
    84   background-position: -483px -160px;
    85   line-height: 32px;
    86     height: 32px;
    87 }
    88 
    89 div.selector span {
    90   background-position: right 0px;
    91   height: 32px;
    92     line-height: 32px;
    93 }
    94 
    95 div.selector select {
    96   /* change these to adjust positioning of select element */
    97   top: 0px;
    98     left: 0px;
    99 }
    100 
    101 div.selector:active,
    102 div.selector.active {
    103     background-position: -483px -192px;
    104 }
    105 
    106 div.selector:active span,
    107 div.selector.active span {
    108     background-position: right -32px;
    109 }
    110 
    111 div.selector.focus, div.selector.hover, div.selector:hover {
    112     background-position: -483px -224px;
    113 }
    114 
    115 div.selector.focus span, div.selector.hover span, div.selector:hover span {
    116     background-position: right -64px;
    117 }
    118 
    119 div.selector.focus:active,
    120 div.selector.focus.active,
    121 div.selector:hover:active,
    122 div.selector.active:hover {
    123     background-position: -483px -256px;
    124 }
    125 
    126 div.selector.focus:active span,
    127 div.selector:hover:active span,
    128 div.selector.active:hover span,
    129 div.selector.focus.active span {
    130     background-position: right -96px;
    131 }
    132 
    133 div.selector.disabled,
    134 div.selector.disabled:active,
    135 div.selector.disabled.active {
    136     background-position: -483px -288px;
    137 }
    138 
    139 div.selector.disabled span,
    140 div.selector.disabled:active span,
    141 div.selector.disabled.active span {
    142   background-position: right -128px;
    143 }
    144 
    145 /* Checkbox */
    146 
    147 div.checker {
    148   width: 23px;
    149   height: 23px;
    150 }
    151 
    152 div.checker input {
    153   width: 23px;
    154   height: 23px;
    155 }
    156 
    157 div.checker span {
    158   background-position: 0px -320px;
    159   height: 23px !important;
    160   width: 23px !important;
    161 }
    162 
    163 div.checker:active span,
    164 div.checker.active span {
    165     background-position: -23px -320px;
    166 }
    167 
    168 div.checker.focus span,
    169 div.checker:hover span {
    170     background-position: -46px -320px;
    171 }
    172 
    173 div.checker.focus:active span,
    174 div.checker:active:hover span,
    175 div.checker.active:hover span,
    176 div.checker.focus.active span {
    177     background-position: -69px -320px;
    178 }
    179 
    180 div.checker span.checked {
    181     background-position: -92px -320px;
    182 }
    183 
    184 div.checker:active span.checked,
    185 div.checker.active span.checked {
    186     background-position: -115px -320px;
    187 }
    188 
    189 div.checker.focus span.checked,
    190 div.checker:hover span.checked {
    191     background-position: -138px -320px;
    192 }
    193 
    194 div.checker.focus:active span.checked,
    195 div.checker:hover:active span.checked,
    196 div.checker.active:hover span.checked,
    197 div.checker.active.focus span.checked {
    198     background-position: -161px -320px;
    199 }
    200 
    201 div.checker.disabled span,
    202 div.checker.disabled:active span,
    203 div.checker.disabled.active span {
    204     background-position: -184px -320px;
    205 }
    206 
    207 div.checker.disabled span.checked,
    208 div.checker.disabled:active span.checked,
    209 div.checker.disabled.active span.checked {
    210     background-position: -207px -320px;
    211 }
    212 
    213 /* radio */
    214 
    215 div.radio {
    216   width: 23px;
    217   height: 23px;
    218 }
    219 
    220 div.radio input {
    221   width: 23px;
    222   height: 23px;
    223 }
    224 
    225 div.radio span {
    226   height: 23px;
    227   width: 23px;
    228   background-position: 0px -343px;
    229 }
    230 
    231 div.radio:active span,
    232 div.radio.active span {
    233     background-position: -23px -343px;
    234 }
    235 
    236 div.radio.focus span,
    237 div.radio:hover span {
    238     background-position: -46px -343px;
    239 }
    240 
    241 div.radio.focus:active span,
    242 div.radio:active:hover span,
    243 div.radio.active:hover span,
    244 div.radio.active.focus span {
    245     background-position: -69px -343px;
    246 }
    247 
    248 div.radio span.checked {
    249     background-position: -92px -343px;
    250 }
    251 
    252 div.radio:active span.checked,
    253 div.radio.active span.checked {
    254     background-position: -115px -343px;
    255 }
    256 
    257 div.radio.focus span.checked, div.radio:hover span.checked {
    258     background-position: -138px -343px;
    259 }
    260 
    261 div.radio.focus:active span.checked,
    262 div.radio:hover:active span.checked,
    263 div.radio.focus.active span.checked,
    264 div.radio.active:hover span.checked {
    265     background-position: -161px -343px;
    266 }
    267 
    268 div.radio.disabled span,
    269 div.radio.disabled:active span,
    270 div.radio.disabled.active span {
    271     background-position: -184px -343px;
    272 }
    273 
    274 div.radio.disabled span.checked,
    275 div.radio.disabled:active span.checked,
    276 div.radio.disabled.active span.checked {
    277     background-position: -207px -343px;
    278 }
    279 
    280 /* uploader */
    281 
    282 div.uploader {
    283   background-position: 0px -366px;
    284   height: 32px;
    285 }
    286 
    287 div.uploader span.action {
    288   background-position: left 0px;
    289   height: 24px;
    290   line-height: 24px;
    291 }
    292 
    293 div.uploader span.filename {
    294   height: 24px;
    295   /* change this line to adjust positioning of filename area */
    296   margin: 4px 0px 4px 4px;
    297   line-height: 24px;
    298 }
    299 
    300 div.uploader.focus,
    301 div.uploader.hover,
    302 div.uploader:hover {
    303   background-position: 0px -430px;
    304 }
    305 
    306 div.uploader.focus span.action,
    307 div.uploader.hover span.action,
    308 div.uploader:hover span.action {
    309   background-position: right -526px;
    310 }
    311 
    312 div.uploader.active span.action,
    313 div.uploader:active span.action {
    314   background-position: right -558px;
    315 }
    316 
    317 div.uploader.focus.active span.action,
    318 div.uploader:focus.active span.action,
    319 div.uploader.focus:active span.action,
    320 div.uploader:focus:active span.action {
    321   background-position: right -590px;
    322 }
    323 
    324 div.uploader.disabled {
    325   background-position: 0px -398px;
    326 }
    327 
    328  div.uploader.disabled span.action {
    329   background-position: right -462px;
    330 }
    331 
    332 /* PRESENTATION */
     306  border-radius: 3px; }
     307  input.uniform-input.hover, input.uniform-input.focus,
     308  select.uniform-multiselect.hover,
     309  select.uniform-multiselect.focus,
     310  textarea.uniform.hover,
     311  textarea.uniform.focus {
     312    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
     313    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
     314    box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
     315    border-color: #999;
     316    background-color: #a1cbe2; }
     317
     318/* Uploader */
     319div.button span {
     320  font-weight: bold;
     321  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
     322  font-size: 13px;
     323  letter-spacing: 1px;
     324  text-transform: uppercase; }
     325div.button.hover span, div.button.focus span {
     326  color: #555; }
     327div.button.disabled span, div.button.disabled.active span {
     328  color: #bbb; }
    333329
    334330/* Select */
    335331div.selector {
    336   margin-bottom: 20px;
    337   width: 190px;
    338332  font-weight: bold;
    339333  color: #464545;
    340   font-size: 14px;
    341 }
    342 
    343 div.selector select {
    344   width: 190px;
    345   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    346     font-size: 1em;
    347     border: solid 1px #fff;
    348 }
    349 
    350 div.selector span {
    351   padding: 0px 25px 0px 2px;
    352   cursor: pointer;
    353 }
    354 
    355 div.selector span {
    356   color: #666;
    357   width: 158px;
    358   text-shadow: 0 1px 0 #fff;
    359 }
    360 
    361 div.selector.disabled span {
    362     color: #bbb;
    363 }
    364 
    365 /* BUTTONS */
    366 
    367 div.button {
    368   background-position: 0px -529px;
    369 }
    370 
    371 div.button span {
    372   background-position: right -655px;
    373   width: auto !important;
    374 }
    375 
    376 div.button.focus,
    377 div.button:focus,
    378 div.button:hover,
    379 div.button.hover {
    380   background-position: 0px -499px;
    381   cursor: pointer;
    382 }
    383 
    384 div.button.focus span,
    385 div.button:focus span,
    386 div.button:hover span,
    387 div.button.hover span {
    388   background-position: right -624px;
    389   cursor: pointer;
    390 }
    391 
    392 div.button.active,
    393 div.button:active {
    394   background-position: 0px -563px;
    395 }
    396 
    397 div.button.active span,
    398 div.button:active span {
    399   background-position: right -688px;
    400   color: #555;
    401   cursor: pointer;
    402 }
    403 
    404 div.button.disabled,
    405 div.button:disabled {
    406   background-position: 0px -613px;
    407 }
    408 
    409 div.button.disabled span,
    410 div.button:disabled span {
    411   background-position: right -733px;
    412   color: #bbb;
    413   cursor: default;
    414 }
    415 
    416 /* PRESENTATION */
    417 
    418 /* Button */
    419 
    420 div.button {
    421   height: 32px;
    422 }
    423 
    424 div.button span {
    425   margin-left: 21px;
    426   height: 22px;
    427   padding-top: 3px;
    428   padding-bottom: 10px;
     334  font-size: 14px; }
     335  div.selector span {
     336    color: #666;
     337    text-shadow: 0 1px 0 white; }
     338  div.selector select {
     339    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
     340    font-size: 1em;
     341    border: solid 1px white; }
     342  div.selector.disabled span, div.selector.disabled.active span {
     343    color: #bbb; }
     344
     345/* Checker */
     346div.checker {
     347  margin-right: 10px; }
     348
     349/* Radio */
     350div.radio {
     351  margin-right: 10px; }
     352
     353div.uploader span.action {
     354  text-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px;
     355  background-color: #fff;
    429356  font-weight: bold;
    430   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    431   font-size: 12px;
    432   letter-spacing: 1px;
    433   text-transform: uppercase;
    434   padding-left: 2px;
    435   padding-right: 0px;
    436 }
    437 
    438 /* checker */
    439 div.checker {
    440   margin-right: 10px;
    441 }
    442 
    443 /* radio */
    444 div.radio {
    445   margin-right: 10px;
    446 }
    447 
    448 /* uploader */
    449 div.uploader {
    450   width: 287px;
    451   margin-bottom: 20px;
    452   cursor: pointer;
    453 }
    454 
    455 div.uploader span.action {
    456   width: 83px;
    457   text-align: center;
    458   text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
    459   font-weight: bold;
    460   color: #1c4257;
    461 }
    462 
     357  color: #1c4257; }
    463358div.uploader span.filename {
    464359  color: #777;
    465   width: 179px;
    466   border-right: solid 1px #567c91;
    467   font-size: 90%;
    468   font-size: 11px;
    469 }
    470 
    471 div.uploader input {
    472   width: 285px;
    473 }
    474 
    475  div.uploader.disabled span.action {
    476   color: #aaa;
    477 }
    478 
    479  div.uploader.disabled span.filename {
     360  font-size: 11px; }
     361div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     362  color: #aaa; }
     363div.uploader.disabled span.filename, div.uploader.disabled.active span.filename {
    480364  border-color: #ddd;
    481   color: #aaa;
    482 }
    483 /*
    484 
    485 CORE FUNCTIONALITY
    486 
    487 Not advised to edit stuff below this line
    488 -----------------------------------------------------
    489 */
    490 
    491 .selector select:focus, .radio input:focus, .checker input:focus, uploader input:focus {
    492   outline: 0;
    493 }
    494 
    495 /* Select */
    496 
    497  div.selector {
    498     position: relative;
    499     padding-left: 10px;
    500 }
    501 
    502  div.selector span {
    503     display: block;
    504     float: left;
    505 }
    506 
    507  div.selector select {
    508     position: absolute;
    509     opacity: 0;
    510 }
    511 
    512 /* checker */
    513 
    514  div.checker {
    515     position: relative;
    516     float: left;
    517 }
    518 
    519  div.checker span {
    520     display: block;
    521     float: left;
    522     text-align: center;
    523 }
    524 
    525 div.checker input {
    526   opacity: 0;
    527   display: inline-block;
    528 }
    529 
    530 /* radio */
    531 
    532 div.radio {
    533     position: relative;
    534     float: left;
    535 }
    536 
    537 div.radio span {
    538     display: block;
    539     float: left;
    540     text-align: center;
    541 }
    542 
    543  div.radio input {
    544   opacity: 0;
    545   text-align: center;
    546   display: inline-block;
    547 }
    548 
    549 /* uploader */
    550 
    551 div.uploader {
    552   position: relative;
    553   float: left;
    554   overflow: hidden;
    555 }
    556 
    557 div.uploader span.action {
    558   float: left;
    559   display: inline;
    560   padding: 4px 0px;
    561   overflow: hidden;
    562   cursor: pointer;
    563 }
    564 
    565 div.uploader span.filename {
    566   padding: 0px 10px;
    567   float: left;
    568   display: block;
    569   overflow: hidden;
    570   text-overflow: ellipsis;
    571   white-space: nowrap;
    572 }
    573 
    574 div.uploader input {
    575   opacity: 0;
    576   position: absolute;
    577   top: 0;
    578   right: 0;
    579   bottom: 0;
    580   float: right;
    581 }
     365  color: #aaa; }
  • uniform-js/trunk/css/uniform.default.css

    r689354 r1067311  
    22
    33Uniform Theme: Uniform Default
    4 Version: 1.6
     4Version: 1.8
    55By: Josh Pyles
    66License: MIT License
    77---
    88For use with the Uniform plugin:
    9 http://pixelmatrixdesign.com/uniform/
    10 ---
    11 Generated by Uniform Theme Generator:
    12 http://pixelmatrixdesign.com/uniform/themer.html
     9http://uniformjs.com/
    1310
    1411*/
    15 
    16 /* Global Declaration */
    17 
    18 div.selector,
    19 div.selector span,
    20 div.checker span,
    21 div.radio span,
    22 div.uploader,
    23 div.uploader span.action,
    24 div.button,
    25 div.button span {
    26   background-image: url(../images/sprite.png);
     12/* General settings */
     13div.selector, div.selector span, div.checker span, div.radio span, div.uploader, div.uploader span.action, div.button, div.button span {
     14  background-image: url("../images/sprite.png");
    2715  background-repeat: no-repeat;
    28   -webkit-font-smoothing: antialiased;
    29 }
    30 
    31 .selector,
    32 .radio,
    33 .checker,
    34 .uploader,
    35 .button,
    36 .selector *,
    37 .radio *,
    38 .checker *,
    39 .uploader *,
    40 .button *{
     16  -webkit-font-smoothing: antialiased; }
     17div.selector, div.checker, div.button, div.radio, div.uploader {
     18  display: -moz-inline-box;
     19  display: inline-block;
     20  *display: inline;
     21  zoom: 1;
     22  vertical-align: middle;
     23  /* Keeping this as :focus to remove browser styles */ }
     24  div.selector:focus, div.checker:focus, div.button:focus, div.radio:focus, div.uploader:focus {
     25    outline: 0; }
     26div.selector, div.selector *, div.radio, div.radio *, div.checker, div.checker *, div.uploader, div.uploader *, div.button, div.button * {
    4127  margin: 0;
    42   padding: 0;
    43 }
     28  padding: 0; }
     29
     30.highContrastDetect {
     31  background: url("../images/bg-input.png") repeat-x 0 0;
     32  width: 0px;
     33  height: 0px; }
     34
     35/* Input & Textarea */
     36input.uniform-input,
     37select.uniform-multiselect,
     38textarea.uniform {
     39  padding: 3px;
     40  background: url("../images/bg-input.png") repeat-x 0 0;
     41  outline: 0; }
     42  input.uniform-input.active,
     43  select.uniform-multiselect.active,
     44  textarea.uniform.active {
     45    background: url("../images/bg-input-focus.png") repeat-x 0 0; }
     46
     47/* Remove default webkit and possible mozilla .search styles.
     48 * Keeping this as :active to remove browser styles */
     49div.checker input,
     50input[type="search"],
     51input[type="search"]:active {
     52  -moz-appearance: none;
     53  -webkit-appearance: none; }
     54
     55/* Select */
     56div.selector {
     57  background-position: 0 -130px;
     58  line-height: 26px;
     59  height: 26px;
     60  padding: 0 0 0 10px;
     61  position: relative;
     62  overflow: hidden; }
     63  div.selector span {
     64    text-overflow: ellipsis;
     65    display: block;
     66    overflow: hidden;
     67    white-space: nowrap;
     68    background-position: right 0;
     69    height: 26px;
     70    line-height: 26px;
     71    padding-right: 25px;
     72    cursor: pointer;
     73    width: 100%;
     74    display: block; }
     75  div.selector.fixedWidth {
     76    width: 190px; }
     77    div.selector.fixedWidth span {
     78      width: 155px; }
     79  div.selector select {
     80    opacity: 0;
     81    filter: alpha(opacity=0);
     82    -moz-opacity: 0;
     83    border: none;
     84    background: none;
     85    position: absolute;
     86    height: 22px;
     87    top: 2px;
     88    left: 0px;
     89    width: 100%; }
     90  div.selector.active {
     91    background-position: 0 -156px; }
     92    div.selector.active span {
     93      background-position: right -26px; }
     94  div.selector.hover, div.selector.focus {
     95    background-position: 0 -182px; }
     96    div.selector.hover span, div.selector.focus span {
     97      background-position: right -52px; }
     98    div.selector.hover.active, div.selector.focus.active {
     99      background-position: 0 -208px; }
     100      div.selector.hover.active span, div.selector.focus.active span {
     101        background-position: right -78px; }
     102  div.selector.disabled, div.selector.disabled.active {
     103    background-position: 0 -234px; }
     104    div.selector.disabled span, div.selector.disabled.active span {
     105      background-position: right -104px; }
     106
     107/* Checkbox */
     108div.checker {
     109  position: relative; }
     110  div.checker, div.checker span, div.checker input {
     111    width: 19px;
     112    height: 19px; }
     113  div.checker span {
     114    display: -moz-inline-box;
     115    display: inline-block;
     116    *display: inline;
     117    zoom: 1;
     118    text-align: center;
     119    background-position: 0 -260px; }
     120    div.checker span.checked {
     121      background-position: -76px -260px; }
     122  div.checker input {
     123    opacity: 0;
     124    filter: alpha(opacity=0);
     125    -moz-opacity: 0;
     126    border: none;
     127    background: none;
     128    display: -moz-inline-box;
     129    display: inline-block;
     130    *display: inline;
     131    zoom: 1; }
     132  div.checker.active span {
     133    background-position: -19px -260px; }
     134    div.checker.active span.checked {
     135      background-position: -95px -260px; }
     136  div.checker.hover span, div.checker.focus span {
     137    background-position: -38px -260px; }
     138    div.checker.hover span.checked, div.checker.focus span.checked {
     139      background-position: -114px -260px; }
     140  div.checker.hover.active span, div.checker.focus.active span {
     141    background-position: -57px -260px; }
     142    div.checker.hover.active span.checked, div.checker.focus.active span.checked {
     143      background-position: -133px -260px; }
     144  div.checker.disabled, div.checker.disabled.active {
     145    background-position: -152px -260px; }
     146    div.checker.disabled span.checked, div.checker.disabled.active span.checked {
     147      background-position: -171px -260px; }
     148
     149/* Radio */
     150div.radio {
     151  position: relative; }
     152  div.radio, div.radio span, div.radio input {
     153    width: 18px;
     154    height: 18px; }
     155  div.radio span {
     156    display: -moz-inline-box;
     157    display: inline-block;
     158    *display: inline;
     159    zoom: 1;
     160    text-align: center;
     161    background-position: 0 -279px; }
     162    div.radio span.checked {
     163      background-position: -72px -279px; }
     164  div.radio input {
     165    opacity: 0;
     166    filter: alpha(opacity=0);
     167    -moz-opacity: 0;
     168    border: none;
     169    background: none;
     170    display: -moz-inline-box;
     171    display: inline-block;
     172    *display: inline;
     173    zoom: 1;
     174    text-align: center; }
     175  div.radio.active span {
     176    background-position: -18px -18px -279px; }
     177    div.radio.active span.checked {
     178      background-position: -90px -279px; }
     179  div.radio.hover span, div.radio.focus span {
     180    background-position: -36px -36px -279px; }
     181    div.radio.hover span.checked, div.radio.focus span.checked {
     182      background-position: -108px -279px; }
     183  div.radio.hover.active span, div.radio.focus.active span {
     184    background-position: -54px -279px; }
     185    div.radio.hover.active span.checked, div.radio.focus.active span.checked {
     186      background-position: -126px -279px; }
     187  div.radio.disabled span, div.radio.disabled.active span {
     188    background-position: -144px -279px; }
     189    div.radio.disabled span.checked, div.radio.disabled.active span.checked {
     190      background-position: -162px -279px; }
     191
     192/* Uploader */
     193div.uploader {
     194  background-position: 0 -297px;
     195  height: 28px;
     196  width: 190px;
     197  cursor: pointer;
     198  position: relative;
     199  overflow: hidden; }
     200  div.uploader span.action {
     201    background-position: right -409px;
     202    height: 28px;
     203    line-height: 28px;
     204    width: 82px;
     205    text-align: center;
     206    float: left;
     207    display: inline;
     208    overflow: hidden;
     209    cursor: pointer; }
     210  div.uploader span.filename {
     211    text-overflow: ellipsis;
     212    display: block;
     213    overflow: hidden;
     214    white-space: nowrap;
     215    float: left;
     216    cursor: default;
     217    height: 24px;
     218    margin: 2px 0 2px 2px;
     219    line-height: 24px;
     220    width: 85px;
     221    padding: 0 10px; }
     222  div.uploader input {
     223    opacity: 0;
     224    filter: alpha(opacity=0);
     225    -moz-opacity: 0;
     226    border: none;
     227    background: none;
     228    position: absolute;
     229    top: 0;
     230    right: 0;
     231    float: right;
     232    cursor: default;
     233    width: 100%;
     234    height: 100%; }
     235  div.uploader.active span.action {
     236    background-position: right -465px; }
     237  div.uploader.hover, div.uploader.focus {
     238    background-position: 0 -353px; }
     239    div.uploader.hover span.action, div.uploader.focus span.action {
     240      background-position: right -437px; }
     241    div.uploader.hover.active span.action, div.uploader.focus.active span.action {
     242      background-position: right -493px; }
     243  div.uploader.disabled, div.uploader.disabled.active {
     244    background-position: 0 -325px; }
     245    div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     246      background-position: right -381px; }
     247
     248/* Buttons */
     249div.button {
     250  background-position: 0 -641px;
     251  height: 30px;
     252  cursor: pointer;
     253  position: relative;
     254  /* Keep buttons barely visible so they can get focus */ }
     255  div.button a, div.button button, div.button input {
     256    opacity: 0.01;
     257    filter: alpha(opacity=1);
     258    -moz-opacity: 0.01;
     259    display: block;
     260    top: 0;
     261    left: 0;
     262    right: 0;
     263    bottom: 0;
     264    position: absolute; }
     265  div.button span {
     266    display: -moz-inline-box;
     267    display: inline-block;
     268    *display: inline;
     269    zoom: 1;
     270    line-height: 22px;
     271    text-align: center;
     272    background-position: right -521px;
     273    height: 22px;
     274    margin-left: 13px;
     275    padding: 8px 15px 0 2px; }
     276  div.button.active {
     277    background-position: 0 -671px; }
     278    div.button.active span {
     279      background-position: right -551px;
     280      cursor: default; }
     281  div.button.hover, div.button.focus {
     282    background-position: 0 -701px; }
     283    div.button.hover span, div.button.focus span {
     284      background-position: right -581px; }
     285  div.button.disabled, div.button.disabled.active {
     286    background-position: 0 -731px; }
     287    div.button.disabled span, div.button.disabled.active span {
     288      background-position: right -611px;
     289      cursor: default; }
    44290
    45291/* INPUT & TEXTAREA */
    46 
    47 input.text,
    48 input.email,
    49 input.password,
     292input.uniform-input,
     293select.uniform-multiselect,
    50294textarea.uniform {
    51295  font-size: 12px;
    52   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     296  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    53297  font-weight: normal;
    54   padding: 5px !important;
    55298  color: #777;
    56   background: #fff url('../images/bg-input-focus.png') repeat-x 0px 0px;
    57   background: #fff url('../images/bg-input.png') repeat-x 0px 0px;
    58   border-top: solid 1px #aaa;
    59   border-left: solid 1px #aaa;
    60   border-bottom: solid 1px #ccc;
    61   border-right: solid 1px #ccc;
     299  border-top: solid 1px #aaaaaa;
     300  border-left: solid 1px #aaaaaa;
     301  border-bottom: solid 1px #cccccc;
     302  border-right: solid 1px #cccccc;
    62303  -webkit-border-radius: 3px;
    63304  -moz-border-radius: 3px;
    64   border-radius: 3px;
    65   outline: 0;
    66 }
    67 
    68 input.text:focus,
    69 input.email:focus,
    70 input.password:focus,
    71 textarea.uniform:focus {
    72   -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    73   -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    74   box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    75   border-color: #999;
    76   background: #fff url('../images/bg-input-focus.png') repeat-x 0px 0px;
    77 }
    78 
    79 /* SPRITES */
    80 
    81 /* Select */
    82 
    83 div.selector {
    84   background-position: -483px -130px;
    85   line-height: 26px;
    86   height: 26px;
    87 }
    88 
    89 div.selector span {
    90   background-position: right 0px;
    91   height: 26px;
    92   line-height: 26px;
    93 }
    94 
    95 div.selector select {
    96   /* change these to adjust positioning of select element */
    97   top: 0px;
    98   left: 0px;
    99 }
    100 
    101 div.selector:active,
    102 div.selector.active {
    103   background-position: -483px -156px;
    104 }
    105 
    106 div.selector:active span,
    107 div.selector.active span {
    108   background-position: right -26px;
    109 }
    110 
    111 div.selector.focus, div.selector.hover, div.selector:hover {
    112   background-position: -483px -182px;
    113 }
    114 
    115 div.selector.focus span, div.selector.hover span, div.selector:hover span {
    116   background-position: right -52px;
    117 }
    118 
    119 div.selector.focus:active,
    120 div.selector.focus.active,
    121 div.selector:hover:active,
    122 div.selector.active:hover {
    123   background-position: -483px -208px;
    124 }
    125 
    126 div.selector.focus:active span,
    127 div.selector:hover:active span,
    128 div.selector.active:hover span,
    129 div.selector.focus.active span {
    130   background-position: right -78px;
    131 }
    132 
    133 div.selector.disabled {
    134   background-position: -483px -234px;
    135 }
    136 
    137 div.selector.disabled span {
    138   background-position: right -104px;
    139 }
    140 
    141 /* Checkbox */
    142 
    143 div.checker {
    144   width: 19px;
    145   height: 19px;
    146 }
    147 
    148 div.checker input {
    149   width: 19px;
    150   height: 19px;
    151 }
    152 
    153 div.checker span {
    154   background-position: 0px -260px;
    155   height: 19px;
    156   width: 19px;
    157 }
    158 
    159 div.checker:active span,
    160 div.checker.active span {
    161   background-position: -19px -260px;
    162 }
    163 
    164 div.checker.focus span,
    165 div.checker:hover span {
    166   background-position: -38px -260px;
    167 }
    168 
    169 div.checker.focus:active span,
    170 div.checker:active:hover span,
    171 div.checker.active:hover span,
    172 div.checker.focus.active span {
    173   background-position: -57px -260px;
    174 }
    175 
    176 div.checker span.checked {
    177   background-position: -76px -260px;
    178 }
    179 
    180 div.checker:active span.checked,
    181 div.checker.active span.checked {
    182   background-position: -95px -260px;
    183 }
    184 
    185 div.checker.focus span.checked,
    186 div.checker:hover span.checked {
    187   background-position: -114px -260px;
    188 }
    189 
    190 div.checker.focus:active span.checked,
    191 div.checker:hover:active span.checked,
    192 div.checker.active:hover span.checked,
    193 div.checker.active.focus span.checked {
    194   background-position: -133px -260px;
    195 }
    196 
    197 div.checker.disabled span,
    198 div.checker.disabled:active span,
    199 div.checker.disabled.active span {
    200   background-position: -152px -260px;
    201 }
    202 
    203 div.checker.disabled span.checked,
    204 div.checker.disabled:active span.checked,
    205 div.checker.disabled.active span.checked {
    206   background-position: -171px -260px;
    207 }
    208 
    209 /* Radio */
    210 
    211 div.radio {
    212   width: 18px;
    213   height: 18px;
    214 }
    215 
    216 div.radio input {
    217   width: 18px;
    218   height: 18px;
    219 }
    220 
    221 div.radio span {
    222   height: 18px;
    223   width: 18px;
    224   background-position: 0px -279px;
    225 }
    226 
    227 div.radio:active span,
    228 div.radio.active span {
    229   background-position: -18px -279px;
    230 }
    231 
    232 div.radio.focus span,
    233 div.radio:hover span {
    234   background-position: -36px -279px;
    235 }
    236 
    237 div.radio.focus:active span,
    238 div.radio:active:hover span,
    239 div.radio.active:hover span,
    240 div.radio.active.focus span {
    241   background-position: -54px -279px;
    242 }
    243 
    244 div.radio span.checked {
    245   background-position: -72px -279px;
    246 }
    247 
    248 div.radio:active span.checked,
    249 div.radio.active span.checked {
    250   background-position: -90px -279px;
    251 }
    252 
    253 div.radio.focus span.checked, div.radio:hover span.checked {
    254   background-position: -108px -279px;
    255 }
    256 
    257 div.radio.focus:active span.checked,
    258 div.radio:hover:active span.checked,
    259 div.radio.focus.active span.checked,
    260 div.radio.active:hover span.checked {
    261   background-position: -126px -279px;
    262 }
    263 
    264 div.radio.disabled span,
    265 div.radio.disabled:active span,
    266 div.radio.disabled.active span {
    267   background-position: -144px -279px;
    268 }
    269 
    270 div.radio.disabled span.checked,
    271 div.radio.disabled:active span.checked,
    272 div.radio.disabled.active span.checked {
    273   background-position: -162px -279px;
    274 }
    275 
    276 /* Uploader */
    277 
    278 div.uploader {
    279   background-position: 0px -297px;
    280   height: 28px;
    281 }
    282 
    283 div.uploader span.action {
    284   background-position: right -409px;
    285   height: 24px;
    286   line-height: 24px;
    287 }
    288 
    289 div.uploader span.filename {
    290   height: 24px;
    291   /* change this line to adjust positioning of filename area */
    292   margin: 2px 0px 2px 2px;
    293   line-height: 24px;
    294 }
    295 
    296 div.uploader.focus,
    297 div.uploader.hover,
    298 div.uploader:hover {
    299   background-position: 0px -353px;
    300 }
    301 
    302 div.uploader.focus span.action,
    303 div.uploader.hover span.action,
    304 div.uploader:hover span.action {
    305   background-position: right -437px;
    306 }
    307 
    308 div.uploader.active span.action,
    309 div.uploader:active span.action {
    310   background-position: right -465px;
    311 }
    312 
    313 div.uploader.focus.active span.action,
    314 div.uploader:focus.active span.action,
    315 div.uploader.focus:active span.action,
    316 div.uploader:focus:active span.action {
    317   background-position: right -493px;
    318 }
    319 
    320 div.uploader.disabled {
    321   background-position: 0px -325px;
    322 }
    323 
    324 div.uploader.disabled span.action {
    325   background-position: right -381px;
    326 }
    327 
    328 /* BUTTONS */
    329 
    330 div.button {
    331   background-position: 0px -525px;
    332 }
    333 
    334 .textwidget div.button, #contact-form-91 div.button {
    335   background-position: 0px -524px;
    336 }
    337 
     305  border-radius: 3px; }
     306  input.uniform-input.hover, input.uniform-input.focus,
     307  select.uniform-multiselect.hover,
     308  select.uniform-multiselect.focus,
     309  textarea.uniform.hover,
     310  textarea.uniform.focus {
     311    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     312    -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     313    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
     314    border-color: #999; }
     315
     316/* PRESENTATION */
     317/* Buttons */
    338318div.button span {
    339   background-position: right -645px;
    340 }
    341 
    342 #post-837 div.button.focus,
    343 #post-837 div.button:focus,
    344 #post-837 div.button:hover,
    345 #post-837 div.button.hover {
    346   background-position: 0px -555px;
    347 }
    348 
    349 div.button.focus,
    350 div.button:focus,
    351 div.button:hover,
    352 div.button.hover {
    353   background-position: 0px -554px;
    354 }
    355 
    356 div.button.focus span,
    357 div.button:focus span,
    358 div.button:hover span,
    359 div.button.hover span {
    360   background-position: right -675px;
    361 }
    362 
    363 div.button.active,
    364 div.button:active {
    365   background-position: 0px -582px;
    366 }
    367 
    368 div.button.active span,
    369 div.button:active span {
    370   background-position: right -703px;
    371   color: #555;
    372 }
    373 
    374 div.button.disabled,
    375 div.button:disabled {
    376   background-position: 0px -613px;
    377 }
    378 
    379 div.button.disabled span,
    380 div.button:disabled span {
    381   background-position: right -733px;
    382   color: #bbb;
    383   cursor: default;
    384 }
    385 
    386 /* PRESENTATION */
    387 
    388 /* Button */
    389 
    390 div.button {
    391   height: 30px;
    392 }
    393 
    394 div.button span {
    395   margin-left: 13px;
    396   height: 22px;
    397   padding-top: 8px;
    398319  font-weight: bold;
    399   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     320  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    400321  font-size: 12px;
    401322  letter-spacing: 1px;
    402   text-transform: uppercase;
    403   padding-left: 2px;
    404   padding-right: 15px;
    405 }
     323  text-transform: uppercase; }
     324div.button.hover span, div.button.focus span {
     325  color: #555; }
     326div.button.disabled span, div.button.disabled.active span {
     327  color: #bbb; }
    406328
    407329/* Select */
    408330div.selector {
    409   width: 190px;
    410   font-size: 12px;
    411 }
    412 
    413 div.selector select {
    414   min-width: 190px;
    415   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    416   font-size: 12px;
    417   border: solid 1px #fff;
    418 }
    419 
    420 div.selector span {
    421   padding: 0px 25px 0px 2px;
    422   cursor: pointer;
    423 }
    424 
    425 div.selector span {
    426   color: #666;
    427   width: 158px;
    428   text-shadow: 0 1px 0 #fff;
    429 }
    430 
    431 div.selector.disabled span {
    432   color: #bbb;
    433 }
     331  font-size: 12px; }
     332  div.selector span {
     333    color: #666;
     334    text-shadow: 0 1px 0 white; }
     335  div.selector select {
     336    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
     337    font-size: 12px; }
     338  div.selector.disabled span, div.selector.disabled.active span {
     339    color: #bbb; }
    434340
    435341/* Checker */
    436342div.checker {
    437   margin-right: 5px;
    438 }
     343  margin-right: 5px; }
    439344
    440345/* Radio */
    441346div.radio {
    442   margin-right: 3px;
    443 }
     347  margin-right: 3px; }
    444348
    445349/* Uploader */
    446 div.uploader {
    447   width: 190px;
    448   cursor: pointer;
    449 }
    450 
    451350div.uploader span.action {
    452   width: 85px;
    453   text-align: center;
    454   text-shadow: #fff 0px 1px 0px;
     351  text-shadow: white 0px 1px 0px;
    455352  background-color: #fff;
    456353  font-size: 11px;
    457   font-weight: bold;
    458 }
    459 
     354  font-weight: bold; }
    460355div.uploader span.filename {
    461356  color: #777;
    462   width: 82px;
    463   border-right: solid 1px #bbb;
    464   font-size: 11px;
    465 }
    466 
    467 div.uploader input {
    468   width: 190px;
    469 }
    470 
    471 div.uploader.disabled span.action {
    472   color: #aaa;
    473 }
    474 
    475 div.uploader.disabled span.filename {
     357  border-right: solid 1px #bbbbbb;
     358  font-size: 11px; }
     359div.uploader.disabled span.action, div.uploader.disabled.active span.action {
     360  color: #aaa; }
     361div.uploader.disabled span.filename, div.uploader.disabled.active span.filename {
    476362  border-color: #ddd;
    477   color: #aaa;
    478 }
    479 /*
    480 
    481 CORE FUNCTIONALITY
    482 
    483 Not advised to edit stuff below this line
    484 -----------------------------------------------------
    485 */
    486 
    487 .selector,
    488 .checker,
    489 .button,
    490 .radio,
    491 .uploader {
    492   display: -moz-inline-box;
    493   display: inline-block;
    494   vertical-align: middle;
    495   zoom: 1;
    496   *display: inline;
    497 }
    498 
    499 .selector select:focus, .radio input:focus, .checker input:focus, .uploader input:focus {
    500   outline: 0;
    501 }
    502 
    503 /* Button */
    504 
    505 div.button a,
    506 div.button button,
    507 div.button input {
    508   position: absolute;
    509 }
    510 
    511 div.button {
    512   cursor: pointer;
    513   position: relative;
    514 }
    515 
    516 div.button span {
    517   display: -moz-inline-box;
    518   display: inline-block;
    519   line-height: 1;
    520   text-align: center;
    521 }
    522 
    523 /* Select */
    524 
    525 div.selector {
    526   position: relative;
    527   padding-left: 10px;
    528   overflow: hidden;
    529 }
    530 
    531 div.selector span {
    532   display: block;
    533   overflow: hidden;
    534   text-overflow: ellipsis;
    535   white-space: nowrap;
    536 }
    537 
    538 div.selector select {
    539   position: absolute;
    540   opacity: 0;
    541   filter: alpha(opacity=0); /* use '=' here, not ':' */
    542   -moz-opacity: 0;
    543   height: 25px;
    544   border: none;
    545   background: none;
    546 }
    547 
    548 /* Checker */
    549 
    550 div.checker {
    551   position: relative;
    552 }
    553 
    554 div.checker span {
    555   display: -moz-inline-box;
    556   display: inline-block;
    557   text-align: center;
    558 }
    559 
    560 div.checker input {
    561   opacity: 0;
    562   filter: alpha(opacity=0);
    563   -moz-opacity: 0;
    564   display: inline-block;
    565   background: none;
    566 }
    567 
    568 /* Radio */
    569 
    570 div.radio {
    571   position: relative;
    572 }
    573 
    574 div.radio span {
    575   display: -moz-inline-box;
    576   display: inline-block;
    577   text-align: center;
    578 }
    579 
    580 div.radio input {
    581   opacity: 0;
    582   filter: alpha(opacity=0);
    583   -moz-opacity: 0;
    584   text-align: center;
    585   display: inline-block;
    586   background: none;
    587 }
    588 
    589 /* Uploader */
    590 
    591 div.uploader {
    592   position: relative;
    593   overflow: hidden;
    594   cursor: default;
    595 }
    596 
    597 div.uploader span.action {
    598   float: left;
    599   display: inline;
    600   padding: 2px 0px;
    601   overflow: hidden;
    602   cursor: pointer;
    603 }
    604 
    605 div.uploader span.filename {
    606   padding: 0px 10px;
    607   float: left;
    608   display: block;
    609   overflow: hidden;
    610   text-overflow: ellipsis;
    611   white-space: nowrap;
    612   cursor: default;
    613 }
    614 
    615 div.uploader input {
    616   opacity: 0;
    617   filter: alpha(opacity=0);
    618   -moz-opacity: 0;
    619   position: absolute;
    620   top: 0;
    621   right: 0;
    622   bottom: 0;
    623   float: right;
    624   height: 25px;
    625   border: none;
    626   cursor: default;
    627 }
     363  color: #aaa; }
     364
     365input.uniform-input, input.uniform-input:focus {
     366  background-color: #fff; }
Note: See TracChangeset for help on using the changeset viewer.