Merge pull request #12917 from woocommerce/12170-rtl

#12170 Set up RTL generation and enqueuing

Gruntfile.js

@@ -128,6 +128,20 @@ module.exports = function( grunt ) {
 			}
 		},
 
+		// Generate RTL .css files
+		rtlcss: {
+			woocommerce: {
+				expand: true,
+				cwd: '<%= dirs.css %>',
+				src: [
+					'*.css',
+					'!*-rtl.css'
+				],
+				dest: '<%= dirs.css %>/',
+				ext: '-rtl.css'
+			}
+		},
+
 		// Minify all .css files.
 		cssmin: {
 			minify: {
@@ -259,6 +273,7 @@ module.exports = function( grunt ) {
 	// Load NPM tasks to be used here
 	grunt.loadNpmTasks( 'grunt-shell' );
 	grunt.loadNpmTasks( 'grunt-wp-i18n' );
+	grunt.loadNpmTasks( 'grunt-rtlcss' );
 	grunt.loadNpmTasks( 'grunt-checktextdomain' );
 	grunt.loadNpmTasks( 'grunt-contrib-jshint' );
 	grunt.loadNpmTasks( 'grunt-contrib-uglify' );
@@ -284,6 +299,7 @@ module.exports = function( grunt ) {
 
 	grunt.registerTask( 'css', [
 		'sass',
+		'rtlcss',
 		'cssmin'
 	]);
 

assets/css/_mixins.scss

@@ -231,7 +231,6 @@
 	text-transform: none;
 	line-height: 1;
 	-webkit-font-smoothing: antialiased;
-	margin-right: 0.618em;
 	content: $glyph;
 	text-decoration: none;
 }

assets/css/activation-rtl.css

@@ -0,0 +1 @@
+div.woocommerce-message{overflow:hidden;position:relative;border-right-color:#cc99c2!important}div.woocommerce-message p{max-width:700px}.woocommerce-message a.button-primary,p.woocommerce-actions a.button-primary{background:#bb77ae;border-color:#a36597;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 0 #a36597;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 0 #a36597;color:#fff;text-shadow:0 -1px 1px #a36597,-1px 0 1px #a36597,0 1px 1px #a36597,1px 0 1px #a36597}.woocommerce-message a.button-primary:active,.woocommerce-message a.button-primary:focus,.woocommerce-message a.button-primary:hover,p.woocommerce-actions a.button-primary:active,p.woocommerce-actions a.button-primary:focus,p.woocommerce-actions a.button-primary:hover{background:#a36597;border-color:#a36597;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 0 #a36597;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 0 #a36597}.woocommerce-message a.woocommerce-message-close,p.woocommerce-actions a.woocommerce-message-close{position:absolute;top:0;left:0;padding:10px 21px 10px 15px;font-size:13px;line-height:1.23076923;text-decoration:none}.woocommerce-message a.woocommerce-message-close::before,p.woocommerce-actions a.woocommerce-message-close::before{position:absolute;top:8px;right:0;-webkit-transition:all .1s ease-in-out;transition:all .1s ease-in-out}.woocommerce-message a.button-primary,.woocommerce-message a.button-secondary,p.woocommerce-actions a.button-primary,p.woocommerce-actions a.button-secondary{text-decoration:none!important}.woocommerce-message .twitter-share-button,p.woocommerce-actions .twitter-share-button{margin-top:-3px;margin-right:3px;vertical-align:middle}.woocommerce-about-text,p.woocommerce-actions{margin-bottom:1em!important}div.woocommerce-legacy-shipping-notice,div.woocommerce-no-shipping-methods-notice{overflow:hidden;padding:1px 12px}div.woocommerce-legacy-shipping-notice p,div.woocommerce-no-shipping-methods-notice p{position:relative;z-index:1;max-width:700px;line-height:1.5em;margin:12px 0}div.woocommerce-legacy-shipping-notice p.main,div.woocommerce-no-shipping-methods-notice p.main{font-size:1.1em}div.woocommerce-legacy-shipping-notice::before,div.woocommerce-no-shipping-methods-notice::before{content:'\e01b';font-family:WooCommerce;text-align:center;line-height:1;color:#f7f1f6;display:block;width:1em;font-size:20em;top:36px;left:12px;position:absolute}

assets/css/admin.scss

@@ -2648,6 +2648,9 @@ table {
 		}
 	}
 }
+.wc-shipping-zones-heading .page-title-action {
+	display: inline-block;	
+}
 table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-classes {
 	td, th {
 		vertical-align: top;
@@ -3477,6 +3480,11 @@ img.help_tip {
 				line-height: 20px !important;
 				border-bottom: 1px solid #eee;
 
+				span {
+					margin-left: 0.618em;
+					margin-right: 0.618em;
+				}
+
 				&::before {
 					@include iconbeforedashicons( '\f107' );
 				}
@@ -3562,6 +3570,10 @@ img.help_tip {
  * Shipping
  */
 .woocommerce_page_wc-settings {
+	input[type=url], input[type=email] {
+		direction: ltr;
+	}
+
 	.shippingrows {
 		th.check-column {
 			padding-top: 20px;
@@ -4310,7 +4322,7 @@ img.help_tip {
 		}
 
 		input[type=checkbox] {
-			margin: -3px 0 0 .5em;
+			margin: 0 5px 0 .5em!important;
 			vertical-align: middle;
 		}
 	}
@@ -4389,11 +4401,10 @@ img.tips {
 	display: none;
 	position: absolute;
 	top: 0;
+	/*rtl:ignore*/
 	left: 0;
 	z-index: 9999999;
-}
 
-#tiptip_holder {
 	&.tip_top {
 		padding-bottom: 5px;
 
@@ -4463,6 +4474,13 @@ img.tips {
 	width: 0;
 }
 
+/*rtl:raw:
+#tiptip_arrow {
+	margin-right: 79.5px!important;
+	margin-left: 0!important;
+}
+*/
+
 .wc_error_tip {
 	max-width: 20em;
 	line-height: 1.8em;

assets/css/auth-rtl.css

@@ -0,0 +1 @@
+body{background:#f1f1f1;box-shadow:none;margin:100px auto 24px;padding:0}#wc-logo{border:0;margin:0 0 24px;padding:0;text-align:center}#wc-logo img{max-width:50%}.wc-auth-content{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.13);overflow:hidden;padding:24px 24px 0;zoom:1}.wc-auth-content h1,.wc-auth-content h2,.wc-auth-content h3,.wc-auth-content table{border:0;clear:none;color:#666;margin:0 0 24px;padding:0}.wc-auth-content p,.wc-auth-content ul{color:#666;font-size:1em;line-height:1.75em;margin:0 0 24px}.wc-auth-content p{padding:0}.wc-auth-content a{color:#a16696}.wc-auth-content a:focus,.wc-auth-content a:hover{color:#111}.wc-auth-content .wc-auth-login label{color:#999;display:block;margin-bottom:.5em}.wc-auth-content .wc-auth-login input{box-sizing:border-box;font-size:1.3em;padding:.5em;width:100%}.wc-auth-content .wc-auth-login .wc-auth-actions{padding:0}.wc-auth-content .wc-auth-login .wc-auth-actions .wc-auth-login-button{float:none;width:100%}.wc-auth-permissions{list-style:disc inside;padding:0}.wc-auth-permissions li{font-size:1em}.wc-auth-logged-in-as{background:#f5f5f5;border-bottom:2px solid #eee;line-height:70px;margin:0 0 24px;padding:0 0 0 1em}.wc-auth-logged-in-as p{margin:0;line-height:70px}.wc-auth-logged-in-as img{float:right;height:70px;margin:0 0 0 1em}.wc-auth-logged-in-as .wc-auth-logout{float:left}.wc-auth .wc-auth-actions{overflow:hidden;padding-right:24px}.wc-auth .wc-auth-actions .button{background:#f7f7f7;border:1px solid #d7d7d7;box-sizing:border-box;color:#777;float:left;font-size:1.25em;height:auto;line-height:1em;padding:1em 2em;text-align:center;width:50%}.wc-auth .wc-auth-actions .button:focus,.wc-auth .wc-auth-actions .button:hover{background:#fcfcfc}.wc-auth .wc-auth-actions .button-primary{background:#ad6ea1;border-color:#a16696;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 0 rgba(0,0,0,.15);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 0 rgba(0,0,0,.15);color:#fff;float:left;opacity:1;text-shadow:0 -1px 1px #8a4f7f,-1px 0 1px #8a4f7f,0 1px 1px #8a4f7f,1px 0 1px #8a4f7f}.wc-auth .wc-auth-actions .button-primary:focus,.wc-auth .wc-auth-actions .button-primary:hover{background:#b472a8;color:#fff}.wc-auth .wc-auth-actions .wc-auth-approve{float:left}.wc-auth .wc-auth-actions .wc-auth-deny{float:right;margin-right:-24px}

assets/css/dashboard-rtl.css

@@ -0,0 +1 @@
+@charset "UTF-8";@font-face{font-family:star;src:url(../fonts/star.eot);src:url(../fonts/star.eot?#iefix) format("embedded-opentype"),url(../fonts/star.woff) format("woff"),url(../fonts/star.ttf) format("truetype"),url(../fonts/star.svg#star) format("svg");font-weight:400;font-style:normal}@font-face{font-family:WooCommerce;src:url(../fonts/WooCommerce.eot);src:url(../fonts/WooCommerce.eot?#iefix) format("embedded-opentype"),url(../fonts/WooCommerce.woff) format("woff"),url(../fonts/WooCommerce.ttf) format("truetype"),url(../fonts/WooCommerce.svg#WooCommerce) format("svg");font-weight:400;font-style:normal}ul.woocommerce_stats{overflow:hidden;zoom:1}ul.woocommerce_stats li{width:25%;padding:0 1em;text-align:center;float:right;font-size:.8em;border-right:1px solid #fff;border-left:1px solid #ececec;box-sizing:border-box}ul.woocommerce_stats li:first-child{border-right:0}ul.woocommerce_stats li:last-child{border-left:0}#woocommerce_dashboard_status .wc_status_list li.low-in-stock,#woocommerce_dashboard_status .wc_status_list li.processing-orders{border-left:1px solid #ececec}ul.woocommerce_stats strong{font-family:Georgia,'Times New Roman','Bitstream Charter',Times,serif;font-size:4em;line-height:1.2em;font-weight:400;text-align:center;display:block}#woocommerce_dashboard_status .inside{padding:0;margin:0}#woocommerce_dashboard_status .wc_status_list{overflow:hidden;margin:0}#woocommerce_dashboard_status .wc_status_list li{width:50%;float:right;padding:0;box-sizing:border-box;margin:0;border-top:1px solid #ececec;color:#aaa}#woocommerce_dashboard_status .wc_status_list li a{display:block;color:#aaa;padding:9px 12px;-webkit-transition:all ease .5s;position:relative;font-size:12px}#woocommerce_dashboard_status .wc_status_list li a .wc_sparkline{width:4em;height:2em;display:block;float:left;position:absolute;left:0;top:50%;margin-left:12px;margin-top:-1.25em}#woocommerce_dashboard_status .wc_status_list li a strong{font-size:18px;line-height:1.2em;font-weight:400;display:block;color:#21759b}#woocommerce_dashboard_status .wc_status_list li a:hover{color:#2ea2cc}#woocommerce_dashboard_status .wc_status_list li a:hover strong,#woocommerce_dashboard_status .wc_status_list li a:hover::before{color:#2ea2cc!important}#woocommerce_dashboard_status .wc_status_list li a::before{font-family:WooCommerce;speak:none;font-weight:400;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;margin:0 0 12px 12px;text-indent:0;top:0;right:0;height:100%;text-align:center;content:"";font-size:2em;position:relative;width:auto;line-height:1.2em;color:#464646;float:right}#woocommerce_dashboard_status .wc_status_list li.best-seller-this-month,#woocommerce_dashboard_status .wc_status_list li.sales-this-month{width:100%}#woocommerce_dashboard_status .wc_status_list li:first-child{border-top:0}#woocommerce_dashboard_status .wc_status_list li.sales-this-month a::before{font-family:Dashicons;content:'\f185'}#woocommerce_dashboard_status .wc_status_list li.best-seller-this-month a::before{content:'\e006'}#woocommerce_dashboard_status .wc_status_list li.processing-orders a::before{content:'\e011';color:#7ad03a}#woocommerce_dashboard_status .wc_status_list li.on-hold-orders a::before{content:'\e033';color:#999}#woocommerce_dashboard_status .wc_status_list li.low-in-stock a::before{content:'\e016';color:#ffba00}#woocommerce_dashboard_status .wc_status_list li.out-of-stock a::before{content:'\e013';color:#a00}#woocommerce_dashboard_recent_reviews li{line-height:1.5em;margin-bottom:12px}#woocommerce_dashboard_recent_reviews h4.meta{line-height:1.4;margin:-.2em 0 0;font-weight:400;color:#999}#woocommerce_dashboard_recent_reviews blockquote{padding:0;margin:0}#woocommerce_dashboard_recent_reviews .avatar{float:right;margin:0 0 5px 10px}#woocommerce_dashboard_recent_reviews .star-rating{float:left;overflow:hidden;position:relative;height:1.5em;line-height:1.5;margin-right:.5em;width:5.4em;font-family:WooCommerce!important}#woocommerce_dashboard_recent_reviews .star-rating::before{content:'\e021\e021\e021\e021\e021';color:#b3b3b3;float:right;top:0;right:0;position:absolute;letter-spacing:.1em;letter-spacing:0\9}#woocommerce_dashboard_recent_reviews .star-rating span{overflow:hidden;float:right;top:0;right:0;position:absolute;padding-top:1.5em}#woocommerce_dashboard_recent_reviews .star-rating span::before{content:'\e020\e020\e020\e020\e020';top:0;position:absolute;right:0;letter-spacing:.1em;letter-spacing:0\9;color:#9c5d90}#dash-right-now li.product-count a::before{font-family:WooCommerce;content:'\e01d'}

assets/css/menu-rtl.css

@@ -0,0 +1 @@
+@charset "UTF-8";@font-face{font-family:star;src:url(../fonts/star.eot);src:url(../fonts/star.eot?#iefix) format("embedded-opentype"),url(../fonts/star.woff) format("woff"),url(../fonts/star.ttf) format("truetype"),url(../fonts/star.svg#star) format("svg");font-weight:400;font-style:normal}@font-face{font-family:WooCommerce;src:url(../fonts/WooCommerce.eot);src:url(../fonts/WooCommerce.eot?#iefix) format("embedded-opentype"),url(../fonts/WooCommerce.woff) format("woff"),url(../fonts/WooCommerce.ttf) format("truetype"),url(../fonts/WooCommerce.svg#WooCommerce) format("svg");font-weight:400;font-style:normal}#adminmenu #toplevel_page_woocommerce .menu-icon-generic div.wp-menu-image::before{font-family:WooCommerce!important;content:'\e03d'}#adminmenu #menu-posts-product .menu-icon-post div.wp-menu-image::before,#adminmenu #menu-posts-product .menu-icon-product div.wp-menu-image::before{font-family:WooCommerce!important;content:'\e006'}#adminmenu #toplevel_page_wc-reports .menu-icon-generic div.wp-menu-image::before{font-family:WooCommerce!important;content:'\e023';font-size:1.3em!important}span.mce_woocommerce_shortcodes_button{background-image:none!important;display:block;text-indent:-9999px;position:relative;height:1em;width:1em}span.mce_woocommerce_shortcodes_button::before{font-family:WooCommerce;speak:none;font-weight:400;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;margin:0;text-indent:0;position:absolute;top:0;right:0;width:100%;height:100%;text-align:center;content:"";font-size:.9em;line-height:1.2}.wc_plugin_upgrade_notice{font-weight:400;color:#fff;background:#d54d21;padding:1em;margin:9px 0}.wc_plugin_upgrade_notice a{color:#fff;text-decoration:underline}.wc_plugin_upgrade_notice::before{content:'\f348';display:inline-block;font:400 18px/1 dashicons;speak:none;margin:0 -2px 0 8px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;vertical-align:top}

assets/css/reports-print-rtl.css

@@ -0,0 +1 @@
+*{background:0 0!important;color:#000!important;text-shadow:none!important;filter:none!important;-ms-filter:none!important;font-size:9pt!important;opacity:1;-webkit-transition:none!important}@page{margin:.5cm}#adminmenuback,#adminmenuwrap,#screen-meta-links,#wpadminbar,#wpfooter,.update-nag,.updated,.woo-nav-tab-wrapper,.woocommerce-reports-wide .button,.woocommerce-reports-wide .postbox h3.stats_range .export_csv,.woocommerce-reports-wrap .postbox h3.stats_range .export_csv{display:none}h2 .nav-tab{line-height:14px}.woocommerce-reports-wide .postbox h3.stats_range ul li a,.woocommerce-reports-wide .postbox h3.stats_range ul li.custom,.woocommerce-reports-wrap .postbox h3.stats_range ul li a,.woocommerce-reports-wrap .postbox h3.stats_range ul li.custom{padding:5px;line-height:14px}#wpcontent{margin-right:0}.woocommerce-reports-wide .postbox .chart-with-sidebar .chart-sidebar,.woocommerce-reports-wrap .postbox .chart-with-sidebar .chart-sidebar{margin-right:-130px;width:130px;display:block}.woocommerce-reports-wide .postbox .chart-with-sidebar,.woocommerce-reports-wrap .postbox .chart-with-sidebar{padding-right:130px}.chart-legend{overflow:hidden;zoom:1}.chart-legend li{padding:.25em .5em!important;box-shadow:none!important;border-bottom:1px solid gray!important}

assets/css/woocommerce-layout.scss

@@ -304,11 +304,18 @@
 
 		.form-row-first,
 		.form-row-last {
-			float: left;
 			width: 47%;
 			overflow: visible;
 		}
 
+		.form-row-first {
+			float: left;
+
+			/*rtl:raw:
+			float: right;
+			*/
+		}
+
 		.form-row-last {
 			float: right;
 		}
@@ -548,14 +555,5 @@
 				float: left;
 			}
 		}
-		form {
-			.form-row-first,
-			.form-row-last {
-				float: right;
-			}
-			.form-row-last {
-				float: left;
-			}
-		}
 	}
 }

includes/admin/class-wc-admin-assets.php

@@ -45,6 +45,12 @@ class WC_Admin_Assets {
 		wp_register_style( 'woocommerce_admin_dashboard_styles', WC()->plugin_url() . '/assets/css/dashboard.css', array(), WC_VERSION );
 		wp_register_style( 'woocommerce_admin_print_reports_styles', WC()->plugin_url() . '/assets/css/reports-print.css', array(), WC_VERSION, 'print' );
 
+		// Add RTL support for admin styles
+		wp_style_add_data( 'woocommerce_admin_menu_styles', 'rtl', 'replace' );
+		wp_style_add_data( 'woocommerce_admin_styles', 'rtl', 'replace' );
+		wp_style_add_data( 'woocommerce_admin_dashboard_styles', 'rtl', 'replace' );
+		wp_style_add_data( 'woocommerce_admin_print_reports_styles', 'rtl', 'replace' );
+
 		// Sitewide menu CSS
 		wp_enqueue_style( 'woocommerce_admin_menu_styles' );
 

includes/admin/meta-boxes/views/html-product-data-panel.php

@@ -28,7 +28,7 @@
 	<ul class="product_data_tabs wc-tabs">
 		<?php foreach ( self::get_product_data_tabs() as $key => $tab ) : ?>
 			<li class="<?php echo $key; ?>_options <?php echo $key; ?>_tab <?php echo implode( ' ' , (array) $tab['class'] ); ?>">
-				<a href="#<?php echo $tab['target']; ?>"><?php echo esc_html( $tab['label'] ); ?></a>
+				<a href="#<?php echo $tab['target']; ?>"><span><?php echo esc_html( $tab['label'] ); ?></span></a>
 			</li>
 		<?php endforeach; ?>
 		<?php do_action( 'woocommerce_product_write_panel_tabs' ); ?>

includes/admin/settings/views/html-admin-page-shipping-zones.php

@@ -4,7 +4,7 @@ if ( ! defined( 'ABSPATH' ) ) {
 }
 ?>
 
-<h2>
+<h2 class="wc-shipping-zones-heading">
 	<?php _e( 'Shipping zones', 'woocommerce' ); ?>
 	<a href="<?php echo admin_url( 'admin.php?page=wc-settings&tab=shipping&zone_id=new' ); ?>" class="page-title-action"><?php esc_html_e( 'Add shipping zone', 'woocommerce' ); ?></a>
 </h2>

includes/class-wc-frontend-scripts.php

@@ -57,18 +57,21 @@ class WC_Frontend_Scripts {
 				'deps'    => '',
 				'version' => WC_VERSION,
 				'media'   => 'all',
+				'has_rtl' => true,
 			),
 			'woocommerce-smallscreen' => array(
 				'src'     => self::get_asset_url( 'assets/css/woocommerce-smallscreen.css' ),
 				'deps'    => 'woocommerce-layout',
 				'version' => WC_VERSION,
 				'media'   => 'only screen and (max-width: ' . apply_filters( 'woocommerce_style_smallscreen_breakpoint', $breakpoint = '768px' ) . ')',
+				'has_rtl' => true,
 			),
 			'woocommerce-general' => array(
 				'src'     => self::get_asset_url( 'assets/css/woocommerce.css' ),
 				'deps'    => '',
 				'version' => WC_VERSION,
 				'media'   => 'all',
+				'has_rtl' => true,
 			),
 		) );
 	}
@@ -125,10 +128,15 @@ class WC_Frontend_Scripts {
 	 * @param  string[] $deps
 	 * @param  string   $version
 	 * @param  string   $media
+	 * @param  boolean  $has_rtl
 	 */
-	private static function register_style( $handle, $path, $deps = array(), $version = WC_VERSION, $media = 'all' ) {
+	private static function register_style( $handle, $path, $deps = array(), $version = WC_VERSION, $media = 'all', $has_rtl = false ) {
 		self::$styles[] = $handle;
 		wp_register_style( $handle, $path, $deps, $version, $media );
+
+		if ( $has_rtl ) {
+			wp_style_add_data( $handle, 'rtl', 'replace' );
+		}
 	}
 
 	/**
@@ -141,10 +149,11 @@ class WC_Frontend_Scripts {
 	 * @param  string[] $deps
 	 * @param  string   $version
 	 * @param  string   $media
+	 * @param  boolean  $has_rtl
 	 */
-	private static function enqueue_style( $handle, $path = '', $deps = array(), $version = WC_VERSION, $media = 'all' ) {
+	private static function enqueue_style( $handle, $path = '', $deps = array(), $version = WC_VERSION, $media = 'all', $has_rtl = false ) {
 		if ( ! in_array( $handle, self::$styles ) && $path ) {
-			self::register_style( $handle, $path, $deps, $version, $media );
+			self::register_style( $handle, $path, $deps, $version, $media, $has_rtl );
 		}
 		wp_enqueue_style( $handle );
 	}
@@ -295,25 +304,29 @@ class WC_Frontend_Scripts {
 				'src'     => self::get_asset_url( 'assets/css/photoswipe/photoswipe.css' ),
 				'deps'    => array(),
 				'version' => WC_VERSION,
+				'has_rtl' => false,
 			),
 			'photoswipe-default-skin' => array(
 				'src'     => self::get_asset_url( 'assets/css/photoswipe/default-skin/default-skin.css' ),
 				'deps'    => array( 'photoswipe' ),
 				'version' => WC_VERSION,
+				'has_rtl' => false,
 			),
 			'select2' => array(
 				'src'     => self::get_asset_url( 'assets/css/select2.css' ),
 				'deps'    => array(),
 				'version' => WC_VERSION,
+				'has_rtl' => true,
 			),
 			'woocommerce_prettyPhoto_css' => array( // deprecated.
 				'src'     => self::get_asset_url( 'assets/css/prettyPhoto.css' ),
 				'deps'    => array(),
 				'version' => WC_VERSION,
+				'has_rtl' => true,
 			),
 		);
 		foreach ( $register_styles as $name => $props ) {
-			self::register_style( $name, $props['src'], $props['deps'], $props['version'] );
+			self::register_style( $name, $props['src'], $props['deps'], $props['version'], 'all', $props['has_rtl'] );
 		}
 	}
 
@@ -376,7 +389,11 @@ class WC_Frontend_Scripts {
 		// CSS Styles
 		if ( $enqueue_styles = self::get_styles() ) {
 			foreach ( $enqueue_styles as $handle => $args ) {
-				self::enqueue_style( $handle, $args['src'], $args['deps'], $args['version'], $args['media'] );
+				if ( ! isset( $args['has_rtl'] ) ) {
+					$args['has_rtl'] = false;
+				}
+
+				self::enqueue_style( $handle, $args['src'], $args['deps'], $args['version'], $args['media'], $args['has_rtl'] );
 			}
 		}
 	}

package.json

@@ -22,6 +22,7 @@
     "grunt-shell": "~2.1.0",
     "grunt-stylelint": "^0.6.0",
     "grunt-wp-i18n": "~0.5.4",
+    "grunt-rtlcss": "2.0.1",
     "node-bourbon": "~4.2.3"
   },
   "engines": {