Merge pull request #1882 from vektor-inc/develop

[ Change version ] 1.66.0.0

inc/vk-components/package/_scss/_vk-post.scss

@@ -49,6 +49,16 @@ $xxl-min: 1400px;
 /*-------------------------------------------*/
 /* If exclude the .vk_posts that, when you select the .media don't work */
 .vk_posts .vk_post-col {
+	// 5 と 7 は horizontal でのみ使用
+	// 他のように -30px でないのは そもそも -30px 自体が vk_post の独自仕様であるため 
+	// horizontal では -30px をつける必要がないのでつけていない
+	&-5 {
+		width: 41.67%;
+	}
+	&-7 {
+		width: 58.33%;
+	}
+
 	&-xs-2 {
 		width: calc(16.66% - 30px);
 	}
@@ -325,6 +335,13 @@ $xxl-min: 1400px;
 	}
 
 	&.card-horizontal {
+		// テーマなどが bootstrap の grid を読み込むと、
+		// horizontal に残っている col-5/col-7 のクラスにpadding をつけられてしまうので打ち消し
+		// （ horizontal から col-5/col-7 のクラスを削除したらこちらも削除可 ）
+		.vk_post-col-5,
+		.vk_post-col-7 {
+			padding: 0;
+		}
 		.vk_post_imgOuter {
 			height: 100%;
 			border-bottom: none;
@@ -338,8 +355,14 @@ $xxl-min: 1400px;
 				border-right:none;
 				border-left:$border_image;
 			}
+			.card-horizontal-inner-row {
+				flex-direction: row-reverse;
+			}
 		}
 	}
+	.card-horizontal-inner-row {
+		display: flex;
+	}
 }
 
 /*-------------------------------------------*/

inc/vk-components/package/class-vk-component-posts.php

@@ -3,7 +3,7 @@
  * VK Components Posts
  *
  * @package VK Component
- * @version 1.5.0
+ * @version 1.6.0
  *
  * *********************** CAUTION ***********************
  * The original of this file is located at:
@@ -840,17 +840,19 @@ public static function get_view_type_card( $post, $options ) {
 		public static function get_view_type_card_horizontal( $post, $options ) {
 			$html  = '';
 			$html .= self::get_view_first_div( $post, $options );
-			$html .= '<div class="row no-gutters card-horizontal-inner-row">';
+			$html .= '<div class="card-horizontal-inner-row">';
 
 			if ( $options['display_image'] ) {
-				$html .= '<div class="col-5 card-img-outer">';
+				// col-5 は古いクラス名 / 現在は vk_post-col-5 にスタイルをあてている
+				$html .= '<div class="vk_post-col-5 col-5 card-img-outer">';
 				$attr  = array(
 					'class_outer' => '',
 					'class_image' => 'card-img card-img-use-bg',
 				);
 				$html .= self::get_thumbnail_image( $post, $options, $attr );
 				$html .= '</div><!-- /.col -->';
-				$html .= '<div class="col-7">';
+				// col-7 は古いクラス名 / 現在は vk_post-col-7 にスタイルをあてている
+				$html .= '<div class="vk_post-col-7 col-7">';
 			}
 
 			$html .= self::get_view_body( $post, $options );