VK Block Patterns - Version 1.12.2

Version Description

[ Bug fix ] Fix .vk-cols--media.vk-cols--reverse on mobile

Download this release

Release Info

Developer vektor-inc
Plugin Icon wp plugin VK Block Patterns
Version 1.12.2
Comparing to
See all releases

Code changes from version 1.12.1 to 1.12.2

Files changed (5) hide show
  1. patterns-data/_scss/_common.scss +4 -0
  2. patterns-data/_scss/_vk-cols.scss +9 -29
  3. patterns-data/style.css +1 -1
  4. readme.txt +4 -1
  5. vk-block-patterns.php +1 -1
patterns-data/_scss/_common.scss CHANGED
@@ -10,4 +10,8 @@
10
  margin-right:auto;
11
  }
12
  }
 
 
 
 
13
  }
10
  margin-right:auto;
11
  }
12
  }
13
+ .vk-no-padding-horizontal--mobile{
14
+ padding-left:0 !important;
15
+ padding-right:0 !important;
16
+ }
17
  }
patterns-data/_scss/_vk-cols.scss CHANGED
@@ -122,34 +122,6 @@
122
  }
123
  }
124
 
125
- // 全幅
126
- // .vk_outer.vk_outer-width-full {
127
- // .vk-cols--fit.vk-cols--grid {
128
- // & > .wp-block-column:nth-child(2){
129
- // & > .wp-block-cover {
130
- // @media (max-width: 599px){
131
- // width:100vw;
132
- // margin-right:calc( ( 100% - 100vw ) / 2 );
133
- // margin-left:calc( ( 100% - 100vw ) / 2 );
134
- // }
135
- // @media (min-width: 600px){
136
- // margin-right:calc( 100% - 50vw );
137
- // width:50vw;
138
- // }
139
- // }
140
- // }
141
- // &.vk-cols--reverse {
142
- // @media (min-width: 600px){
143
- // & > .wp-block-column:nth-child(2){
144
- // & > .wp-block-cover {
145
- // margin-left:calc( 100% - 50vw );
146
- // }
147
- // }
148
- // }
149
- // }
150
- // }
151
- // }
152
-
153
  /*
154
  カラムメニュー
155
  /* ----------------------------------- */
