diff --git a/src/wp-admin/css/edit.css b/src/wp-admin/css/edit.css index af5250c301..e50c1d847a 100644 --- a/src/wp-admin/css/edit.css +++ b/src/wp-admin/css/edit.css @@ -1241,6 +1241,97 @@ table.links-table { max-width: 280px; } +/* DFW 2 +-------------------------------------------------------------- */ + +.focus-on .wrap > h2, +.focus-on #wpfooter, +.focus-on .postbox-container, +.focus-on div.updated, +.focus-on div.error, +.focus-on div.notice { + opacity: 0; + -webkit-transition-duration: 0.6s; + transition-duration: 0.6s; + -webkit-transition-property: opacity; + transition-property: opacity; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + +.focus-on #wp-toolbar { + opacity: 0.3; + -webkit-transition-duration: 0.6s; + transition-duration: 0.6s; + -webkit-transition-property: opacity; + transition-property: opacity; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + +.focus-off .wrap > h2, +.focus-off #wpfooter, +.focus-off .postbox-container, +.focus-off div.updated, +.focus-off div.error, +.focus-off div.notice, +.focus-off #wp-toolbar { + opacity: 1; + -webkit-transition-duration: 0.2s; + transition-duration: 0.2s; + -webkit-transition-property: opacity; + transition-property: opacity; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + +.focus-on #adminmenuback, +.focus-on #adminmenuwrap, +.focus-on .screen-meta-toggle { + -webkit-transition-duration: 0.6s; + transition-duration: 0.6s; + -webkit-transition-property: -webkit-transform; + transition-property: transform; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + +/* @noflip */ +.focus-on #adminmenuback, +.focus-on #adminmenuwrap { + -webkit-transform: translateX( -100% ); + -ms-transform: translateX( -100% ); + transform: translateX( -100% ); +} + +/* @noflip */ +.rtl.focus-on #adminmenuback, +.rtl.focus-on #adminmenuwrap { + -webkit-transform: translateX( 100% ); + -ms-transform: translateX( 100% ); + transform: translateX( 100% ); +} + +.focus-on .screen-meta-toggle { + -webkit-transform: translateY( -100% ); + -ms-transform: translateY( -100% ); + transform: translateY( -100% ); +} + +.focus-off #adminmenuback, +.focus-off #adminmenuwrap, +.focus-off .screen-meta-toggle { + -webkit-transform: translateX( 0 ); + -ms-transform: translateX( 0 ); + transform: translateX( 0 ); + -webkit-transition-duration: 0.2s; + transition-duration: 0.2s; + -webkit-transition-property: -webkit-transform; + transition-property: transform; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + /* =Media Queries -------------------------------------------------------------- */ diff --git a/src/wp-includes/css/editor.css b/src/wp-includes/css/editor.css index 5d759316be..25da78e087 100644 --- a/src/wp-includes/css/editor.css +++ b/src/wp-includes/css/editor.css @@ -2132,89 +2132,3 @@ html:lang(he-il) .rtl .quicktags-toolbar input { background: none; } } - -/* TODO: DFW responsive */ - -/* DFW 2 --------------------------------------------------------------- */ - -.focus-on .wrap > h2, -.focus-on #wpfooter, -.focus-on .postbox-container, -.focus-on div.updated, -.focus-on div.error, -.focus-on #wp-toolbar { - opacity: 0; - -webkit-transition-duration: 0.6s; - transition-duration: 0.6s; - -webkit-transition-property: opacity; - transition-property: opacity; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; -} - -.focus-on #wp-toolbar { - opacity: 0.3; -} - -.focus-off .wrap > h2, -.focus-off #wpfooter, -.focus-off .postbox-container, -.focus-off div.updated, -.focus-off div.error, -.focus-off #wp-toolbar { - opacity: 1; - -webkit-transition-duration: 0.2s; - transition-duration: 0.2s; - -webkit-transition-property: opacity; - transition-property: opacity; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; -} - -.focus-on #adminmenuback, -.focus-on #adminmenuwrap, -.focus-on .screen-meta-toggle { - -webkit-transition-duration: 0.6s; - transition-duration: 0.6s; - -webkit-transition-property: -webkit-transform; - transition-property: transform; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; -} - -/* @noflip */ -.focus-on #adminmenuback, -.focus-on #adminmenuwrap { - -webkit-transform: translateX( -100% ); - -ms-transform: translateX( -100% ); - transform: translateX( -100% ); -} - -/* @noflip */ -.rtl.focus-on #adminmenuback, -.rtl.focus-on #adminmenuwrap { - -webkit-transform: translateX( 100% ); - -ms-transform: translateX( 100% ); - transform: translateX( 100% ); -} - -.focus-on .screen-meta-toggle { - -webkit-transform: translateY( -100% ); - -ms-transform: translateY( -100% ); - transform: translateY( -100% ); -} - -.focus-off #adminmenuback, -.focus-off #adminmenuwrap, -.focus-off .screen-meta-toggle { - -webkit-transform: translateX( 0 ); - -ms-transform: translateX( 0 ); - transform: translateX( 0 ); - -webkit-transition-duration: 0.2s; - transition-duration: 0.2s; - -webkit-transition-property: -webkit-transform; - transition-property: transform; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; -}