●手順

[Cocoon設定]→[インデックス]→カードタイプ「タイルカード2列」or「タイルカード3列」を設定。

●現象

上記設定の時、カードが図示のようにつぶれて表示されます。

●原因

全体幅の計算が間違っています。

●気になった点

透過色を使う為に、--primary-color、--primary-color-rgbの両方を定義しています。
個人の意見ですが、--primary-color-rgbのみの方が使い易くありませんか？

松田さん

すみません。

ダウンロードできないような・・・。

●対象
skin-tegakinote-dark-sky/style.css

●問題
コーディングミスがあり。
1086行目、bcolorとなっている。colorの誤記。
1192行目、rgba(var(--back-color), .15)となっている。--back-color-rgbの誤記。
2069行目、rgba(var(--black-color), .2)となっている。--back-color-rgbの誤記。
以下の指定を入れた方が望ましいと思います。

@charset "UTF-8";

作成した全CSSチェッカーでの確認願います。

@mk2_mk2 

ご確認をありがとうございます！確かにダウンロードができないようでお手数をおかけいたしました。
ただいまダウンロードできるように設定し直しましたのでよろしくお願いいたします。

ちなみに、こちらは「Download Manager」というプラグインを使っているのですが、以下URLの内容を参考にして設定し直しております。備忘録までに。 https://ja.wordpress.org/support/topic/download-manager%E3%81%A7%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%84/

@chu-ya

ご確認をありがとうございます！ 

> ●手順

> [Cocoon設定]→[インデックス]→カードタイプ「タイルカード2列」or「タイルカード3列」を設定。

デモサイトのトップページをカードタイプ「タイルカード2列」で指定してみました。
ブラウザやローカル等で確認してみましたが、ご連絡いただいた現象を確認できませんでした。
もしこの現象が起こる詳しい内容が分かりましたらお手数ですがご連絡をいただけますと幸いです。

> ●気になった点

> 透過色を使う為に、--primary-color、--primary-color-rgbの両方を定義しています。
> 個人の意見ですが、--primary-color-rgbのみの方が使い易くありませんか？

おっしゃる通りそのように考えてみたこともあるのですがそのままにしていました。
もう少し検討してます！

@chu-ya 

ご確認をありがとうございます。

ご指摘いただいた点の修正、及び、今一度チェックを行います。

修正＆ダウンロードファイルを更新し次第、フォーラムの方でも報告させていただきます。

@usort さん

条件が漏れていました、再度確認願います。

●手順

[Coocon設定]→[インデックス]→
フロントページタイプ（β版）「カテゴリごと（2カラム）」「カテゴリごと（3カラム）」
とカードタイプ「タイルカード2列」「タイルカード3列」

●原因

前回の添付画像の通り、以下となり、表示幅が不正です。

.front-page-type-category-2-columns.masonry, .ect-tile-card-2 .masonry-brick {
    width: calc(49.5% - 2em);
}

@chu-ya 

詳細をありがとうございます！

現象を再現できました。大変助かりました。修正していきます。

松田さん

ご対応いただき、ありがとうございます。

まだ試してはいないのですが・・・。

「ダークスカイ」の場合、ダウンロードのところの文字が、背景色と同化して読めない感じみたいです。

@mk2_mk2 

ご確認ありがとうございます！
吹き出しを対応させていただきます。
ダウンロードはプラグインを使用しております。

上記でご指摘いただいた部分などをデモサイトで反映いたしました。
なお、全ての変更が完了していないできていないため、ダウンロードデータには反映しておりません。
申し訳ありませんが、出来次第またこちらに書き込ませていただきます。

対応完了箇所

• style.cssの頭に「@charset "UTF-8";」を入れる
• skin-tegakinote-dark-sky/style.css
  • 1086行目、bcolorとなっている。colorの誤記。
  • 1192行目、rgba(var(--back-color), .15)となっている。--back-color-rgbの誤記。
  • 2069行目、rgba(var(--black-color), .2)となっている。--back-color-rgbの誤記。
  • 吹き出しのカラー対応。
  • h3:beforeのカラー対応。

対応中の箇所

• フロントページタイプ（β版）「カテゴリごと（2カラム）」「カテゴリごと（3カラム）」とカードタイプ「タイルカード2列」「タイルカード3列」の組み合わせの場合、表示が崩れる。
• ver1.0.0では、–primary-colorと–primary-color-rgbなど、同じ色に対し2種類のCSS変数を使っているが、これを–primary-color-rgbなどに統一する。