@@ -231,10 +203,18 @@
231
  .vk-cols--media{
232
  .wp-block-column:not(:first-child) {
233
  .wp-block-image,
234
- figure, {
235
  margin-bottom:0;
236
  }
237
  }
 
 
 
 
 
 
 
 
238
  @media (min-width: 782px) {
239
  .wp-block-column:not(:first-child) {
240
  margin-left: 3rem;
122
  }
123
  }
124
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
125
  /*
126
  カラムメニュー
127
  /* ----------------------------------- */
203
  .vk-cols--media{
204
  .wp-block-column:not(:first-child) {
205
  .wp-block-image,
206
+ figure {
207
  margin-bottom:0;
208
  }
209
  }
210
+ // .vk-cols--reverse が付与する余白の打ち消し
211
+ @media (min-width: 600px){
212
+ &.vk-cols--reverse {
213
+ .wp-block-column:first-child {
214
+ margin-left:0;
215
+ }
216
+ }
217
+ }
218
  @media (min-width: 782px) {
219
  .wp-block-column:not(:first-child) {
220
  margin-left: 3rem;
patterns-data/style.css CHANGED
@@ -1 +1 @@
1
- .vk-cols--reverse{flex-direction:row-reverse}@media(min-width: 600px){.vk-cols--reverse .wp-block-column{margin-left:1em}.vk-cols--reverse .wp-block-column:last-child{margin-right:1em;margin-left:0}}.vk-cols--hasbtn{margin-bottom:0}.vk-cols--hasbtn>.row>.vk_gridColumn_item,.vk-cols--hasbtn>.wp-block-column{position:relative;padding-bottom:3em;margin-bottom:var(--vk-margin-block-bottom)}.vk-cols--hasbtn>.row>.vk_gridColumn_item>.wp-block-buttons,.vk-cols--hasbtn>.row>.vk_gridColumn_item>.vk_button,.vk-cols--hasbtn>.wp-block-column>.wp-block-buttons,.vk-cols--hasbtn>.wp-block-column>.vk_button{position:absolute;bottom:0;width:calc( 100% - 15px - 15px )}.vk-cols--fit{margin-top:0;margin-bottom:0;justify-content:space-between}.vk-cols--fit>.wp-block-column *:last-child{margin-bottom:0}.vk-cols--fit>.wp-block-column>.wp-block-cover{margin-top:0}.vk-cols--fit.has-background{padding:0}@media(max-width: 599px){.vk-cols--fit:not(.has-background)>.wp-block-column:not(.has-background){padding-left:0 !important;padding-right:0 !important}}@media(min-width: 782px){.vk-cols--fit .block-editor-block-list__block.wp-block-column:not(:first-child),.vk-cols--fit .wp-block-column:not(:first-child){margin-left:0}}@media(min-width: 600px)and (max-width: 781px){.vk-cols--fit .wp-block-column:nth-child(2n){margin-left:0}.vk-cols--fit .wp-block-column:not(:only-child){flex-basis:50% !important}}.vk-cols--fit--gap1{gap:1px}@media(min-width: 600px)and (max-width: 781px){.vk-cols--fit--gap1 .wp-block-column:not(:only-child){flex-basis:calc(50% - 1px) !important}}.vk-cols--fit.vk-cols--grid>.block-editor-block-list__block,.vk-cols--fit.vk-cols--grid>.wp-block-column{flex-basis:50%}@media(max-width: 599px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull>.wp-block-column:nth-child(2)>.wp-block-cover{width:100vw;margin-right:calc( ( 100% - 100vw ) / 2 );margin-left:calc( ( 100% - 100vw ) / 2 )}}@media(min-width: 600px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull>.wp-block-column:nth-child(2)>.wp-block-cover{margin-right:calc( 100% - 50vw );width:50vw}}@media(min-width: 600px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull.vk-cols--reverse>.wp-block-column{margin-left:0;margin-right:0}.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull.vk-cols--reverse>.wp-block-column:nth-child(2)>.wp-block-cover{margin-left:calc( 100% - 50vw )}}.vk-cols--menu h2,.vk-cols--menu h3,.vk-cols--menu h4,.vk-cols--menu h5{margin-bottom:.2em;text-shadow:#000 0 0 10px}.vk-cols--menu h2:first-child,.vk-cols--menu h3:first-child,.vk-cols--menu h4:first-child,.vk-cols--menu h5:first-child{margin-top:0}.vk-cols--menu p{margin-bottom:1rem;text-shadow:#000 0 0 10px}.vk-cols--menu .wp-block-cover__inner-container:last-child{margin-bottom:0}.vk-cols--fitbnrs .wp-block-column .wp-block-cover:hover img{filter:unset}.vk-cols--fitbnrs .wp-block-column .wp-block-cover:hover{background-color:unset}.vk-cols--fitbnrs .wp-block-cover__inner-container{position:absolute;height:100%;width:100%}.vk-cols--fitbnrs .vk_button{height:100%;margin:0}.vk-cols--fitbnrs .vk_button .vk_button_btn,.vk-cols--fitbnrs .vk_button .btn{height:100%;width:100%;border:none;box-shadow:none;background-color:unset;transition:unset}.vk-cols--fitbnrs .vk_button .vk_button_btn:hover,.vk-cols--fitbnrs .vk_button .btn:hover{transition:unset}.vk-cols--fitbnrs .vk_button .vk_button_btn:after,.vk-cols--fitbnrs .vk_button .btn:after{border:none}.vk-cols--fitbnrs .vk_button .vk_button_link_txt{width:100%;position:absolute;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);font-size:2rem;text-shadow:#000 0 0 10px}.vk-cols--fitbnrs .vk_button .vk_button_link_subCaption{width:100%;position:absolute;top:calc( 50% + 2.2em );left:50%;transform:translateY(-50%) translateX(-50%);text-shadow:#000 0 0 10px}.vk-cols--media .wp-block-column:not(:first-child) .wp-block-image,.vk-cols--media .wp-block-column:not(:first-child) figure{margin-bottom:0}@media(min-width: 782px){.vk-cols--media .wp-block-column:not(:first-child){margin-left:3rem}.vk-cols--media.vk-cols--reverse .wp-block-column:not(:first-child){margin-right:3rem;margin-left:0}}@media(min-width: 600px)and (max-width: 781px){.vk-cols--media.vk-cols--reverse .wp-block-column:not(:first-child){margin-right:2rem;margin-left:0}}.vk-fit-map iframe{position:relative;margin-bottom:0;display:block;max-height:400px;width:100vw}.no-margin{margin:0}@media(max-width: 599px){.wp-block-image.vk-aligncenter--mobile>.alignright{float:none;margin-left:auto;margin-right:auto}}
1
+ .vk-cols--reverse{flex-direction:row-reverse}@media(min-width: 600px){.vk-cols--reverse .wp-block-column{margin-left:1em}.vk-cols--reverse .wp-block-column:last-child{margin-right:1em;margin-left:0}}.vk-cols--hasbtn{margin-bottom:0}.vk-cols--hasbtn>.row>.vk_gridColumn_item,.vk-cols--hasbtn>.wp-block-column{position:relative;padding-bottom:3em;margin-bottom:var(--vk-margin-block-bottom)}.vk-cols--hasbtn>.row>.vk_gridColumn_item>.wp-block-buttons,.vk-cols--hasbtn>.row>.vk_gridColumn_item>.vk_button,.vk-cols--hasbtn>.wp-block-column>.wp-block-buttons,.vk-cols--hasbtn>.wp-block-column>.vk_button{position:absolute;bottom:0;width:calc( 100% - 15px - 15px )}.vk-cols--fit{margin-top:0;margin-bottom:0;justify-content:space-between}.vk-cols--fit>.wp-block-column *:last-child{margin-bottom:0}.vk-cols--fit>.wp-block-column>.wp-block-cover{margin-top:0}.vk-cols--fit.has-background{padding:0}@media(max-width: 599px){.vk-cols--fit:not(.has-background)>.wp-block-column:not(.has-background){padding-left:0 !important;padding-right:0 !important}}@media(min-width: 782px){.vk-cols--fit .block-editor-block-list__block.wp-block-column:not(:first-child),.vk-cols--fit .wp-block-column:not(:first-child){margin-left:0}}@media(min-width: 600px)and (max-width: 781px){.vk-cols--fit .wp-block-column:nth-child(2n){margin-left:0}.vk-cols--fit .wp-block-column:not(:only-child){flex-basis:50% !important}}.vk-cols--fit--gap1{gap:1px}@media(min-width: 600px)and (max-width: 781px){.vk-cols--fit--gap1 .wp-block-column:not(:only-child){flex-basis:calc(50% - 1px) !important}}.vk-cols--fit.vk-cols--grid>.block-editor-block-list__block,.vk-cols--fit.vk-cols--grid>.wp-block-column{flex-basis:50%}@media(max-width: 599px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull>.wp-block-column:nth-child(2)>.wp-block-cover{width:100vw;margin-right:calc( ( 100% - 100vw ) / 2 );margin-left:calc( ( 100% - 100vw ) / 2 )}}@media(min-width: 600px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull>.wp-block-column:nth-child(2)>.wp-block-cover{margin-right:calc( 100% - 50vw );width:50vw}}@media(min-width: 600px){.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull.vk-cols--reverse>.wp-block-column{margin-left:0;margin-right:0}.vk-cols--fit.vk-cols--grid.vk-cols--grid--alignfull.vk-cols--reverse>.wp-block-column:nth-child(2)>.wp-block-cover{margin-left:calc( 100% - 50vw )}}.vk-cols--menu h2,.vk-cols--menu h3,.vk-cols--menu h4,.vk-cols--menu h5{margin-bottom:.2em;text-shadow:#000 0 0 10px}.vk-cols--menu h2:first-child,.vk-cols--menu h3:first-child,.vk-cols--menu h4:first-child,.vk-cols--menu h5:first-child{margin-top:0}.vk-cols--menu p{margin-bottom:1rem;text-shadow:#000 0 0 10px}.vk-cols--menu .wp-block-cover__inner-container:last-child{margin-bottom:0}.vk-cols--fitbnrs .wp-block-column .wp-block-cover:hover img{filter:unset}.vk-cols--fitbnrs .wp-block-column .wp-block-cover:hover{background-color:unset}.vk-cols--fitbnrs .wp-block-cover__inner-container{position:absolute;height:100%;width:100%}.vk-cols--fitbnrs .vk_button{height:100%;margin:0}.vk-cols--fitbnrs .vk_button .vk_button_btn,.vk-cols--fitbnrs .vk_button .btn{height:100%;width:100%;border:none;box-shadow:none;background-color:unset;transition:unset}.vk-cols--fitbnrs .vk_button .vk_button_btn:hover,.vk-cols--fitbnrs .vk_button .btn:hover{transition:unset}.vk-cols--fitbnrs .vk_button .vk_button_btn:after,.vk-cols--fitbnrs .vk_button .btn:after{border:none}.vk-cols--fitbnrs .vk_button .vk_button_link_txt{width:100%;position:absolute;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);font-size:2rem;text-shadow:#000 0 0 10px}.vk-cols--fitbnrs .vk_button .vk_button_link_subCaption{width:100%;position:absolute;top:calc( 50% + 2.2em );left:50%;transform:translateY(-50%) translateX(-50%);text-shadow:#000 0 0 10px}.vk-cols--media .wp-block-column:not(:first-child) .wp-block-image,.vk-cols--media .wp-block-column:not(:first-child) figure{margin-bottom:0}@media(min-width: 600px){.vk-cols--media.vk-cols--reverse .wp-block-column:first-child{margin-left:0}}@media(min-width: 782px){.vk-cols--media .wp-block-column:not(:first-child){margin-left:3rem}.vk-cols--media.vk-cols--reverse .wp-block-column:not(:first-child){margin-right:3rem;margin-left:0}}@media(min-width: 600px)and (max-width: 781px){.vk-cols--media.vk-cols--reverse .wp-block-column:not(:first-child){margin-right:2rem;margin-left:0}}.vk-fit-map iframe{position:relative;margin-bottom:0;display:block;max-height:400px;width:100vw}.no-margin{margin:0}@media(max-width: 599px){.wp-block-image.vk-aligncenter--mobile>.alignright{float:none;margin-left:auto;margin-right:auto}.vk-no-padding-horizontal--mobile{padding-left:0 !important;padding-right:0 !important}}
readme.txt CHANGED
@@ -4,7 +4,7 @@ Donate link:
4
  Tags: Guternberg, Block Pattern
5
  Requires at least: 5.8
6
  Tested up to: 5.8.1
7
- Stable tag: 1.12.1
8
  Requires PHP: 7.2
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
@@ -16,6 +16,9 @@ When you activate this plugin that create new custom post type for custom block
16
 
17
  == Changelog ==
18
 
 
 
 
19
  = 1.12.1 =
20
  [ Design tuning ] vk-cols--reverse and add class vk-aligncenter--mobile
21
  [ Specification Change ] Change some patterns
4
  Tags: Guternberg, Block Pattern
5
  Requires at least: 5.8
6
  Tested up to: 5.8.1
7
+ Stable tag: 1.12.2
8
  Requires PHP: 7.2
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
16
 
17
  == Changelog ==
18
 
19
+ = 1.12.2 =
20
+ [ Bug fix ] Fix .vk-cols--media.vk-cols--reverse on mobile
21
+
22
  = 1.12.1 =
23
  [ Design tuning ] vk-cols--reverse and add class vk-aligncenter--mobile
24
  [ Specification Change ] Change some patterns
vk-block-patterns.php CHANGED
@@ -3,7 +3,7 @@
3
  * Plugin Name: VK Block Patterns
4
  * Plugin URI: https://github.com/vektor-inc/vk-block-patterns
5
  * Description: You can make and register your original custom block patterns.
6
- * Version: 1.12.1
7
  * Requires at least: 5.8
8
  * Author: Vektor,Inc.
9
  * Author URI: https://vektor-inc.co.jp
3
  * Plugin Name: VK Block Patterns
4
  * Plugin URI: https://github.com/vektor-inc/vk-block-patterns
5
  * Description: You can make and register your original custom block patterns.
6
+ * Version: 1.12.2
7
  * Requires at least: 5.8
8
  * Author: Vektor,Inc.
9
  * Author URI: https://vektor-inc.co.jp