mirror of
https://github.com/WordPress/WordPress.git
synced 2024-11-15 15:16:29 +01:00
DFW:
- Move the word count and "Just Write" to a fixed bar at the bottom. - Fix responsive mode to 480px. Narrower screens will have a scroll bar. - Hide the Help button on screens < 480px, move the Save button to the right, make it bigger to match the others, and other responsive mode fixes. Fixes #26907, see #27709 Built from https://develop.svn.wordpress.org/trunk@28043 git-svn-id: http://core.svn.wordpress.org/trunk@27873 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrew Ozz
parent
a55d734f60
commit
268092761d
@ -309,6 +309,7 @@
|
||||
|
||||
if ( pixels && pixels.toString().indexOf('%') !== -1 ) {
|
||||
s.$editorContainer.css( 'width', pixels );
|
||||
s.$statusbar.css( 'width', pixels );
|
||||
|
||||
if ( s.$dfwTitle ) {
|
||||
s.$dfwTitle.css( 'width', pixels );
|
||||
@ -320,6 +321,7 @@
|
||||
// Reset to theme width
|
||||
width = $('#wp-fullscreen-body').data('theme-width') || 800;
|
||||
s.$editorContainer.width( width );
|
||||
s.$statusbar.width( width );
|
||||
|
||||
if ( s.$dfwTitle ) {
|
||||
s.$dfwTitle.width( width - 16 );
|
||||
@ -342,6 +344,7 @@
|
||||
}
|
||||
|
||||
s.$editorContainer.width( width );
|
||||
s.$statusbar.width( width );
|
||||
|
||||
if ( s.$dfwTitle ) {
|
||||
s.$dfwTitle.width( width - 16 );
|
||||
@ -362,9 +365,7 @@
|
||||
// This event occurs while the overlay blocks the UI.
|
||||
ps.subscribe( 'showing', function() {
|
||||
$body.addClass( 'wp-fullscreen-active' );
|
||||
|
||||
s.$dfwWrap.addClass( 'wp-fullscreen-wrap' );
|
||||
s.$editorContainer.append( $('#wp-fullscreen-status') );
|
||||
|
||||
if ( s.$dfwTitle ) {
|
||||
s.$dfwTitle.after( '<span id="wp-fullscreen-title-placeholder">' );
|
||||
@ -412,7 +413,6 @@
|
||||
|
||||
ps.subscribe( 'hiding', function() { // This event occurs while the overlay blocks the DFW UI.
|
||||
$body.removeClass( 'wp-fullscreen-active' );
|
||||
$( '#wp-fullscreen-body' ).append( $('#wp-fullscreen-status') );
|
||||
|
||||
if ( s.$dfwTitle ) {
|
||||
$( '#wp-fullscreen-title-placeholder' ).before( s.$dfwTitle.removeClass('wp-fullscreen-title').css( 'width', '' ) ).remove();
|
||||
@ -474,6 +474,7 @@
|
||||
|
||||
s.toolbar = toolbar = $('#fullscreen-topbar');
|
||||
s.$fullscreenFader = $('#fullscreen-fader');
|
||||
s.$statusbar = $('#wp-fullscreen-status');
|
||||
s.hasTinymce = typeof tinymce !== 'undefined';
|
||||
|
||||
if ( ! s.hasTinymce )
|
||||
|
||||
2
wp-admin/js/wp-fullscreen.min.js
vendored
2
wp-admin/js/wp-fullscreen.min.js
vendored
File diff suppressed because one or more lines are too long
@ -1263,7 +1263,7 @@ final class _WP_Editors {
|
||||
</div></div>
|
||||
|
||||
<div id="wp-fullscreen-save">
|
||||
<input type="button" class="button-primary right" value="<?php echo $save; ?>" onclick="wp.editor.fullscreen.save();" />
|
||||
<input type="button" class="button button-primary right" value="<?php echo $save; ?>" onclick="wp.editor.fullscreen.save();" />
|
||||
<span class="spinner"></span>
|
||||
<span class="wp-fullscreen-saved-message"><?php if ( $post->post_status == 'publish' ) _e('Updated.'); else _e('Saved.'); ?></span>
|
||||
<span class="wp-fullscreen-error-message"><?php _e('Save failed.'); ?></span>
|
||||
@ -1272,9 +1272,11 @@ final class _WP_Editors {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="wp-fullscreen-status">
|
||||
<div id="wp-fullscreen-count"><?php printf( __( 'Word count: %s' ), '<span class="word-count">0</span>' ); ?></div>
|
||||
<div id="wp-fullscreen-tagline"><?php _e('Just write.'); ?></div>
|
||||
<div id="wp-fullscreen-statusbar">
|
||||
<div id="wp-fullscreen-status">
|
||||
<div id="wp-fullscreen-count"><?php printf( __( 'Word count: %s' ), '<span class="word-count">0</span>' ); ?></div>
|
||||
<div id="wp-fullscreen-tagline"><?php _e('Just write.'); ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -1501,7 +1501,7 @@ i.mce-i-hr:before {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
max-width: 100% !important;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-editor-tools,
|
||||
@ -1511,10 +1511,22 @@ i.mce-i-hr:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#wp-fullscreen-statusbar {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 30px;
|
||||
z-index: 100020;
|
||||
background: #fff;
|
||||
transition-property: height;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
#wp-fullscreen-status {
|
||||
margin: auto;
|
||||
-webkit-transition: opacity 0.4s;
|
||||
transition: opacity 0.4s;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
border-top: 1px dashed #ccc;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title,
|
||||
@ -1531,7 +1543,8 @@ i.mce-i-hr:before {
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-editor-container {
|
||||
margin: auto;
|
||||
margin: 0 auto 30px;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title {
|
||||
@ -1544,10 +1557,10 @@ i.mce-i-hr:before {
|
||||
}
|
||||
|
||||
#wp-fullscreen-tagline {
|
||||
color: #bbb;
|
||||
color: #888;
|
||||
font-size: 18px;
|
||||
float: left;
|
||||
padding-top: 5px;
|
||||
padding: 4px 0 0;
|
||||
}
|
||||
|
||||
/* =Top bar
|
||||
@ -1575,28 +1588,34 @@ i.mce-i-hr:before {
|
||||
|
||||
#wp-fullscreen-mode-bar,
|
||||
#wp-fullscreen-button-bar,
|
||||
#wp-fullscreen-close,
|
||||
#wp-fullscreen-count {
|
||||
#wp-fullscreen-close {
|
||||
float: right;
|
||||
}
|
||||
|
||||
#wp-fullscreen-count,
|
||||
#wp-fullscreen-tagline {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#wp-fullscreen-button-bar {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-save {
|
||||
float: left;
|
||||
padding: 2px 5px 0 2px;
|
||||
padding: 2px 0 0;
|
||||
min-width: 95px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-count,
|
||||
#wp-fullscreen-close {
|
||||
padding-top: 6px;
|
||||
padding: 5px 0 0;
|
||||
}
|
||||
|
||||
#wp-fullscreen-central-toolbar {
|
||||
margin: auto;
|
||||
padding: 0;
|
||||
min-width: 550px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-buttons > div {
|
||||
@ -1645,11 +1664,10 @@ i.mce-i-hr:before {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#wp-fullscreen-save img,
|
||||
#wp-fullscreen-save span {
|
||||
padding-left: 4px;
|
||||
line-height: 26px;
|
||||
display: none;
|
||||
margin: 5px 6px 0;
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* =Thickbox Adjustments
|
||||
@ -1670,7 +1688,6 @@ i.mce-i-hr:before {
|
||||
/* =CSS 3 transitions
|
||||
-------------------------------------------------------------- */
|
||||
|
||||
.wp-fullscreen-active #wp-fullscreen-status,
|
||||
.wp-fullscreen-active #fullscreen-topbar {
|
||||
-webkit-transition-duration: 0.8s;
|
||||
transition-duration: 0.8s;
|
||||
@ -1678,7 +1695,10 @@ i.mce-i-hr:before {
|
||||
filter: alpha(opacity=0);
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-status,
|
||||
.wp-fullscreen-active #wp-fullscreen-statusbar {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #fullscreen-topbar {
|
||||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
@ -1686,6 +1706,10 @@ i.mce-i-hr:before {
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-statusbar {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title,
|
||||
.wp-fullscreen-active .wp-editor-container {
|
||||
-webkit-transition-duration: 0.8s;
|
||||
@ -1749,8 +1773,8 @@ i.mce-i-hr:before {
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
.wp-dfw-touch #wp-fullscreen-status {
|
||||
opacity: 1;
|
||||
.wp-dfw-touch #wp-fullscreen-statusbar {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
@media screen and ( max-width: 782px ) {
|
||||
@ -1759,7 +1783,6 @@ i.mce-i-hr:before {
|
||||
#wp-fullscreen-mode-bar,
|
||||
#wp-fullscreen-button-bar,
|
||||
#wp-fullscreen-save {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@ -1769,6 +1792,7 @@ i.mce-i-hr:before {
|
||||
|
||||
#wp-fullscreen-central-toolbar {
|
||||
width: auto !important;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
#wp-fullscreen-close {
|
||||
@ -1787,13 +1811,36 @@ i.mce-i-hr:before {
|
||||
top: 95px;
|
||||
}
|
||||
|
||||
.wp-fullscreen-wrap .wp-editor-container,
|
||||
.wp-fullscreen-title {
|
||||
max-width: 700px;
|
||||
#wp-fullscreen-save {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and ( max-width: 480px ) {
|
||||
#wp_fs_help {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wp-fullscreen-saved-message {
|
||||
display: none !important;
|
||||
.wp-fullscreen-wrap .wp-editor-container,
|
||||
.wp-fullscreen-title {
|
||||
width: 480px !important;
|
||||
}
|
||||
|
||||
body.wp-fullscreen-active {
|
||||
width: 480px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#fullscreen-topbar,
|
||||
.wp-fullscreen-wrap {
|
||||
width: 480px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-status {
|
||||
width: auto !important;
|
||||
max-width: 100%;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
2
wp-includes/css/editor-rtl.min.css
vendored
2
wp-includes/css/editor-rtl.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1501,7 +1501,7 @@ i.mce-i-hr:before {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
max-width: 100% !important;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-editor-tools,
|
||||
@ -1511,10 +1511,22 @@ i.mce-i-hr:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#wp-fullscreen-statusbar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 30px;
|
||||
z-index: 100020;
|
||||
background: #fff;
|
||||
transition-property: height;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
#wp-fullscreen-status {
|
||||
margin: auto;
|
||||
-webkit-transition: opacity 0.4s;
|
||||
transition: opacity 0.4s;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
border-top: 1px dashed #ccc;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title,
|
||||
@ -1531,7 +1543,8 @@ i.mce-i-hr:before {
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-editor-container {
|
||||
margin: auto;
|
||||
margin: 0 auto 30px;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title {
|
||||
@ -1544,10 +1557,10 @@ i.mce-i-hr:before {
|
||||
}
|
||||
|
||||
#wp-fullscreen-tagline {
|
||||
color: #bbb;
|
||||
color: #888;
|
||||
font-size: 18px;
|
||||
float: right;
|
||||
padding-top: 5px;
|
||||
padding: 4px 0 0;
|
||||
}
|
||||
|
||||
/* =Top bar
|
||||
@ -1575,28 +1588,34 @@ i.mce-i-hr:before {
|
||||
|
||||
#wp-fullscreen-mode-bar,
|
||||
#wp-fullscreen-button-bar,
|
||||
#wp-fullscreen-close,
|
||||
#wp-fullscreen-count {
|
||||
#wp-fullscreen-close {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#wp-fullscreen-count,
|
||||
#wp-fullscreen-tagline {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#wp-fullscreen-button-bar {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-save {
|
||||
float: right;
|
||||
padding: 2px 2px 0 5px;
|
||||
padding: 2px 0 0;
|
||||
min-width: 95px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-count,
|
||||
#wp-fullscreen-close {
|
||||
padding-top: 6px;
|
||||
padding: 5px 0 0;
|
||||
}
|
||||
|
||||
#wp-fullscreen-central-toolbar {
|
||||
margin: auto;
|
||||
padding: 0;
|
||||
min-width: 550px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-buttons > div {
|
||||
@ -1645,11 +1664,10 @@ i.mce-i-hr:before {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#wp-fullscreen-save img,
|
||||
#wp-fullscreen-save span {
|
||||
padding-right: 4px;
|
||||
line-height: 26px;
|
||||
display: none;
|
||||
margin: 5px 6px 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* =Thickbox Adjustments
|
||||
@ -1670,7 +1688,6 @@ i.mce-i-hr:before {
|
||||
/* =CSS 3 transitions
|
||||
-------------------------------------------------------------- */
|
||||
|
||||
.wp-fullscreen-active #wp-fullscreen-status,
|
||||
.wp-fullscreen-active #fullscreen-topbar {
|
||||
-webkit-transition-duration: 0.8s;
|
||||
transition-duration: 0.8s;
|
||||
@ -1678,7 +1695,10 @@ i.mce-i-hr:before {
|
||||
filter: alpha(opacity=0);
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-status,
|
||||
.wp-fullscreen-active #wp-fullscreen-statusbar {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #fullscreen-topbar {
|
||||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
@ -1686,6 +1706,10 @@ i.mce-i-hr:before {
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
|
||||
.wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-statusbar {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.wp-fullscreen-active .wp-fullscreen-title,
|
||||
.wp-fullscreen-active .wp-editor-container {
|
||||
-webkit-transition-duration: 0.8s;
|
||||
@ -1749,8 +1773,8 @@ i.mce-i-hr:before {
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
.wp-dfw-touch #wp-fullscreen-status {
|
||||
opacity: 1;
|
||||
.wp-dfw-touch #wp-fullscreen-statusbar {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
@media screen and ( max-width: 782px ) {
|
||||
@ -1759,7 +1783,6 @@ i.mce-i-hr:before {
|
||||
#wp-fullscreen-mode-bar,
|
||||
#wp-fullscreen-button-bar,
|
||||
#wp-fullscreen-save {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@ -1769,6 +1792,7 @@ i.mce-i-hr:before {
|
||||
|
||||
#wp-fullscreen-central-toolbar {
|
||||
width: auto !important;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
#wp-fullscreen-close {
|
||||
@ -1787,13 +1811,36 @@ i.mce-i-hr:before {
|
||||
top: 95px;
|
||||
}
|
||||
|
||||
.wp-fullscreen-wrap .wp-editor-container,
|
||||
.wp-fullscreen-title {
|
||||
max-width: 700px;
|
||||
#wp-fullscreen-save {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and ( max-width: 480px ) {
|
||||
#wp_fs_help {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wp-fullscreen-saved-message {
|
||||
display: none !important;
|
||||
.wp-fullscreen-wrap .wp-editor-container,
|
||||
.wp-fullscreen-title {
|
||||
width: 480px !important;
|
||||
}
|
||||
|
||||
body.wp-fullscreen-active {
|
||||
width: 480px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#fullscreen-topbar,
|
||||
.wp-fullscreen-wrap {
|
||||
width: 480px;
|
||||
}
|
||||
|
||||
#wp-fullscreen-status {
|
||||
width: auto !important;
|
||||
max-width: 100%;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
2
wp-includes/css/editor.min.css
vendored
2
wp-includes/css/editor.min.css
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user