Last active
August 1, 2018 15:16
-
-
Save kght6123/d8975c0dd4ee2dcbc9df9e390d1db8d5 to your computer and use it in GitHub Desktop.
時間帯でダークカラーとライトカラーのCSSを切り替え(Wordpress)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
blockquote, .post-password-form label, | |
a:hover, a:focus, a:active, .post-navigation | |
.meta-nav, .image-navigation, .comment-navigation, | |
.widget_recent_entries .post-date, .widget_rss .rss-date, | |
.widget_rss cite, .site-description, | |
.author-bio, .entry-footer, .entry-footer a, | |
.sticky-post, .taxonomy-description, | |
.entry-caption, .comment-metadata, | |
.pingback .edit-link, .comment-metadata a, .pingback .comment-edit-link, | |
.comment-form label, .comment-notes, | |
.comment-awaiting-moderation, .logged-in-as, | |
.form-allowed-tags, .site-info, .site-info a, | |
.wp-caption .wp-caption-text, .gallery-caption, | |
.widecolumn label, .widecolumn .mu_register label { | |
color: #c1c1c1 !important; | |
} | |
body, blockquote cite, blockquote small, | |
.main-navigation a, .menu-toggle, .dropdown-toggle, | |
.social-navigation a, .post-navigation a, .pagination a:hover, | |
.pagination a:focus, .widget-title a, .site-branding .site-title a, | |
.entry-title a, .page-links>.page-links-title, .comment-author, | |
.comment-reply-title small a:hover, .comment-reply-title small a:focus { | |
color: #e5e5e5 !important; | |
} | |
body { | |
background-color: #111 !important; | |
background: #111 !important; | |
} | |
a { | |
color: #a2d7fa !important; | |
} | |
.site { | |
background-color: #2C2C2C !important; | |
} | |
.widget-area { | |
background-color: rgba(0, 0, 0, 0) !important; | |
} | |
.widget-area ul li::after { | |
border-right: 3px solid #666; | |
border-bottom: 3px solid #666; | |
} | |
/* Gistダークテーマ */ | |
/* Line Numbers */ | |
.gist-data tbody td:nth-of-type(1) { | |
color: #666 !important; | |
} | |
/* Code */ | |
.gist-data tbody td:nth-of-type(2){ | |
color: #ddd !important; | |
} | |
/* All & Footer & body */ | |
.gist-data, .gist-data table, .gist-data tbody { | |
background-color: #333 !important; | |
color: #ccc !important; | |
} | |
.gist-meta, .gist-meta * { | |
background-color: #393939 !important; | |
color: #ccc !important; | |
} | |
.gist { | |
background-color: rgba(0, 0, 0, 0) !important; | |
color: #ccc !important; | |
} | |
.gist, .gist-data, .gist-data table td, .gist-file, .gist-meta { | |
border: 1px solid rgba(0, 0, 0, 0) !important; | |
} | |
/* Comments */ | |
.pl-c | |
{ | |
color: #57A64A !important; | |
} | |
/* Function */ | |
.pl-k | |
{ | |
color: rgb(229, 173, 255) !important; | |
} | |
/* Function Name */ | |
.pl-en | |
{ | |
color: rgb(255, 173, 230) !important; | |
} | |
/* Function Method */ | |
.pl-c1 | |
{ | |
color: rgb(255, 196, 196) !important; | |
} | |
/* "'s around Strings */ | |
.pl-pds | |
{ | |
color: rgb(204, 173, 255) !important; | |
} | |
/* Strings */ | |
.pl-s | |
{ | |
color: rgb(204, 173, 255) !important; | |
} | |
/* val */ | |
.pl-smi | |
{ | |
color: rgb(159, 193, 255) !important; | |
} | |
.tbl { | |
background-color: #616161 !important; | |
} | |
.tbl th, | |
.tbl td { | |
border-color: #424242 !important; | |
} | |
.tbl th { | |
background-color: #757575 !important; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
function kght_theme_enqueue_styles() { | |
// 親CSSの読み込み | |
wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css' ); | |
// 親CSSを継承して、子CSSの読み込み | |
wp_enqueue_style('child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style')); | |
// タームゾーンを指定 | |
date_default_timezone_set('Asia/Tokyo'); | |
// リクエストパラメータの値を取得 | |
$kght_style_mode = get_query_var('kght_style_mode', 'none'); | |
// 現在時刻を数値で取得 | |
$time_hour = idate('H'); | |
if (strcmp($kght_style_mode, 'light') == 0) { | |
// ライトカラーが指定されていたとき | |
kght_light_enqueue_styles(); | |
} elseif (strcmp($kght_style_mode, 'dark') == 0) { | |
// ダークカラーが指定されていたとき | |
kght_dark_enqueue_styles(); | |
} elseif (5 <= $time_hour && $time_hour <= 17) { | |
// ライトカラー(4時~17時)のとき | |
kght_light_enqueue_styles(); | |
} elseif (17 <= $time_hour && $time_hour <= 24) { | |
// ダークカラー(17時~24時)のとき | |
kght_dark_enqueue_styles(); | |
} else { | |
// デフォルトはダークカラー | |
kght_dark_enqueue_styles(); | |
} | |
} | |
function kght_dark_enqueue_styles(){ | |
// ダークカラー用のCSSの読み込み | |
wp_enqueue_style('dark-style', get_stylesheet_directory_uri() . '/dark.css', array('child-style')); | |
} | |
function kght_light_enqueue_styles(){ | |
// ライトカラー用のCSSの読み込み | |
wp_enqueue_style('light-style', get_stylesheet_directory_uri() . '/light.css', array('child-style')); | |
} | |
function kght_add_query_vars_filter( $vars ){ | |
// 強制的にダーク・ライトカラーを切り替えるリクエストパラメータを追加 | |
$vars[] = "kght_style_mode"; | |
return $vars; | |
} | |
// テーマスタイル読み込みアクションをスクリプトキューに追加 | |
add_action('wp_enqueue_scripts', 'kght_theme_enqueue_styles'); | |
// カスタムクエリ変数を追加 | |
add_filter('query_vars', 'kght_add_query_vars_filter'); | |
?> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
blockquote, .post-password-form label, | |
a:hover, a:focus, a:active, .post-navigation | |
.meta-nav, .image-navigation, .comment-navigation, | |
.widget_recent_entries .post-date, .widget_rss .rss-date, | |
.widget_rss cite, .site-description, | |
.author-bio, .entry-footer, .entry-footer a, | |
.sticky-post, .taxonomy-description, | |
.entry-caption, .comment-metadata, | |
.pingback .edit-link, .comment-metadata a, .pingback .comment-edit-link, | |
.comment-form label, .comment-notes, | |
.comment-awaiting-moderation, .logged-in-as, | |
.form-allowed-tags, .site-info, .site-info a, | |
.wp-caption .wp-caption-text, .gallery-caption, | |
.widecolumn label, .widecolumn .mu_register label { | |
color: #3e3e3e !important; | |
} | |
body, blockquote cite, blockquote small, | |
.main-navigation a, .menu-toggle, .dropdown-toggle, | |
.social-navigation a, .post-navigation a, .pagination a:hover, | |
.pagination a:focus, .widget-title a, .site-branding .site-title a, | |
.entry-title a, .page-links>.page-links-title, .comment-author, | |
.comment-reply-title small a:hover, .comment-reply-title small a:focus { | |
color: #1a1a1a !important; | |
} | |
body { | |
background-color: #eee !important; | |
background: #eee !important; | |
} | |
.site { | |
background-color: #f8f8f8 !important; | |
} | |
.widget-area { | |
background-color: rgba(0, 0, 0, 0) !important; | |
} | |
.widget-area ul li::after { | |
border-right: 3px solid #ccc; | |
border-bottom: 3px solid #ccc; | |
} | |
/* Gistライトテーマ */ | |
/* Line Numbers */ | |
.gist-data tbody td:nth-of-type(1) { | |
color: #f8f8f8 !important; | |
} | |
/* Code */ | |
.gist-data tbody td:nth-of-type(2){ | |
color: #222 !important; | |
} | |
/* All & Footer & body */ | |
.gist-data, .gist-data table, .gist-data tbody { | |
background-color: #ccc !important; | |
color: #333 !important; | |
} | |
.gist-meta, .gist-meta * { | |
background-color: #c6c6c6 !important; | |
color: #333 !important; | |
} | |
.gist { | |
background-color: rgba(0, 0, 0, 0) !important; | |
color: #333 !important; | |
} | |
.gist, .gist-data, .gist-data table td, .gist-file, .gist-meta { | |
border: 1px solid rgba(0, 0, 0, 0) !important; | |
} | |
/* Comments */ | |
.pl-c | |
{ | |
color: #57A64A !important; | |
} | |
/* Function */ | |
.pl-k | |
{ | |
color: rgb(229, 173, 255) !important; | |
} | |
/* Function Name */ | |
.pl-en | |
{ | |
color: rgb(255, 173, 230) !important; | |
} | |
/* Function Method */ | |
.pl-c1 | |
{ | |
color: rgb(255, 196, 196) !important; | |
} | |
/* "'s around Strings */ | |
.pl-pds | |
{ | |
color: rgb(204, 173, 255) !important; | |
} | |
/* Strings */ | |
.pl-s | |
{ | |
color: rgb(204, 173, 255) !important; | |
} | |
/* val */ | |
.pl-smi | |
{ | |
color: rgb(159, 193, 255) !important; | |
} | |
.tbl { | |
background-color: #eee !important; | |
} | |
.tbl th, | |
.tbl td { | |
border-color: #f8f8f8 !important; | |
} | |
.tbl th { | |
background-color: #ddd !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment