「タイムライン」ブロックのCSSについて - Cocoonテーマに関する質問

RE: 「タイムライン」ブロックのCSSについて

わいひら — Mon, 01 Apr 2024 11:36:48 +0000

カスタムカラーだけCSSプロパティ変数で、パレットカラーはCSSクラスにする理由は、何ですか？
ここの部分、色々あったように思えます。

パレットカラーのCSSは基本的にクラシックエディター用です。

RE: 「タイムライン」ブロックのCSSについて

大門未知子 — Sun, 31 Mar 2024 13:13:26 +0000

--cocoon-custom-はパレット色ではなく、カスタム色を利用した際に使用されませんか？

拝承。
カスタムカラーの時、必要ですね。

現状のままとし、本件をクローズとします。

ここは確かに以下の部分があるからいらないのかも。

以下は不要ですね。

https://github.com/xserver-inc/cocoon/blob/9405cd106ac3457dced2cbd289bbf9549ff603d6/style.css#L8537-L8539

カスタムカラーだけCSSプロパティ変数で、パレットカラーはCSSクラスにする理由は、何ですか？
ここの部分、色々あったように思えます。

RE: 「タイムライン」ブロックのCSSについて

わいひら — Sun, 31 Mar 2024 12:52:47 +0000

--cocoon-custom-はパレット色ではなく、カスタム色を利用した際に使用されませんか？
添付画像部分での色設定です。

ポイントの色

https://github.com/xserver-inc/cocoon/blob/9405cd106ac3457dced2cbd289bbf9549ff603d6/style.css#L8530

ここは確かに以下の部分があるからいらないのかも。
https://github.com/xserver-inc/cocoon/blob/9405cd106ac3457dced2cbd289bbf9549ff603d6/style.css#L8538

2024-03-31_20h59_53.png

「タイムライン」ブロックのCSSについて

大門未知子 — Sun, 31 Mar 2024 06:45:02 +0000

実害がないです。修正するか否かの判断はお任せします。

----------------------------------------------
テーマ名：Cocoon
バージョン：2.7.2.1
カテゴリー数：11
タグ数：11
ユーザー数：1
----------------------------------------------

●内容

「タイムライン」ブロックで、CSSプロパティ変数--cocoon-custom-を用いているが、開発途中の残骸と思います。https://github.com/xserver-inc/cocoon/blob/9405cd106ac3457dced2cbd289bbf9549ff603d6/style.css#L8456-L8466

パレットで色指定した場合、例えば、以下のようにCSSクラスが追加され、CSSプロパティを用いる事がない。

html .body .timeline-box.has-vivid-red-point-color:not(.not-nested-style) .timeline-item::before {
background-color: #cf2e2e;
}

ポイントの色(.has-xxx-point-color)
背景色(.has-xxx-background-color)
文字色(.has-xxx-color)
ボーダー色(.has-xxx-border-color)

●修正案

--cocoon-custom-を定義するのを止める。

.timeline-box {
  padding: 16px 5px;
  overflow: auto;
  background-color: transparent;
  color: var(--cocoon-text-color);
  border-color: var(--cocoon-basic-border-color);
}

ポイントの色

https://github.com/xserver-inc/cocoon/blob/9405cd106ac3457dced2cbd289bbf9549ff603d6/style.css#L8530

background: #6fc173;