素晴らしいスキンを作成していただきありがとうございます。
是非Cocoonのにも同梱させていただければ幸いです。
現在のダウンロードデータで当サイトでも動作確認できるようにスキンを適用してみました。

https://wp-cocoon.com/?theme-switch=skin-tegakinote-blue-coral
https://wp-cocoon.com/?theme-switch=skin-tegakinote-dark-sky
https://wp-cocoon.com/?theme-switch=skin-tegakinote-green-orange
https://wp-cocoon.com/?theme-switch=skin-tegakinote-pink-lemon
https://wp-cocoon.com/?theme-switch=skin-tegakinote-white-banana

僕も一点、表示の不具合らしき物を見つけたので報告です。
ダークスカイスキンでコメントウィジェットの吹き出しの文字が白色になっているようです。
https://wp-cocoon.com/?theme-switch=skin-tegakinote-dark-sky
もし「吹き出しのカラー対応。」で対応済みのものでしたらスルーしていただければ幸いです。

あと、ダークテーマのコメント部分でodd（奇数）返信の文字も白くなるようです。
https://wp-cocoon.com/google-tag-manager-id/

加えて、通常テーマダークテーマ関係なく投稿・固定ページ本文下のシェアボタンやフォローボタンも表示が崩れているようです。
https://wp-cocoon.com/2-4-3/?theme-switch=skin-tegakinote-blue-coral
https://wp-cocoon.com/downloads/
意図したデザインでしたら申し訳ありません。
※アイコンフォントが表示されていないのは、当サイト側の問題の可能性もあるかもしれません。

念のため、ボトムシェアボタンの設定はこちら。

Cocoon設定の「SNSフォロー」の設定項目はこちら。

ダークテーマの場合、アコーディオンボックス、見出しボックス、タブ見出しボックス、ラベルボックス部分のデフォルトデザインの文字色が白く表示されてしまうようです。
https://wp-cocoon.com/cocoon-blocks-response-status/

「ダークスカイ」の場合、キャッチフレーズが見えづらい気がします。

スキン作成お疲れ様です。

色々なところのデザインが手書きっぽくて良いですね！CSSで色んなパーツが再現できるんだなと思いました。

スキンのCSS112行目の

cursor: pointer;

は意図したものですか？

投稿ページなどでカーソルがクリックできるかのような状態になります。

何個もすいません。
これも意図したものなら大変申しわけないのですが、グローバルメニューのサブメニューについてです。
メニュー名が左揃えなのに、サブメニュー名が中央揃えになっているようです。

疑似要素部分のアイコンフォントが表示されないのは、サイトアイコンフォントをFont Awesome5にするとなるみたいですね。

以下のようなコードをスキンに追加すると、Font Awesome5でも表示されるようになるようです。

