カスタムテンプレートのサムネイルグリッドのhover色

2016年3月11日 at 13:26

はじめまして。
初めて質問させていただきます。concrete5に出会って5週間目になりますが、いままではこのフォーラムを見ながらどうにか解決できる場合が多かったのですがついにわからなくなってしまいました。
LESSファイルで行き詰っています。

エレメンタルのテーマで「ページリスト」に使われているカスタムテンプレートで定義されていると思うのですがマウスを動かしたときのホバー色を別の色にしたいと思っています。FireFoxの開発ツールで追いかけてもmain.css:1までしかわかりません。

div.ccm-page div.ccm-block-page-list-thumbnail-grid-wrapper div.ccm-block-page-list-page-entry-grid-thumbnail-hover {
background-color: rgba(32,189,232,0.7);
}

rgbaの値を変えると色は変化します。
値が定義されている場所を教えてもらえないでしょうか。

使用環境
さくらのレンタルサーバ スタンダード
クイックインストール
concrete5.7.5.6

タグ:

Re: カスタムテンプレートのサムネイルグリッドのhover色

2016年3月11日 at 17:36
concrete/themes/elemental/css/build/blocks/page-list-template-thumbnail-grid.less
の37~39行目で呼び出され
37:div.ccm-block-page-list-page-entry-grid-thumbnail-hover {
38: background-color: rgba(red(@body-link-color), green(@body-link-color), blue(@body-link-color), 0.7);
39:}


concrete/themes/elemental/css/presets/default.css
の46行目で定義されていることまでわかりました。
45:// Links
46:@body-link-color: #20bde8;
47:@body-link-hover-color: #abddff;


でも、lessファイルを書き換えてもホバーの色が変わりません。
書き換えてから何をすればいいのでしょうか。
自分でも調べてみますがお分かりの方がおいでましたらお願いいたします。

lessファイルはコンパイルが必要とかどこかで見たような気がしますが。
システム設定でブロックのキャッシュは無効にしてあります。
ひょっとしてブロックじゃなかったかな。ここまで書いてから気が付きました。

ちょっとやってみます。
 

Re: カスタムテンプレートのサムネイルグリッドのhover色

2016年3月11日 at 17:48
キャッシュをすべて無効にしたら色が変わりました。
これでちょっとlessファイルの触り方がわかってきました。

それにしても
rgba(red(@body-link-color), green(@body-link-color), blue(@body-link-color)

の書き方でなぜ水色になるのかよくわかりませんが。

結局、自己解決してしまいました。
他にも聞きたいことがあるのでまたあとでよろしくお願いします。