added IE11 ponyfill

hever/style-editor.css

@@ -120,6 +120,12 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Add font-family using CSS variables.
  * It also adds the proper fallback for browsers without support.
  */
+body {
+	display: none;
+	/* Legacy */
+	display: var(--skip, block);
+}
+
 /**
  * Global variables
  */

hever/style-rtl.css

@@ -141,6 +141,12 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Add font-family using CSS variables.
  * It also adds the proper fallback for browsers without support.
  */
+body {
+	display: none;
+	/* Legacy */
+	display: var(--skip, block);
+}
+
 /**
   * Global variables
   */

hever/style.css

@@ -141,6 +141,12 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Add font-family using CSS variables.
  * It also adds the proper fallback for browsers without support.
  */
+body {
+	display: none;
+	/* Legacy */
+	display: var(--skip, block);
+}
+
 /**
   * Global variables
   */

varia/functions.php

@@ -257,6 +257,19 @@ function varia_scripts() {
 		wp_enqueue_script( 'comment-reply' );
 	}
 
+	// Note, the is_IE global variable is defined by WordPress and is used
+	// to detect if the current browser is internet explorer.
+	global $is_IE;
+	if ( $is_IE ) {
+		// If IE 11 or below, use a ponyfill to add CSS Variable support
+		wp_register_script( 'css-vars-ponyfill', get_stylesheet_directory_uri() . '/assets/js/css-vars-ponyfill2.js' );
+		wp_enqueue_script( 'ie11-fix',
+			get_stylesheet_directory_uri() . '/assets/js/ie11-fix.js',
+			array( 'css-vars-ponyfill' ),
+			'1.0'
+		);
+	}
+
 }
 add_action( 'wp_enqueue_scripts', 'varia_scripts' );
 

varia/js/ie11-fix.js

@@ -0,0 +1 @@
+cssVars( {} );

varia/sass/abstracts/_ie11-ponyfill.scss

@@ -0,0 +1,6 @@
+// This is needed to avoid FOUC in IE11
+// See https://github.com/jhildenbiddle/css-vars-ponyfill/issues/55
+body {
+	display: none; /* Legacy */
+	display: var(--skip, block);
+}

varia/sass/abstracts/_imports.scss

@@ -6,3 +6,4 @@
 @import "functions";
 @import "config-global";
 @import "mixins";
+@import "ie11-ponyfill";

varia/style-rtl.css

@@ -140,6 +140,12 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Add font-family using CSS variables.
  * It also adds the proper fallback for browsers without support.
  */
+body {
+	display: none;
+	/* Legacy */
+	display: var(--skip, block);
+}
+
 /**
  * Extends
  */

varia/style.css

@@ -140,6 +140,12 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Add font-family using CSS variables.
  * It also adds the proper fallback for browsers without support.
  */
+body {
+	display: none;
+	/* Legacy */
+	display: var(--skip, block);
+}
+
 /**
  * Extends
  */