.font-awesome-5 .navi .sub-caption::before,
.font-awesome-5 .sns-share-message::before, 
.font-awesome-5 .sns-follow-message::before{
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

.font-awesome-5 .navi .sub-caption::before{
  content: "\f105";
  font-size: 0.8em;
}

.font-awesome-5 .sns-share-message::before, 
.font-awesome-5 .sns-follow-message::before{
  content: "\f00c";
}

※もしくはスキン制御機能で、サイトアイコンフォントをFont Awesome4に限定するという方法もあります。
https://wp-cocoon.com/skin-control/

別の不具合対応中です。申し訳ありません。

みなさま、色々とご確認いただきありがとうございます。

不具合部分から、シェアボタン部分の間隔(デザインのつもりでしたが利便性を考えもう少し離しました)、目次の視認性などを含め、本日いただいたのFont Awesome5まで対応いたしました。
初めにご指摘いただいたカラー設定のCSS変数を検討し、CSS変数はRGBに統一しております。
(先ほど抜けていたコメント欄のCSSも対応いたしました。)

大変お手数ですが、以下から最新バージョンのダウンロードをお願いいたします。

https://usort.jp/cocoon/tegakinote-feature/#toc3/

なお今後、ダークスカイ特有の不具合が多く発生するようでしたら、今回ダークスカイの同梱は外していただきたく思います。もし、てがきノートをご同梱いただいた後、追加での同梱が可能でしたら幸いです。

どうぞよろしくお願いいたします。

すみません、編集ができなくなっていたのでこちらに書き込みます。

みなさま、色々とご確認いただきありがとうございます。

不具合部分から、シェアボタン部分の間隔(デザインのつもりでしたが利便性を考えもう少し離しました)、目次の視認性などを含め、本日いただいたのFont Awesome5まで対応いたしました。
初めにご指摘いただいたカラー設定のCSS変数を検討し、CSS変数はRGBに統一しております。
(先ほど抜けていたコメント欄のCSSや個人的に見つけた不具合も対応いたしました。)

大変お手数ですが、以下から最新バージョンのダウンロードをお願いいたします。

https://usort.jp/cocoon/tegakinote-feature/#toc3/

なお今後、ダークスカイ特有の不具合が多く発生するようでしたら、今回ダークスカイの同梱は外していただきたく思います。もし、てがきノートをご同梱いただいた後、追加での同梱が可能でしたら幸いです。

どうぞよろしくお願いいたします。

スキン：/wp-content/themes/cocoon-child-master/skins/skin-tegakinote-blue-coral/style.css

●前回の指摘確認

• カードタイプ「タイルカード2列」「タイルカード3列」の動作で正しく表示される事を確認しました。
• CSSチェッカーでエラーがない事を確認しました。

●CSSの記述で気になった点

-webkit-overflow-scrolling
以下の注意書きがあり、削除かと。
https://developer.mozilla.org/ja/docs/Web/CSS/-webkit-overflow-scrolling

box-shadow
既にサポートされ、ベンダープレフィックスは不要では？
webkit-box-shadow
-moz-box-shadow

body:not(.blog):not(.archive) .main, .list
box-shadowが2重定義されている。

あと、[外観]→[カスタマイズ]で、HTMLにbox-shadowがstyle追加するので、あえてstyle.cssに定義必要ですか？

●動作で気になった点
「.list .a-wrap：hover」の時、「border：none」となる為、カード幅が微妙に変わり。
日付などのコンテンツが少し動きます。

●ご参考

body:not(.blog):not(.archive) .main,.list
の定義ですが個人的にわかり難く、以下の定義で十分なのでは？と思い。

• 投稿ページ、.single .mian
• 固定ページ、.page .main
• 一覧ページ、.list

修正ありがとうございます！
取り急ぎ、当サイトを最新版にアップデートしました。
以下、URLの再掲。
https://wp-cocoon.com/?theme-switch=skin-tegakinote-blue-coral
https://wp-cocoon.com/?theme-switch=skin-tegakinote-dark-sky
https://wp-cocoon.com/?theme-switch=skin-tegakinote-green-orange
https://wp-cocoon.com/?theme-switch=skin-tegakinote-pink-lemon
https://wp-cocoon.com/?theme-switch=skin-tegakinote-white-banana
後で時間が空きましたら僕も不具合報告した箇所を確認してみます。

僕が報告させていただいた箇所は、すべて修正されているのを確認いたしました。
ダークテーマも問題ないように思います。
今後、もう少し動作確認をしてみて、問題なければ同梱させていただこうと思います。
予定としては次の次のバージョンあたり（2.4.5）に公開しようと思っています。
以下の注意点などは問題ないでしょうか。
https://wp-cocoon.com/skin-make/
問題なければ、スキンが同梱されたバージョンを公開した際に、同梱料としてAmazonギフト券を送付させていただければと思います。

それにしても、見てて楽しいスキンですね。
良いものを作っていただきありがとうございます！

●スキン
/wp-content/themes/cocoon-child-master/skins/skin-tegakinote-blue-coral/style.css

●確認事項

アピールエリアのデザインについて確認したく。
図の赤枠のドット部分ですが、ドットの色が--back-colorでなく、--gray-colorとなっており。
ウィジェットのドットの色と異なりますが、間違いないですか？

.appeal-content::before {
   border-top-color: rgba(var(--gray-color), 1);
}

松田さん

ご対応いただき、ありがとうございます。

私が書かせていただいたものは、解消していることを確認致しました。
お手数お掛けしました。

P.S.

本件の確認をしている内に、別件に気づいてしまいました。
（スキンではありません。）

別途、トピックを立てようかと思っております。
（ここに書こうかと思いましたが、スキンではありませんので、別にします。）

今は時間がありませんので、また後程。

ダークテーマの不具合？を見つけたので報告させていただきます。
デフォルトのpreタグだと、背景色と文字色が近い色で見づらいかもしれません。
https://wp-cocoon.com/campaign-shortcode/

みなさま、ご確認をありがとうございます！

自分で見つけたところも含めて修正させていただきます。

また連絡いたしますので少々お待ちください。

はるさんも書かれていて重複になってしまうのですが、添付画像の.mainカーソルがポインターになっているのは、そういうデザインということでよいのでしょうか。
https://wp-cocoon.com/community/postid/61792/

シェアボタンの、ボトムシェアボタンで「カラム数」を1列とした際は、添付画像のような表示になるのは意図的なものでしょうか。
設定値によって以下のような挙動になるので質問させていただきました。

1. 1列：1列
2. 2列：2列
3. 3列：6列←ここだけ設定と同数にならない
4. 4列：4列
5. 5列：5列
6. 6列：6列

3列設定の表示がこちら。

設定箇所。

お世話になります。

気になるところとおっしゃっていただいた部分から、シェアボタンの「カラム数」まで全て対応いたしました。
cursorですが、ダークスカイだけCSSの記述が消えてませんでした。ご指摘いただきありがとうございます。

スキン同梱に関する注意点について承知いたしました。

お手数ですが、以下からダウンロードをお願いいたします。

https://usort.jp/cocoon/tegakinote-feature/#toc3

●スキン
/wp-content/themes/cocoon-child-master/skins/skin-tegakinote-blue-coral/style.css

●確認
アピールエリアのドットの色が--back-colorに修正されている事を確認しました。

修正ありがとうございます。
最新版を当サイトに適用しておきました。
カーソルは、ダークテーマだけだったんですね。修正を確認致しました。
加えて、ボトムのシェアボタンが一列でも、左右の高さが同じになったので、意図的なものだと明確に分かるようになりました。

みなさま、色々とご確認いただきありがとうございました！

プロフィールボックス用のSNSアイコンの表示に不具合があり修正しました。

またお手数をお掛け致しますが、以下からダウンロードをお願いいたします。

https://usort.jp/cocoon/tegakinote-feature/#toc3

とりあえず、当サイトに適用しておきました。
URL再掲
https://wp-cocoon.com/?theme-switch=skin-tegakinote-blue-coral
https://wp-cocoon.com/?theme-switch=skin-tegakinote-dark-sky
https://wp-cocoon.com/?theme-switch=skin-tegakinote-green-orange
https://wp-cocoon.com/?theme-switch=skin-tegakinote-pink-lemon
https://wp-cocoon.com/?theme-switch=skin-tegakinote-white-banana

@yhira

お手数をお掛け致しました。適用いただきありがとうございます。

お世話になります。

WordPress6.0がリリースされた最中で申し訳ありません。

スキンですが、主にfunctions.phpの不具合を修正しました。

再三で申し訳ありませんが、お手隙の時で大丈夫ですので、こちらに添付したzipからダウンロードをお願いいたします。

サイトに適用しておきました。
次のバージョン用のファイルもアップデートしておきます。

@yhira 

ありがとうございます。よろしくお願いいたします。

投稿者:: @mk2_mk2

「ダークスカイ」の場合、キャッチフレーズが見えづらい気がします。

先日のこちらのダークスカイスキンのスタイルの件なんですが、一旦改善されたように思ったんですが、今日見たら以前の状態に戻っているようです。
これは意図的に戻されたものなのでしょうか。

今更で、すみません。

「ダークスカイ」は、プルダウンが見づらいような気がします。
（年齢が高い方には厳しいかもしれないです）

@yhira 様

ご確認をありがとうございます。

white-colorの設定に不具合がありました。修正いたします。

@mk2_mk2 様

ご確認をありがとうございます。

windowsでご連絡いただいた内容を確認できました。こちらを修正いたします。

お世話になります。

ご連絡いただいたダークスカイの以下を修正しました。
・white-colorを指定している部分が効いていない
・プルダウンの視認性

また、すべてのスキンにて、以下の対応を行いました。
・404ページの修正
・モバイル時のメニュー表示のCSSを追加＆カスタマイザー適用箇所を変更
・モバイル時のロゴテキストのフォント、傍点のCSSを追加＆カスタマイザー適用箇所を変更
・アピールエリア、サイドバーの穴あき部分(boder-top-color)のカラーを、Cocoon設定 > 全体 > サイト背景色で色変更可能に

お手数をお掛け致しますが、添付からダウンロードをお願いいたします。