Changeset 6754

Show
Ignore:
Timestamp:
02/07/08 21:57:54 (5 months ago)
Author:
ryan
Message:

Widget interface updates from mdawaffe. see #5583

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved

  • trunk/wp-admin/css/widgets-rtl.css

    r6146 r6754  
    1 .dropzone, 
    2 #palettediv, 
    3 .handle, 
    4 .controlform { 
    5     direction: rtl; 
    6     text-align: justify; 
    7     } 
    8 .dropzone { 
     1div.widget-liquid-left-holder { 
    92    float: right; 
    10     margin-left: 10px; 
    11     margin-right: auto; 
    12     width: 240px; 
    13     } 
    14 * html .dropzone ul { 
     3    clear: right; 
     4    margin-left: -310px; 
    155    margin-right: 0; 
    16     } 
    17 * .handle, #lastmodule span { 
    18     border-left: 1px solid #e8e8e8; 
    19     border-right: 1px solid #f2f2f2; 
    20     } 
    21 * .popper { 
     6} 
     7 
     8div.widget-liquid-left { 
     9    margin-right: 0; 
     10    margin-left: 310px; 
     11} 
     12 
     13div.widget-liquid-right { 
     14    float: left; 
     15    clear: left; 
     16} 
     17 
     18p#widget-search { 
     19    left: 0; 
    2220    right: auto; 
    23     left: 3px; 
    24     } 
    25 #palettediv .module, #lastmodule { 
    26     margin-right: auto; 
    27     margin-left: 10px; 
     21} 
     22 
     23ul#widget-list li.widget-list-item h4.widget-title { 
    2824    float: right; 
    29     } 
    30 #palettediv ul { 
    31     padding: 0 10px 0 0; 
     25} 
     26 
     27ul#widget-list li.widget-list-item div.widget-description { 
     28    margin: 0 200px 0 0; 
     29    padding: 0 4em 0 0; 
     30} 
     31 
     32h4.widget-title a { 
     33    left: 1em; 
     34    right: auto; 
     35} 
     36 
     37li.widget-list-control-item div.widget-control { 
     38    padding: 0 0 0 10px; 
     39} 
     40 
     41ul.widget-control-list div.widget-control-actions { 
     42    margin-left: -10px; 
    3243    margin-right: 0; 
    33     width: 100%; 
    34     } 
    35 .placemat { 
    36     margin-right: 0; 
    37     float: right; 
    38     } 
     44} 

  • trunk/wp-admin/css/widgets.css

    r5934 r6754  
    1 body { 
    2     height: 100%; 
     1/* 2 column liquid layout */ 
     2div.widget-liquid-left-holder { 
     3    float: left; 
     4    clear: left; 
     5    width: 100%; 
     6    margin-right: -310px; 
    37} 
    48 
    5 #sbadmin #zones { 
    6     -moz-user-select: none; 
    7     -khtml-user-select: none; 
    8     user-select: none; 
     9div.widget-liquid-left { 
     10    margin-right: 310px; 
    911} 
    1012 
    11 #sbreset { 
    12     float: left; 
    13     margin: 1px 0; 
     13div.widget-liquid-right { 
     14    float: right; 
     15    clear: right; 
     16    width: 300px; 
    1417} 
    1518 
    16 .dropzone { 
    17     border: 1px solid #bbb; 
    18     float: left; 
    19     margin-right: 10px; 
    20     padding: 5px; 
    21     background-color: #f0f8ff; 
     19/* pasitioning etc. */ 
     20form#widgets-filter { 
     21    position: relative; 
    2222} 
    2323 
    24 .dropzone h3 { 
    25     text-align: center; 
    26     color: #333; 
     24div#available-widgets-filter { 
     25    border-bottom: 1px solid #ccc; 
    2726} 
    2827 
    29 .dropzone input { 
     28p#widget-search { 
     29    position: absolute; 
     30    right: 0; 
     31    top: 0; 
     32    margin: 0; 
     33} 
     34 
     35div#widget-content { 
     36    border-bottom: 1px solid #ccc; 
     37}    
     38 
     39ul#widget-list { 
     40    list-style: none; 
     41    margin: 0; 
     42    padding: 0; 
     43} 
     44 
     45ul#widget-list li.widget-list-item { 
     46    padding: .7em 1em; 
     47    margin: 0; 
     48    border-bottom: 1px solid #ccc; 
     49    background-color: transparent; 
     50    line-height: 1; 
     51} 
     52 
     53ul#widget-list li.widget-list-item h4.widget-title { 
     54    position: relative; 
     55    margin: 0; 
     56    padding: .5em 1em; 
     57    width: 200px; 
     58    float: left; 
     59    background-color: #f0f0f0; 
     60    color: #000; 
     61} 
     62 
     63#dragHelper h4.widget-title { 
     64    color: #fff; 
     65    background-color: #2683ae; 
     66    padding: .5em 1em; 
     67    margin: 0; 
     68} 
     69 
     70ul#widget-list li.widget-list-item div.widget-description { 
     71    display: block; 
     72    margin: 0 0 0 200px; 
     73    padding: 0 0 0 4em; 
     74} 
     75 
     76 
     77ul#widget-list li.widget-list-item ul.widget-control-info { 
    3078    display: none; 
    3179} 
    3280 
    33 .dropzone ul { 
    34     float: left; 
    35     list-style-type: none; 
    36     width: 240px; 
    37     margin: 0; 
    38     min-height: 200px; 
    39     padding: 0; 
    40     display: block; 
     81div#sidebar-info { 
     82    padding: 0 1em; 
     83    margin-bottom: 1em; 
    4184} 
    4285 
    43 * .module { 
    44     width: 238px; 
    45     padding: 0; 
    46     margin: 5px 0; 
    47     cursor: move; 
    48     display: block; 
    49     border: 1px solid #ccc; 
    50     background-color: #fbfbfb; 
    51     position: relative; 
    52     text-align: left; 
    53     line-height: 25px; 
     86ul.widget-control-list { 
     87    list-style: none; 
     88    margin: 0; 
     89    padding: 0 1em; 
    5490} 
    5591 
    56 * .handle { 
    57     display: block; 
    58     width: 216px; 
    59     padding: 0 10px; 
    60     position: relative; 
    61     border-top: 1px solid #f2f2f2; 
    62     border-right: 1px solid #e8e8e8; 
    63     border-bottom: 1px solid #e8e8e8; 
    64     border-left: 1px solid #f2f2f2; 
     92li.widget-list-control-item { 
     93    background-color: #eaf3fa; 
     94    margin: 0 0 1em; 
    6595} 
    6696 
    67 * .popper { 
     97li.widget-list-control-item h4, #dragHelper li.widget-list-control-item h4 { 
     98    position: relative; 
    6899    margin: 0; 
    69     display: inline; 
    70     position: absolute; 
    71     top: 3px; 
    72     right: 3px; 
    73     overflow: hidden; 
    74     text-align: center; 
    75     height: 16px; 
    76     font-size: 18px; 
    77     line-height: 14px; 
    78     cursor: pointer; 
    79     padding: 0 3px 1px; 
    80     border-top: 4px solid #6da6d1; 
    81     background: url( ../images/fade-butt.png ) -5px 0px; 
     100    background-color: #2683ae; 
     101    padding: .5em 1em; 
     102    color: #fff; 
    82103} 
    83104 
    84 * html .popper { 
    85     padding: 1px 6px 0; 
    86     font-size: 16px; 
     105div.widget-control a.widget-action, div.widget-control a.widget-action:hover { 
     106    padding: .5em 1em; 
    87107} 
    88108 
    89 #sbadmin p.submit { 
    90     padding-right: 10px; 
    91     clear: left; 
     109h4.widget-title a { 
     110    position: absolute; 
     111    right: 1em; 
     112    text-decoration: underline; 
     113    border-bottom: none; 
    92114} 
    93115 
    94 .placemat { 
    95     cursor: default; 
    96     margin: 0; 
    97     padding: 0; 
    98     position: relative; 
     116li.widget-list-control-item h4.widget-title a, li.widget-list-control-item h4.widget-title a:visited { 
     117    color: #fff; 
    99118} 
    100119 
    101 .placemat h4 { 
    102     text-align: center; 
     120li.widget-list-control-item h4.widget-title a:hover { 
     121    color: #fff; 
     122    text-decoration: none; 
     123    border-bottom: none; 
    103124} 
    104125 
    105 .placemat span { 
    106     background-color: #ffe; 
    107     border: 1px solid #ccc; 
    108     padding: 0 10px 10px; 
    109     position: absolute; 
    110     text-align: justify; 
     126li.widget-list-control-item div.widget-control { 
     127    display: none; 
     128    margin: 1em; 
     129    padding: 0 10px 0 0; /* Correction for padding, margin, border of inputs */ 
    111130} 
    112131 
    113 #palettediv { 
    114     border: 1px solid #bbb; 
    115     background-color: #f0f8ff; 
    116     height:auto; 
    117     margin-top: 10px; 
    118     padding-bottom: 10px; 
    119 } 
    120  
    121 #palettediv:after, #zones:after, .dropzone:after { 
    122     content: "."; 
    123     display: block; 
    124     height: 0; 
    125     clear: both; 
    126     visibility: hidden; 
    127 } 
    128  
    129 #palettediv, #zones, .dropzone { 
    130     display: block; 
    131     min-height: 1px; 
    132 } 
    133  
    134 * html #palettediv, * html #zones, * html .dropzone { 
    135     height: 1%; 
    136 } 
    137  
    138 #palettediv h3 { 
    139     text-align: center; 
    140     color: #333; 
    141     min-height: 1px; 
    142 } 
    143  
    144 #palettediv ul { 
    145     padding: 0 0 0 10px; 
    146 } 
    147  
    148 #palettediv .module { 
    149     margin-right: 10px; 
    150     float: left; 
    151     width: 120px; 
    152 } 
    153  
    154 #palettediv .handle { 
    155     height: 40px; 
    156     font-size: 90%; 
    157     width: 110px; 
    158     padding: 0 5px; 
    159 } 
    160  
    161 #palettediv .popper { 
    162     visibility: hidden; 
    163 } 
    164  
    165 * html #palettediv ul { 
    166     margin: 0; 
    167     padding: 0 0 0 10px; 
    168 } 
    169  
    170 #controls { 
    171     height: 0px; 
    172 } 
    173  
    174 .control { 
    175     position: absolute; 
    176     display: block; 
    177     background: #f9fcfe; 
     132li.widget-list-control-item div.widget-control p { 
     133    margin: 0 0 1em; 
    178134    padding: 0; 
    179135} 
    180136 
    181 .controlhandle { 
    182     cursor: move; 
    183     background-color: #6da6d1; 
    184     border-bottom: 2px solid #448abd; 
    185     color: #333; 
    186     display: block; 
    187     margin: 0 0 5px; 
    188     padding: 4px; 
    189     font-size: 120%; 
     137ul.widget-control-list div.widget-control-actions { 
     138    margin-right: -10px; /* Correction for padding, margin, border of inputs */ 
     139    padding: 0 0 1em; 
    190140} 
    191141 
    192 .controlcloser { 
    193     cursor: pointer; 
    194     font-size: 120%; 
    195     display: block; 
    196     position: absolute; 
    197     top: 2px; 
    198     right: 8px; 
    199     padding: 0 3px; 
    200     font-weight: bold; 
     142ul.widget-control-list .sorthelper { 
     143    background-color: #ccf3fa; 
     144 
    201145} 
    202146 
    203 .controlform { 
    204     margin: 20px 30px; 
     147div#current-widgets { 
     148    padding-top: 1em; 
     149    border-top: 1px solid #ccc; 
     150    border-bottom: 1px solid #ccc; 
    205151} 
    206152 
    207 .controlform p { 
    208     text-align: center; 
     153#current-widgets .drop-widget-here { 
     154    background-color: #ffc 
    209155} 
    210  
    211 .control .checkbox { 
    212     border: none; 
    213     background: transparent; 
    214 } 
    215  
    216 .hidden { 
    217     display: none; 
    218 } 
    219  
    220 #shadow { 
    221     background: black; 
    222     display: none; 
    223     position: absolute; 
    224     top: 0px; 
    225     left: 0px; 
    226     width: 100%; 
    227 } 
    228  
    229 #dragHelper { 
    230     position: absolute; 
    231 } 
    232  
    233 #dragHelper li.module { 
    234     display: block; 
    235     float: left; 
    236 } 

  • trunk/wp-admin/includes/admin.php

    r6579 r6754  
    1515require_once(ABSPATH . 'wp-admin/includes/user.php'); 
    1616require_once(ABSPATH . 'wp-admin/includes/update.php'); 
    17 require_once(ABSPATH . 'wp-admin/includes/widgets.php'); 
    1817 
    1918require_once(ABSPATH . WPINC . '/registration.php'); 

  • trunk/wp-admin/includes/widgets.php

    r6726 r6754  
    206206} 
    207207 
    208 function temp_widget_css() { 
    209 ?> 
    210  
    211 <style type="text/css"> 
    212 /* 2 column liquid layout */ 
    213 div.widget-liquid-left-holder { 
    214     float: left; 
    215     clear: left; 
    216     width: 100%; 
    217     margin-right: -310px; 
    218 } 
    219  
    220 div.widget-liquid-left { 
    221     margin-right: 310px; 
    222 } 
    223  
    224 div.widget-liquid-right { 
    225     float: right; 
    226     clear: right; 
    227     width: 300px; 
    228 } 
    229  
    230 p.submit { 
    231     clear: both; 
    232 } 
    233  
    234 /* pasitioning etc. */ 
    235 form#widgets-filter { 
    236     position: relative; 
    237 } 
    238  
    239 p#widget-search { 
    240     position: absolute; 
    241     right: 0; 
    242     top: 0; 
    243     margin: 0; 
    244 } 
    245  
    246 ul#widget-list { 
    247     list-style: none; 
    248     margin: 0; 
    249     padding: 0; 
    250 } 
    251  
    252 ul#widget-list li.widget-list-item { 
    253     padding: .7em 1em; 
    254     margin: 0; 
    255     border-top:    1px solid #ccc; 
    256     border-bottom: 1px solid #ccc; 
    257     background-color: transparent; 
    258     line-height: 1; 
    259 } 
    260  
    261 ul#widget-list li.widget-list-item h4.widget-title { 
    262     position: relative; 
    263     margin: 0; 
    264     padding: .5em 1em; 
    265     width: 200px; 
    266     float: left; 
    267     background-color: #ccc; 
    268     color: #000; 
    269 } 
    270  
    271 #dragHelper h4.widget-title { 
    272     color: #fff; 
    273     background-color: #2683ae; 
    274     padding: .5em 1em; 
    275     margin: 0; 
    276 } 
    277  
    278 ul#widget-list li.widget-list-item div.widget-description { 
    279     display: block; 
    280     margin: 0 0 0 200px; 
    281     padding: 0 0 0 4em; 
    282 } 
    283  
    284  
    285 ul#widget-list li.widget-list-item ul.widget-control-info { 
    286     display: none; 
    287 } 
    288  
    289 div#sidebar-info { 
    290     padding: 0 1em; 
    291     margin-bottom: 1em; 
    292 } 
    293  
    294 ul.widget-control-list { 
    295     list-style: none; 
    296     margin: 0; 
    297     padding: 0 1em; 
    298 } 
    299  
    300 li.widget-list-control-item { 
    301     background-color: #eaf3fa; 
    302     margin: 0 0 1em; 
    303 } 
    304  
    305 li.widget-list-control-item h4, #dragHelper li.widget-list-control-item h4 { 
    306     position: relative; 
    307     margin: 0; 
    308     background-color: #2683ae; 
    309     padding: .5em 1em; 
    310     color: #fff; 
    311 } 
    312  
    313 div.widget-control a.widget-action, div.widget-control a.widget-action:hover { 
    314     padding: .5em 1em; 
    315 } 
    316  
    317 h4.widget-title a { 
    318     position: absolute; 
    319     right: 1em; 
    320     text-decoration: underline; 
    321     border-bottom: none; 
    322 } 
    323  
    324 li.widget-list-control-item h4.widget-title a, li.widget-list-control-item h4.widget-title a:visited { 
    325     color: #fff; 
    326 } 
    327  
    328 li.widget-list-control-item h4.widget-title a:hover { 
    329     color: #fff; 
    330     text-decoration: none; 
    331     border-bottom: none; 
    332 } 
    333  
    334 li.widget-list-control-item div.widget-control { 
    335     display: none; 
    336     margin: 1em; 
    337     padding: 0 10px 0 0; /* Correction for padding, margin, border of inputs */ 
    338 } 
    339  
    340 li.widget-list-control-item div.widget-control p { 
    341     margin: 0 0 1em; 
    342     padding: 0; 
    343 } 
    344  
    345 ul.widget-control-list div.widget-control-actions { 
    346     margin-right: -10px; /* Correction for padding, margin, border of inputs */ 
    347     padding: 0 0 1em; 
    348 } 
    349  
    350 ul.widget-control-list .sorthelper { 
    351     background-color: #ccf3fa; 
    352  
    353 } 
    354  
    355 #current-widgets .drop-widget-here { 
    356     background-color: #ffc 
    357 } 
    358  
    359 ul.widget-control-list select option { 
    360 } 
    361 </style> 
    362  
    363 <?php 
    364 } 
    365  
    366 add_action( 'admin_head', 'temp_widget_css' ); 
    367  
    368 ?> 
     208function widget_css() { 
     209    wp_admin_css( 'css/widgets' ); 
     210} 
     211 
     212add_action( 'admin_head', 'widget_css' ); 
     213 
     214?> 

  • trunk/wp-admin/widgets.php

    r6726 r6754  
    22 
    33require_once( 'admin.php' ); 
     4require_once(ABSPATH . 'wp-admin/includes/widgets.php'); 
    45 
    56if ( ! current_user_can('switch_themes') ) 
    …… 
    147148)); 
    148149*/ 
    149 $page_links = false; 
     150$page_links = '&nbsp;'; 
    150151 
    151152// Unsanitized! 
    …… 
    181182    <p id="widget-search"> 
    182183        <input type="text" id="widget-search-input" name="s" value="<?php echo attribute_escape( $widget_search ); ?>" /> 
    183         <input type="submit" value="<?php _e( 'Search Widgets' ); ?>" /> 
     184        <input type="submit" class="button" value="<?php _e( 'Search Widgets' ); ?>" /> 
    184185    </p> 
    185186 
    …… 
    187188    <div id="available-widgets-filter" class="widget-liquid-left"> 
    188189        <h3><?php printf( __('Available Widgets %s'), '<a href="#help:avaliable-widgets" class="wp-context-help">?</a>' ); ?></h3> 
    189         <p> 
     190        <div class="nav"> 
    190191            <select name="show"> 
    191192<?php foreach ( $show_values as $show_value => $show_text ) : $show_value = attribute_escape( $show_value ); ?> 
    …… 
    194195            </select> 
    195196            <input type="submit" value="<?php _e('Show' ); ?>" /> 
    196         </p> 
    197 <?php if ( $page_links ) : ?> 
    198         <p class="pagenav"> 
    199             <?php echo $page_links; ?> 
    200  
    201         </p> 
    202 <?php endif; ?> 
     197            <p class="pagenav"> 
     198                <?php echo $page_links; ?> 
     199            </p> 
     200        </div> 
    203201    </div> 
    204202    </div> 
    …… 
    207205        <h3><?php printf( __('Current Widgets %s'), '<a href="#help:current-widgets" class="wp-context-help">?</a>' ); ?></h3> 
    208206 
    209 <?php if ( 1 < $sidebars_count ) : ?> 
    210  
    211         <p> 
     207        <div class="nav"> 
    212208            <select id="sidebar-selector" name="sidebar"> 
    213209<?php foreach ( $wp_registered_sidebars as $sidebar_id => $registered_sidebar ) : $sidebar_id = attribute_escape( $sidebar_id ); ?> 
    …… 
    216212            </select> 
    217213            <input type="submit" value="<?php _e('Go' ); ?>" /> 
    218         </p> 
    219  
    220 <?php endif; ?> 
     214        </div> 
    221215 
    222216    </div> 
    …… 
    230224            <?php wp_list_widgets( $show, $widget_search ); // This lists all the widgets for the query ( $show, $search ) ?> 
    231225 
    232 <?php if ( $page_links ) : ?> 
    233             <p class="pagenav"> 
    234                 <?php echo $page_links; ?> 
    235  
    236             </p> 
    237 <?php endif; ?> 
    238  
     226            <div class="nav"> 
     227                <p class="pagenav"> 
     228                    <?php echo $page_links; ?> 
     229                </p> 
     230            </div> 
    239231        </div> 
    240232    </div> 
    …… 
    260252        </div> 
    261253    </div> 
     254 
     255    <br class="clear" /> 
    262256 
    263257    <p class="submit"> 

  • trunk/wp-admin/wp-admin.css

    r6734 r6754  
    269269} 
    270270 
     271.submit { 
     272    margin: 1.5em 0; 
     273} 
     274 
    271275.submit input, .submit input:focus, .button, .button:focus { 
    272276    color: #246; 
    …… 
    274278} 
    275279 
    276 .submit, .editform th, #postcustomsubmit { 
     280.editform th, #postcustomsubmit { 
    277281    text-align: right; 
    278282} 
    …… 
    732736 
    733737 
     738div.nav { 
     739    background-color: #eaf3fa; 
     740    padding: 0.7em 1em; 
     741    margin: .7em 0; 
     742} 
     743 
    734744.page-numbers { 
    735745    padding: 4px 7px; 
    …… 
    749759    border: 1px solid #999; 
    750760    font-weight: bold; 
     761} 
     762 
     763p.pagenav { 
     764    margin: 0; 
     765    display: inline; 
    751766} 
    752767