AlxMedia/microtype
1
0
Fork 0
mirror of https://ghproxy.net/https://github.com/AlxMedia/microtype.git synced 2025-08-26 23:21:39 +08:00
Code Issues Projects Packages Wiki Activity Actions

Add slick dots

Browse source
This commit is contained in:
AlxMedia 2022-09-10 12:01:26 +02:00
parent 426721a33e
commit d2163bb1a6
7 changed files with 20 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

6
content-featured.php
View file

@ -1,6 +1,7 @@
<?php $format = get_post_format(); ?>
<div class="box-featured-wrap">
<article id="post-<?php the_ID(); ?>" <?php post_class('box-featured-wrap'); ?>>
<div class="box-featured">
<a href="<?php the_permalink(); ?>" rel="bookmark" class="<?php if ( has_post_thumbnail() ) echo 'box-featured-thumbnail-enabled'; ?>">
@ -24,4 +25,5 @@
</a>
</div>
</div>
</article>

1
dark.css
View file

@ -33,6 +33,7 @@ body:where(.dark) .box-featured a { border: 1px solid rgba(255,255,255,0.06); }
body:where(.dark) .box-featured a:hover { background: rgba(0,0,0,0.12); }
body:where(.dark) .box-featured-title { color: #fff; }
body:where(.dark) .box-featured-date { color: rgba(255,255,255,0.3); }
body:where(.dark) .slick-featured .slick-dots li button { background: rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }
/* header */
body:where(.dark) .site-title a { color: #fff; }

2
functions/dynamic-styles.php
View file

@ -169,6 +169,8 @@ if ( ! function_exists( 'microtype_dynamic_css' ) ) {
.slick-featured-nav .slick-next:hover,
.slick-featured-nav .slick-prev:focus,
.slick-featured-nav .slick-next:focus { background: '.esc_attr( get_theme_mod('color-1') ).'; }
.slick-featured .slick-dots .slick-active button { border-color: '.esc_attr( get_theme_mod('color-1') ).'; }
'."\n";
}
// background color

2
functions/theme-options.php
View file

@ -148,7 +148,7 @@ Kirki::add_field( 'microtype_theme', array(
'label' => esc_html__( 'Featured Post Count', 'microtype' ),
'description' => esc_html__( 'Max number of featured posts to display. Set it to 0 to disable', 'microtype' ),
'section' => 'blog',
'default' => '4',
'default' => '3',
'choices' => array(
'min' => '0',
'max' => '10',

4
inc/featured.php
View file

@ -6,13 +6,13 @@ $featured = new WP_Query(
'update_post_meta_cache' => false,
'update_post_term_cache' => false,
'ignore_sticky_posts' => 1,
'posts_per_page' => absint( get_theme_mod('featured-posts-count','4') ),
'posts_per_page' => absint( get_theme_mod('featured-posts-count','3') ),
'cat' => absint( get_theme_mod('featured-category','') )
)
);
?>
<?php if ( is_home() && !is_paged() && ( get_theme_mod('featured-posts-count','4') !='0') && $featured->have_posts() ): // Show if posts are not 0 ?>
<?php if ( is_home() && !is_paged() && ( get_theme_mod('featured-posts-count','3') !='0') && $featured->have_posts() ): // Show if posts are not 0 ?>
<div class="slick-featured-wrap-outer">
<div class="slick-featured-wrap">

5
js/scripts.js
View file

@ -123,6 +123,7 @@ jQuery(document).ready(function($) {
centerPadding: '100px',
slidesToShow: 1,
appendArrows: '.slick-featured-nav',
dots: true,
responsive: [
{
breakpoint: 1280,
@ -147,7 +148,7 @@ jQuery(document).ready(function($) {
settings: {
arrows: true,
centerMode: true,
centerPadding: '60px',
centerPadding: '40px',
slidesToShow: 1
}
},
@ -156,7 +157,7 @@ jQuery(document).ready(function($) {
settings: {
arrows: true,
centerMode: true,
centerPadding: '40px',
centerPadding: '20px',
slidesToShow: 1
}
}

8
style.css
View file

@ -881,7 +881,7 @@ body.dark #theme-toggle-btn:before { border-color: #1a1a1a; top: 2px; left: 34px
.box-featured a:hover .box-featured-comments { opacity: 1; right: 20px; }
.slick-featured-wrap-outer { display: none; }
.slick-featured-wrap { background: rgba(0,0,0,0.04); border-top: 1px solid rgba(0,0,0,0.06); position: relative; }
.slick-featured-wrap { background: rgba(0,0,0,0.04); border-top: 1px solid rgba(0,0,0,0.06); position: relative; padding-bottom: 20px; }
.slick-featured { position: relative; z-index: 2; }
.slick-featured-nav { position: absolute; left: 0; right: 0; top: 50%; margin-top: 0; text-align: center; margin-bottom: 0; z-index: 4; }
.slick-featured-nav .slick-prev,
@ -899,6 +899,12 @@ body.dark #theme-toggle-btn:before { border-color: #1a1a1a; top: 2px; left: 34px
.slick-featured-nav .slick-prev:before { color: #fff; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f053"; }
.slick-featured-nav .slick-next:before { color: #fff; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f054"; }
.slick-featured.slick-dotted.slick-slider { margin-bottom: 0; }
.slick-featured .slick-dots { bottom: -6px; }
.slick-featured .slick-dots li { margin: 0 3px; }
.slick-featured .slick-dots li button { background: rgba(0,0,0,0.08); box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); margin: 3px; height: 10px; width: 10px; border-radius: 100%; text-indent: -9999px; overflow: hidden; }
.slick-featured .slick-dots .slick-active button { margin: 0; border: 3px solid #1da9ff; }
.slick-image-slide-wrapper { position: relative; }
.slick-image-slide { background: #333; }
.slick-image-slide .slick-slide > div > div { display: block!important; }