Changeset 5951


Ignore:
Timestamp:
Jan 31, 2008 9:45:04 AM (8 years ago)
Author:
enjahova
Message:

Updated nav button positioning

File:
1 edited

Legend:

Unmodified
Added
Removed
  • sandbox/enjahova/openlayers/theme/FREAC/style.css

    r5788 r5951  
    11/*various layer config stuff*/
    22#layers {
    3    width: 200px;
    4    border: 1px solid #000000;
    5    font-size: 10px;
    6    top: 100px;
    7    position: absolute;
     3    width:200px;
     4    border:1px solid #000000;
     5    font-size:10px;
     6    top:100px;
     7    position:absolute;
    88}
    99.l_vis {
    10    font-size: 11px;
    11    height: 29px;
    12    cursor: pointer;
    13    padding-left: 20px;
    14    position: relative;
    15 }
     10    font-size:11px;
     11    height:29px;
     12}
     13
    1614.l_vis div {
    17    position: relative;
    18    display: block;
    19    width: 16px;
    20    height: 16px;
    21    background-image: url("img/map.png");
    22    /*background-repeat: no-repeat;float: left; Float to display horizontally*/
    23    margin-top: 2px;
    24    margin-right: 2px;
    25    position: absolute;
    26    top: -2px;
    27    left: 2px;
    28 }
    29 .l_vis input {
    30    position: relative;
    31    margin-bottom: 0px;
    32    height: 16px;
    33    width: 16px;
    34  }
    35 .l_vis_dis {
    36    font-size: 11px;
    37    height: 29px;
    38    cursor: default;
    39    padding-left: 20px;
    40    opacity: .5;
    41 }
    42 .l_vis_dis div {
    43    position: relative;
    44    display: block;
    45    width: 16px;
    46    height: 16px;
    47    background-image: url("img/map.png");
    48    /*background-repeat: no-repeat;float: left; Float to display horizontally*/
    49    margin-top: 2px;
    50    margin-right: 2px;
    51    position: absolute;
    52    top: -2px;
    53    left: 2px;
    54 }
    55 .l_vis_dis input {
    56    position: relative;
    57    margin-bottom: 0px;
    58    height: 16px;
    59    width: 16px;
    60 }
     15    position:relative;
     16    display:block;
     17    width:16px;
     18    height:16px;
     19    background-image: url("img/map.png");
     20    /*background-repeat: no-repeat; Float to display horizontally*/
     21    margin-top:2px;
     22    margin-right:2px;
     23    position:absolute;
     24    top:-2px;
     25    left:2px;
     26}
     27
    6128.check {
    62    float: left;
    63    top: -2px;
    64 }
    65 #click_f_Data Layers {
    66    font-size: 11px;
    67 }
    68 .f_open {
    69    font-size: 14px;
    70    cursor: pointer;
    71 }
    72 .f_closed {
    73    font-size: 14px;
    74    font-weight: 200;
    75    cursor: pointer;
     29   
     30top:-2px;
     31}
     32
     33#click_f_Data Layers{
     34    font-size:11px;
     35}
     36.f_open {
     37    font-size:14px;
     38    cursor:pointer;
     39}
     40.f_closed {
     41    font-size:14px;
     42    font-weight:200;
     43    cursor:pointer;
    7644}
    7745.img_f_open {
    78    margin-right: 10px;
    79    display: block;
    80    width: 16px;
    81    height: 16px;
    82    float: left;
    83    background-image: url("img/folder_add.png");
     46    margin-right: 10px;
     47    display:block;
     48    width:16px;
     49    height:16px;
     50    
     51    background-image: url("img/folder_add.png");
    8452}
    8553.img_f_closed {
    86    margin-right: 10px;
    87    display: block;
    88    width: 16px;
    89    height: 16px;
    90    float: left;
    91    background-image: url("img/folder_delete.png");
    92 }
    93 .l_closed div {
    94    display: none;
    95  }
    96 .l_open div {
    97    display: block;
    98  }
    99 .l_closed {
    100    margin-bottom: 0px;
    101    margin-top: 0px;
    102  }
    103 .l_open {
    104    margin-bottom: 0px;
    105    margin-top: 0px;
    106 }
    107 
    108 /*set positioning of tools*/
     54    margin-right: 10px;
     55    display:block;
     56    width:16px;
     57    height:16px;
     58   
     59    background-image: url("img/folder_delete.png");
     60}
     61
     62.l_closed div {display:none;}
     63.l_open div {display:;}
     64.l_closed {margin-bottom:0px;margin-top:0px;}
     65.l_open {margin-bottom:0px;margin-top:0px;}
     66
     67.l_vis {cursor:pointer;
     68        padding-left:20px;
     69            position:relative;}
     70.l_vis input {position:relative;
     71        margin-bottom:0px;
     72        height:16px;width:16px;}   
     73   
     74.l_vis_dis {cursor:default;
     75        padding-left:20px;
     76        opacity:.5;}
     77.l_vis_dis input {position:relative;
     78        margin-bottom:0px;
     79        height:16px;width:16px;}
     80
     81
     82/*set width of tools*/
    10983#panelDiv {
    110    position: absolute;
    111    top: 75px;
     84    width:100%;
    11285}
    11386/* OpenLayers Styling */
    11487div.olMapViewport {
    115    -moz-user-select: none;
    116 }
     88   -moz-user-select: none;
     89}
     90
    11791.olLayerGoogleCopyright {
    118    left: 2px;
    119    bottom: 2px;
     92    left: 2px;
     93    bottom: 2px; 
    12094}
    12195.olLayerGooglePoweredBy {
    122    left: 2px;
    123    bottom: 15px;
     96    left: 2px;
     97    bottom: 15px;   
    12498}
    12599.olControlAttribution {
    126    font-size: smaller;
    127    right: 3px;
    128    bottom: 4.5em;
    129    position: absolute;
    130    display: block;
     100    font-size: smaller;
     101    right: 3px;
     102    bottom: 4.5em;
     103    position: absolute;
     104    display: block;
    131105}
    132106.olControlScale {
    133    right: 3px;
    134    bottom: 3em;
    135    display: block;
    136    position: absolute;
     107    right: 3px;
     108    bottom: 3em;
     109    display: block;
     110    position: absolute;
    137111}
    138112.olControlPermalink {
    139    right: 3px;
    140    bottom: 1.5em;
    141    display: block;
    142    position: absolute;
    143 }
     113    right: 3px;
     114    bottom: 1.5em;
     115    display: block;
     116    position: absolute;
     117}
     118
    144119div.olControlMousePosition {
    145    bottom: 0em;
    146    right: 3px;
    147    display: block;
    148    position: absolute;
    149    font-family: Arial;
    150    font-size: smaller;
    151 }
     120    bottom: 0em;
     121    right: 3px;
     122    display: block;
     123    position: absolute;
     124    font-family: Arial;
     125    font-size: smaller;
     126}
     127
    152128.olControlOverviewMapContainer {
    153    position: absolute;
    154    bottom: 0px;
    155    right: 0px;
    156 }
     129    position: absolute;
     130    bottom: 0px;
     131    right: 0px;
     132}
     133
    157134.olControlOverviewMapElement {
    158    padding: 10px 18px 10px 10px;
    159    background-color: #00008B;
    160    -moz-border-radius: 1em 0 0 0;
    161 }
     135    padding: 10px 18px 10px 10px;
     136    background-color: #00008B;
     137    -moz-border-radius: 1em 0 0 0;
     138}
     139
    162140.olControlOverviewMapMinimizeButton {
    163    right: 0px;
    164    bottom: 80px;
    165 }
     141    right: 0px;
     142    bottom: 80px;
     143}   
     144
    166145.olControlOverviewMapMaximizeButton {
    167    right: 0px;
    168    bottom: 80px;
    169 }
     146    right: 0px;
     147    bottom: 80px;
     148}
     149
    170150.olControlOverviewMapExtentRectangle {
    171151   cursor: move;
    172    border: 2px dotted red;
     152    border: 2px dotted red;
    173153}
    174154.olLayerGeoRSSDescription {
    175    float: left;
    176    width: 100%;
    177    overflow: auto;
    178    font-size: 1.0em;
     155    
     156    width:100%;
     157    overflow:auto;
     158    font-size:1.0em;
    179159}
    180160.olLayerGeoRSSClose {
    181    float: right;
    182    color: gray;
    183    font-size: 1.2em;
    184    margin-right: 6px;
    185    font-family: sans-serif;
     161    
     162    color:gray;
     163    font-size:1.2em;
     164    margin-right:6px;
     165    font-family:sans-serif;
    186166}
    187167.olLayerGeoRSSTitle {
    188    float: left;font-size: 1.2em;
    189 }
     168    font-size:1.2em;
     169}
     170
    190171.olPopupContent {
    191    padding: 5px;
    192 }
    193 .olControlNavToolbar {
    194    width: 0px;
    195    height: 0px;
    196 }
    197 .olControlNavToolbar div {
    198    display: block;
    199    width:  22px;
    200    height: 22px;
    201    top: 0px;
    202    left: 300px;
    203    position: relative;
    204 }
     172    padding:5px;
     173}   
     174.olControlNavToolbar { 
     175    width:0px;
     176    height:0px;
     177}   
     178.olControlNavToolbar div { 
     179  display:block;
     180  width: 22px ;
     181  height: 22px ;
     182  float:left;
     183  position: relative;/*All these properties are inherited by each tool*/
     184}
     185
    205186/* we use NavToolbar as the panel for all our tools*/
    206 .olControlNavToolbar .olControlNavigationItemActive {
    207    background-image: url("img/panning-hand-on.png");
    208    background-repeat: no-repeat;/*much easier to use position instead of float for IE*/
    209    position: absolute;
    210    left: 0px;
    211    top: 0px;
    212    margin-right: 0px;
    213 }
    214 .olControlNavToolbar .olControlNavigationItemInactive {
    215    background-image: url("img/panning-hand-off.png");
    216    background-repeat: no-repeat;
    217    position: absolute;
    218    left: 0px;
    219    top: 0px;
    220    margin-right: 0px;
    221 }
    222 .olControlNavToolbar .olControlZoomBoxItemActive {
    223    background-image: url("img/drag-rectangle-on.png");
    224    background-repeat: no-repeat;
    225    position: absolute;
    226    left: 22px;
    227    top: 0px;
    228 }
    229 .olControlNavToolbar .olControlZoomBoxItemInactive {
    230    background-image: url("img/drag-rectangle-off.png");
    231    background-repeat: no-repeat;
    232    float: right;
    233    position: absolute;
    234    left: 22px;
    235    top: 0px;
    236 }
    237 .olControlNavToolbar .olControlZoomOutItemActive {
    238    background-image: url("img/zoom-out-on.png");
    239    background-repeat: no-repeat;
    240    position: absolute;
    241    left: 44px;
    242    top: 0px;
    243 }
    244 .olControlNavToolbar .olControlZoomOutItemInactive {
    245    background-image: url("img/zoom-out-off.png");
    246    background-repeat: no-repeat;
    247    position: absolute;
    248    left: 44px;
    249    top: 0px;
    250 }
    251 .olControlNavToolbar .olControlZoomToMaxExtentItemActive {
    252    background-image: url("img/zoom-orig-on.png");
    253    background-repeat: no-repeat;
    254    position: absolute;
    255    left: 66px;
    256    top: 0px;
    257 }
    258 .olControlNavToolbar .olControlZoomToMaxExtentItemInactive {
    259    background-image: url("img/zoom-orig-off.png");
    260    background-repeat: no-repeat;
    261    position: absolute;
    262    left: 66px;
    263    top: 0px;
    264 }
    265 .olControlNavToolbar .olControlZoomToLastExtentItemActive {
    266    background-image: url("img/zoom-last-on.png");
    267    background-repeat: no-repeat;
    268    position: absolute;
    269    left: 88px;
    270    top: 0px;
    271 }
    272 .olControlNavToolbar .olControlZoomToLastExtentItemInactive {
    273    background-image: url("img/zoom-last-off.png");
    274    background-repeat: no-repeat;
    275    position: absolute;
    276    left: 88px;
    277    top: 0px;
    278 }
    279 .olControlNavToolbar .olControlIdentifyItemActive {
    280    background-image: url("img/identify-on.png");
    281    background-repeat: no-repeat;
    282    position: absolute;
    283    left: 110px;
    284    top: 0px;
    285 }
    286 .olControlNavToolbar .olControlIdentifyItemInactive {
    287    background-image: url("img/identify-off.png");
    288    background-repeat: no-repeat;
    289    position: absolute;
    290    left: 110px;
    291    top: 0px;
    292 }
    293 .olControlNavToolbar .olControlEmailItemActive {
    294    background-image: url("img/email_on.png");
    295    background-repeat: no-repeat;
    296    position: absolute;
    297    left: 132px;
    298    top: 0px;
    299 }
    300 .olControlNavToolbar .olControlEmailItemInactive {
    301    background-image: url("img/email_off.png");
    302    background-repeat: no-repeat;
    303    position: absolute;
    304    left: 132px;
    305    top: 0px;
    306 }
    307 .olControlNavToolbar .olControlSwitchItemActive {
    308    background-image: url("img/switch-on.png");
    309    background-repeat: no-repeat;
    310    position: absolute;
    311    left: 154px;
    312    top: 0px;
    313 }
    314 .olControlNavToolbar .olControlSwitchItemInactive {
    315    background-image: url("img/switch-off.png");
    316    background-repeat: no-repeat;
    317    position: absolute;
    318    left: 154px;
    319    top: 0px;
    320 }
     187.olControlNavToolbar .olControlNavigationItemActive {
     188  background-image: url("img/panning-hand-on.png");
     189  background-repeat: no-repeat;
     190}
     191.olControlNavToolbar .olControlNavigationItemInactive {
     192  background-image: url("img/panning-hand-off.png");
     193  background-repeat: no-repeat;
     194}
     195
     196.olControlNavToolbar .olControlZoomBoxItemActive {
     197  background-image: url("img/drag-rectangle-on.png");
     198  background-repeat: no-repeat;
     199}
     200.olControlNavToolbar .olControlZoomBoxItemInactive {
     201  background-image: url("img/drag-rectangle-off.png");
     202  background-repeat: no-repeat;
     203}
     204
     205.olControlNavToolbar .olControlZoomOutItemActive {
     206  background-image: url("img/zoom-out-on.png");
     207  background-repeat: no-repeat;
     208}
     209.olControlNavToolbar .olControlZoomOutItemInactive {
     210  background-image: url("img/zoom-out-off.png");
     211  background-repeat: no-repeat;
     212}
     213
     214.olControlNavToolbar .olControlZoomToMaxExtentItemActive {
     215  background-image: url("img/zoom-orig-on.png");
     216  background-repeat: no-repeat;
     217
     218
     219}
     220.olControlNavToolbar .olControlZoomToMaxExtentItemInactive {
     221  background-image: url("img/zoom-orig-off.png");
     222  background-repeat: no-repeat;
     223}
     224
     225.olControlNavToolbar .olControlZoomToLastExtentItemActive {
     226  background-image: url("img/zoom-last-on.png");
     227  background-repeat: no-repeat;
     228}
     229.olControlNavToolbar .olControlZoomToLastExtentItemInactive {
     230  background-image: url("img/zoom-last-off.png");
     231  background-repeat: no-repeat;
     232}
     233
     234
     235.olControlNavToolbar .olControlIdentifyItemActive {
     236  background-image: url("img/identify-on.png");
     237  background-repeat: no-repeat;
     238}
     239.olControlNavToolbar .olControlIdentifyItemInactive {
     240  background-image: url("img/identify-off.png");
     241  background-repeat: no-repeat;
     242}
     243
     244
    321245.olControlEditingToolbar  {
    322    float: right;
    323    right: 0px;
    324    height: 30px;
    325    width: 200px;
    326 }
    327 .olControlEditingToolbar div {
    328    float: right;
    329    width: 24px;
    330    height: 24px;
    331    margin: 5px;
    332 }
    333 .olControlEditingToolbar .olControlNavigationItemActive {
    334    background-image: url("img/pan_on.png");
    335    background-repeat: no-repeat;
    336 }
    337 .olControlEditingToolbar .olControlNavigationItemInactive {
    338    background-image: url("img/pan_off.png");
    339    background-repeat: no-repeat;
    340 }
    341 .olControlEditingToolbar .olControlDrawFeaturePointItemActive {
    342    background-image: url("img/draw_point_on.png");
    343    background-repeat: no-repeat;
    344 }
    345 .olControlEditingToolbar .olControlDrawFeaturePointItemInactive {
    346    background-image: url("img/draw_point_off.png");
    347    background-repeat: no-repeat;
    348 }
    349 .olControlEditingToolbar .olControlDrawFeaturePathItemInactive {
    350    background-image: url("img/draw_line_off.png");
    351    background-repeat: no-repeat;
    352 }
    353 .olControlEditingToolbar .olControlDrawFeaturePathItemActive {
    354    background-image: url("img/draw_line_on.png");
    355    background-repeat: no-repeat;
    356 }
    357 .olControlEditingToolbar .olControlDrawFeaturePolygonItemInactive {
    358    background-image: url("img/draw_polygon_off.png");
    359    background-repeat: no-repeat;
    360 }
    361 .olControlEditingToolbar .olControlDrawFeaturePolygonItemActive {
    362    background-image: url("img/draw_polygon_on.png");
    363    background-repeat: no-repeat;
    364 }
    365 
    366 .olHandlerBoxZoomBox {
    367     border: 2px solid red;
    368     position: absolute;
    369     background-color: white;
    370     opacity: 0.50;
    371     font-size: 1px;
    372     filter: alpha(opacity=50);
    373 }   
    374 
     246    right: 0px;
     247    height: 30px;
     248    width: 200px;
     249}
     250.olControlEditingToolbar div {
     251  width:  24px;
     252  height: 24px;
     253  margin: 5px;
     254}
     255.olControlEditingToolbar .olControlNavigationItemActive {
     256  background-image: url("img/pan_on.png");
     257  background-repeat: no-repeat;
     258}
     259.olControlEditingToolbar .olControlNavigationItemInactive {
     260  background-image: url("img/pan_off.png");
     261  background-repeat: no-repeat;
     262}
     263.olControlEditingToolbar .olControlDrawFeaturePointItemActive {
     264  background-image: url("img/draw_point_on.png");
     265  background-repeat: no-repeat;
     266}
     267.olControlEditingToolbar .olControlDrawFeaturePointItemInactive {
     268  background-image: url("img/draw_point_off.png");
     269  background-repeat: no-repeat;
     270}
     271.olControlEditingToolbar .olControlDrawFeaturePathItemInactive {
     272  background-image: url("img/draw_line_off.png");
     273  background-repeat: no-repeat;
     274}
     275.olControlEditingToolbar .olControlDrawFeaturePathItemActive {
     276  background-image: url("img/draw_line_on.png");
     277  background-repeat: no-repeat;
     278}
     279.olControlEditingToolbar .olControlDrawFeaturePolygonItemInactive {
     280  background-image: url("img/draw_polygon_off.png");
     281  background-repeat: no-repeat;
     282}
     283.olControlEditingToolbar .olControlDrawFeaturePolygonItemActive {
     284  background-image: url("img/draw_polygon_on.png");
     285  background-repeat: no-repeat;
     286}
     287
     288
Note: See TracChangeset for help on using the changeset viewer.