Changeset 1780

Show
Ignore:
Timestamp:
09/01/05 15:11:15 (3 years ago)
Author:
rambo
Message:

Started CSS restructuring, and slightly changed design. Works better on IE now

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • trunk/static/org.openpsa.core/openpsa.css

    r1777 r1780  
    1 body { 
     1/* Generic typography */ 
     2body 
     3
    24    margin: 0px; 
    35    padding: 0px; 
    46    font-family: "Tahoma", "Lucida Grande Regular", "Arial", "Helvetica", sans-serif; 
    57    font-size: 70%; 
    6 
    7 a { 
    8     color: #4B6983; 
    9     background-color: transparent; 
    10 
    11 /* Main header */ 
    12 #org_openpsa_header { 
    13     height: 5em; 
     8    background-color: #FFFFFF; 
     9
     10a:link 
     11
     12    color: #314E6C; 
     13
     14a:visited 
     15
     16    color: #494066; 
     17
     18 
     19/* The header area */ 
     20#org_openpsa_view #org_openpsa_header 
     21
     22    /* This is the version IE uses */ 
     23    position: absolute; 
     24    top: expression( (ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) + 'px' ); 
     25     
     26    /* Common elements used by both IE and FF */ 
     27    background-color: #FFFFFF; 
     28    height: 50px; 
     29    width: 100%;     
     30    z-index: 100;     
     31    overflow: hidden; 
     32
     33#org_openpsa_view > #org_openpsa_header 
     34
     35    /* Fixed positioning for FF */ 
    1436    position: fixed; 
     37    top: 0px; 
     38} 
     39#org_openpsa_userinfo 
     40{ 
     41    position: absolute; 
     42    width: 26%; 
     43    padding-top: 0px; 
     44    padding-left: 2%; 
     45    padding-right: 2%;     
     46    right: 0px; 
     47    top: 0px; 
     48    height: 20px; 
     49    line-height: 20px; 
     50    vertical-align: middle; 
     51    background-color: #E0C39E; 
     52    text-align: right; 
     53    -moz-border-radius-bottomleft: 8px; 
     54    padding-bottom: 3px; 
     55    overflow: hidden; 
     56} 
     57#org_openpsa_userinfo ul 
     58{ 
     59    margin: 0px; 
     60    padding: 0px; 
     61} 
     62#org_openpsa_userinfo ul li 
     63{ 
     64    display: inline; 
     65    list-style: none; 
     66    width: 33%; 
     67} 
     68#org_openpsa_userinfo ul li span.fn 
     69{ 
     70    font-weight: bold; 
     71} 
     72#org_openpsa_userinfo ul li img 
     73{ 
     74    border: none; 
     75} 
     76#org_openpsa_userinfo ul li select 
     77{ 
     78    width: 50%; 
     79    overflow: hidden; 
     80} 
     81#org_openpsa_logo 
     82{ 
     83    position: absolute; 
     84    left: 5px; 
     85    top: 5px; 
     86} 
     87#org_openpsa_logo img 
     88{ 
     89    border: none; 
     90} 
     91#org_openpsa_navigation 
     92{ 
     93    position: absolute; 
     94    bottom: 0px; 
     95    left: 160px; 
     96    vertical-align: bottom; 
     97    overflow: hidden; 
     98    white-space: nowrap; 
     99} 
     100#org_openpsa_navigation ul 
     101{ 
     102    margin: 0px; 
     103    padding: 0px; 
     104} 
     105#org_openpsa_navigation ul li 
     106{ 
     107    margin: 0px; 
     108    padding: 0px; 
     109    float: left; 
     110    list-style: none; 
     111} 
     112#org_openpsa_navigation ul li a 
     113{ 
     114    display: block; 
     115    padding: 8px; 
     116    margin-right: 1px; 
     117    -moz-border-radius-topleft: 8px; 
     118    -moz-border-radius-topright: 8px;     
     119    color: #000000; 
     120    text-decoration: none; 
     121    font-weight: bold; 
     122} 
     123#org_openpsa_navigation ul li a:hover 
     124{ 
     125    background-color: #7590AE; 
     126} 
     127#org_openpsa_navigation ul li a.selected 
     128{ 
     129    background-color: #4B6983; 
     130    color: #FFFFFF; 
     131} 
     132 
     133/* The floating toolbar */ 
     134#org_openpsa_body 
     135{ 
     136    position: absolute; 
     137    top: 0px; 
     138    width: 100%;  
     139    font-size: 1.1em; 
     140} 
     141#org_openpsa_body #org_openpsa_toolbar 
     142{ 
     143    /* Simulate position: fixed for IE */ 
     144    position: absolute; 
     145    top: expression( ( 50 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' ); 
     146     
     147    /* Shared styling for both IE and FF */ 
     148    background-color: #4B6983; 
     149    color: #FFFFFF; 
     150    height: 30px; 
     151    width: 97%; 
     152    padding-left: 1%; 
     153    padding-right: 2%;     
     154    z-index: 100; 
     155    overflow: hidden; 
     156} 
     157#org_openpsa_body > #org_openpsa_toolbar 
     158{ 
     159    /* Real fixed positioning */ 
     160    position: fixed; 
     161    top: 50px;     
     162} 
     163#org_openpsa_toolbar_buttons ul 
     164{ 
     165    margin: 0px; 
     166    padding: 0px; 
     167} 
     168#org_openpsa_toolbar_buttons li 
     169{ 
     170    margin: 0px; 
     171    padding: 0px; 
     172    float: left; 
     173    list-style: none; 
     174    line-height: 30px; 
     175    vertical-align: middle; 
     176} 
     177#org_openpsa_toolbar_buttons li a 
     178{ 
     179    color: #FFFFFF; 
     180    text-decoration: none; 
     181    display: block; 
     182    padding-left: 6px; 
     183    padding-right: 6px;     
     184    margin-right: 6px; 
     185} 
     186#org_openpsa_toolbar_buttons li a:hover 
     187{ 
     188    background-color: #7590AE; 
     189} 
     190#org_openpsa_toolbar_buttons li img 
     191{ 
     192    border: none; 
     193} 
     194#org_openpsa_object_metadata 
     195{ 
     196    float: right; 
     197    text-align: right; 
     198} 
     199#org_openpsa_object_metadata h1 
     200{ 
     201    margin: 0px; 
     202    padding: 0px; 
     203    font-size: 1.3em; 
     204} 
     205#org_openpsa_object_metadata a 
     206{ 
     207    color: #FFFFFF; 
     208    text-decoration: none; 
     209} 
     210 
     211/* Content area formatting */ 
     212#org_openpsa_content 
     213{ 
     214    position: absolute; 
     215    top: 80px; 
    15216    width: 100%; 
    16     top: 0px; 
     217
     218#org_openpsa_content div.main 
     219
     220    width: 66%; 
     221    position: absolute; 
    17222    left: 0px; 
    18     z-index: 256; 
    19     background-color: #ffffff; 
    20 
    21 #org_openpsa_navigation { 
    22     position: absolute; 
    23     left: 170px; 
    24     top: 22px; 
     223    padding-right: 2%; 
     224    padding-left: 2%; 
     225
     226#org_openpsa_content div.wide 
     227
     228    width: 98%; 
     229    padding-right: 1%; 
     230
     231#org_openpsa_content div.sidebar 
     232
     233    width: 26%; 
     234    padding-top: 0px; 
     235    padding-left: 2%; 
     236    padding-right: 2%; 
     237    /*padding-bottom: 12px;*/ 
     238    position: absolute;     
     239    right: 0px; 
     240    background-color: #EAE8E3; 
     241    -moz-border-radius-bottomleft: 10px; 
     242
     243#org_openpsa_content div.sidebar div.area 
     244
     245    margin-bottom: 8px; 
     246
     247 
     248/* Actual editable areas */ 
     249#org_openpsa_content fieldset 
     250
     251    border: none; 
     252
     253#org_openpsa_content fieldset fieldset, #org_openpsa_content div.area div.area 
     254
     255    margin-top: 1.1em; 
     256    margin-left: 2%; 
     257
     258 
     259/* Content styling */ 
     260#org_openpsa_content h2, #org_openpsa_content div.area h1, #org_openpsa_content div.form_fieldgroup_title, #org_openpsa_content fieldset legend 
     261
    25262    font-size: 1.2em; 
    26 
    27 #org_openpsa_navigation ul { 
    28     margin: 0px; 
    29     padding: 0px; 
    30 
    31 #org_openpsa_navigation ul li { 
    32     display: inline; 
    33     margin: 0px; 
    34     padding: 0px; 
    35     list-style: none; 
    36 
    37 #org_openpsa_navigation ul li a { 
    38     text-decoration: none; 
    39     color: #000000; 
    40     -moz-border-radius-topleft: 8px; 
    41     -moz-border-radius-topright: 8px; 
    42     padding-top: 7px; 
    43     padding-left: 5px; 
    44     padding-right: 5px; 
    45     padding-bottom: 7px; 
     263    margin-top: 6px; 
     264    margin-bottom: 0px; 
     265    padding-bottom: 0px; 
     266    margin-left: -5px; 
    46267    font-weight: bold; 
    47268} 
    48 #org_openpsa_navigation ul li a:hover { 
    49 /*    background-color: #b0ceeb;*/ 
    50     background-color: #9DB8D2; 
    51 
    52 #org_openpsa_navigation ul li a.selected { 
    53 /*    background-color: #9DB8D2;*/ 
    54     background-color: #7590AE; 
    55     color: #ffffff; 
    56 
    57  
    58 #org_openpsa_logo { 
    59     position: absolute; 
    60     top: 0px; 
    61     left: 6px; 
    62 
    63 #org_openpsa_logo img { 
    64     border: 0px; 
    65 
    66 #org_openpsa_userinfo { 
    67     position: absolute; 
    68     padding: 3px; 
    69     padding-top: 1px; 
    70     right: 1%; 
    71 
    72 #org_openpsa_userinfo dt { 
    73     font-weight: bold; 
    74     margin: 0px; 
    75     padding: 0px; 
    76 
    77 #org_openpsa_userinfo select { 
    78     font-size: 1.0em; 
    79     margin: 0px; 
    80     padding: 0px; 
    81     width: 120px; 
    82 
    83 #org_openpsa_userinfo ul, #org_openpsa_userinfo li, #org_openpsa_userinfo dl, #org_openpsa_userinfo dd { 
    84     margin: 0px; 
    85     padding: 0px; 
    86     text-align: right; 
    87     list-style: none; 
    88 
    89 #org_openpsa_userinfo a { 
    90     color: #4B6983; 
    91     text-decoration: none; 
    92 
    93 #org_openpsa_userinfo a:hover { 
    94     text-decoration: underline; 
    95 
    96  
    97 #org_openpsa_body form { 
    98     margin: 0px; 
    99     padding: 0px; 
    100 
    101 #org_openpsa_body form div.form_toolbar input { 
    102     border: 1px solid #7590AE; 
    103     -moz-border-radius: 4px;     
    104     background-color: #7590AE; 
    105     color: #ffffff; 
    106 
    107 #org_openpsa_body form div.form_toolbar input:hover { 
    108     color: #7590AE; 
    109     background-color: #ffffff; 
    110 
    111  
    112 #org_openpsa_toolbar { 
    113     top: 4em; 
    114     left: 0px; 
    115     position: fixed; 
    116     width: 100%; 
    117     background-color: #7590AE; 
    118     color: #ffffff; 
    119     /*border-top: 1px solid #9DB8D2;*/ 
    120     border-bottom: 1px solid #4B6983; 
    121     display: block; 
    122     z-index: 256; 
    123     padding: 0px; 
    124     margin: 0px; 
    125     padding-left: 1%; 
    126     padding-right: 1%; 
    127     min-height: 3em; 
    128 
    129 #org_openpsa_popup #org_openpsa_toolbar { 
    130     top: 0em; 
    131 
    132 #org_openpsa_toolbar_buttons { 
    133     /*display: inline;*/ 
    134     float: right; 
    135     margin: 0px; 
    136     padding: 0px; 
    137     padding-right: 2%; 
    138 
    139 #org_openpsa_toolbar_buttons ul { 
    140     margin: 0px; 
    141     padding: 0px; 
    142     padding-top: 6px; 
    143 
    144 #org_openpsa_toolbar_buttons li { 
    145     list-style: none; 
    146     display: inline; 
    147     margin: 0px; 
    148     padding: 0px; 
    149 
    150 #org_openpsa_toolbar_buttons a { 
    151     padding: 8px; 
    152     text-decoration: none; 
    153     color: #ffffff; 
    154 
    155 #org_openpsa_object_metadata { 
    156     margin: 0px; 
    157     padding: 0px; 
    158     padding-left: 1%; 
    159     max-width: 60%; 
    160     min-width: 30%; 
    161     overflow: hidden; 
    162     white-space: nowrap; 
    163 
    164 #org_openpsa_object_metadata h1 { 
    165     font-size: 1.5em; 
    166     margin: 0px; 
    167 
    168 #org_openpsa_object_metadata div.location { 
    169     font-size: 1em; 
    170     margin: 0px; 
    171     color: #EAE8E3; 
    172     background-color: transparent; 
    173 
    174 #org_openpsa_object_metadata div.location a { 
    175     color: #EAE8E3; 
    176     background-color: transparent; 
    177     font-weight: bold; 
    178     text-decoration: none; 
    179 
    180  
    181  
    182 #org_openpsa_content { 
    183     margin-top: 8em; 
    184 
    185 #org_openpsa_popup #org_openpsa_content { 
    186     margin-top: 3em; 
    187 
    188  
    189 #org_openpsa_content div.main { 
    190     width: 64%; 
    191     /* position: absolute; */ 
    192     float: left; 
    193     margin: 0px; 
    194     padding-left: 1%; 
    195     font-size: 1.2em; 
    196 
    197 #org_openpsa_popup div.main, #org_openpsa_content div.wide { 
    198     width: 94%; 
    199 
    200 #org_openpsa_content div.nonopenpsa { 
    201     width: 98%; 
    202 
    203 #org_openpsa_content div.sidebar { 
    204     /* position: relative; */ 
    205     float: left; 
    206     width: 33%; 
    207     margin: 0px; 
    208     left: 65%; 
    209     margin-left: 1%; 
    210     padding-right: 1%; 
    211     font-size: 1.2em; 
    212 
    213 /* Areas */ 
    214 #org_openpsa_content form { 
    215     margin: 0px; 
    216     padding: 0px; 
    217 
    218 #org_openpsa_content div.area, #org_openpsa_content fieldset.area { 
    219     border: 1px #B39169 solid; 
    220     border-left: 7px #B39169 solid; 
    221     padding: 8px; 
    222     margin-bottom: 10px; 
    223     -moz-border-radius-bottomright: 10px; 
    224     /* TODO: Is this a good idea? */ 
    225     overflow: hidden; 
    226 
    227 #org_openpsa_content div.area h2, #org_openpsa_content div.area div.form_fieldgroup_title, #org_openpsa_content fieldset.area legend, #org_openpsa_content div.area h1 { 
    228     background-color: #E0C39E; 
    229     color: #826647; 
    230     display: block; 
    231     margin-top: 0px; 
    232     padding: 2px; 
    233     font-size: 1.4em; 
    234     /*margin-left: -8px; 
    235     margin-right: -8px; 
    236     margin-top: -8px;*/ 
    237 
    238 #org_openpsa_content div.area h2 a { 
    239     text-decoration: none; 
    240     color: #826647; 
    241 
    242 #org_openpsa_content fieldset.area legend { 
    243     background-color: transparent; 
    244 
    245 #org_openpsa_content fieldset.area { 
    246     margin: 0px; 
    247     /*margin-top: -21px;*/ 
    248 
    249 #org_openpsa_content fieldset.area legend { 
    250     position: relative; 
    251     margin-top: 21px; 
    252     /*top: 0.5em;*/ 
    253 
    254 #org_openpsa_content div.meta, #org_openpsa_content fieldset.meta { 
    255     border-left-color: #5D7555; 
    256 
    257 #org_openpsa_content div.contact, #org_openpsa_content fieldset.contact { 
    258     border-left-color: #444444; 
    259 
    260 #org_openpsa_content div.postal, #org_openpsa_content fieldset.postal { 
    261     border-left-color: #c0c0c0; 
    262 
    263 #org_openpsa_content div.area dt { 
    264     font-weight: bold; 
    265     border-bottom: 1px dashed #BAB5AB; 
    266     margin-bottom: 3px; 
    267     margin-top: 5px; 
    268 
    269  
    270 /* Toolbar buttons */ 
    271 #org_openpsa_toolbar ul.midcom_toolbar li a:hover, #org_openpsa_toolbar ul li a:active { 
    272     background-color: #4B6983; 
    273     color: #ffffff; 
    274     -moz-border-radius: 3px; 
    275 
    276 div.area ul.midcom_toolbar li a { 
    277     color: #ffffff; 
    278     background-color: transparent; 
    279     border: 1px solid transparent; 
    280 
    281 div.area ul.midcom_toolbar li a:hover, div.area ul.midcom_toolbar li a:active { 
    282     background-color: #B39169; 
    283     -moz-border-radius: 3px; 
    284 
    285 ul.midcom_toolbar li a img { 
    286     border: none; 
    287     overflow: hidden; 
    288 
    289  
    290 div.buttons ul.midcom_toolbar li a { 
    291     color: #000000; 
    292 
    293 div.buttons ul.midcom_toolbar li a:hover { 
    294     color: #ffffff; 
    295 
    296  
    297 /* Making AIS look nicer */ 
    298 #aismaintable { 
    299     width: 90%; 
    300     clear: both; 
    301 
    302  
    303 /* Calendar-specific things */ 
    304 #org_openpsa_calendar_calendarwidget { 
    305     position: absolute; 
    306     right: 5px; 
    307     display: none; 
    308 
    309  
    310 /* Hidden things */ 
    311 .hidden { 
    312     display: none; 
    313 
     269#org_openpsa_content div.form_description, #org_openpsa_content form.datamanager label 
     270
     271    margin-top: 6px; 
     272
     273#org_openpsa_content div.form_description 
     274
     275    border-bottom: 1px dashed #B39169;     
     276
     277#org_openpsa_content div.form_viewfield, #org_openpsa_content form.datamanager input, #org_openpsa_content form.datamanager textarea, #org_openpsa_content form.datamanager select 
     278
     279    margin-left: 10px; 
     280    font-size: 1.15em; 
     281
     282#org_openpsa_content div.sidebar div.area dt, #org_openpsa_content div.sidebar div.area div.vcard div.n 
     283
     284    border-bottom: 1px dashed #B39169; 
     285
  • trunk/static/org.openpsa.core/ui-elements.css

    r1663 r1780  
    115115   background-position: top right; 
    116116   background-repeat: no-repeat; 
     117   margin-bottom: 6px; 
    117118} 
    118119div.area ul.comments li div.mobile { 
     
    146147/* Ajax handling */ 
    147148input.ajax_editable, select.ajax_editable { 
    148     border: 1px solid #ffffff; 
     149    border: 1px solid transparent; 
     150    background-color: transparent; 
    149151    background-position: right; 
    150152    background-repeat: no-repeat; 
     153} 
     154select.ajax_editable option { 
     155    background-color: #ffffff; 
    151156} 
    152157input.ajax_editable:hover, form.datamanager input, form.datamanager textarea {