Skip to content

Add automated RTL support #3844

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
youknowriad merged 9 commits into from
Dec 7, 2017
Merged

Add automated RTL support #3844

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
8b95585
fix add new post button for RTL (minor)
yoavf Dec 7, 2017
bdc5290
Remove manual RTL css
yoavf Dec 7, 2017
2a42c8a
Add temp version of webpack-rtl-plugin
yoavf Dec 7, 2017
077a6bb
use webback-rtl-plugin to create -rtl css files
yoavf Dec 7, 2017
bf51f05
Load -rtl css files for all Gutenberg css files
yoavf Dec 7, 2017
a603bd8
whitespace, add inline comment to build file
yoavf Dec 7, 2017
f1106b9
indenting fix
yoavf Dec 7, 2017
dc00710
Improve RTL styles on the desktop breakpoint.
Dec 6, 2017
bace2cf
TintMCE: Fix TinyMCE initialization for RTL languages
youknowriad Dec 7, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion components/panel/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,10 +75,20 @@

.dashicon {
position: absolute;
right: 10px;
right: $item-spacing;
top: 50%;
transform: translateY( -50% );
}

// mirror the arrow horizontally in RTL languages
/* rtl:begin:ignore */
body.rtl & .dashicons-arrow-right {
transform: scaleX(-1);
-ms-filter: fliph;
filter: FlipH;
margin-top: -10px;
}
/* rtl:end:ignore */
}

.components-panel__body-toggle-icon {
Expand Down
18 changes: 0 additions & 18 deletions editor/edit-post/header/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,24 +54,6 @@
right: -$admin-sidebar-width-big;
}

/* RTL */
.rtl.auto-fold .editor-header {
@include break-medium() {
left: 0;
right: $admin-sidebar-width-collapsed;
}

@include break-large() {
left: 0;
right: $admin-sidebar-width;
}
}

.rtl.auto-fold .wp-responsive-open .editor-header {
left: -$admin-sidebar-width-big;
right: $admin-sidebar-width-big;
}

.editor-header__settings {
display: inline-flex;
align-items: center;
Expand Down
8 changes: 8 additions & 0 deletions gutenberg.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -460,7 +460,11 @@ function gutenberg_replace_default_add_new_button() {
font: 400 20px/.5 dashicons;
speak: none;
top: 1px;
<?php if ( is_rtl() ) : ?>
right: -1px;
<?php else : ?>
left: -1px;
<?php endif; ?>
position: relative;
vertical-align: top;
-webkit-font-smoothing: antialiased;
Expand All @@ -484,7 +488,11 @@ function gutenberg_replace_default_add_new_button() {
display: block;
top: 0;
margin: -1px 0;
<?php if ( is_rtl() ) : ?>
padding-left: 9px;
<?php else : ?>
padding-right: 9px;
<?php endif; ?>
}

</style>
Expand Down
11 changes: 9 additions & 2 deletions lib/client-assets.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,18 +160,23 @@ function gutenberg_register_scripts_and_styles() {
array(),
filemtime( gutenberg_dir_path() . 'components/build/style.css' )
);
wp_style_add_data( 'wp-components', 'rtl', 'replace' );

wp_register_style(
'wp-blocks',
gutenberg_url( 'blocks/build/style.css' ),
array(),
filemtime( gutenberg_dir_path() . 'blocks/build/style.css' )
);
wp_style_add_data( 'wp-blocks', 'rtl', 'replace' );

wp_register_style(
'wp-edit-blocks',
gutenberg_url( 'blocks/build/edit-blocks.css' ),
array(),
filemtime( gutenberg_dir_path() . 'blocks/build/edit-blocks.css' )
);
wp_style_add_data( 'wp-edit-blocks', 'rtl', 'replace' );
}
add_action( 'wp_enqueue_scripts', 'gutenberg_register_scripts_and_styles', 5 );
add_action( 'admin_enqueue_scripts', 'gutenberg_register_scripts_and_styles', 5 );
Expand Down Expand Up @@ -620,7 +625,7 @@ function gutenberg_editor_scripts_and_styles( $hook ) {
'baseURL' => includes_url( 'js/tinymce' ),
'suffix' => SCRIPT_DEBUG ? '' : '.min',
'settings' => apply_filters( 'tiny_mce_before_init', array(
'plugins' => array_unique( apply_filters( 'tiny_mce_plugins', array(
'plugins' => implode( ',', array_unique( apply_filters( 'tiny_mce_plugins', array(
'charmap',
'colorpicker',
'hr',
Expand All @@ -639,7 +644,7 @@ function gutenberg_editor_scripts_and_styles( $hook ) {
'wpdialogs',
'wptextpattern',
'wpview',
) ) ),
) ) ) ),
'toolbar1' => implode( ',', array_merge( apply_filters( 'mce_buttons', array(
'formatselect',
'bold',
Expand Down Expand Up @@ -820,12 +825,14 @@ function gutenberg_editor_scripts_and_styles( $hook ) {
'wp-editor-font',
'https://fonts.googleapis.com/css?family=Noto+Serif:400,400i,700,700i'
);

wp_enqueue_style(
'wp-editor',
gutenberg_url( 'editor/build/style.css' ),
array( 'wp-components', 'wp-blocks', 'wp-edit-blocks' ),
filemtime( gutenberg_dir_path() . 'editor/build/style.css' )
);
wp_style_add_data( 'wp-editor', 'rtl', 'replace' );

/**
* Fires after block assets have been enqueued for the editing interface.
Expand Down
Loading