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

/**
 * utilities.css 
 * code by strangecode :: www.strangecode.com :: this document contains copyrighted information
 *
 * 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.
 */

/* BEAU: I format my CSS using BBEdit's Markup->CSS->Format command. Would you like to use that as well so our code looks consistant? */
/*_____________________ FORMS ____________________*/

/* BEAU: Had to comment-out all generic definitions... They fucked golbon. I guess the only things to have that are safe are custom class identifiers. Maybe we should standardize on classes we define in the codebase so they never conflict with other people's css, like: codebase_small, or cb_small? */
/*
input, select, submit
{
    color: #000;
    margin: 0 0.5em 0 0;
    padding: 0;
}

submit
{
    font-weight: bold;
    margin: 0.5em;
}
*/

/*
form table select, form table input
{
    margin-top: 0;
}
*/

/* 
BEAU: I want more text box widths! I find need for boxes that fit 5em, 10em, 20em, and 40em widths. These should be in EMs so text can resize and still fit. Since it is useful to apply a width to other form elements to have them similar sizes (not always a text box, such as <select multiple>) I propose renaming them to "input.tiny", "input.small", "input.medium", "input.large", and "input.half" (not sure how you would do "half" in EMs however. DONE.
*/

input.tiny, textarea.tiny, select.tiny,
input.small, textarea.small, select.small,
input.medium, textarea.medium, select.medium,
input.large, textarea.large, select.large
{
    margin: 0 0.5em 0 0;
}

input.tiny, textarea.tiny, select.tiny
{
    width: 4.75em;
}

input.small, textarea.small, select.small
{
    width: 10em;
}

input.medium, textarea.medium, select.medium
{
    width: 20.5em;
}

input.large, textarea.large, select.large
{
    width: 41.5em;
}

textarea.twolines, select.twolines
{
    height: 3em;
}

textarea.short, select.short
{
    height: 8em;
}

textarea.tall, select.tall
{
    height: 25em;
}

textarea.fullscreen, select.fullscreen
{
    height: 40em;
}

/* BEAU: Should be in EMs? Also, sometimes it is nice to have the select menu be only the width as its contents. How to override this? */
select.small
{
    width: 10em;
}

select.medium
{
    width: 20.5em;
}

/*
form label
{
    padding: 7px 0px 0px 0px;
    font-weight: bold;
}
*/

/* BEAU: We need a .formtext substitute...something like a label tag but not bold! Maybe use "form p { }"? */


/*_____________________ COMMANDS ____________________*/

/* Should this be an ID??? */
#commandbox
{
    padding: 5px;
    margin: 0 0 .5em 0;
    border: black 1px dotted;
    background-color: #DDD;
}

.commanditem
{
    margin: 0 10px 0 0;
    white-space: nowrap;
}

.commandtext
{
    padding-right: 1em;
}

.command_left
{
    float: left;
    white-space: nowrap;
}

.command_right
{
    position: relative;
    visibility: visible;
    white-space: nowrap;
    float: right;
}

/*_____________________ UTILITIES ____________________*/
.nowrap
{
    white-space: nowrap;
}

.clearboth
{
    clear: both;
}

.center
{
    text-align: center;
}

.right
{
    text-align: right;
}

.padright
{
    padding: 0 10px 0 0;
}

.padleft
{
    padding: 0 0 0 10px;
}

.help
{
    color: #666;
    font-weight: normal;
}

.monospaced
{
    font-family: monaco, courier;
    font-weight: normal;
}

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