WordPressテーマ「Arkhe ( アルケー )」の v.2.2 をリリースしました。
アップデート内容
- テーマのスクリーンショット画像を変更しました。
- 一部のCSS変数名を変更しました。
- メディアクエリの書き方を微調整しました。
- サイドバーのサイズ感を微調整しました。
- スムースリンクの処理を調整しました。
- オーバーレイヘッダー使用時のテキストカラーを設定できるようになりました。
- ※ これにより、オーバーレイヘッダーでの
color指定が少し変わってるのでCSSで調整している方は修正が必要かもしれません。
- ※ これにより、オーバーレイヘッダーでの
- その他、CSSの微調整や軽微なバグフィックスなど。
今回のテーマアップデートに合わせて、各種プラグインもアップデートしています。
テーマスクリーンショット画像の変更
Before
After
CSS変数名の変更内容について
--ark-color_main → --ark-color--main
--ark-color_text → --ark-color--text
--ark-color_link → --ark-color--link
--ark-color_bg → --ark-color--bg
--ark-color_gray → --ark-color--gray
--ark-hover_gray → --ark-color--gray--hover
--ark-color_border → --ark-color--border
--ark-color_table_border → --ark-color--border--table
--ark-font_size--mobile → --ark-font_size をメディアクエリで上書き
--ark-pad--container → --ark-padding--container
--ark-nav-padding → --ark-padding--nav
--ark-offset_y → --ark-offset--y
--ark-container_width → --ark-width--container
--ark-article_width → --ark-width--article
--ark-slim_width → --ark-width--article--slim
--ark-logo_size_pc → --ark-logo_size--pc
--ark-logo_size_sp → --ark-logo_size--sp旧名でも利用できるように、--ark-color_main: var(--ark-color--main);のようにして後方互換は維持しています。
var(--古い変数名)を使うことは引き続き可能できますが、--古い変数名:値のセット のように古い変数名を上書きしている部分は書き換えが必要になります。
ただし、前者についても、いずれ完全に切り替えて後方互換コードも廃止する予定なので、CSS変数を流用していた場合は変更をお願いいたします。
メディアクエリの書き方について
Arkheで使用している主なブレイクポイントがは600px/1000pxなのですが、これまで「599px以下」や「999px以下」と書いていた部分を「600px未満」「1000px未満」となるように調整しました。
/* これまでの書き方 */
@media (max-width: 599px) { /* ... */ }
@media (max-width: 999px) { /* ... */ }/* ver.2.2以降 */
@media not all and (min-width: 600px) { /* ... */ }
@media not all and (min-width: 1000px) { /* ... */ }