Feature: frontend improvements (#7692)

* Fix unnecessary padding in outline buttons (#7462)

* add body class in editor (#7465)

* Add changelog

* Bump version

* Change version to 1.3.6

course/assets/css/default.css

@@ -1,3 +1,9 @@
 /*
 * Styles specific to default variation
-*/
+*/
+.wp-block-button.is-style-outline .wp-block-button__link {
+    padding-top: var(--wp--custom--button--spacing--padding--top);
+    padding-right: var(--wp--custom--button--spacing--padding--right);
+    padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
+    padding-left: var(--wp--custom--button--spacing--padding--left);
+}

course/assets/css/gold.css

@@ -1,3 +1,6 @@
 /*
 * Styles specific to gold variation
-*/
+*/
+.wp-block-button.is-style-outline .wp-block-button__link {
+    padding: 1em 1.3em;
+}

course/functions.php

@@ -82,6 +82,8 @@ add_filter(
 
 add_filter( 'body_class', 'add_body_class_for_variation' );
 
+add_filter( 'admin_body_class', 'add_body_class_for_variation' );
+
 add_action( 'course_theme_variation_loaded', 'enqueue_style_for_variation' );
 
 /**
@@ -113,16 +115,19 @@ function course_theme_filter_single_lesson_template_for_sensei_learning_mode( $p
 
 /**
  * Add a body class with the variation.
+ * body_class hook passes classes as array whereas
+ * admin_body_class passes them as string. So we handle both.
  *
- * @param array $classes Body classes.
+ * @param array|string $classes Body classes.
  *
  * @internal
  *
- * @return array Body classes.
+ * @return array|string Body classes.
  */
 function add_body_class_for_variation( $classes ) {
 	$css_string    = wp_get_global_stylesheet( array( 'variables' ) );
 	$property_name = '--wp--custom--course-theme-variation';
+	$is_array      = is_array( $classes );
 
 	// 1. "/": Delimiters that mark the start and end of the regex pattern.
 	// 2. "$property_name": This part of the pattern matches the specific property name, in our case, '--wp--custom--course-theme-variation', defined in Course theme's JSON files.
@@ -140,8 +145,14 @@ function add_body_class_for_variation( $classes ) {
 		// $matches[0] contains the full match.
 		// $matches[1] contains the CSS value for the specified property.
 		$css_value      = trim( $matches[1] );
-		$classes[]      = 'is-' . $css_value;
 		$variation_name = $css_value;
+		$class_value    = 'is-' . $css_value;
+
+		if ( $is_array ) {
+			$classes[] = $class_value;
+		} else {
+			$classes .= ' ' . $class_value;
+		}
 	}
 
 	/**

course/readme.txt

@@ -14,6 +14,8 @@ Course is a flexible and modern education theme for anyone wanting to share thei
 
 = 1.3.6 =
 * Optimize images (#7671)
+* Fix unnecessary padding in outline buttons (#7462)
+* Add theme variation body class in editor (#7465)
 
 = 1.3.5 =
 * Style the "Awaiting Grade" notice (#7401)

course/style.css

@@ -3,7 +3,7 @@ Theme Name: Course
 Author: Automattic
 Author URI: https://automattic.com/
 Description: Course is a flexible and modern education theme for anyone wanting to share their knowledge. The theme is built with integration with Sensei LMS and is ideal for Sensei users that are creating or selling courses. Style variations with multiple font and color combinations help you craft the perfect look and feel to show off courses and content. The theme can be used without Sensei too.
-Version: 1.3.5
+Version: 1.3.6
 Requires at least: 6.2
 Tested up to: 6.4
 Requires PHP: 7.4