source: trunk/css/utilities.inc.css @ 559

/**
 * utilities.inc.css
 *
 * CSS used often in Strangecode applications. Do not arbitrarily
 * edit this code! This file is used between many sites and modifying it may result
 * in something breaking. Instead, overwrite these values in a specific site by
 * adding new definitions to a screen.css file.
 */

/*_____________________ FORMS ____________________*/

input.sc-tiny, textarea.sc-tiny, select.sc-tiny,
input.sc-small, textarea.sc-small, select.sc-small,
input.sc-medium, textarea.sc-medium, select.sc-medium,
input.sc-large, textarea.sc-large, select.sc-large,
input.sc-full, textarea.sc-full, select.sc-full {
    margin: 0 0.5rem 0 0;
    padding: 3px 0.25rem;
    border-width: 1px;
}

/*
The following widths are calculated using `width = (maxwidth - (1.2 * multiple)) / multiple`
where width is the sought value, maxwidth is the width of a sc-large, and multiple is the number
of times an element fits within maxwidth (i.e. sc-tiny has a multiple of 8).
The values are dependent on the margin, padding, and border set above.
*/
input.sc-micro, textarea.sc-micro, select.sc-micro, label.sc-micro      { width: 1.55rem; }
input.sc-tiny, textarea.sc-tiny, select.sc-tiny, label.sc-tiny          { width: 4.54rem; }
input.sc-small, textarea.sc-small, select.sc-small, label.sc-small      { width: 10.15rem; }
input.sc-medium, textarea.sc-medium, select.sc-medium, label.sc-medium  { width: 21.42rem; }
input.sc-large, textarea.sc-large, select.sc-large, label.sc-large      { width: 44rem; }
input.sc-full, textarea.sc-full, select.sc-full, label.sc-full          { width: 100%; }

select.sc-small     { width: 10rem; }
select.sc-medium    { width: 20.5rem; }

textarea.sc-twolines, select.sc-twolines              { height: 3rem; }
textarea.sc-short, select.sc-short                    { height: 8rem; }
textarea.sc-tall, select.sc-tall                      { height: 25rem; }
textarea.sc-fullscreen, select.sc-fullscreen          { height: 40rem; }

/*_____________________ UTILITIES ____________________*/
.sc-center { text-align: center; }
.sc-clearboth { clear: both; }
.sc-help { color: #999; font-weight: normal; }
.sc-hidden { display: none; }
.sc-monospaced { font-family: monospace; }
.sc-padleft { padding-left: 10px; }
.sc-padright { padding-right: 10px; }
.sc-marginleft { margin-left: 10px; }
.sc-marginright { margin-right: 10px; }
.sc-right { text-align: right; }
.sc-normal { font-weight: normal; }
.sc-nowrap { white-space: nowrap; }
.sc-dim {
    filter:alpha(opacity=33);
    -moz-opacity:.33;
    opacity:.33;
}
.sc-note:hover { cursor: help; }
.sc-ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* .sc-pkg class wraps enclosing block element around inner floated elements */
.sc-pkg:after { content: " "; display: block; visibility: hidden; clear: both; height: 0.1px; font-size: 0.1em; line-height: 0.0; }
* html .sc-pkg { display: block; }
/* no ie mac \*/
* html .sc-pkg { height: 1%; }
.sc-pkg { display: block; }
/* */