Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. #2271

Merged
merged 1 commit into from
Oct 18, 2024

Conversation

kurudrive
Copy link
Member

@kurudrive kurudrive commented Oct 16, 2024

チケットへのリンク / 変更の理由(元のissueがあればリンクを貼り付ければOK)

TT4 や TT5 でスライダーが全幅にならない

どういう変更をしたか?

スクリーンショットまたは動画

変更前 Before

スクリーンショット 2024-10-17 1 43 17

変更後 After

スクリーンショット 2024-10-17 1 48 02

実装者の確認事項

実装者はレビュワーに回す前に以下の事を確認してチェックをつけてください。

  • 複数の意図の変更 ( 機能の不具合修正 + 別の機能追加など ) を含んでいないか?
  • Files changed (変更ファイル)の内容は目視で確認したか?
  • readme.txt に変更内容は書いたか?
  • 本当にちゃんと確認をしたか?

プログラムの変更の場合

テストを書かないのは普通ではありません。書けるテストは極力書くようにしてください。

  • 書けそうなテストは書いたか?
    -> CSS修正なので省略

変更内容について何を確認したか、どういう方法で確認をしたかなど

  • テスト環境 TT4 を設定
  • 固定ページなどに以下のコードを貼り付け
<!-- wp:vk-blocks/slider {"unit":"svh","autoPlayStop":true,"autoPlayDelay":5000,"width":"full","speed":750,"blockId":"69842241-0e8b-4f56-9519-70551fed77ba","className":"vkp-slider-zoomup"} -->
<div class="wp-block-vk-blocks-slider swiper swiper-container vk_slider vk_slider_69842241-0e8b-4f56-9519-70551fed77ba alignfull vkp-slider-zoomup" data-vkb-slider="{&quot;autoPlay&quot;:true,&quot;autoPlayStop&quot;:true,&quot;autoPlayDelay&quot;:5000,&quot;pagination&quot;:&quot;bullets&quot;,&quot;blockId&quot;:&quot;69842241-0e8b-4f56-9519-70551fed77ba&quot;,&quot;width&quot;:&quot;full&quot;,&quot;loop&quot;:true,&quot;effect&quot;:&quot;slide&quot;,&quot;speed&quot;:750,&quot;slidesPerViewMobile&quot;:1,&quot;slidesPerViewTablet&quot;:1,&quot;slidesPerViewPC&quot;:1,&quot;slidesPerGroup&quot;:&quot;one-by-one&quot;,&quot;centeredSlides&quot;:false}"><div class="swiper-wrapper"><!-- wp:vk-blocks/slider-item {"bgColor":"white","opacity":0.6,"bgSize":"cover","padding_left_and_right":"2","blockId":"e2a9e4d4-89b1-4976-868f-2c066fcf3ab1"} -->
<div class="wp-block-vk-blocks-slider-item vk_slider_item swiper-slide vk_valign-center vk_slider_item-e2a9e4d4-89b1-4976-868f-2c066fcf3ab1  vk_slider_item-paddingLR-zero vk_slider_item-paddingVertical-none"><div class="vk_slider_item-background-area has-background has-white-background-color has-background-dim has-background-dim-6" style="padding-left:0;padding-right:0"></div><div class="vk_slider_item_container"><!-- wp:cover {"dimRatio":50,"overlayColor":"contrast","isUserOverlayColor":true,"minHeight":0,"contentPosition":"center center","isDark":false,"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-cover is-light" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><span aria-hidden="true" class="wp-block-cover__background has-contrast-background-color has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:cover {"dimRatio":0,"minHeight":0,"contentPosition":"center left","isDark":false,"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}}} -->
<div class="wp-block-cover is-light has-custom-content-position is-position-center-left" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-0 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:group {"className":"width-auto","style":{"color":{"background":"#ffffffd9"},"spacing":{"padding":{"top":"2em","bottom":"2em","left":"2em","right":"2em"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group width-auto has-background" style="background-color:#ffffffd9;padding-top:2em;padding-right:2em;padding-bottom:2em;padding-left:2em"><!-- wp:paragraph {"align":"left","className":"vk_block-margin-0\u002d\u002dmargin-top vk_block-margin-sm\u002d\u002dmargin-bottom"} -->
<p class="has-text-align-left vk_block-margin-0--margin-top vk_block-margin-sm--margin-bottom">朝日昇る 空蒼く 柔らか風 鳥の声 葉擽る 水面波紋 穏やかな日々 <br>心地良い午後 星空瞬く 夜長し 夢幻の如し</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:group --></div></div>
<!-- /wp:cover --></div></div>
<!-- /wp:vk-blocks/slider-item --></div><div class="swiper-button-next swiper-button-mobile-bottom"></div><div class="swiper-button-prev swiper-button-mobile-bottom"></div><div class="swiper-pagination swiper-pagination-bullets"></div></div>
<!-- /wp:vk-blocks/slider -->
  • 保存してして、編集画面 / 公開画面ともに余白がなくなる事を確認
  • Lightning でも不具合が出ない事を確認

レビュワーに回す前の確認事項

  • 実装者はこのテンプレートのチェック項目をちゃんと確認してチェックしたか?

レビュワー確認方法・確認内容など

  • 実装者に同じ
  • パターンライブラリのスライダーを使ってるパターンをいくつか貼り付けて問題ないか?

レビュワー向け

レビュワーが確認して変更が反映されていない場合の確認事項

レビューしてみて意図した動作をしない場合は再度ビルドするなど以下の項目を確認してください。

  • プルしたか?
  • ビルドしたか?
  • ビルドしたディレクトリは正しいか(別の開発環境のディレクトリを見ていないか)?
  • npm install したか?
  • composer install したか?
  • キャッシュをクリアして確認したか?

@goutetsuguma goutetsuguma changed the title [ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. 【確認中】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. Oct 17, 2024
@goutetsuguma
Copy link
Contributor

goutetsuguma commented Oct 17, 2024

ありがとうございます!Lightning 、X-T9 、TTシリーズ、問題ありませんでした!
(レビュワー確認方法 のhtmlのコードは何か壊れている感じでしたので、パターンライブラリのスライダーのパターンでいくつか確認しました。)


あと、このプルリクとは全く関係ないのですが TT5で確認しようと WordPressのバージョンを 6.7-beta3 にしてから「外観」>「テーマ」から X-T9( Lightning も? ) に変えた時にNoticeエラーが出るようでした。テーマ側の問題ですかね、、?
念の為コードを貼ります

( ! ) Notice: 関数 _load_textdomain_just_in_time が誤って呼び出されました。Translation loading for the x-t9 domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. 詳しくは WordPress のデバッグをご覧ください。 (このメッセージはバージョン 6.7.0 で追加されました) in /Users/goutetsuguma/Local Sites/testsite/app/public/wp-includes/functions.php on line 6099


どなたか2人目確認お願いします

@goutetsuguma goutetsuguma changed the title 【確認中】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. 【二人目確認待ち】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. Oct 17, 2024
@sysbird sysbird changed the title 【二人目確認待ち】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. 【二人目確認中】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. Oct 18, 2024
@sysbird
Copy link
Member

sysbird commented Oct 18, 2024

確認しました
WP 6.6、WP6.7 ---> Lightning、x-t9、tt-4、tt-5
全幅の表示は解決しています

以前に確認したちころ全幅のスライダーがtt-4で表示くずれるのはしょうがない(tt-4 のせい)とうかがった気がします
なんにしても、パターンの対応テーマがぐっと増えますので解決して良かったです!
ありがとうございます〜

※ WP 6.7 でスライダーの表示がくずれる(?)ときがあります、もう少し確認して別途 issue しますね

@sysbird sysbird changed the title 【二人目確認中】[ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. [ Bug fix ][ Slider ] Fix an issue where full width alignment does not work in tt4 and tt5. Oct 18, 2024
@sysbird sysbird merged commit 578d75c into develop Oct 18, 2024
14 checks passed
@sysbird sysbird deleted the fix/slider/width-tt4-tt5 branch October 18, 2024 02:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants