mirror of
https://ghproxy.net/https://github.com/AlxMedia/boxstyle.git
synced 2025-08-26 08:15:24 +08:00
1.0.9 - dark theme styling option
This commit is contained in:
Alexander Agnarson
parent
0fce783884
commit
8d3c453222
10 changed files with 245 additions and 7 deletions
226
dark.css
Normal file
226
dark.css
Normal file
|
|
@ -0,0 +1,226 @@
|
|||
body { background: #111; }
|
||||
.main { background: #222!important; }
|
||||
|
||||
#profile-name,
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
.page-title h1,
|
||||
.page-title h2,
|
||||
.page-title h4,
|
||||
.post-title a,
|
||||
.alx-tab .tab-item-title a,
|
||||
.alx-tab .tab-item-comment a,
|
||||
.alx-posts .post-item-title a,
|
||||
.alx-tabs-nav li a:hover,
|
||||
.author-bio .bio-name,
|
||||
.post-nav li a span,
|
||||
#footer-bottom .social-links a:hover,
|
||||
#footer-bottom a:hover,
|
||||
.widget a:hover,
|
||||
.widget > h3 a,
|
||||
.widget > h3 a:hover { color: rgba(255,255,255,1); }
|
||||
|
||||
body,
|
||||
.entry blockquote,
|
||||
.author-bio .bio-desc,
|
||||
.wp-pagenavi a:hover,
|
||||
.wp-pagenavi a:active,
|
||||
.wp-pagenavi span.current,
|
||||
#footer-bottom #back-to-top:hover,
|
||||
#footer-bottom .social-links a,
|
||||
#footer-bottom a,
|
||||
#flexslider-featured .flex-direction-nav a:before,
|
||||
.widget_rss ul li span.rss-date { color: rgba(255,255,255,0.7); }
|
||||
|
||||
a:hover,
|
||||
#profile-description,
|
||||
.site-description,
|
||||
.page-title span,
|
||||
.post-list .entry,
|
||||
#footer-bottom #back-to-top,
|
||||
#footer-bottom #copyright,
|
||||
#footer-bottom #credit,
|
||||
.notebox,
|
||||
.widget,
|
||||
.widget a { color: rgba(255,255,255,0.5); }
|
||||
|
||||
.post-date,
|
||||
.alx-tab .tab-item-date,
|
||||
.alx-tab .tab-item-name,
|
||||
.alx-posts .post-item-date,
|
||||
.post-category,
|
||||
.post-nav li a strong,
|
||||
.wp-pagenavi a,
|
||||
.wp-pagenavi span,
|
||||
.widget > ul li:before,
|
||||
.widget > ul li a:before,
|
||||
.widget > div > ul li a:before,
|
||||
.widget_calendar caption:before,
|
||||
.widget_archive ul li,
|
||||
.widget_categories ul li,
|
||||
.widget_links ul li,
|
||||
.widget_recent_comments ul li,
|
||||
.widget_recent_entries ul li,
|
||||
.format-circle .fa:before { color: rgba(255,255,255,0.3); }
|
||||
|
||||
.post-grid .post-row,
|
||||
.post-standard,
|
||||
#flexslider-featured { border-color: #2d2d2d; }
|
||||
#flexslider-featured .flex-control-nav li a { background: #555; }
|
||||
#flexslider-featured .flex-direction-nav a { background: #181818; }
|
||||
|
||||
.alx-tabs-nav li a { border-bottom-color: #333; }
|
||||
#footer-bottom #back-to-top { background: #222; }
|
||||
|
||||
#profile-curve,
|
||||
#footer:before { background-image: url(img/dark/curve-color-dark.png); }
|
||||
.main-inner:before { background: linear-gradient(to bottom, rgba(26,26,26,1) 0%,rgba(0,0,0,0) 100%); }
|
||||
|
||||
/* header : nav header
|
||||
/* ------------------------------------ */
|
||||
#nav-header.nav-container { background: #222; border-top: 1px solid rgba(255,255,255,0.05); border-bottom: 1px solid rgba(255,255,255,0.05); }
|
||||
.sticky-element-sticky #nav-header.nav-container:after { background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%); }
|
||||
#nav-header .nav-toggle { color: #fff; }
|
||||
#nav-header .nav-text { color: #999; }
|
||||
|
||||
@media only screen and (min-width: 720px) {
|
||||
|
||||
#nav-header .nav li a { color: rgba(255,255,255,0.5); }
|
||||
#nav-header .nav > li > a:hover,
|
||||
#nav-header .nav > li:hover > a { color: rgba(255,255,255,0.9); }
|
||||
#nav-header .nav li > a:hover,
|
||||
#nav-header .nav li:hover > a { color: rgba(255,255,255,0.9); }
|
||||
#nav-header .nav li.current_page_item > a,
|
||||
#nav-header .nav li.current-menu-item > a,
|
||||
#nav-header .nav li.current-menu-ancestor > a,
|
||||
#nav-header .nav li.current-post-parent > a { color: rgba(255,255,255,0.9); }
|
||||
#nav-header .nav ul { background: #222; }
|
||||
#nav-header .nav ul li { border-bottom: 1px solid rgba(255,255,255,0.03); }
|
||||
}
|
||||
@media only screen and (max-width: 719px) {
|
||||
|
||||
#nav-header .nav-wrap { background: #222; }
|
||||
#nav-header .nav li a { color: #999; border-bottom: 1px solid #292929; }
|
||||
#nav-header .nav li > a:hover,
|
||||
#nav-header .nav li.current_page_item > a,
|
||||
#nav-header .nav li.current-menu-item > a,
|
||||
#nav-header .nav li.current-post-parent > a { background: transparent; }
|
||||
|
||||
}
|
||||
|
||||
/* footer : nav
|
||||
/* ------------------------------------ */
|
||||
#nav-footer.nav-container { background: #1a1a1a; border-bottom: 1px solid #222; }
|
||||
#nav-footer .nav-toggle { color: rgba(255,255,255,0.9); }
|
||||
#nav-footer .nav-text { color: #666; }
|
||||
|
||||
@media only screen and (min-width: 720px) {
|
||||
|
||||
#nav-footer .nav li a { color: #777; }
|
||||
#nav-footer .nav li > a:hover,
|
||||
#nav-footer .nav li:hover > a,
|
||||
#nav-footer .nav li.current_page_item > a,
|
||||
#nav-footer .nav li.current-menu-item > a,
|
||||
#nav-footer .nav li.current-menu-ancestor > a,
|
||||
#nav-footer .nav li.current-post-parent > a { color: rgba(255,255,255,0.9); }
|
||||
#nav-footer .nav ul { background: #222; }
|
||||
#nav-footer .nav ul:before { border-top: 8px solid #222; }
|
||||
#nav-footer .nav ul li { border-bottom: 1px solid #292929; }
|
||||
|
||||
}
|
||||
@media only screen and (max-width: 719px) {
|
||||
|
||||
#nav-footer .nav li a { color: #999; border-top: 1px solid #222; }
|
||||
#nav-footer .nav li > a:hover { background: #1a1a1a; color: #fff; }
|
||||
#nav-footer .nav li.current_page_item > a,
|
||||
#nav-footer .nav li.current-menu-item > a,
|
||||
#nav-footer .nav li.current-post-parent > a { background: #1a1a1a; color: #fff; }
|
||||
|
||||
}
|
||||
|
||||
.page-title,
|
||||
.pad-top,
|
||||
.sidebar .widget { border-color: rgba(255,255,255,0.05); }
|
||||
|
||||
.col-2cl .main-inner { background-image: url(img/dark/sidebar/s-right.png); }
|
||||
.col-2cr .main-inner { background-image: url(img/dark/sidebar/s-left.png); }
|
||||
|
||||
#footer-widgets { border-color: #222; }
|
||||
|
||||
#footer,
|
||||
.author-bio,
|
||||
.sharrre .count,
|
||||
.format-circle,
|
||||
#commentform { background: #1a1a1a; }
|
||||
|
||||
.search-expand .themeform input { background: #1a1a1a; border-color: #333; }
|
||||
.search-expand .themeform input:focus { border-color: #444; color: #999; }
|
||||
|
||||
.alx-tab .tab-item-category a:hover,
|
||||
.alx-posts .post-item-category a:hover { color: rgba(255,255,255,0.5)!important; }
|
||||
|
||||
.related-posts,
|
||||
.sidebar .post-nav li.previous a,
|
||||
.sidebar .post-nav li.next a { border-color: #2d2d2d; }
|
||||
|
||||
.content .post-nav { border-top: 1px solid #2d2d2d; border-bottom: 1px solid #2d2d2d; }
|
||||
.content .post-nav li.next { -webkit-box-shadow: -1px 0 0 #2d2d2d, inset 1px 0 0 #2d2d2d; box-shadow: -1px 0 0 #2d2d2d, inset 1px 0 0 #2d2d2d; }
|
||||
.content .post-nav li.previous { float: left; -webkit-box-shadow: 1px 0 0 #2d2d2d, inset -1px 0 0 #2d2d2d; box-shadow: 1px 0 0 #2d2d2d, inset -1px 0 0 #2d2d2d; }
|
||||
|
||||
.sharrre .count:after { border-left-color: #1a1a1a; }
|
||||
.sharrre#twitter .box:hover { background: #222f35; }
|
||||
.sharrre#facebook .box:hover { background: #25282e; }
|
||||
.sharrre#pinterest .box:hover { background: #332223; }
|
||||
.sharrre#linkedin .box:hover { background: #1f2b31; }
|
||||
|
||||
.themeform input[type="text"],
|
||||
.themeform input[type="password"],
|
||||
.themeform input[type="email"],
|
||||
.themeform input[type="url"],
|
||||
.themeform input[type="tel"],
|
||||
.themeform input[type="number"],
|
||||
.themeform select,
|
||||
.themeform textarea { background: #1a1a1a; border: 2px solid #222; color: #999; }
|
||||
.themeform input[type="text"]:focus,
|
||||
.themeform input[type="password"]:focus,
|
||||
.themeform input[type="email"]:focus,
|
||||
.themeform input[type="url"]:focus,
|
||||
.themeform input[type="tel"]:focus,
|
||||
.themeform input[type="number"]:focus,
|
||||
.themeform select:focus,
|
||||
.themeform textarea:focus { border-color: #333; color: #999; }
|
||||
|
||||
.entry pre { background-image: url(img/dark/pre.png); border: 1px solid #2d2d2d; }
|
||||
|
||||
.entry table tr.alt { background: #2d2d2d; }
|
||||
.entry table td { border-bottom: 1px solid #2d2d2d; }
|
||||
.entry table th { border-top: 1px solid #2d2d2d; border-bottom: 1px solid #2d2d2d; }
|
||||
|
||||
.wp-pagenavi a { border-bottom: 3px solid #333; border-top: 1px solid #333; }
|
||||
.wp-pagenavi a:hover,
|
||||
.wp-pagenavi a:active,
|
||||
.wp-pagenavi span.current { border-top: 1px solid #333; }
|
||||
|
||||
.widget_calendar a:hover { color: #fff!important; }
|
||||
.widget_calendar caption { color: #fff; }
|
||||
.widget_calendar thead { background: #2d2d2d; -webkit-box-shadow: none; box-shadow: none; }
|
||||
.widget_calendar th,
|
||||
.widget_calendar td { border: 1px solid #2d2d2d; }
|
||||
|
||||
@media only screen and (min-width: 480px) and (max-width: 960px) {
|
||||
.s1 { border-top: 1px solid #2d2d2d; }
|
||||
}
|
||||
@media only screen and (max-width: 719px) {
|
||||
.content .post-nav li.previous { border-top: 1px solid #2d2d2d; }
|
||||
}
|
||||
@media only screen and (max-width: 479px) {
|
||||
.post-grid .post,
|
||||
.post-grid .page { border-bottom: 1px solid #2d2d2d; }
|
||||
}
|
||||
|
||||
.child-menu a { color: #999; }
|
||||
.child-menu > li > a { border: 1px solid #2d2d2d; }
|
||||
.child-menu > li > ul { border-top: 1px solid #2d2d2d; border-bottom: 1px solid #2d2d2d; }
|
||||
.child-menu > li > ul > li > a { border-bottom: 1px solid #2d2d2d; border-left: 1px solid #2d2d2d; border-right: 1px solid #2d2d2d; }
|
||||
.child-menu > li ul ul { border-left: 10px solid #2d2d2d; border-right: 1px solid #2d2d2d; border-bottom: 1px solid #2d2d2d; }
|
||||
.child-menu > li ul ul a:hover,
|
||||
.child-menu > li ul ul li.current_page_item > a { background: #2d2d2d; }
|
||||
|
|
@ -200,6 +200,7 @@ if ( ! function_exists( 'boxstyle_styles' ) ) {
|
|||
function boxstyle_styles() {
|
||||
wp_enqueue_style( 'boxstyle-style', get_stylesheet_uri() );
|
||||
if ( get_theme_mod('responsive','on') =='on' ) { wp_enqueue_style( 'boxstyle-responsive', get_template_directory_uri().'/responsive.css' ); }
|
||||
if ( get_theme_mod('dark','off') == 'on' ) { wp_enqueue_style( 'boxstyle-dark', get_template_directory_uri().'/dark.css' ); }
|
||||
wp_enqueue_style( 'boxstyle-font-awesome', get_template_directory_uri().'/fonts/font-awesome.min.css' );
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -610,6 +610,15 @@ Kirki::add_field( 'boxstyle_theme', array(
|
|||
'section' => 'styling',
|
||||
'default' => 'on',
|
||||
) );
|
||||
// Styling: Dark
|
||||
Kirki::add_field( 'boxstyle_theme', array(
|
||||
'type' => 'switch',
|
||||
'settings' => 'dark',
|
||||
'label' => esc_html__( 'Dark Style', 'boxstyle' ),
|
||||
'description' => esc_html__( 'Use dark instead of light base', 'boxstyle' ),
|
||||
'section' => 'styling',
|
||||
'default' => 'off',
|
||||
) );
|
||||
// Styling: Font
|
||||
Kirki::add_field( 'boxstyle_theme', array(
|
||||
'type' => 'select',
|
||||
|
|
|
|||
BIN
img/dark/curve-color-dark.png
Normal file
BIN
img/dark/curve-color-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
img/dark/pre.png
Normal file
BIN
img/dark/pre.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 937 B |
BIN
img/dark/sidebar/s-left.png
Normal file
BIN
img/dark/sidebar/s-left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 944 B |
BIN
img/dark/sidebar/s-right.png
Normal file
BIN
img/dark/sidebar/s-right.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 948 B |
|
|
@ -2,7 +2,7 @@
|
|||
Contributors: alxmedia
|
||||
Requires at least: 5.0
|
||||
Tested up to: 5.0
|
||||
Version: 1.0.8
|
||||
Version: 1.0.9
|
||||
License: GPLv3
|
||||
License URI: http://www.gnu.org/licenses/gpl-3.0
|
||||
Tags: blog, one-column, two-columns, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, flexible-header, full-width-template, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, custom-logo, custom-header, custom-background
|
||||
|
|
@ -81,6 +81,9 @@ Sidebar images
|
|||
|
||||
== Changelog ==
|
||||
|
||||
= 1.0.9 - 2019-02-04 =
|
||||
* Add a dark theme styling option
|
||||
|
||||
= 1.0.8 - 2019-02-03 =
|
||||
* Add a featured slider area with theme options to blog home
|
||||
|
||||
|
|
|
|||
|
|
@ -14,10 +14,10 @@
|
|||
.s1 .sidebar-content { width: 100%; }
|
||||
|
||||
.col-2cr .s1 { margin-left: 0; }
|
||||
.col-2cr .main-inner { background: none; padding-left: 0; }
|
||||
.col-2cr .main-inner { background: none!important; padding-left: 0; }
|
||||
|
||||
.col-2cl .s1 { margin-right: 0; }
|
||||
.col-2cl .main-inner { background: none; padding-right: 0; }
|
||||
.col-2cl .main-inner { background: none!important; padding-right: 0; }
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -56,7 +56,7 @@
|
|||
/* header */
|
||||
#header,
|
||||
#header .pad { padding-top: 0; padding-bottom: 0; }
|
||||
.site-title { padding: 20px 0; margin: 0; width: 100%; float: none; line-height: 50px; border-bottom: 1px solid rgba(255,255,255,0.1); }
|
||||
.site-title { padding: 20px 0; margin: 0; width: 100%; float: none; line-height: 50px; }
|
||||
.site-title a { text-align: center; }
|
||||
#nav-mobile.nav-container,
|
||||
#nav-header.nav-container,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/*
|
||||
Theme Name: Boxstyle
|
||||
Theme URI: http://alxmedia.se/themes/boxstyle/
|
||||
Version: 1.0.8
|
||||
Version: 1.0.9
|
||||
Description: <a href="http://alxmedia.se/themes/boxstyle/">Boxstyle</a> is a responsive 100% high resolution theme for personal blogs. The feature list is long: Unlimited accent colors, unlimited widget areas, 0-1 sidebars to the left or right that can be uniquely specified for each page or post, 220px fixed width sidebar, 0-4 footer widget columns, almost zero layout images, related posts and post nav, 5 post formats, good SEO, 2 flexible custom widgets, localisation support, social links, logo upload and many more useful admin panel features.
|
||||
Author: Alexander Agnarson
|
||||
Author URI: http://alxmedia.se
|
||||
|
|
@ -773,8 +773,7 @@ box-shadow: 0 0 2px rgba(255,255,255,0.4);
|
|||
#flexslider-featured .flex-control-nav { position: absolute; bottom: 10px; left: 2px; right: 0; top: auto; text-align: center; }
|
||||
#flexslider-featured .flex-control-nav li { padding: 0; margin: 0 4px; }
|
||||
#flexslider-featured .flex-control-nav li a { background: #ccc; width: 10px; height: 10px; text-indent: -999px; overflow: hidden;
|
||||
-webkit-border-radius: 100%; border-radius: 100%;
|
||||
-webkit-box-shadow: none; box-shadow: 0 1px 0 #fff, inset 0 1px 0 rgba(0,0,0,0.2); }
|
||||
-webkit-border-radius: 100%; border-radius: 100%; }
|
||||
#flexslider-featured .flex-control-nav li a:hover { }
|
||||
#flexslider-featured .flex-control-nav li a.flex-active { background: #198cff; }
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue
