Changeset 7222 for CKEditor/trunk


Ignore:
Timestamp:
08/24/11 16:41:31 (4 years ago)
Author:
garry.yao
Message:

#6200: visual focus outline for checkbox, radio, lock button.

Location:
CKEditor/trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • CKEditor/trunk/CHANGES.html

    r7221 r7222  
    6969                <li><a href="http://dev.ckeditor.com/ticket/7490">#7490</a> : [IE] Block format leaks to the next unselected line when <code>enterMode</code> is set to <code>BR</code>.</li>
    7070                <li><a href="http://dev.ckeditor.com/ticket/8087">#8087</a> : Indenting list items may add redundant text direction attributes.</li>
     71                <li><a href="http://dev.ckeditor.com/ticket/6200">#6200</a> : Styling for certain dialog element type that miss focus outline like checkbox.</li>
    7172                <li>Updated the following language files:<ul>
    7273                        <li><a href="http://dev.ckeditor.com/ticket/8128">#8128</a> : Italian;</li>
  • CKEditor/trunk/_source/plugins/dialog/plugin.js

    r7196 r7222  
    23572357                                dialog.on( 'load', function()
    23582358                                        {
    2359                                                 if ( me.getInputElement() )
     2359                                                var input = me.getInputElement();
     2360                                                if ( input )
    23602361                                                {
    2361                                                         me.getInputElement().on( 'focus', function()
     2362                                                        var focusClass = me.type in { 'checkbox' : 1, 'ratio' : 1 } && CKEDITOR.env.ie && CKEDITOR.env.version < 8 ? 'cke_dialog_ui_focused' : '';
     2363                                                        input.on( 'focus', function()
    23622364                                                                {
    23632365                                                                        dialog._.tabBarMode = false;
    23642366                                                                        dialog._.hasFocus = true;
    23652367                                                                        me.fire( 'focus' );
    2366                                                                 }, me );
     2368                                                                        focusClass && this.addClass( focusClass );
     2369
     2370                                                                });
     2371
     2372                                                        input.on( 'blur', function()
     2373                                                                {
     2374                                                                        me.fire( 'blur' );
     2375                                                                        focusClass && this.removeClass( focusClass );
     2376                                                                });
    23672377                                                }
    23682378                                        } );
  • CKEditor/trunk/_source/skins/kama/dialog.css

    r7201 r7222  
    943943}
    944944
     945/* Compensate focus outline for some input elements. (#6200) */
     946.cke_skin_kama .cke_browser_gecko .cke_dialog_ui_checkbox_input:focus,
     947.cke_skin_kama .cke_browser_gecko .cke_dialog_ui_radio_input:focus,
     948.cke_skin_kama .cke_browser_opera .cke_dialog_ui_checkbox_input:focus,
     949.cke_skin_kama .cke_browser_opera .cke_dialog_ui_radio_input:focus,
     950.cke_skin_kama .cke_browser_gecko .cke_dialog_ui_input_select:focus,
     951.cke_skin_kama .cke_browser_gecko .cke_btn_over,
     952.cke_skin_kama .cke_browser_opera .cke_btn_over,
     953.cke_skin_kama .cke_browser_ie .cke_btn_over
     954{
     955        outline: 1px dotted #696969;
     956}
     957
     958/* IE<8 instead doesn't support CSS outline property, emulated with dotted border. */
     959
     960/* Predefined border to avoid visual size change impact. */
     961.cke_skin_kama .cke_browser_ie .cke_dialog_ui_checkbox_input,
     962.cke_skin_kama .cke_browser_ie .cke_dialog_ui_ratio_input,
     963.cke_skin_kama .cke_browser_ie .cke_btn_reset,
     964.cke_skin_kama .cke_browser_ie .cke_btn_locked,
     965.cke_skin_kama .cke_browser_ie .cke_btn_unlocked
     966{
     967        *border: 1px solid transparent !important;
     968        /* Emulating border-color: transparent in IE6.*/
     969        -filter: chroma(color=black);
     970}
     971
     972.cke_skin_kama .cke_browser_ie .cke_dialog_ui_focused,
     973.cke_skin_kama .cke_browser_ie .cke_btn_over
     974{
     975        *border: 1px dotted #696969 !important;
     976}
     977
    945978.cke_skin_kama .cke_iframe_shim
    946979{
  • CKEditor/trunk/_source/skins/office2003/dialog.css

    r7201 r7222  
    844844}
    845845
     846/* Compensate focus outline for some input elements. (#6200) */
     847.cke_skin_office2003 .cke_browser_gecko .cke_dialog_ui_checkbox_input:focus,
     848.cke_skin_office2003 .cke_browser_gecko .cke_dialog_ui_radio_input:focus,
     849.cke_skin_office2003 .cke_browser_opera .cke_dialog_ui_checkbox_input:focus,
     850.cke_skin_office2003 .cke_browser_opera .cke_dialog_ui_radio_input:focus,
     851.cke_skin_office2003 .cke_browser_gecko .cke_dialog_ui_input_select:focus,
     852.cke_skin_office2003 .cke_browser_gecko .cke_btn_over,
     853.cke_skin_office2003 .cke_browser_opera .cke_btn_over,
     854.cke_skin_office2003 .cke_browser_ie .cke_btn_over
     855{
     856        outline: 1px dotted #696969;
     857}
     858
     859/* IE<8 instead doesn't support CSS outline property, emulated with dotted border. */
     860
     861/* Predefined border to avoid visual size change impact. */
     862.cke_skin_office2003 .cke_browser_ie .cke_dialog_ui_checkbox_input,
     863.cke_skin_office2003 .cke_browser_ie .cke_dialog_ui_ratio_input,
     864.cke_skin_office2003 .cke_browser_ie .cke_btn_reset,
     865.cke_skin_office2003 .cke_browser_ie .cke_btn_locked,
     866.cke_skin_office2003 .cke_browser_ie .cke_btn_unlocked
     867{
     868        *border: 1px solid transparent !important;
     869        /* Emulating border-color: transparent in IE6.*/
     870        -filter: chroma(color=black);
     871}
     872
     873.cke_skin_office2003 .cke_browser_ie .cke_dialog_ui_focused,
     874.cke_skin_office2003 .cke_browser_ie .cke_btn_over
     875{
     876        *border: 1px dotted #696969 !important;
     877}
     878
    846879.cke_skin_office2003 .cke_iframe_shim
    847880{
  • CKEditor/trunk/_source/skins/v2/dialog.css

    r7201 r7222  
    861861}
    862862
     863/* Compensate focus outline for some input elements. (#6200) */
     864.cke_skin_v2 .cke_browser_gecko .cke_dialog_ui_checkbox_input:focus,
     865.cke_skin_v2 .cke_browser_gecko .cke_dialog_ui_radio_input:focus,
     866.cke_skin_v2 .cke_browser_opera .cke_dialog_ui_checkbox_input:focus,
     867.cke_skin_v2 .cke_browser_opera .cke_dialog_ui_radio_input:focus,
     868.cke_skin_v2 .cke_browser_gecko .cke_dialog_ui_input_select:focus,
     869.cke_skin_v2 .cke_browser_gecko .cke_btn_over,
     870.cke_skin_v2 .cke_browser_opera .cke_btn_over,
     871.cke_skin_v2 .cke_browser_ie .cke_btn_over
     872{
     873        outline: 1px dotted #696969;
     874}
     875
     876/* IE<8 instead doesn't support CSS outline property, emulated with dotted border. */
     877
     878/* Predefined border to avoid visual size change impact. */
     879.cke_skin_v2 .cke_browser_ie .cke_dialog_ui_checkbox_input,
     880.cke_skin_v2 .cke_browser_ie .cke_dialog_ui_ratio_input,
     881.cke_skin_v2 .cke_browser_ie .cke_btn_reset,
     882.cke_skin_v2 .cke_browser_ie .cke_btn_locked,
     883.cke_skin_v2 .cke_browser_ie .cke_btn_unlocked
     884{
     885        *border: 1px solid transparent !important;
     886        /* Emulating border-color: transparent in IE6.*/
     887        -filter: chroma(color=black);
     888}
     889
     890.cke_skin_v2 .cke_browser_ie .cke_dialog_ui_focused,
     891.cke_skin_v2 .cke_browser_ie .cke_btn_over
     892{
     893        *border: 1px dotted #696969 !important;
     894}
     895
    863896.cke_skin_v2 .cke_iframe_shim
    864897{
Note: See TracChangeset for help on using the changeset viewer.
© 2003 – 2015 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy