SWELLを導入したデフォルトの状態では、サムネイル上にマウスカーソルを持っていくと、マウスホバー時にフィルターがかかる効果がついている。 投稿リストの上にマウスを持っていったときに掛かる。
「明瞭 ▶ 不明瞭」 という効果だ。
これは、「選択されている」ということが分かりやすいし、全体的に解像度が落ちるので「クリックして詳細を確認したい」という気持ちになるかもしれない。しかし、今回のサムネイル表示の場合は、良くないのではないかと思った。
とくに記事タイトル下のディスクリプション？（記事の最初の分が数文字表示されている部分）が、この場合は、マウスオーバー時に見えやすくしたほうが良いのではないかと思った。字が小さいので、そうしたしたほうが良いと思った。自分が使用しているモニタも解像度が低いことも関係している。
他のSWELLのサイトを見ていても、この効果をそのままにしている方がほとんどだったので、差別化、個性を出す意味でも、逆の効果「マウスホバーしたら明瞭化させる」という方向にしたいと考えた。
2020-12-13 あたりから、このフィルターのようなものをキャンセルしたいと思っていたが、なかなか解決できなかった。
SWELL側の初期設定の問題かなと思い、フォーラムで質問したところ、開発者の了さんから回答を頂いた。最初は、まだピンと来ていなかったが、頑張って色々さわっていたろころ、main.css の存在にやっと気づいた。Javascript やらで何やら動いているのかなと思って、main.cssは全く気にしていなかった。
そこから、それらしい該当箇所を探しだし opacity:.75 となっている箇所があったので 1 に設定した。それ再適用させたところ希望通りに、「マウスホバー時のフィルターによる文字の不明瞭化」をキャンセルすることができた。
（余談だが、Dreamweaver CS6 でCSSファイルを開いたところズラーッと改行されずに羅列表示されたので、戸惑った。Visual Studio だと改行されるのかな？と疑問に思った。今度試してみたい。）
パソコンだとマウスホバーしたときに「 不明瞭 ▶ 明瞭 」という動きをつけることで 『選択されてることを示す』ことになって良さそうなのでそうしようｋな？ と思ったが、よく考えると、スマホで見る事もあり、スマホの場合は、マウスホバーの操作が出来ない。なのでやめた。
スマホのことも考えると、フィルターの効果をつけるとすれば「 明瞭 ▶ 不明瞭 」 という動きが無難なのかなと思った。
スマホの場合だと、初期状態を不明瞭にしておくと見にくいなと思った。
そこで、「スマホのときは、別の動く気をさせるのも良いのでは？」と思ったが、時間がかかりそうなので今の方法に落ち着いた。
とりあえず「パソコンで選択（ホバーさせたとき）したときの文字の不明瞭化」が個人的には、ちょっと気になったのでキャンセルして、今の形になった。
なんとか個人的に満足出来る形になったと思う
「こういった カスタマイズは流石に自分でしないといけないな」 と思った。
