WordPressテーマSANGOの質問

【gutenberg】吹き出しのデザイン崩れについて

アバター
みひまる

先日はTwitterにてリプいただきありがとうございました。(@mihimarudesu)
やはり解決できずお力添えいただきたいです。
【質問】吹き出し、背景グレーにすると◀の部分だけ浮き出るのをなくしたい
おそらく当方のCSSの問題かとは存じますが
解決方法をご教授いただけると幸いです。
よろしくお願いいたします。

SANGO
SANGO 質問ガイドライン
コメントへの回答
サルワカくん
サルワカくん
2021/07/15

お世話になっております。
こちらこそありがとうございました。
もしよろしければ、問題が再現するページのURLをご共有いただけないでしょうか?
よろしくお願いします。

アバター
みひまる
2021/07/18

ご返信ありがとうございます。
https://mihimarublog.com/okimoto/
こちらの記事、1つ目のh2の段落に吹き出しがありますので
ご確認お願いします。
この記事だけでなく、グーテンベルクで作成した記事については
すべて同様の事象が起こっております。
よろしくお願いいたします。

サルワカくん
サルワカくん
2021/07/18

お世話になっております。
URLを共有いただきありがとうございます。
こちら調査不足ですみません、背景色に透明度が設定されている色を選ぶと確かに吹き出しのスタイルに不具合があることが確認できました。
ちなみに、Gutenbergにて他の色を選んでいただいても同様の問題が発生するかご確認いただいてもよろしいでしょうか?
よろしくお願いします。

アバター
みひまる
2021/07/18

お世話になります。
デフォルトのカラーで一番下の段、右から2つ
・gray
・silver
が、デザイン崩れるようです。
他のカラーは問題ありません。

サルワカくん
サルワカくん
2021/07/19

お世話になっております。
そういうことですね。
一つ一つお試しいただきありがとうございます。
grayとsilverに関しては色自体に透明度が設定されていて、その影響で色がおかしくなってしまうようです。
先日カスタムカラー機能をリリースしました。
この機能はご自身でカラーパレットの色を追加できる機能になります。
大変お手数ですが、それを利用して透明度をなくしたgrayとsilverをそれぞれ作っていただくのが良さそうです。
手順としては、以下のようになります。
1. 投稿画面に移動
2. 投稿画面の画面右上にあるSANGOマークをクリック
3. カスタムカラー設定より「カスタムカラーを作成」をクリック
4. カラーコードを選び名前をつけて保存
5. 吹き出しのブロックの背景色に追加したカラーコードが選択できるようになっているのが確認できます。
以下それぞれの色のカラーコードになります
gray -> #999999
silver -> #d9d9d9

TwitterのURLで恐縮ですが動画を投稿しておりますのでこちらの動画を見ていただくと使い勝手が分かり易いかと思います。
https://twitter.com/sangowp/status/1415272375730405376

以上になります。
お手数をおかけしますが、よろしくお願いします。

アバター
みひまる
2021/07/21

ご返信ありがとうございます。
無事、問題解決できました!
この度はご多忙の中ありがとうございました。