rayelliott
/
understrap
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #1 from understrap/master 

Update local fork
This commit is contained in:
Davor Lonzaric 2019-01-22 17:05:15 +01:00 committed by GitHub
parent 05cbe7bedf 1c806b7e57
commit cc82a79616
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
104 changed files with 15904 additions and 14966 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
.editorconfig Normal file
View File

@ -0,0 +1,21 @@
# This file is for unifying the coding style for different editors and IDEs
# editorconfig.org
# WordPress Coding Standards
# https://make.wordpress.org/core/handbook/coding-standards/
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = tab
[{package.json,*.yml}]
indent_style = space
indent_size = 2
[{*.txt,wp-config-sample.php}]
end_of_line = crlf

28
404.php
View File

@ -11,7 +11,7 @@ if ( ! defined( 'ABSPATH' ) ) {
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
<div class="wrapper" id="error-404-wrapper"> <div class="wrapper" id="error-404-wrapper">
@ -28,15 +28,13 @@ $container = get_theme_mod( 'understrap_container_type' );
<header class="page-header"> <header class="page-header">
<h1 class="page-title"><?php esc_html_e( 'Oops! That page can&rsquo;t be found.', <h1 class="page-title"><?php esc_html_e( 'Oops! That page can&rsquo;t be found.', 'understrap' ); ?></h1>
'understrap' ); ?></h1>
</header><!-- .page-header --> </header><!-- .page-header -->
<div class="page-content"> <div class="page-content">
<p><?php esc_html_e( 'It looks like nothing was found at this location. Maybe try one of the links below or a search?', <p><?php esc_html_e( 'It looks like nothing was found at this location. Maybe try one of the links below or a search?', 'understrap' ); ?></p>
'understrap' ); ?></p>
<?php get_search_form(); ?> <?php get_search_form(); ?>
@ -50,13 +48,15 @@ $container = get_theme_mod( 'understrap_container_type' );
<ul> <ul>
<?php <?php
wp_list_categories( array( wp_list_categories(
'orderby' => 'count', array(
'order' => 'DESC', 'orderby' => 'count',
'show_count' => 1, 'order' => 'DESC',
'title_li' => '', 'show_count' => 1,
'number' => 10, 'title_li' => '',
) ); 'number' => 10,
)
);
?> ?>
</ul> </ul>
@ -83,8 +83,8 @@ $container = get_theme_mod( 'understrap_container_type' );
</div><!-- .row --> </div><!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #error-404-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

22
CHANGELOG.md
View File

@ -1,3 +1,19 @@
- ** Release 0.8.9 December 28th 2018 **
- Update to Bootstrap 4.2.1
- Fix for #796 - thx @IanDelMar
- Add .editorconfig - thx @IanDelMar
- Clean up gulp file and package.json according to #853
- Conditionally add pingback - thx @IanDelMar
- Add mobile-web-app meta as action - thx @IanDelMar
- Fixing spacing and indentation on a lot of spots - thx @IanDelMar
- Update comments.php - thx @IanDelMar
- Update sidebar-statichero.php - thx @IanDelMar
- Update several .php files - thx @IanDelMar
- Fix dropdown when setting depth=0 in wp_nav_menu - thx @stevygee
- WooCommerce 3.5.2 update - thx @Fatshape
- Fix for issue #876 - thx @Noel Springer
- ** Release 0.8.8 November 1st 2018 ** - ** Release 0.8.8 November 1st 2018 **
- Refactor functions.php - Thx @ylkyrg - Refactor functions.php - Thx @ylkyrg
- Fix for #808 - Thx @VarunBatraIT - Fix for #808 - Thx @VarunBatraIT
@ -154,7 +170,7 @@
- Fixing colormap problem with beta 2 - Fixing colormap problem with beta 2
- Making navwalker function pluggable - Thx @bruceconlon - Making navwalker function pluggable - Thx @bruceconlon
- Adding WordPress title attribute - Thx @JDVirtual and @Thomas-A-Reinert - Adding WordPress title attribute - Thx @JDVirtual and @Thomas-A-Reinert
- Fixing comments in _theme_variable.scss - thx @ianwyllie - Fixing comments in theme_variable.scss - thx @ianwyllie
- Adding spaces the separate "posted on" and "edited" timestamps - Thx @bruceconlon - Adding spaces the separate "posted on" and "edited" timestamps - Thx @bruceconlon
@ -237,7 +253,7 @@
- Adding AJAX classes to add-to-cart buttons - thx @typeplus - Adding AJAX classes to add-to-cart buttons - thx @typeplus
- Updating Jetpack integration - Updating Jetpack integration
- Fixing "missing" h1 on frontpage problem - Fixing "missing" h1 on frontpage problem
- Updating inc/template-tags.php from _s - Updating inc/template-tags.php from s
- Fixing W3C validator issues - Fixing W3C validator issues
- Removing cleancss gulp task from cssnano task sequence due to performance issues - Removing cleancss gulp task from cssnano task sequence due to performance issues
@ -395,7 +411,7 @@
- ** 0.3.4 SEP. 9th 2015** - ** 0.3.4 SEP. 9th 2015**
- Adding basic WooCommerce support - Adding basic WooCommerce support
- Cleanup for submitting to wordpress.org - Cleanup for submitting to wordpress.org
- Removing _s SASS ... no need for basic styling. Thats Bootstrap´s job. - Removing s SASS ... no need for basic styling. Thats Bootstrap´s job.
- ** 0.3.1 AUG. 12th 2015** - ** 0.3.1 AUG. 12th 2015**

14
archive.php
View File

@ -12,10 +12,8 @@ if ( ! defined( 'ABSPATH' ) ) {
} }
get_header(); get_header();
?>
<?php $container = get_theme_mod( 'understrap_container_type' );
$container = get_theme_mod( 'understrap_container_type' );
?> ?>
<div class="wrapper" id="archive-wrapper"> <div class="wrapper" id="archive-wrapper">
@ -64,13 +62,13 @@ $container = get_theme_mod( 'understrap_container_type' );
<!-- The pagination component --> <!-- The pagination component -->
<?php understrap_pagination(); ?> <?php understrap_pagination(); ?>
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div> <!-- .row --> </div> <!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #archive-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

67
author.php
View File

@ -12,10 +12,9 @@ if ( ! defined( 'ABSPATH' ) ) {
} }
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
<div class="wrapper" id="author-wrapper"> <div class="wrapper" id="author-wrapper">
<div class="<?php echo esc_attr( $container ); ?>" id="content" tabindex="-1"> <div class="<?php echo esc_attr( $container ); ?>" id="content" tabindex="-1">
@ -30,32 +29,36 @@ $container = get_theme_mod( 'understrap_container_type' );
<header class="page-header author-header"> <header class="page-header author-header">
<?php <?php
$curauth = ( isset( $_GET['author_name'] ) ) ? get_user_by( 'slug', if ( isset( $_GET['author_name'] ) ) {
$author_name ) : get_userdata( intval( $author ) ); $curauth = get_user_by( 'slug', $author_name );
} else {
$curauth = get_userdata( intval( $author ) );
}
?> ?>
<h1><?php esc_html_e( 'About:', 'understrap' ); ?><?php echo esc_html( $curauth->nickname ); ?></h1> <h1><?php echo esc_html__( 'About:', 'understrap' ) . ' ' . esc_html( $curauth->nickname ); ?></h1>
<?php if ( ! empty( $curauth->ID ) ) : ?> <?php if ( ! empty( $curauth->ID ) ) : ?>
<?php echo get_avatar( $curauth->ID ); ?> <?php echo get_avatar( $curauth->ID ); ?>
<?php endif; ?> <?php endif; ?>
<dl> <?php if ( ! empty( $curauth->user_url ) || ! empty( $curauth->user_description ) ) : ?>
<?php if ( ! empty( $curauth->user_url ) ) : ?> <dl>
<dt><?php esc_html_e( 'Website', 'understrap' ); ?></dt> <?php if ( ! empty( $curauth->user_url ) ) : ?>
<dd> <dt><?php esc_html_e( 'Website', 'understrap' ); ?></dt>
<a href="<?php echo esc_url( $curauth->user_url ); ?>"><?php echo esc_html( $curauth->user_url ); ?></a> <dd>
</dd> <a href="<?php echo esc_url( $curauth->user_url ); ?>"><?php echo esc_html( $curauth->user_url ); ?></a>
<?php endif; ?> </dd>
<?php endif; ?>
<?php if ( ! empty( $curauth->user_description ) ) : ?> <?php if ( ! empty( $curauth->user_description ) ) : ?>
<dt><?php esc_html_e( 'Profile', 'understrap' ); ?></dt> <dt><?php esc_html_e( 'Profile', 'understrap' ); ?></dt>
<dd><?php echo esc_html( $curauth->user_description ); ?></dd> <dd><?php esc_html_e( $curauth->user_description ); ?></dd>
<?php endif; ?> <?php endif; ?>
</dl> </dl>
<?php endif; ?>
<h2><?php esc_html_e( 'Posts by', 'understrap' ); ?> <?php echo esc_html( $curauth->nickname ); ?> <h2><?php echo esc_html( 'Posts by', 'understrap' ) . ' ' . esc_html( $curauth->nickname ); ?>:</h2>
:</h2>
</header><!-- .page-header --> </header><!-- .page-header -->
@ -65,11 +68,17 @@ $container = get_theme_mod( 'understrap_container_type' );
<?php if ( have_posts() ) : ?> <?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?> <?php while ( have_posts() ) : the_post(); ?>
<li> <li>
<a rel="bookmark" href="<?php the_permalink() ?>" <?php
title="<?php esc_html_e( 'Permanent Link:', 'understrap' ); ?> <?php the_title(); ?>"> printf(
<?php the_title(); ?></a>, '<a rel="bookmark" href="%1$s" title="%2$s %3$s">%3$s</a>',
<?php understrap_posted_on(); ?> <?php esc_html_e( 'in', esc_url( apply_filters( 'the_permalink', get_permalink( $post ), $post ) ),
'understrap' ); ?> <?php the_category( '&' ); ?> esc_attr( __( 'Permanent Link:', 'understrap' ) ),
the_title( '', '', false )
);
?>
<?php understrap_posted_on(); ?>
<?php esc_html_e( 'in', 'understrap' ); ?>
<?php the_category( '&' ); ?>
</li> </li>
<?php endwhile; ?> <?php endwhile; ?>
@ -88,13 +97,13 @@ $container = get_theme_mod( 'understrap_container_type' );
<!-- The pagination component --> <!-- The pagination component -->
<?php understrap_pagination(); ?> <?php understrap_pagination(); ?>
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div> <!-- .row --> </div> <!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #author-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

4
bower.json
View File

@ -1,6 +1,6 @@
{ {
"name": "understrap", "name": "understrap",
"version": "0.8.8", "version": "0.8.9",
"homepage": "http://understrap.com", "homepage": "http://understrap.com",
"authors": [ "authors": [
"Holger Koenemann <office@holgerkoenemann.de>" "Holger Koenemann <office@holgerkoenemann.de>"
@ -26,6 +26,6 @@
"dependencies": { "dependencies": {
}, },
"_source": "https://github.com/holger1411/understrap.git", "_source": "https://github.com/holger1411/understrap.git",
"_target": "~0.8.8", "_target": "~0.8.9",
"_originalSource": "understrap" "_originalSource": "understrap"
} }

82
comments.php
View File

@ -31,27 +31,27 @@ if ( post_password_required() ) {
<h2 class="comments-title"> <h2 class="comments-title">
<?php <?php
$comments_number = get_comments_number(); $comments_number = get_comments_number();
if ( 1 === (int)$comments_number ) { if ( 1 === (int) $comments_number ) {
printf( printf(
/* translators: %s: post title */ /* translators: %s: post title */
esc_html_x( 'One thought on &ldquo;%s&rdquo;', 'comments title', 'understrap' ), esc_html_x( 'One thought on &ldquo;%s&rdquo;', 'comments title', 'understrap' ),
'<span>' . get_the_title() . '</span>' '<span>' . get_the_title() . '</span>'
); );
} else { } else {
printf( // WPCS: XSS OK. printf( // WPCS: XSS OK.
/* translators: 1: number of comments, 2: post title */ /* translators: 1: number of comments, 2: post title */
esc_html( _nx( esc_html( _nx(
'%1$s thought on &ldquo;%2$s&rdquo;', '%1$s thought on &ldquo;%2$s&rdquo;',
'%1$s thoughts on &ldquo;%2$s&rdquo;', '%1$s thoughts on &ldquo;%2$s&rdquo;',
$comments_number, $comments_number,
'comments title', 'comments title',
'understrap' 'understrap'
) ), ) ),
number_format_i18n( $comments_number ), number_format_i18n( $comments_number ),
'<span>' . get_the_title() . '</span>' '<span>' . get_the_title() . '</span>'
); );
} }
?> ?>
</h2><!-- .comments-title --> </h2><!-- .comments-title -->
@ -63,12 +63,15 @@ if ( post_password_required() ) {
<h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'understrap' ); ?></h1> <h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'understrap' ); ?></h1>
<?php if ( get_previous_comments_link() ) { ?> <?php if ( get_previous_comments_link() ) { ?>
<div class="nav-previous"><?php previous_comments_link( __( '&larr; Older Comments', <div class="nav-previous">
'understrap' ) ); ?></div> <?php previous_comments_link( __( '&larr; Older Comments', 'understrap' ) ); ?>
<?php } </div>
if ( get_next_comments_link() ) { ?> <?php } ?>
<div class="nav-next"><?php next_comments_link( __( 'Newer Comments &rarr;',
'understrap' ) ); ?></div> <?php if ( get_next_comments_link() ) { ?>
<div class="nav-next">
<?php next_comments_link( __( 'Newer Comments &rarr;', 'understrap' ) ); ?>
</div>
<?php } ?> <?php } ?>
</nav><!-- #comment-nav-above --> </nav><!-- #comment-nav-above -->
@ -78,10 +81,12 @@ if ( post_password_required() ) {
<ol class="comment-list"> <ol class="comment-list">
<?php <?php
wp_list_comments( array( wp_list_comments(
'style' => 'ol', array(
'short_ping' => true, 'style' => 'ol',
) ); 'short_ping' => true,
)
);
?> ?>
</ol><!-- .comment-list --> </ol><!-- .comment-list -->
@ -93,12 +98,15 @@ if ( post_password_required() ) {
<h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'understrap' ); ?></h1> <h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'understrap' ); ?></h1>
<?php if ( get_previous_comments_link() ) { ?> <?php if ( get_previous_comments_link() ) { ?>
<div class="nav-previous"><?php previous_comments_link( __( '&larr; Older Comments', <div class="nav-previous">
'understrap' ) ); ?></div> <?php previous_comments_link( __( '&larr; Older Comments', 'understrap' ) ); ?>
<?php } </div>
if ( get_next_comments_link() ) { ?> <?php } ?>
<div class="nav-next"><?php next_comments_link( __( 'Newer Comments &rarr;',
'understrap' ) ); ?></div> <?php if ( get_next_comments_link() ) { ?>
<div class="nav-next">
<?php next_comments_link( __( 'Newer Comments &rarr;', 'understrap' ) ); ?>
</div>
<?php } ?> <?php } ?>
</nav><!-- #comment-nav-below --> </nav><!-- #comment-nav-below -->

1325
css/theme.css
View File

File diff suppressed because one or more lines are too long

4
css/theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
css/theme.min.css.map
View File

File diff suppressed because one or more lines are too long

4
global-templates/left-sidebar-check.php
View File

@ -8,14 +8,12 @@
if ( ! defined( 'ABSPATH' ) ) { if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly. exit; // Exit if accessed directly.
} }
?>
<?php
$sidebar_pos = get_theme_mod( 'understrap_sidebar_position' ); $sidebar_pos = get_theme_mod( 'understrap_sidebar_position' );
?> ?>
<?php if ( 'left' === $sidebar_pos || 'both' === $sidebar_pos ) : ?> <?php if ( 'left' === $sidebar_pos || 'both' === $sidebar_pos ) : ?>
<?php get_template_part( 'sidebar-templates/sidebar', 'left' ); ?> <?php get_template_part( 'sidebar-templates/sidebar', 'left' ); ?>
<?php endif; ?> <?php endif; ?>
<div class="col-md content-area" id="primary"> <div class="col-md content-area" id="primary">

2
global-templates/right-sidebar-check.php
View File

@ -16,6 +16,6 @@ if ( ! defined( 'ABSPATH' ) ) {
<?php if ( 'right' === $sidebar_pos || 'both' === $sidebar_pos ) : ?> <?php if ( 'right' === $sidebar_pos || 'both' === $sidebar_pos ) : ?>
<?php get_template_part( 'sidebar-templates/sidebar', 'right' ); ?> <?php get_template_part( 'sidebar-templates/sidebar', 'right' ); ?>
<?php endif; ?> <?php endif; ?>

2
gulpfile.js
View File

@ -200,7 +200,7 @@ gulp.task( 'clean-vendor-assets', function() {
// gulp dist // gulp dist
// Copies the files to the /dist folder for distribution as simple theme // Copies the files to the /dist folder for distribution as simple theme
gulp.task( 'dist', ['clean-dist'], function() { gulp.task( 'dist', ['clean-dist'], function() {
return gulp.src( ['**/*', '!' + paths.bower, '!' + paths.bower + '/**', '!' + paths.node, '!' + paths.node + '/**', '!' + paths.dev, '!' + paths.dev + '/**', '!' + paths.dist, '!' + paths.dist + '/**', '!' + paths.distprod, '!' + paths.distprod + '/**', '!' + paths.sass, '!' + paths.sass + '/**', '!readme.txt', '!readme.md', '!package.json', '!package-lock.json', '!gulpfile.js', '!gulpconfig.json', '!CHANGELOG.md', '!.travis.yml', '!jshintignore', '!codesniffer.ruleset.xml', '*'], { 'buffer': false } ) return gulp.src( ['**/*', '!' + paths.bower, '!' + paths.bower + '/**', '!' + paths.node, '!' + paths.node + '/**', '!' + paths.dev, '!' + paths.dev + '/**', '!' + paths.dist, '!' + paths.dist + '/**', '!' + paths.distprod, '!' + paths.distprod + '/**', '!' + paths.sass, '!' + paths.sass + '/**', '!readme.txt', '!readme.md', '!package.json', '!package-lock.json', '!gulpfile.js', '!gulpconfig.json', '!CHANGELOG.md', '!.travis.yml', '!jshintignore', '!codesniffer.ruleset.xml', '*'], { 'buffer': true } )
.pipe( replace( '/js/jquery.slim.min.js', '/js' + paths.vendor + '/jquery.slim.min.js', { 'skipBinary': true } ) ) .pipe( replace( '/js/jquery.slim.min.js', '/js' + paths.vendor + '/jquery.slim.min.js', { 'skipBinary': true } ) )
.pipe( replace( '/js/popper.min.js', '/js' + paths.vendor + '/popper.min.js', { 'skipBinary': true } ) ) .pipe( replace( '/js/popper.min.js', '/js' + paths.vendor + '/popper.min.js', { 'skipBinary': true } ) )
.pipe( replace( '/js/skip-link-focus-fix.js', '/js' + paths.vendor + '/skip-link-focus-fix.js', { 'skipBinary': true } ) ) .pipe( replace( '/js/skip-link-focus-fix.js', '/js' + paths.vendor + '/skip-link-focus-fix.js', { 'skipBinary': true } ) )

6
header.php
View File

@ -18,11 +18,7 @@ $container = get_theme_mod( 'understrap_container_type' );
<head> <head>
<meta charset="<?php bloginfo( 'charset' ); ?>"> <meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="<?php bloginfo( 'name' ); ?> - <?php bloginfo( 'description' ); ?>">
<link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<?php wp_head(); ?> <?php wp_head(); ?>
</head> </head>
@ -38,7 +34,7 @@ $container = get_theme_mod( 'understrap_container_type' );
<nav class="navbar navbar-expand-md navbar-dark bg-primary"> <nav class="navbar navbar-expand-md navbar-dark bg-primary">
<?php if ( 'container' == $container ) : ?> <?php if ( 'container' == $container ) : ?>
<div class="container" > <div class="container">
<?php endif; ?> <?php endif; ?>
<!-- Your site title as branding in the menu --> <!-- Your site title as branding in the menu -->

2
inc/class-wp-bootstrap-navwalker.php
View File

@ -185,7 +185,7 @@ if ( ! class_exists( 'Understrap_WP_Bootstrap_Navwalker' ) ) {
$atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : '';
$atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : '';
// If item has_children add atts to <a>. // If item has_children add atts to <a>.
if ( isset( $args->has_children ) && $args->has_children && 0 === $depth && $args->depth > 1 ) { if ( isset( $args->has_children ) && $args->has_children && 0 === $depth && $args->depth !== 1 ) {
$atts['href'] = '#'; $atts['href'] = '#';
$atts['data-toggle'] = 'dropdown'; $atts['data-toggle'] = 'dropdown';
$atts['aria-haspopup'] = 'true'; $atts['aria-haspopup'] = 'true';

40
inc/custom-header.php
View File

@ -11,7 +11,7 @@ if ( ! defined( 'ABSPATH' ) ) {
add_action( 'after_setup_theme', 'understrap_custom_header_setup' ); add_action( 'after_setup_theme', 'understrap_custom_header_setup' );
if ( ! function_exists ( 'understrap_custom_header_setup' ) ) { if ( ! function_exists( 'understrap_custom_header_setup' ) ) {
function understrap_custom_header_setup() { function understrap_custom_header_setup() {
/** /**
@ -22,28 +22,36 @@ if ( ! function_exists ( 'understrap_custom_header_setup' ) ) {
* @param array $args { * @param array $args {
* An array of custom-header support arguments. * An array of custom-header support arguments.
* *
* @type string $default-image Default image of the header. * @type string $default-image Default image of the header.
* @type string $default_text_color Default color of the header text. * @type string $default_text_color Default color of the header text.
* @type int $width Width in pixels of the custom header image. Default 954. * @type int $width Width in pixels of the custom header image. Default 954.
* @type int $height Height in pixels of the custom header image. Default 1300. * @type int $height Height in pixels of the custom header image. Default 1300.
* @type string $wp-head-callback Callback function used to styles the header image and text * @type string $wp-head-callback Callback function used to styles the header image and text
* displayed on the blog. * displayed on the blog.
* @type string $flex-height Flex support for height of header. * @type string $flex-height Flex support for height of header.
* } * }
*/ */
add_theme_support( 'custom-header', apply_filters( 'understrap_custom_header_args', array( add_theme_support(
'default-image' => get_parent_theme_file_uri( '/img/header.jpg' ), 'custom-header',
'width' => 2000, apply_filters(
'height' => 1200, 'understrap_custom_header_args',
'flex-height' => true, array(
) ) ); 'default-image' => get_parent_theme_file_uri( '/img/header.jpg' ),
'width' => 2000,
'height' => 1200,
'flex-height' => true,
)
)
);
register_default_headers( array( register_default_headers(
'default-image' => array( array(
'url' => '%s/img/header.jpg', 'default-image' => array(
'thumbnail_url' => '%s/img/header.jpg', 'url' => '%s/img/header.jpg',
'description' => __( 'Default Header Image', 'understrap' ), 'thumbnail_url' => '%s/img/header.jpg',
), 'description' => __( 'Default Header Image', 'understrap' ),
) ); ),
)
);
} }
} }

99
inc/customizer.php
View File

@ -37,12 +37,15 @@ if ( ! function_exists( 'understrap_theme_customize_register' ) ) {
function understrap_theme_customize_register( $wp_customize ) { function understrap_theme_customize_register( $wp_customize ) {
// Theme layout settings. // Theme layout settings.
$wp_customize->add_section( 'understrap_theme_layout_options', array( $wp_customize->add_section(
'title' => __( 'Theme Layout Settings', 'understrap' ), 'understrap_theme_layout_options',
'capability' => 'edit_theme_options', array(
'description' => __( 'Container width and sidebar defaults', 'understrap' ), 'title' => __( 'Theme Layout Settings', 'understrap' ),
'priority' => 160, 'capability' => 'edit_theme_options',
) ); 'description' => __( 'Container width and sidebar defaults', 'understrap' ),
'priority' => 160,
)
);
/** /**
* Select sanitization function * Select sanitization function
@ -51,30 +54,34 @@ if ( ! function_exists( 'understrap_theme_customize_register' ) ) {
* @param WP_Customize_Setting $setting Setting instance. * @param WP_Customize_Setting $setting Setting instance.
* @return string Sanitized slug if it is a valid choice; otherwise, the setting default. * @return string Sanitized slug if it is a valid choice; otherwise, the setting default.
*/ */
function understrap_theme_slug_sanitize_select( $input, $setting ){ function understrap_theme_slug_sanitize_select( $input, $setting ) {
// Ensure input is a slug (lowercase alphanumeric characters, dashes and underscores are allowed only). // Ensure input is a slug (lowercase alphanumeric characters, dashes and underscores are allowed only).
$input = sanitize_key( $input ); $input = sanitize_key( $input );
// Get the list of possible select options. // Get the list of possible select options.
$choices = $setting->manager->get_control( $setting->id )->choices; $choices = $setting->manager->get_control( $setting->id )->choices;
// If the input is a valid key, return it; otherwise, return the default. // If the input is a valid key, return it; otherwise, return the default.
return ( array_key_exists( $input, $choices ) ? $input : $setting->default ); return ( array_key_exists( $input, $choices ) ? $input : $setting->default );
} }
$wp_customize->add_setting( 'understrap_container_type', array( $wp_customize->add_setting(
'default' => 'container', 'understrap_container_type',
'type' => 'theme_mod', array(
'sanitize_callback' => 'understrap_theme_slug_sanitize_select', 'default' => 'container',
'capability' => 'edit_theme_options', 'type' => 'theme_mod',
) ); 'sanitize_callback' => 'understrap_theme_slug_sanitize_select',
'capability' => 'edit_theme_options',
)
);
$wp_customize->add_control( $wp_customize->add_control(
new WP_Customize_Control( new WP_Customize_Control(
$wp_customize, $wp_customize,
'understrap_container_type', array( 'understrap_container_type',
array(
'label' => __( 'Container Width', 'understrap' ), 'label' => __( 'Container Width', 'understrap' ),
'description' => __( 'Choose between Bootstrap\'s container and container-fluid', 'understrap' ), 'description' => __( 'Choose between Bootstrap\'s container and container-fluid', 'understrap' ),
'section' => 'understrap_theme_layout_options', 'section' => 'understrap_theme_layout_options',
@ -86,35 +93,43 @@ if ( ! function_exists( 'understrap_theme_customize_register' ) ) {
), ),
'priority' => '10', 'priority' => '10',
) )
) ); )
);
$wp_customize->add_setting( 'understrap_sidebar_position', array( $wp_customize->add_setting(
'default' => 'right', 'understrap_sidebar_position',
'type' => 'theme_mod', array(
'sanitize_callback' => 'sanitize_text_field', 'default' => 'right',
'capability' => 'edit_theme_options', 'type' => 'theme_mod',
) ); 'sanitize_callback' => 'sanitize_text_field',
'capability' => 'edit_theme_options',
)
);
$wp_customize->add_control( $wp_customize->add_control(
new WP_Customize_Control( new WP_Customize_Control(
$wp_customize, $wp_customize,
'understrap_sidebar_position', array( 'understrap_sidebar_position',
'label' => __( 'Sidebar Positioning', 'understrap' ), array(
'description' => __( 'Set sidebar\'s default position. Can either be: right, left, both or none. Note: this can be overridden on individual pages.', 'label' => __( 'Sidebar Positioning', 'understrap' ),
'understrap' ), 'description' => __(
'section' => 'understrap_theme_layout_options', 'Set sidebar\'s default position. Can either be: right, left, both or none. Note: this can be overridden on individual pages.',
'settings' => 'understrap_sidebar_position', 'understrap'
'type' => 'select', ),
'section' => 'understrap_theme_layout_options',
'settings' => 'understrap_sidebar_position',
'type' => 'select',
'sanitize_callback' => 'understrap_theme_slug_sanitize_select', 'sanitize_callback' => 'understrap_theme_slug_sanitize_select',
'choices' => array( 'choices' => array(
'right' => __( 'Right sidebar', 'understrap' ), 'right' => __( 'Right sidebar', 'understrap' ),
'left' => __( 'Left sidebar', 'understrap' ), 'left' => __( 'Left sidebar', 'understrap' ),
'both' => __( 'Left & Right sidebars', 'understrap' ), 'both' => __( 'Left & Right sidebars', 'understrap' ),
'none' => __( 'No sidebar', 'understrap' ), 'none' => __( 'No sidebar', 'understrap' ),
), ),
'priority' => '20', 'priority' => '20',
) )
) ); )
);
} }
} // endif function_exists( 'understrap_theme_customize_register' ). } // endif function_exists( 'understrap_theme_customize_register' ).
add_action( 'customize_register', 'understrap_theme_customize_register' ); add_action( 'customize_register', 'understrap_theme_customize_register' );
@ -127,8 +142,12 @@ if ( ! function_exists( 'understrap_customize_preview_js' ) ) {
* Setup JS integration for live previewing. * Setup JS integration for live previewing.
*/ */
function understrap_customize_preview_js() { function understrap_customize_preview_js() {
wp_enqueue_script( 'understrap_customizer', get_template_directory_uri() . '/js/customizer.js', wp_enqueue_script(
array( 'customize-preview' ), '20130508', true 'understrap_customizer',
get_template_directory_uri() . '/js/customizer.js',
array( 'customize-preview' ),
'20130508',
true
); );
} }
} }

92
inc/editor.php
View File

@ -15,64 +15,64 @@ if ( ! defined( 'ABSPATH' ) ) {
add_action( 'admin_init', 'understrap_wpdocs_theme_add_editor_styles' ); add_action( 'admin_init', 'understrap_wpdocs_theme_add_editor_styles' );
if ( ! function_exists ( 'understrap_wpdocs_theme_add_editor_styles' ) ) { if ( ! function_exists( 'understrap_wpdocs_theme_add_editor_styles' ) ) {
function understrap_wpdocs_theme_add_editor_styles() { function understrap_wpdocs_theme_add_editor_styles() {
add_editor_style( 'css/custom-editor-style.min.css' ); add_editor_style( 'css/custom-editor-style.min.css' );
} }
} }
// Add TinyMCE style formats. // Add TinyMCE style formats.
add_filter( 'mce_buttons_2', 'understrap_tiny_mce_style_formats' ); add_filter( 'mce_buttons_2', 'understrap_tiny_mce_style_formats' );
if ( ! function_exists ( 'understrap_tiny_mce_style_formats' ) ) { if ( ! function_exists( 'understrap_tiny_mce_style_formats' ) ) {
function understrap_tiny_mce_style_formats( $styles ) { function understrap_tiny_mce_style_formats( $styles ) {
array_unshift( $styles, 'styleselect' ); array_unshift( $styles, 'styleselect' );
return $styles; return $styles;
} }
} }
add_filter( 'tiny_mce_before_init', 'understrap_tiny_mce_before_init' ); add_filter( 'tiny_mce_before_init', 'understrap_tiny_mce_before_init' );
if ( ! function_exists ( 'understrap_tiny_mce_before_init' ) ) { if ( ! function_exists( 'understrap_tiny_mce_before_init' ) ) {
function understrap_tiny_mce_before_init( $settings ) { function understrap_tiny_mce_before_init( $settings ) {
$style_formats = array( $style_formats = array(
array( array(
'title' => 'Lead Paragraph', 'title' => 'Lead Paragraph',
'selector' => 'p', 'selector' => 'p',
'classes' => 'lead', 'classes' => 'lead',
'wrapper' => true 'wrapper' => true,
), ),
array( array(
'title' => 'Small', 'title' => 'Small',
'inline' => 'small' 'inline' => 'small',
), ),
array( array(
'title' => 'Blockquote', 'title' => 'Blockquote',
'block' => 'blockquote', 'block' => 'blockquote',
'classes' => 'blockquote', 'classes' => 'blockquote',
'wrapper' => true 'wrapper' => true,
), ),
array( array(
'title' => 'Blockquote Footer', 'title' => 'Blockquote Footer',
'block' => 'footer', 'block' => 'footer',
'classes' => 'blockquote-footer', 'classes' => 'blockquote-footer',
'wrapper' => true 'wrapper' => true,
), ),
array( array(
'title' => 'Cite', 'title' => 'Cite',
'inline' => 'cite' 'inline' => 'cite',
) ),
); );
if ( isset( $settings['style_formats'] ) ) { if ( isset( $settings['style_formats'] ) ) {
$orig_style_formats = json_decode($settings['style_formats'],true); $orig_style_formats = json_decode( $settings['style_formats'], true );
$style_formats = array_merge($orig_style_formats,$style_formats); $style_formats = array_merge( $orig_style_formats, $style_formats );
} }
$settings['style_formats'] = json_encode( $style_formats ); $settings['style_formats'] = json_encode( $style_formats );
return $settings; return $settings;
} }
} }

8
inc/enqueue.php
View File

@ -15,15 +15,15 @@ if ( ! function_exists( 'understrap_scripts' ) ) {
*/ */
function understrap_scripts() { function understrap_scripts() {
// Get the theme data. // Get the theme data.
$the_theme = wp_get_theme(); $the_theme = wp_get_theme();
$theme_version = $the_theme->get( 'Version' ); $theme_version = $the_theme->get( 'Version' );
$css_version = $theme_version . '.' . filemtime(get_template_directory() . '/css/theme.min.css'); $css_version = $theme_version . '.' . filemtime( get_template_directory() . '/css/theme.min.css' );
wp_enqueue_style( 'understrap-styles', get_stylesheet_directory_uri() . '/css/theme.min.css', array(), $css_version ); wp_enqueue_style( 'understrap-styles', get_stylesheet_directory_uri() . '/css/theme.min.css', array(), $css_version );
wp_enqueue_script( 'jquery'); wp_enqueue_script( 'jquery' );
$js_version = $theme_version . '.' . filemtime(get_template_directory() . '/js/theme.min.js'); $js_version = $theme_version . '.' . filemtime( get_template_directory() . '/js/theme.min.js' );
wp_enqueue_script( 'understrap-scripts', get_template_directory_uri() . '/js/theme.min.js', array(), $js_version, true ); wp_enqueue_script( 'understrap-scripts', get_template_directory_uri() . '/js/theme.min.js', array(), $js_version, true );
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' ); wp_enqueue_script( 'comment-reply' );

50
inc/extras.php
View File

@ -74,7 +74,7 @@ if ( ! function_exists( 'understrap_change_logo_class' ) ) {
$html = str_replace( 'class="custom-logo"', 'class="img-fluid"', $html ); $html = str_replace( 'class="custom-logo"', 'class="img-fluid"', $html );
$html = str_replace( 'class="custom-logo-link"', 'class="navbar-brand custom-logo-link"', $html ); $html = str_replace( 'class="custom-logo-link"', 'class="navbar-brand custom-logo-link"', $html );
$html = str_replace( 'alt=""', 'title="Home" alt="logo"' , $html ); $html = str_replace( 'alt=""', 'title="Home" alt="logo"', $html );
return $html; return $html;
} }
@ -94,21 +94,39 @@ if ( ! function_exists ( 'understrap_post_nav' ) ) {
return; return;
} }
?> ?>
<nav class="container navigation post-navigation"> <nav class="container navigation post-navigation">
<h2 class="sr-only"><?php _e( 'Post navigation', 'understrap' ); ?></h2> <h2 class="sr-only"><?php esc_html_e( 'Post navigation', 'understrap' ); ?></h2>
<div class="row nav-links justify-content-between"> <div class="row nav-links justify-content-between">
<?php <?php
if ( get_previous_post_link() ) {
if ( get_previous_post_link() ) { previous_post_link( '<span class="nav-previous">%link</span>', _x( '<i class="fa fa-angle-left"></i>&nbsp;%title', 'Previous post link', 'understrap' ) );
previous_post_link( '<span class="nav-previous">%link</span>', _x( '<i class="fa fa-angle-left"></i>&nbsp;%title', 'Previous post link', 'understrap' ) ); }
} if ( get_next_post_link() ) {
if ( get_next_post_link() ) { next_post_link( '<span class="nav-next">%link</span>', _x( '%title&nbsp;<i class="fa fa-angle-right"></i>', 'Next post link', 'understrap' ) );
next_post_link( '<span class="nav-next">%link</span>', _x( '%title&nbsp;<i class="fa fa-angle-right"></i>', 'Next post link', 'understrap' ) ); }
} ?>
?> </div><!-- .nav-links -->
</div><!-- .nav-links --> </nav><!-- .navigation -->
</nav><!-- .navigation -->
<?php <?php
} }
} }
/**
* Add a pingback url auto-discovery header for single posts of any post type.
*/
function understrap_pingback() {
if ( is_singular() && pings_open() ) {
echo '<link rel="pingback" href="' . esc_url( get_bloginfo( 'pingback_url' ) ) . '">' . "\n";
}
}
add_action( 'wp_head', 'understrap_pingback' );
/**
* Add mobile-web-app meta.
*/
function understrap_mobile_web_app_meta() {
echo '<meta name="mobile-web-app-capable" content="yes">' . "\n";
echo '<meta name="apple-mobile-web-app-capable" content="yes">' . "\n";
echo '<meta name="apple-mobile-web-app-title" content="' . esc_attr( get_bloginfo( 'name' ) ) . ' - ' . esc_attr( get_bloginfo( 'description' ) ) . '">' . "\n";
}
add_action( 'wp_head', 'understrap_mobile_web_app_meta' );

64
inc/hooks.php
View File

@ -10,40 +10,44 @@ if ( ! defined( 'ABSPATH' ) ) {
} }
if ( ! function_exists( 'understrap_site_info' ) ) { if ( ! function_exists( 'understrap_site_info' ) ) {
/** /**
* Add site info hook to WP hook library. * Add site info hook to WP hook library.
*/ */
function understrap_site_info() { function understrap_site_info() {
do_action( 'understrap_site_info' ); do_action( 'understrap_site_info' );
} }
} }
if ( ! function_exists( 'understrap_add_site_info' ) ) { if ( ! function_exists( 'understrap_add_site_info' ) ) {
add_action( 'understrap_site_info', 'understrap_add_site_info' ); add_action( 'understrap_site_info', 'understrap_add_site_info' );
/** /**
* Add site info content. * Add site info content.
*/ */
function understrap_add_site_info() { function understrap_add_site_info() {
$the_theme = wp_get_theme(); $the_theme = wp_get_theme();
$site_info = sprintf( $site_info = sprintf(
'<a href="%1$s">%2$s</a><span class="sep"> | </span>%3$s(%4$s)', '<a href="%1$s">%2$s</a><span class="sep"> | </span>%3$s(%4$s)',
esc_url( __( 'http://wordpress.org/', 'understrap' ) ), esc_url( __( 'http://wordpress.org/', 'understrap' ) ),
sprintf( sprintf(
/* translators:*/ /* translators:*/
esc_html__( 'Proudly powered by %s', 'understrap' ), 'WordPress' esc_html__( 'Proudly powered by %s', 'understrap' ),
), 'WordPress'
sprintf( // WPCS: XSS ok. ),
/* translators:*/ sprintf( // WPCS: XSS ok.
esc_html__( 'Theme: %1$s by %2$s.', 'understrap' ), $the_theme->get( 'Name' ), '<a href="' . esc_url( __( 'http://understrap.com', 'understrap' ) ) . '">understrap.com</a>' /* translators:*/
), esc_html__( 'Theme: %1$s by %2$s.', 'understrap' ),
sprintf( // WPCS: XSS ok. $the_theme->get( 'Name' ),
/* translators:*/ '<a href="' . esc_url( __( 'http://understrap.com', 'understrap' ) ) . '">understrap.com</a>'
esc_html__( 'Version: %1$s', 'understrap' ), $the_theme->get( 'Version' ) ),
) sprintf( // WPCS: XSS ok.
); /* translators:*/
esc_html__( 'Version: %1$s', 'understrap' ),
$the_theme->get( 'Version' )
)
);
echo apply_filters( 'understrap_site_info_content', $site_info ); // WPCS: XSS ok. echo apply_filters( 'understrap_site_info_content', $site_info ); // WPCS: XSS ok.
} }
} }

19
inc/jetpack.php
View File

@ -20,14 +20,17 @@ if ( ! defined( 'ABSPATH' ) ) {
add_action( 'after_setup_theme', 'understrap_components_jetpack_setup' ); add_action( 'after_setup_theme', 'understrap_components_jetpack_setup' );
if ( ! function_exists ( 'understrap_components_jetpack_setup' ) ) { if ( ! function_exists( 'understrap_components_jetpack_setup' ) ) {
function understrap_components_jetpack_setup() { function understrap_components_jetpack_setup() {
// Add theme support for Infinite Scroll. // Add theme support for Infinite Scroll.
add_theme_support( 'infinite-scroll', array( add_theme_support(
'container' => 'main', 'infinite-scroll',
'render' => 'understrap_components_infinite_scroll_render', array(
'footer' => 'page', 'container' => 'main',
) ); 'render' => 'understrap_components_infinite_scroll_render',
'footer' => 'page',
)
);
// Add theme support for Responsive Videos. // Add theme support for Responsive Videos.
add_theme_support( 'jetpack-responsive-videos' ); add_theme_support( 'jetpack-responsive-videos' );
@ -43,7 +46,7 @@ if ( ! function_exists ( 'understrap_components_jetpack_setup' ) ) {
* Custom render function for Infinite Scroll. * Custom render function for Infinite Scroll.
*/ */
if ( ! function_exists ( 'understrap_components_infinite_scroll_render' ) ) { if ( ! function_exists( 'understrap_components_infinite_scroll_render' ) ) {
function understrap_components_infinite_scroll_render() { function understrap_components_infinite_scroll_render() {
while ( have_posts() ) { while ( have_posts() ) {
the_post(); the_post();
@ -56,7 +59,7 @@ if ( ! function_exists ( 'understrap_components_infinite_scroll_render' ) ) {
} }
} }
if ( ! function_exists ( 'understrap_components_social_menu' ) ) { if ( ! function_exists( 'understrap_components_social_menu' ) ) {
function understrap_components_social_menu() { function understrap_components_social_menu() {
if ( ! function_exists( 'jetpack_social_menu' ) ) { if ( ! function_exists( 'jetpack_social_menu' ) ) {
return; return;

63
inc/pagination.php
View File

@ -9,48 +9,51 @@ if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly. exit; // Exit if accessed directly.
} }
if ( ! function_exists ( 'understrap_pagination' ) ) { if ( ! function_exists( 'understrap_pagination' ) ) {
function understrap_pagination( $args = array(), $class = 'pagination' ) { function understrap_pagination( $args = array(), $class = 'pagination' ) {
if ($GLOBALS['wp_query']->max_num_pages <= 1) return; if ( $GLOBALS['wp_query']->max_num_pages <= 1 ) {
return;
}
$args = wp_parse_args( $args, array( $args = wp_parse_args(
'mid_size' => 2, $args,
'prev_next' => true, array(
'prev_text' => __('&laquo;', 'understrap'), 'mid_size' => 2,
'next_text' => __('&raquo;', 'understrap'), 'prev_next' => true,
'screen_reader_text' => __('Posts navigation', 'understrap'), 'prev_text' => __( '&laquo;', 'understrap' ),
'type' => 'array', 'next_text' => __( '&raquo;', 'understrap' ),
'current' => max( 1, get_query_var('paged') ), 'screen_reader_text' => __( 'Posts navigation', 'understrap' ),
) ); 'type' => 'array',
'current' => max( 1, get_query_var( 'paged' ) ),
)
);
$links = paginate_links($args); $links = paginate_links( $args );
?> ?>
<nav aria-label="<?php echo $args['screen_reader_text']; ?>"> <nav aria-label="<?php echo $args['screen_reader_text']; ?>">
<ul class="pagination"> <ul class="pagination">
<?php <?php
foreach ( $links as $key => $link ) {
?>
<li class="page-item <?php echo strpos( $link, 'current' ) ? 'active' : ''; ?>">
<?php echo str_replace( 'page-numbers', 'page-link', $link ); ?>
</li>
<?php
}
?>
foreach ( $links as $key => $link ) { ?> </ul>
<li class="page-item <?php echo strpos( $link, 'current' ) ? 'active' : '' ?>"> </nav>
<?php echo str_replace( 'page-numbers', 'page-link', $link ); ?> <?php
}
</li>
<?php } ?>
</ul>
</nav>
<?php
}
} }
?> ?>

8
inc/template-tags.php
View File

@ -14,7 +14,7 @@ if ( ! defined( 'ABSPATH' ) ) {
/** /**
* Prints HTML with meta information for the current post-date/time and author. * Prints HTML with meta information for the current post-date/time and author.
*/ */
if ( ! function_exists ( 'understrap_posted_on' ) ) { if ( ! function_exists( 'understrap_posted_on' ) ) {
function understrap_posted_on() { function understrap_posted_on() {
$time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>'; $time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>';
if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) { if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
@ -50,7 +50,7 @@ if ( ! function_exists ( 'understrap_posted_on' ) ) {
/** /**
* Prints HTML with meta information for the categories, tags and comments. * Prints HTML with meta information for the categories, tags and comments.
*/ */
if ( ! function_exists ( 'understrap_entry_footer' ) ) { if ( ! function_exists( 'understrap_entry_footer' ) ) {
function understrap_entry_footer() { function understrap_entry_footer() {
// Hide category and tag text for pages. // Hide category and tag text for pages.
if ( 'post' === get_post_type() ) { if ( 'post' === get_post_type() ) {
@ -90,7 +90,7 @@ if ( ! function_exists ( 'understrap_entry_footer' ) ) {
* *
* @return bool * @return bool
*/ */
if ( ! function_exists ( 'understrap_categorized_blog' ) ) { if ( ! function_exists( 'understrap_categorized_blog' ) ) {
function understrap_categorized_blog() { function understrap_categorized_blog() {
if ( false === ( $all_the_cool_cats = get_transient( 'understrap_categories' ) ) ) { if ( false === ( $all_the_cool_cats = get_transient( 'understrap_categories' ) ) ) {
// Create an array of all the categories that are attached to posts. // Create an array of all the categories that are attached to posts.
@ -121,7 +121,7 @@ if ( ! function_exists ( 'understrap_categorized_blog' ) ) {
add_action( 'edit_category', 'understrap_category_transient_flusher' ); add_action( 'edit_category', 'understrap_category_transient_flusher' );
add_action( 'save_post', 'understrap_category_transient_flusher' ); add_action( 'save_post', 'understrap_category_transient_flusher' );
if ( ! function_exists ( 'understrap_category_transient_flusher' ) ) { if ( ! function_exists( 'understrap_category_transient_flusher' ) ) {
function understrap_category_transient_flusher() { function understrap_category_transient_flusher() {
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) { if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
return; return;

3
inc/theme-settings.php
View File

@ -3,14 +3,13 @@
* Check and setup theme's default settings * Check and setup theme's default settings
* *
* @package understrap * @package understrap
*
*/ */
if ( ! defined( 'ABSPATH' ) ) { if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly. exit; // Exit if accessed directly.
} }
if ( ! function_exists ( 'understrap_setup_theme_default_settings' ) ) { if ( ! function_exists( 'understrap_setup_theme_default_settings' ) ) {
function understrap_setup_theme_default_settings() { function understrap_setup_theme_default_settings() {
// check if settings are set, if not set defaults. // check if settings are set, if not set defaults.

52
inc/woocommerce.php
View File

@ -17,7 +17,7 @@ if ( ! function_exists( 'understrap_woocommerce_support' ) ) {
function understrap_woocommerce_support() { function understrap_woocommerce_support() {
add_theme_support( 'woocommerce' ); add_theme_support( 'woocommerce' );
// Add New Woocommerce 3.0.0 Product Gallery support // Add New Woocommerce 3.0.0 Product Gallery support.
add_theme_support( 'wc-product-gallery-lightbox' ); add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-zoom' ); add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-slider' ); add_theme_support( 'wc-product-gallery-slider' );
@ -30,31 +30,31 @@ if ( ! function_exists( 'understrap_woocommerce_support' ) ) {
/** /**
* First unhook the WooCommerce wrappers * First unhook the WooCommerce wrappers
*/ */
remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10); remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10 );
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10); remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10 );
/** /**
* Then hook in your own functions to display the wrappers your theme requires * Then hook in your own functions to display the wrappers your theme requires
*/ */
add_action('woocommerce_before_main_content', 'understrap_woocommerce_wrapper_start', 10); add_action( 'woocommerce_before_main_content', 'understrap_woocommerce_wrapper_start', 10 );
add_action('woocommerce_after_main_content', 'understrap_woocommerce_wrapper_end', 10); add_action( 'woocommerce_after_main_content', 'understrap_woocommerce_wrapper_end', 10 );
if ( ! function_exists( 'understrap_woocommerce_wrapper_start' ) ) { if ( ! function_exists( 'understrap_woocommerce_wrapper_start' ) ) {
function understrap_woocommerce_wrapper_start() { function understrap_woocommerce_wrapper_start() {
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
echo '<div class="wrapper" id="woocommerce-wrapper">'; echo '<div class="wrapper" id="woocommerce-wrapper">';
echo '<div class="' . esc_attr( $container ) . '" id="content" tabindex="-1">'; echo '<div class="' . esc_attr( $container ) . '" id="content" tabindex="-1">';
echo '<div class="row">'; echo '<div class="row">';
get_template_part( 'global-templates/left-sidebar-check' ); get_template_part( 'global-templates/left-sidebar-check' );
echo '<main class="site-main" id="main">'; echo '<main class="site-main" id="main">';
} }
} }
if ( ! function_exists( 'understrap_woocommerce_wrapper_end' ) ) { if ( ! function_exists( 'understrap_woocommerce_wrapper_end' ) ) {
function understrap_woocommerce_wrapper_end() { function understrap_woocommerce_wrapper_end() {
echo '</main><!-- #main -->'; echo '</main><!-- #main -->';
get_template_part( 'global-templates/right-sidebar-check' ); get_template_part( 'global-templates/right-sidebar-check' );
echo '</div><!-- .row -->'; echo '</div><!-- .row -->';
echo '</div><!-- Container end -->'; echo '</div><!-- Container end -->';
echo '</div><!-- Wrapper end -->'; echo '</div><!-- Wrapper end -->';
} }
} }
@ -69,12 +69,12 @@ function understrap_woocommerce_wrapper_end() {
* *
* @return mixed * @return mixed
*/ */
if ( ! function_exists ( 'understrap_wc_form_field_args' ) ) { if ( ! function_exists( 'understrap_wc_form_field_args' ) ) {
function understrap_wc_form_field_args( $args, $key, $value = null ) { function understrap_wc_form_field_args( $args, $key, $value = null ) {
// Start field type switch case. // Start field type switch case.
switch ( $args['type'] ) { switch ( $args['type'] ) {
/* Targets all select input type elements, except the country and state select input types */ /* Targets all select input type elements, except the country and state select input types */
case 'select' : case 'select':
// Add a class to the field's html element wrapper - woocommerce // Add a class to the field's html element wrapper - woocommerce
// input types (fields) are often wrapped within a <p></p> tag. // input types (fields) are often wrapped within a <p></p> tag.
$args['class'][] = 'form-group'; $args['class'][] = 'form-group';
@ -90,13 +90,13 @@ if ( ! function_exists ( 'understrap_wc_form_field_args' ) ) {
break; break;
// By default WooCommerce will populate a select with the country names - $args // By default WooCommerce will populate a select with the country names - $args
// defined for this specific input type targets only the country select element. // defined for this specific input type targets only the country select element.
case 'country' : case 'country':
$args['class'][] = 'form-group single-country'; $args['class'][] = 'form-group single-country';
$args['label_class'] = array( 'control-label' ); $args['label_class'] = array( 'control-label' );
break; break;
// By default WooCommerce will populate a select with state names - $args defined // By default WooCommerce will populate a select with state names - $args defined
// for this specific input type targets only the country select element. // for this specific input type targets only the country select element.
case 'state' : case 'state':
// Add class to the field's html element wrapper. // Add class to the field's html element wrapper.
$args['class'][] = 'form-group'; $args['class'][] = 'form-group';
// add class to the form input itself. // add class to the form input itself.
@ -108,28 +108,28 @@ if ( ! function_exists ( 'understrap_wc_form_field_args' ) ) {
'aria-hidden' => 'true', 'aria-hidden' => 'true',
); );
break; break;
case 'password' : case 'password':
case 'text' : case 'text':
case 'email' : case 'email':
case 'tel' : case 'tel':
case 'number' : case 'number':
$args['class'][] = 'form-group'; $args['class'][] = 'form-group';
$args['input_class'] = array( 'form-control', 'input-lg' ); $args['input_class'] = array( 'form-control', 'input-lg' );
$args['label_class'] = array( 'control-label' ); $args['label_class'] = array( 'control-label' );
break; break;
case 'textarea' : case 'textarea':
$args['input_class'] = array( 'form-control', 'input-lg' ); $args['input_class'] = array( 'form-control', 'input-lg' );
$args['label_class'] = array( 'control-label' ); $args['label_class'] = array( 'control-label' );
break; break;
case 'checkbox' : case 'checkbox':
$args['label_class'] = array( 'custom-control custom-checkbox' ); $args['label_class'] = array( 'custom-control custom-checkbox' );
$args['input_class'] = array( 'custom-control-input', 'input-lg' ); $args['input_class'] = array( 'custom-control-input', 'input-lg' );
break; break;
case 'radio' : case 'radio':
$args['label_class'] = array( 'custom-control custom-radio' ); $args['label_class'] = array( 'custom-control custom-radio' );
$args['input_class'] = array( 'custom-control-input', 'input-lg' ); $args['input_class'] = array( 'custom-control-input', 'input-lg' );
break; break;
default : default:
$args['class'][] = 'form-group'; $args['class'][] = 'form-group';
$args['input_class'] = array( 'form-control', 'input-lg' ); $args['input_class'] = array( 'form-control', 'input-lg' );
$args['label_class'] = array( 'control-label' ); $args['label_class'] = array( 'control-label' );

4
inc/wpcom.php
View File

@ -18,7 +18,7 @@ if ( ! defined( 'ABSPATH' ) ) {
*/ */
add_action( 'after_setup_theme', 'understrap_wpcom_setup' ); add_action( 'after_setup_theme', 'understrap_wpcom_setup' );
if ( ! function_exists ( 'understrap_wpcom_setup' ) ) { if ( ! function_exists( 'understrap_wpcom_setup' ) ) {
function understrap_wpcom_setup() { function understrap_wpcom_setup() {
global $themecolors; global $themecolors;
@ -44,7 +44,7 @@ if ( ! function_exists ( 'understrap_wpcom_setup' ) ) {
*/ */
add_action( 'wp_enqueue_scripts', 'understrap_wpcom_styles' ); add_action( 'wp_enqueue_scripts', 'understrap_wpcom_styles' );
if ( ! function_exists ( 'understrap_wpcom_styles' ) ) { if ( ! function_exists( 'understrap_wpcom_styles' ) ) {
function understrap_wpcom_styles() { function understrap_wpcom_styles() {
wp_enqueue_style( 'understrap-wpcom', get_template_directory_uri() . '/inc/style-wpcom.css', array(), '20160411' ); wp_enqueue_style( 'understrap-wpcom', get_template_directory_uri() . '/inc/style-wpcom.css', array(), '20160411' );
} }

13
index.php
View File

@ -17,7 +17,7 @@ if ( ! defined( 'ABSPATH' ) ) {
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
<?php if ( is_front_page() && is_home() ) : ?> <?php if ( is_front_page() && is_home() ) : ?>
@ -64,14 +64,13 @@ $container = get_theme_mod( 'understrap_container_type' );
<!-- The pagination component --> <!-- The pagination component -->
<?php understrap_pagination(); ?> <?php understrap_pagination(); ?>
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div><!-- .row -->
</div><!-- .row --> </div><!-- #content -->
</div><!-- Container end --> </div><!-- #index-wrapper -->
</div><!-- Wrapper end -->
<?php get_footer(); ?> <?php get_footer(); ?>

7759
js/theme.js
View File

File diff suppressed because it is too large Load Diff

2
js/theme.min.js vendored
View File

File diff suppressed because one or more lines are too long

10
loop-templates/content-page.php
View File

@ -25,10 +25,12 @@ if ( ! defined( 'ABSPATH' ) ) {
<?php the_content(); ?> <?php the_content(); ?>
<?php <?php
wp_link_pages( array( wp_link_pages(
'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ), array(
'after' => '</div>', 'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ),
) ); 'after' => '</div>',
)
);
?> ?>
</div><!-- .entry-content --> </div><!-- .entry-content -->

8
loop-templates/content-search.php
View File

@ -14,8 +14,12 @@ if ( ! defined( 'ABSPATH' ) ) {
<header class="entry-header"> <header class="entry-header">
<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), <?php
'</a></h2>' ); ?> the_title(
sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ),
'</a></h2>'
);
?>
<?php if ( 'post' == get_post_type() ) : ?> <?php if ( 'post' == get_post_type() ) : ?>

10
loop-templates/content-single.php
View File

@ -31,10 +31,12 @@ if ( ! defined( 'ABSPATH' ) ) {
<?php the_content(); ?> <?php the_content(); ?>
<?php <?php
wp_link_pages( array( wp_link_pages(
'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ), array(
'after' => '</div>', 'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ),
) ); 'after' => '</div>',
)
);
?> ?>
</div><!-- .entry-content --> </div><!-- .entry-content -->

22
loop-templates/content.php
View File

@ -14,8 +14,12 @@ if ( ! defined( 'ABSPATH' ) ) {
<header class="entry-header"> <header class="entry-header">
<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), <?php
'</a></h2>' ); ?> the_title(
sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ),
'</a></h2>'
);
?>
<?php if ( 'post' == get_post_type() ) : ?> <?php if ( 'post' == get_post_type() ) : ?>
@ -31,15 +35,15 @@ if ( ! defined( 'ABSPATH' ) ) {
<div class="entry-content"> <div class="entry-content">
<?php <?php the_excerpt(); ?>
the_excerpt();
?>
<?php <?php
wp_link_pages( array( wp_link_pages(
'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ), array(
'after' => '</div>', 'before' => '<div class="page-links">' . __( 'Pages:', 'understrap' ),
) ); 'after' => '</div>',
)
);
?> ?>
</div><!-- .entry-content --> </div><!-- .entry-content -->

4019
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

16
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "understrap", "name": "understrap",
"version": "0.8.8", "version": "0.8.9",
"description": "WordPress Theme framework", "description": "WordPress Theme framework",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
@ -27,23 +27,23 @@
}, },
"homepage": "https://understrap.com", "homepage": "https://understrap.com",
"dependencies": { "dependencies": {
"bootstrap": "4.1.3", "bootstrap": "4.2.1",
"browser-sync": "^2.23.6", "browser-sync": "^2.26.3",
"del": "^3.0.0", "del": "^3.0.0",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"gulp": "3.9.1", "gulp": "3.9.1",
"gulp-clean-css": "^3.9.2", "gulp-clean-css": "^4.0.0",
"gulp-concat": "^2.6.1", "gulp-concat": "^2.6.1",
"gulp-ignore": "^2.0.2", "gulp-ignore": "^2.0.2",
"gulp-imagemin": "^4.1.0", "gulp-imagemin": "^5.0.3",
"gulp-plumber": "^1.2.0", "gulp-plumber": "^1.2.1",
"gulp-rename": "^1.2.2", "gulp-rename": "^1.4.0",
"gulp-replace": "1.0.0", "gulp-replace": "1.0.0",
"gulp-rimraf": "^0.2.2", "gulp-rimraf": "^0.2.2",
"gulp-sass": "4.0.2", "gulp-sass": "4.0.2",
"gulp-sequence": "1.0.0", "gulp-sequence": "1.0.0",
"gulp-sourcemaps": "2.6.4", "gulp-sourcemaps": "2.6.4",
"gulp-uglify": "^3.0.0", "gulp-uglify": "^3.0.1",
"gulp-watch": "5.0.1", "gulp-watch": "5.0.1",
"run-sequence": "^2.2.1", "run-sequence": "^2.2.1",
"undescores-for-npm": "^1.0.0", "undescores-for-npm": "^1.0.0",

13
page-templates/blank.php
View File

@ -17,20 +17,15 @@ if ( ! defined( 'ABSPATH' ) ) {
<meta charset="<?php bloginfo( 'charset' ); ?>"> <meta charset="<?php bloginfo( 'charset' ); ?>">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title"
content="<?php bloginfo( 'name' ); ?> - <?php bloginfo( 'description' ); ?>">
<link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<?php wp_head(); ?> <?php wp_head(); ?>
</head> </head>
<body> <body>
<?php while ( have_posts() ) : the_post(); ?> <?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'loop-templates/content', 'blank' ); ?> <?php get_template_part( 'loop-templates/content', 'blank' ); ?>
<?php endwhile; // end of the loop. ?> <?php endwhile; // end of the loop. ?>
<?php wp_footer(); ?> <?php wp_footer(); ?>
</body> </body>
</html> </html>

4
page-templates/both-sidebarspage.php
View File

@ -54,8 +54,8 @@ $container = get_theme_mod( 'understrap_container_type' );
</div><!-- .row --> </div><!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- page-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

3
page-templates/empty.php
View File

@ -14,7 +14,8 @@ if ( ! defined( 'ABSPATH' ) ) {
get_header(); get_header();
while ( have_posts() ) : the_post(); while ( have_posts() ) :
the_post();
get_template_part( 'loop-templates/content', 'empty' ); get_template_part( 'loop-templates/content', 'empty' );
endwhile; endwhile;

6
page-templates/fullwidthpage.php
View File

@ -32,9 +32,7 @@ $container = get_theme_mod( 'understrap_container_type' );
<?php <?php
// If comments are open or we have at least one comment, load up the comment template. // If comments are open or we have at least one comment, load up the comment template.
if ( comments_open() || get_comments_number() ) : if ( comments_open() || get_comments_number() ) :
comments_template(); comments_template();
endif; endif;
?> ?>
@ -46,8 +44,8 @@ $container = get_theme_mod( 'understrap_container_type' );
</div><!-- .row end --> </div><!-- .row end -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #full-width-page-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

12
page.php
View File

@ -16,7 +16,7 @@ if ( ! defined( 'ABSPATH' ) ) {
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
@ -46,13 +46,13 @@ $container = get_theme_mod( 'understrap_container_type' );
</main><!-- #main --> </main><!-- #main -->
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div><!-- .row --> </div><!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #page-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

6
readme.txt
View File

@ -11,7 +11,7 @@ At the moment, UnderStrap is in a very early stage. But if you want, feel free t
# UnderStrap WordPress Theme Framework # UnderStrap WordPress Theme Framework
Website: [http://understrap.com](http://understrap.com) Website: [https://understrap.com](https://understrap.com)
Child Theme Project: [https://github.com/holger1411/understrap-child](https://github.com/holger1411/understrap-child) Child Theme Project: [https://github.com/holger1411/understrap-child](https://github.com/holger1411/understrap-child)
@ -212,12 +212,12 @@ The front-page slider is widget driven. Simply add more than one widget to widge
- Add two, or more, widgets of any kind to widget area “Hero”. - Add two, or more, widgets of any kind to widget area “Hero”.
- That’s it. - That’s it.
[1] Visit [http://browsersync.io](http://browsersync.io) for more information on Browser Sync [1] Visit [https://browsersync.io](https://browsersync.io) for more information on Browser Sync
Licenses & Credits Licenses & Credits
= =
- Font Awesome: http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) - Font Awesome: http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
- Bootstrap: http://getbootstrap.com | https://github.com/twbs/bootstrap/blob/master/LICENSE (Code licensed under MIT documentation under CC BY 3.0.) - Bootstrap: https://getbootstrap.com | https://github.com/twbs/bootstrap/blob/master/LICENSE (Code licensed under MIT documentation under CC BY 3.0.)
- Owl Carousel 2: http://www.owlcarousel.owlgraphic.com/ | https://github.com/smashingboxes/OwlCarousel2/blob/develop/LICENSE (Code licensed under MIT) - Owl Carousel 2: http://www.owlcarousel.owlgraphic.com/ | https://github.com/smashingboxes/OwlCarousel2/blob/develop/LICENSE (Code licensed under MIT)
and of course and of course
- jQuery: https://jquery.org | (Code licensed under MIT) - jQuery: https://jquery.org | (Code licensed under MIT)

3
sass/assets/bootstrap4.scss vendored
View File

@ -1,5 +1,5 @@
/*! /*!
* Bootstrap v4.1.0 (https://getbootstrap.com/) * Bootstrap v4.2.1 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc. * Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
@ -34,6 +34,7 @@
@import "../../src/sass/bootstrap4/media"; @import "../../src/sass/bootstrap4/media";
@import "../../src/sass/bootstrap4/list-group"; @import "../../src/sass/bootstrap4/list-group";
@import "../../src/sass/bootstrap4/close"; @import "../../src/sass/bootstrap4/close";
@import "../../src/sass/bootstrap4/toasts";
@import "../../src/sass/bootstrap4/modal"; @import "../../src/sass/bootstrap4/modal";
@import "../../src/sass/bootstrap4/tooltip"; @import "../../src/sass/bootstrap4/tooltip";
@import "../../src/sass/bootstrap4/popover"; @import "../../src/sass/bootstrap4/popover";

9
sass/understrap/woocommerce.scss
View File

@ -5,5 +5,12 @@
// Woocommerce product gallery slider width fix // Woocommerce product gallery slider width fix
figure.woocommerce-product-gallery__wrapper { figure.woocommerce-product-gallery__wrapper {
max-width: inherit !important; max-width: inherit !important;
}
// Fix coupon code input width
@media(min-width: 768px) {
#coupon_code.input-text {
width: 110px !important;
}
} }

25
search.php
View File

@ -11,7 +11,7 @@ if ( ! defined( 'ABSPATH' ) ) {
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
@ -30,10 +30,15 @@ $container = get_theme_mod( 'understrap_container_type' );
<header class="page-header"> <header class="page-header">
<h1 class="page-title"><?php printf( <h1 class="page-title">
/* translators:*/ <?php
esc_html__( 'Search Results for: %s', 'understrap' ), printf(
'<span>' . get_search_query() . '</span>' ); ?></h1> /* translators: %s: query term */
esc_html__( 'Search Results for: %s', 'understrap' ),
'<span>' . get_search_query() . '</span>'
);
?>
</h1>
</header><!-- .page-header --> </header><!-- .page-header -->
@ -62,13 +67,13 @@ $container = get_theme_mod( 'understrap_container_type' );
<!-- The pagination component --> <!-- The pagination component -->
<?php understrap_pagination(); ?> <?php understrap_pagination(); ?>
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div><!-- .row --> </div><!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #search-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

4
searchform.php
View File

@ -1,6 +1,6 @@
<?php <?php
/** /**
* The template for displaying search forms in Underscores.me * The template for displaying search forms
* *
* @package understrap * @package understrap
*/ */
@ -18,6 +18,6 @@ if ( ! defined( 'ABSPATH' ) ) {
<span class="input-group-append"> <span class="input-group-append">
<input class="submit btn btn-primary" id="searchsubmit" name="submit" type="submit" <input class="submit btn btn-primary" id="searchsubmit" name="submit" type="submit"
value="<?php esc_attr_e( 'Search', 'understrap' ); ?>"> value="<?php esc_attr_e( 'Search', 'understrap' ); ?>">
</span> </span>
</div> </div>
</form> </form>

30
sidebar-templates/sidebar-hero.php
View File

@ -14,34 +14,34 @@ if ( ! defined( 'ABSPATH' ) ) {
<!-- ******************* The Hero Widget Area ******************* --> <!-- ******************* The Hero Widget Area ******************* -->
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox"> <div class="carousel-inner" role="listbox">
<?php dynamic_sidebar( 'hero' ); ?> <?php dynamic_sidebar( 'hero' ); ?>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only"><?php esc_html_e( 'Previous', 'understrap' ); ?></span> <span class="sr-only"><?php esc_html_e( 'Previous', 'understrap' ); ?></span>
</a> </a>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only"><?php esc_html_e( 'Next', 'understrap' ); ?></span> <span class="sr-only"><?php esc_html_e( 'Next', 'understrap' ); ?></span>
</a> </a>
</div><!-- .carousel --> </div><!-- .carousel -->
<script> <script>
jQuery( ".carousel-item" ).first().addClass( "active" ); jQuery( ".carousel-item" ).first().addClass( "active" );
</script> </script>
<?php endif; ?> <?php endif; ?>

8
sidebar-templates/sidebar-left.php
View File

@ -18,10 +18,10 @@ $sidebar_pos = get_theme_mod( 'understrap_sidebar_position' );
?> ?>
<?php if ( 'both' === $sidebar_pos ) : ?> <?php if ( 'both' === $sidebar_pos ) : ?>
<div class="col-md-3 widget-area" id="left-sidebar" role="complementary"> <div class="col-md-3 widget-area" id="left-sidebar" role="complementary">
<?php else : ?> <?php else : ?>
<div class="col-md-4 widget-area" id="left-sidebar" role="complementary"> <div class="col-md-4 widget-area" id="left-sidebar" role="complementary">
<?php endif; ?> <?php endif; ?>
<?php dynamic_sidebar( 'left-sidebar' ); ?> <?php dynamic_sidebar( 'left-sidebar' ); ?>
</div><!-- #left-sidebar --> </div><!-- #left-sidebar -->

8
sidebar-templates/sidebar-right.php
View File

@ -18,10 +18,10 @@ $sidebar_pos = get_theme_mod( 'understrap_sidebar_position' );
?> ?>
<?php if ( 'both' === $sidebar_pos ) : ?> <?php if ( 'both' === $sidebar_pos ) : ?>
<div class="col-md-3 widget-area" id="right-sidebar" role="complementary"> <div class="col-md-3 widget-area" id="right-sidebar" role="complementary">
<?php else : ?> <?php else : ?>
<div class="col-md-4 widget-area" id="right-sidebar" role="complementary"> <div class="col-md-4 widget-area" id="right-sidebar" role="complementary">
<?php endif; ?> <?php endif; ?>
<?php dynamic_sidebar( 'right-sidebar' ); ?> <?php dynamic_sidebar( 'right-sidebar' ); ?>
</div><!-- #right-sidebar --> </div><!-- #right-sidebar -->

2
sidebar-templates/sidebar-statichero.php
View File

@ -5,11 +5,11 @@
* @package understrap * @package understrap
*/ */
$container = get_theme_mod( 'understrap_container_type' );
if ( ! defined( 'ABSPATH' ) ) { if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly. exit; // Exit if accessed directly.
} }
$container = get_theme_mod( 'understrap_container_type' );
?> ?>
<?php if ( is_active_sidebar( 'statichero' ) ) : ?> <?php if ( is_active_sidebar( 'statichero' ) ) : ?>

14
single.php
View File

@ -10,7 +10,7 @@ if ( ! defined( 'ABSPATH' ) ) {
} }
get_header(); get_header();
$container = get_theme_mod( 'understrap_container_type' ); $container = get_theme_mod( 'understrap_container_type' );
?> ?>
<div class="wrapper" id="single-wrapper"> <div class="wrapper" id="single-wrapper">
@ -28,7 +28,7 @@ $container = get_theme_mod( 'understrap_container_type' );
<?php get_template_part( 'loop-templates/content', 'single' ); ?> <?php get_template_part( 'loop-templates/content', 'single' ); ?>
<?php understrap_post_nav(); ?> <?php understrap_post_nav(); ?>
<?php <?php
// If comments are open or we have at least one comment, load up the comment template. // If comments are open or we have at least one comment, load up the comment template.
@ -41,13 +41,13 @@ $container = get_theme_mod( 'understrap_container_type' );
</main><!-- #main --> </main><!-- #main -->
<!-- Do the right sidebar check --> <!-- Do the right sidebar check -->
<?php get_template_part( 'global-templates/right-sidebar-check' ); ?> <?php get_template_part( 'global-templates/right-sidebar-check' ); ?>
</div><!-- .row --> </div><!-- .row -->
</div><!-- Container end --> </div><!-- #content -->
</div><!-- Wrapper end --> </div><!-- #single-wrapper -->
<?php get_footer(); ?> <?php get_footer(); ?>

7759
src/js/bootstrap4/bootstrap.bundle.js vendored
View File

File diff suppressed because it is too large Load Diff

4
src/js/bootstrap4/bootstrap.bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

7717
src/js/bootstrap4/bootstrap.js vendored
View File

File diff suppressed because it is too large Load Diff

4
src/js/bootstrap4/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
src/sass/bootstrap4/_alert.scss
View File

@ -27,7 +27,7 @@
// Expand the right padding and account for the close button's positioning. // Expand the right padding and account for the close button's positioning.
.alert-dismissible { .alert-dismissible {
padding-right: ($close-font-size + $alert-padding-x * 2); padding-right: $close-font-size + $alert-padding-x * 2;
// Adjust close link position // Adjust close link position
.close { .close {

6
src/sass/bootstrap4/_badge.scss
View File

@ -14,6 +14,12 @@
vertical-align: baseline; vertical-align: baseline;
@include border-radius($badge-border-radius); @include border-radius($badge-border-radius);
@at-root a#{&} {
@include hover-focus {
text-decoration: none;
}
}
// Empty badges collapse automatically // Empty badges collapse automatically
&:empty { &:empty {
display: none; display: none;

27
src/sass/bootstrap4/_button-group.scss
View File

@ -9,7 +9,7 @@
> .btn { > .btn {
position: relative; position: relative;
flex: 0 1 auto; flex: 1 1 auto;
// Bring the hover, focused, and "active" buttons to the front to overlay // Bring the hover, focused, and "active" buttons to the front to overlay
// the borders properly // the borders properly
@ -22,14 +22,6 @@
z-index: 1; z-index: 1;
} }
} }
// Prevent double borders when buttons are next to each other
.btn + .btn,
.btn + .btn-group,
.btn-group + .btn,
.btn-group + .btn-group {
margin-left: -$btn-border-width;
}
} }
// Optional: Group multiple button groups together for a toolbar // Optional: Group multiple button groups together for a toolbar
@ -44,8 +36,10 @@
} }
.btn-group { .btn-group {
> .btn:first-child { // Prevent double borders when buttons are next to each other
margin-left: 0; > .btn:not(:first-child),
> .btn-group:not(:first-child) {
margin-left: -$btn-border-width;
} }
// Reset rounded corners // Reset rounded corners
@ -119,17 +113,14 @@
align-items: flex-start; align-items: flex-start;
justify-content: center; justify-content: center;
.btn, > .btn,
.btn-group { > .btn-group {
width: 100%; width: 100%;
} }
> .btn + .btn, > .btn:not(:first-child),
> .btn + .btn-group, > .btn-group:not(:first-child) {
> .btn-group + .btn,
> .btn-group + .btn-group {
margin-top: -$btn-border-width; margin-top: -$btn-border-width;
margin-left: 0;
} }
// Reset rounded corners // Reset rounded corners

17
src/sass/bootstrap4/_buttons.scss
View File

@ -7,16 +7,17 @@
.btn { .btn {
display: inline-block; display: inline-block;
font-weight: $btn-font-weight; font-weight: $btn-font-weight;
color: $body-color;
text-align: center; text-align: center;
white-space: nowrap;
vertical-align: middle; vertical-align: middle;
user-select: none; user-select: none;
background-color: transparent;
border: $btn-border-width solid transparent; border: $btn-border-width solid transparent;
@include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-line-height, $btn-border-radius); @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
@include transition($btn-transition); @include transition($btn-transition);
// Share hover and focus styles @include hover {
@include hover-focus { color: $body-color;
text-decoration: none; text-decoration: none;
} }
@ -80,19 +81,15 @@ fieldset:disabled a.btn {
.btn-link { .btn-link {
font-weight: $font-weight-normal; font-weight: $font-weight-normal;
color: $link-color; color: $link-color;
background-color: transparent;
@include hover { @include hover {
color: $link-hover-color; color: $link-hover-color;
text-decoration: $link-hover-decoration; text-decoration: $link-hover-decoration;
background-color: transparent;
border-color: transparent;
} }
&:focus, &:focus,
&.focus { &.focus {
text-decoration: $link-hover-decoration; text-decoration: $link-hover-decoration;
border-color: transparent;
box-shadow: none; box-shadow: none;
} }
@ -111,11 +108,11 @@ fieldset:disabled a.btn {
// //
.btn-lg { .btn-lg {
@include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-line-height-lg, $btn-border-radius-lg); @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
} }
.btn-sm { .btn-sm {
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm); @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
} }

55
src/sass/bootstrap4/_card.scss
View File

@ -43,7 +43,7 @@
} }
.card-subtitle { .card-subtitle {
margin-top: -($card-spacer-y / 2); margin-top: -$card-spacer-y / 2;
margin-bottom: 0; margin-bottom: 0;
} }
@ -68,6 +68,7 @@
.card-header { .card-header {
padding: $card-spacer-y $card-spacer-x; padding: $card-spacer-y $card-spacer-x;
margin-bottom: 0; // Removes the default margin-bottom of <hN> margin-bottom: 0; // Removes the default margin-bottom of <hN>
color: $card-cap-color;
background-color: $card-cap-bg; background-color: $card-cap-bg;
border-bottom: $card-border-width solid $card-border-color; border-bottom: $card-border-width solid $card-border-color;
@ -98,15 +99,15 @@
// //
.card-header-tabs { .card-header-tabs {
margin-right: -($card-spacer-x / 2); margin-right: -$card-spacer-x / 2;
margin-bottom: -$card-spacer-y; margin-bottom: -$card-spacer-y;
margin-left: -($card-spacer-x / 2); margin-left: -$card-spacer-x / 2;
border-bottom: 0; border-bottom: 0;
} }
.card-header-pills { .card-header-pills {
margin-right: -($card-spacer-x / 2); margin-right: -$card-spacer-x / 2;
margin-left: -($card-spacer-x / 2); margin-left: -$card-spacer-x / 2;
} }
// Card image // Card image
@ -277,25 +278,33 @@
// //
.accordion { .accordion {
.card:not(:first-of-type):not(:last-of-type) { .card {
border-bottom: 0; overflow: hidden;
border-radius: 0;
}
.card:not(:first-of-type) { &:not(:first-of-type) {
.card-header:first-child { .card-header:first-child {
border-radius: 0; border-radius: 0;
}
&:not(:last-of-type) {
border-bottom: 0;
border-radius: 0;
}
}
&:first-of-type {
border-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
&:last-of-type {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.card-header {
margin-bottom: -$card-border-width;
} }
} }
.card:first-of-type {
border-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.card:last-of-type {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
} }

110
src/sass/bootstrap4/_carousel.scss
View File

@ -1,70 +1,55 @@
// Notes on the classes: // Notes on the classes:
// //
// 1. The .carousel-item-left and .carousel-item-right is used to indicate where // 1. .carousel.pointer-event should ideally be pan-y (to allow for users to scroll vertically)
// even when their scroll action started on a carousel, but for compatibility (with Firefox)
// we're preventing all actions instead
// 2. The .carousel-item-left and .carousel-item-right is used to indicate where
// the active slide is heading. // the active slide is heading.
// 2. .active.carousel-item is the current slide. // 3. .active.carousel-item is the current slide.
// 3. .active.carousel-item-left and .active.carousel-item-right is the current // 4. .active.carousel-item-left and .active.carousel-item-right is the current
// slide in its in-transition state. Only one of these occurs at a time. // slide in its in-transition state. Only one of these occurs at a time.
// 4. .carousel-item-next.carousel-item-left and .carousel-item-prev.carousel-item-right // 5. .carousel-item-next.carousel-item-left and .carousel-item-prev.carousel-item-right
// is the upcoming slide in transition. // is the upcoming slide in transition.
.carousel { .carousel {
position: relative; position: relative;
} }
.carousel.pointer-event {
touch-action: pan-y;
}
.carousel-inner { .carousel-inner {
position: relative; position: relative;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
@include clearfix();
} }
.carousel-item { .carousel-item {
position: relative; position: relative;
display: none; display: none;
align-items: center; float: left;
width: 100%; width: 100%;
margin-right: -100%;
backface-visibility: hidden; backface-visibility: hidden;
perspective: 1000px; @include transition($carousel-transition);
} }
.carousel-item.active, .carousel-item.active,
.carousel-item-next, .carousel-item-next,
.carousel-item-prev { .carousel-item-prev {
display: block; display: block;
@include transition($carousel-transition);
} }
.carousel-item-next, .carousel-item-next:not(.carousel-item-left),
.carousel-item-prev {
position: absolute;
top: 0;
}
.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
transform: translateX(0);
@supports (transform-style: preserve-3d) {
transform: translate3d(0, 0, 0);
}
}
.carousel-item-next,
.active.carousel-item-right { .active.carousel-item-right {
transform: translateX(100%); transform: translateX(100%);
@supports (transform-style: preserve-3d) {
transform: translate3d(100%, 0, 0);
}
} }
.carousel-item-prev, .carousel-item-prev:not(.carousel-item-right),
.active.carousel-item-left { .active.carousel-item-left {
transform: translateX(-100%); transform: translateX(-100%);
@supports (transform-style: preserve-3d) {
transform: translate3d(-100%, 0, 0);
}
} }
@ -75,31 +60,22 @@
.carousel-fade { .carousel-fade {
.carousel-item { .carousel-item {
opacity: 0; opacity: 0;
transition-duration: .6s;
transition-property: opacity; transition-property: opacity;
transform: none;
} }
.carousel-item.active, .carousel-item.active,
.carousel-item-next.carousel-item-left, .carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right { .carousel-item-prev.carousel-item-right {
z-index: 1;
opacity: 1; opacity: 1;
} }
.active.carousel-item-left, .active.carousel-item-left,
.active.carousel-item-right { .active.carousel-item-right {
z-index: 0;
opacity: 0; opacity: 0;
} @include transition(0s $carousel-transition-duration opacity);
.carousel-item-next,
.carousel-item-prev,
.carousel-item.active,
.active.carousel-item-left,
.active.carousel-item-prev {
transform: translateX(0);
@supports (transform-style: preserve-3d) {
transform: translate3d(0, 0, 0);
}
} }
} }
@ -113,6 +89,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
z-index: 1;
// Use flex for alignment (1-3) // Use flex for alignment (1-3)
display: flex; // 1. allow flex styles display: flex; // 1. allow flex styles
align-items: center; // 2. vertically center contents align-items: center; // 2. vertically center contents
@ -121,15 +98,14 @@
color: $carousel-control-color; color: $carousel-control-color;
text-align: center; text-align: center;
opacity: $carousel-control-opacity; opacity: $carousel-control-opacity;
// We can't have a transition here because WebKit cancels the carousel @include transition($carousel-control-transition);
// animation if you trip this while in the middle of another animation.
// Hover/focus state // Hover/focus state
@include hover-focus { @include hover-focus {
color: $carousel-control-color; color: $carousel-control-color;
text-decoration: none; text-decoration: none;
outline: 0; outline: 0;
opacity: .9; opacity: $carousel-control-hover-opacity;
} }
} }
.carousel-control-prev { .carousel-control-prev {
@ -170,7 +146,7 @@
.carousel-indicators { .carousel-indicators {
position: absolute; position: absolute;
right: 0; right: 0;
bottom: 10px; bottom: 0;
left: 0; left: 0;
z-index: 15; z-index: 15;
display: flex; display: flex;
@ -182,7 +158,7 @@
list-style: none; list-style: none;
li { li {
position: relative; box-sizing: content-box;
flex: 0 1 auto; flex: 0 1 auto;
width: $carousel-indicator-width; width: $carousel-indicator-width;
height: $carousel-indicator-height; height: $carousel-indicator-height;
@ -190,31 +166,17 @@
margin-left: $carousel-indicator-spacer; margin-left: $carousel-indicator-spacer;
text-indent: -999px; text-indent: -999px;
cursor: pointer; cursor: pointer;
background-color: rgba($carousel-indicator-active-bg, .5); background-color: $carousel-indicator-active-bg;
background-clip: padding-box;
// Use pseudo classes to increase the hit area by 10px on top and bottom. // Use transparent borders to increase the hit area by 10px on top and bottom.
&::before { border-top: $carousel-indicator-hit-area-height solid transparent;
position: absolute; border-bottom: $carousel-indicator-hit-area-height solid transparent;
top: -10px; opacity: .5;
left: 0; @include transition($carousel-indicator-transition);
display: inline-block;
width: 100%;
height: 10px;
content: "";
}
&::after {
position: absolute;
bottom: -10px;
left: 0;
display: inline-block;
width: 100%;
height: 10px;
content: "";
}
} }
.active { .active {
background-color: $carousel-indicator-active-bg; opacity: 1;
} }
} }
@ -225,9 +187,9 @@
.carousel-caption { .carousel-caption {
position: absolute; position: absolute;
right: ((100% - $carousel-caption-width) / 2); right: (100% - $carousel-caption-width) / 2;
bottom: 20px; bottom: 20px;
left: ((100% - $carousel-caption-width) / 2); left: (100% - $carousel-caption-width) / 2;
z-index: 10; z-index: 10;
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;

21
src/sass/bootstrap4/_close.scss
View File

@ -7,11 +7,14 @@
text-shadow: $close-text-shadow; text-shadow: $close-text-shadow;
opacity: .5; opacity: .5;
&:not(:disabled):not(.disabled) { // Override <a>'s hover style
@include hover {
color: $close-color;
text-decoration: none;
}
&:not(:disabled):not(.disabled) {
@include hover-focus { @include hover-focus {
color: $close-color;
text-decoration: none;
opacity: .75; opacity: .75;
} }
@ -25,11 +28,17 @@
// If you want the anchor version, it requires `href="#"`. // If you want the anchor version, it requires `href="#"`.
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
// stylelint-disable property-no-vendor-prefix, selector-no-qualifying-type // stylelint-disable-next-line selector-no-qualifying-type
button.close { button.close {
padding: 0; padding: 0;
background-color: transparent; background-color: transparent;
border: 0; border: 0;
-webkit-appearance: none; appearance: none;
}
// Future-proof disabling of clicks on `<a>` elements
// stylelint-disable-next-line selector-no-qualifying-type
a.close.disabled {
pointer-events: none;
} }
// stylelint-enable

134
src/sass/bootstrap4/_custom-forms.scss
View File

@ -10,8 +10,8 @@
.custom-control { .custom-control {
position: relative; position: relative;
display: block; display: block;
min-height: ($font-size-base * $line-height-base); min-height: $font-size-base * $line-height-base;
padding-left: $custom-control-gutter; padding-left: $custom-control-gutter + $custom-control-indicator-size;
} }
.custom-control-inline { .custom-control-inline {
@ -26,18 +26,28 @@
&:checked ~ .custom-control-label::before { &:checked ~ .custom-control-label::before {
color: $custom-control-indicator-checked-color; color: $custom-control-indicator-checked-color;
border-color: $custom-control-indicator-checked-border-color;
@include gradient-bg($custom-control-indicator-checked-bg); @include gradient-bg($custom-control-indicator-checked-bg);
@include box-shadow($custom-control-indicator-checked-box-shadow); @include box-shadow($custom-control-indicator-checked-box-shadow);
} }
&:focus ~ .custom-control-label::before { &:focus ~ .custom-control-label::before {
// the mixin is not used here to make sure there is feedback // the mixin is not used here to make sure there is feedback
box-shadow: $custom-control-indicator-focus-box-shadow; @if $enable-shadows {
box-shadow: $input-box-shadow, $input-focus-box-shadow;
} @else {
box-shadow: $custom-control-indicator-focus-box-shadow;
}
} }
&:active ~ .custom-control-label::before { &:focus:not(:checked) ~ .custom-control-label::before {
border-color: $custom-control-indicator-focus-border-color;
}
&:not(:disabled):active ~ .custom-control-label::before {
color: $custom-control-indicator-active-color; color: $custom-control-indicator-active-color;
background-color: $custom-control-indicator-active-bg; background-color: $custom-control-indicator-active-bg;
border-color: $custom-control-indicator-active-border-color;
@include box-shadow($custom-control-indicator-active-box-shadow); @include box-shadow($custom-control-indicator-active-box-shadow);
} }
@ -59,27 +69,28 @@
.custom-control-label { .custom-control-label {
position: relative; position: relative;
margin-bottom: 0; margin-bottom: 0;
vertical-align: top;
// Background-color and (when enabled) gradient // Background-color and (when enabled) gradient
&::before { &::before {
position: absolute; position: absolute;
top: (($font-size-base * $line-height-base - $custom-control-indicator-size) / 2); top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
left: -$custom-control-gutter; left: -($custom-control-gutter + $custom-control-indicator-size);
display: block; display: block;
width: $custom-control-indicator-size; width: $custom-control-indicator-size;
height: $custom-control-indicator-size; height: $custom-control-indicator-size;
pointer-events: none; pointer-events: none;
content: ""; content: "";
user-select: none;
background-color: $custom-control-indicator-bg; background-color: $custom-control-indicator-bg;
border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
@include box-shadow($custom-control-indicator-box-shadow); @include box-shadow($custom-control-indicator-box-shadow);
} }
// Foreground (icon) // Foreground (icon)
&::after { &::after {
position: absolute; position: absolute;
top: (($font-size-base * $line-height-base - $custom-control-indicator-size) / 2); top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
left: -$custom-control-gutter; left: -($custom-control-gutter + $custom-control-indicator-size);
display: block; display: block;
width: $custom-control-indicator-size; width: $custom-control-indicator-size;
height: $custom-control-indicator-size; height: $custom-control-indicator-size;
@ -101,9 +112,6 @@
} }
.custom-control-input:checked ~ .custom-control-label { .custom-control-input:checked ~ .custom-control-label {
&::before {
@include gradient-bg($custom-control-indicator-checked-bg);
}
&::after { &::after {
background-image: $custom-checkbox-indicator-icon-checked; background-image: $custom-checkbox-indicator-icon-checked;
} }
@ -111,6 +119,7 @@
.custom-control-input:indeterminate ~ .custom-control-label { .custom-control-input:indeterminate ~ .custom-control-label {
&::before { &::before {
border-color: $custom-checkbox-indicator-indeterminate-border-color;
@include gradient-bg($custom-checkbox-indicator-indeterminate-bg); @include gradient-bg($custom-checkbox-indicator-indeterminate-bg);
@include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow); @include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow);
} }
@ -139,9 +148,6 @@
} }
.custom-control-input:checked ~ .custom-control-label { .custom-control-input:checked ~ .custom-control-label {
&::before {
@include gradient-bg($custom-control-indicator-checked-bg);
}
&::after { &::after {
background-image: $custom-radio-indicator-icon-checked; background-image: $custom-radio-indicator-icon-checked;
} }
@ -155,6 +161,47 @@
} }
// switches
//
// Tweak a few things for switches
.custom-switch {
padding-left: $custom-switch-width + $custom-control-gutter;
.custom-control-label {
&::before {
left: -($custom-switch-width + $custom-control-gutter);
width: $custom-switch-width;
pointer-events: all;
border-radius: $custom-switch-indicator-border-radius;
}
&::after {
top: calc(#{(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2)} + #{$custom-control-indicator-border-width * 2});
left: calc(#{-($custom-switch-width + $custom-control-gutter)} + #{$custom-control-indicator-border-width * 2});
width: $custom-switch-indicator-size;
height: $custom-switch-indicator-size;
background-color: $custom-control-indicator-border-color;
border-radius: $custom-switch-indicator-border-radius;
@include transition(transform .15s ease-in-out, $custom-forms-transition);
}
}
.custom-control-input:checked ~ .custom-control-label {
&::after {
background-color: $custom-control-indicator-bg;
transform: translateX($custom-switch-width - $custom-control-indicator-size);
}
}
.custom-control-input:disabled {
&:checked ~ .custom-control-label::before {
background-color: $custom-control-indicator-checked-disabled-bg;
}
}
}
// Select // Select
// //
// Replaces the browser default select with a custom one, mostly pulled from // Replaces the browser default select with a custom one, mostly pulled from
@ -166,11 +213,12 @@
width: 100%; width: 100%;
height: $custom-select-height; height: $custom-select-height;
padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x; padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
font-weight: $custom-select-font-weight;
line-height: $custom-select-line-height; line-height: $custom-select-line-height;
color: $custom-select-color; color: $custom-select-color;
vertical-align: middle; vertical-align: middle;
background: $custom-select-bg $custom-select-indicator no-repeat right $custom-select-padding-x center; background: $custom-select-background;
background-size: $custom-select-bg-size; background-color: $custom-select-bg;
border: $custom-select-border-width solid $custom-select-border-color; border: $custom-select-border-width solid $custom-select-border-color;
@if $enable-rounded { @if $enable-rounded {
border-radius: $custom-select-border-radius; border-radius: $custom-select-border-radius;
@ -220,15 +268,17 @@
.custom-select-sm { .custom-select-sm {
height: $custom-select-height-sm; height: $custom-select-height-sm;
padding-top: $custom-select-padding-y; padding-top: $custom-select-padding-y-sm;
padding-bottom: $custom-select-padding-y; padding-bottom: $custom-select-padding-y-sm;
padding-left: $custom-select-padding-x-sm;
font-size: $custom-select-font-size-sm; font-size: $custom-select-font-size-sm;
} }
.custom-select-lg { .custom-select-lg {
height: $custom-select-height-lg; height: $custom-select-height-lg;
padding-top: $custom-select-padding-y; padding-top: $custom-select-padding-y-lg;
padding-bottom: $custom-select-padding-y; padding-bottom: $custom-select-padding-y-lg;
padding-left: $custom-select-padding-x-lg;
font-size: $custom-select-font-size-lg; font-size: $custom-select-font-size-lg;
} }
@ -256,10 +306,6 @@
&:focus ~ .custom-file-label { &:focus ~ .custom-file-label {
border-color: $custom-file-focus-border-color; border-color: $custom-file-focus-border-color;
box-shadow: $custom-file-focus-box-shadow; box-shadow: $custom-file-focus-box-shadow;
&::after {
border-color: $custom-file-focus-border-color;
}
} }
&:disabled ~ .custom-file-label { &:disabled ~ .custom-file-label {
@ -271,6 +317,10 @@
content: $value; content: $value;
} }
} }
~ .custom-file-label[data-browse]::after {
content: attr(data-browse);
}
} }
.custom-file-label { .custom-file-label {
@ -281,6 +331,7 @@
z-index: 1; z-index: 1;
height: $custom-file-height; height: $custom-file-height;
padding: $custom-file-padding-y $custom-file-padding-x; padding: $custom-file-padding-y $custom-file-padding-x;
font-weight: $custom-file-font-weight;
line-height: $custom-file-line-height; line-height: $custom-file-line-height;
color: $custom-file-color; color: $custom-file-color;
background-color: $custom-file-bg; background-color: $custom-file-bg;
@ -301,7 +352,7 @@
color: $custom-file-button-color; color: $custom-file-button-color;
content: "Browse"; content: "Browse";
@include gradient-bg($custom-file-button-bg); @include gradient-bg($custom-file-button-bg);
border-left: $custom-file-border-width solid $custom-file-border-color; border-left: inherit;
@include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0); @include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
} }
} }
@ -314,14 +365,15 @@
.custom-range { .custom-range {
width: 100%; width: 100%;
padding-left: 0; // Firefox specific height: calc(#{$custom-range-thumb-height} + #{$custom-range-thumb-focus-box-shadow-width * 2});
padding: 0; // Need to reset padding
background-color: transparent; background-color: transparent;
appearance: none; appearance: none;
&:focus { &:focus {
outline: none; outline: none;
// Pseudo-elements must be split across multiple rulesets to have an affect. // Pseudo-elements must be split across multiple rulesets to have an effect.
// No box-shadow() mixin for focus accessibility. // No box-shadow() mixin for focus accessibility.
&::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; } &::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
&::-moz-range-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; } &::-moz-range-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
@ -335,7 +387,7 @@
&::-webkit-slider-thumb { &::-webkit-slider-thumb {
width: $custom-range-thumb-width; width: $custom-range-thumb-width;
height: $custom-range-thumb-height; height: $custom-range-thumb-height;
margin-top: (($custom-range-track-height - $custom-range-thumb-height) / 2); // Webkit specific margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
@include gradient-bg($custom-range-thumb-bg); @include gradient-bg($custom-range-thumb-bg);
border: $custom-range-thumb-border; border: $custom-range-thumb-border;
@include border-radius($custom-range-thumb-border-radius); @include border-radius($custom-range-thumb-border-radius);
@ -410,7 +462,7 @@
cursor: $custom-range-track-cursor; cursor: $custom-range-track-cursor;
background-color: transparent; background-color: transparent;
border-color: transparent; border-color: transparent;
border-width: ($custom-range-thumb-height * .5); border-width: $custom-range-thumb-height / 2;
@include box-shadow($custom-range-track-box-shadow); @include box-shadow($custom-range-track-box-shadow);
} }
@ -424,6 +476,28 @@
background-color: $custom-range-track-bg; background-color: $custom-range-track-bg;
@include border-radius($custom-range-track-border-radius); @include border-radius($custom-range-track-border-radius);
} }
&:disabled {
&::-webkit-slider-thumb {
background-color: $custom-range-thumb-disabled-bg;
}
&::-webkit-slider-runnable-track {
cursor: default;
}
&::-moz-range-thumb {
background-color: $custom-range-thumb-disabled-bg;
}
&::-moz-range-track {
cursor: default;
}
&::-ms-thumb {
background-color: $custom-range-thumb-disabled-bg;
}
}
} }
.custom-control-label::before, .custom-control-label::before,

35
src/sass/bootstrap4/_dropdown.scss
View File

@ -33,9 +33,26 @@
@include box-shadow($dropdown-box-shadow); @include box-shadow($dropdown-box-shadow);
} }
.dropdown-menu-right { @each $breakpoint in map-keys($grid-breakpoints) {
right: 0; @include media-breakpoint-up($breakpoint) {
left: auto; $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
.dropdown-menu#{$infix}-right {
right: 0;
left: auto;
}
}
}
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
.dropdown-menu#{$infix}-left {
right: auto;
left: 0;
}
}
} }
// Allow for dropdowns to go bottom up (aka, dropup-menu) // Allow for dropdowns to go bottom up (aka, dropup-menu)
@ -88,7 +105,7 @@
} }
// When enabled Popper.js, reset basic dropdown position // When enabled Popper.js, reset basic dropdown position
// stylelint-disable no-duplicate-selectors // stylelint-disable-next-line no-duplicate-selectors
.dropdown-menu { .dropdown-menu {
&[x-placement^="top"], &[x-placement^="top"],
&[x-placement^="right"], &[x-placement^="right"],
@ -98,7 +115,6 @@
bottom: auto; bottom: auto;
} }
} }
// stylelint-enable no-duplicate-selectors
// Dividers (basically an `<hr>`) within the dropdown // Dividers (basically an `<hr>`) within the dropdown
.dropdown-divider { .dropdown-divider {
@ -120,6 +136,14 @@
background-color: transparent; // For `<button>`s background-color: transparent; // For `<button>`s
border: 0; // For `<button>`s border: 0; // For `<button>`s
&:first-child {
@include border-top-radius($dropdown-inner-border-radius);
}
&:last-child {
@include border-bottom-radius($dropdown-inner-border-radius);
}
@include hover-focus { @include hover-focus {
color: $dropdown-link-hover-color; color: $dropdown-link-hover-color;
text-decoration: none; text-decoration: none;
@ -136,6 +160,7 @@
&.disabled, &.disabled,
&:disabled { &:disabled {
color: $dropdown-link-disabled-color; color: $dropdown-link-disabled-color;
pointer-events: none;
background-color: transparent; background-color: transparent;
// Remove CSS gradients if they're enabled // Remove CSS gradients if they're enabled
@if $enable-gradients { @if $enable-gradients {

23
src/sass/bootstrap4/_forms.scss
View File

@ -9,7 +9,8 @@
width: 100%; width: 100%;
height: $input-height; height: $input-height;
padding: $input-padding-y $input-padding-x; padding: $input-padding-y $input-padding-x;
font-size: $font-size-base; font-size: $input-font-size;
font-weight: $input-font-weight;
line-height: $input-line-height; line-height: $input-line-height;
color: $input-color; color: $input-color;
background-color: $input-bg; background-color: $input-bg;
@ -94,14 +95,14 @@ select.form-control {
.col-form-label-lg { .col-form-label-lg {
padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width}); padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width});
padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width}); padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width});
font-size: $font-size-lg; font-size: $input-font-size-lg;
line-height: $input-line-height-lg; line-height: $input-line-height-lg;
} }
.col-form-label-sm { .col-form-label-sm {
padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width}); padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width}); padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
font-size: $font-size-sm; font-size: $input-font-size-sm;
line-height: $input-line-height-sm; line-height: $input-line-height-sm;
} }
@ -141,7 +142,7 @@ select.form-control {
.form-control-sm { .form-control-sm {
height: $input-height-sm; height: $input-height-sm;
padding: $input-padding-y-sm $input-padding-x-sm; padding: $input-padding-y-sm $input-padding-x-sm;
font-size: $font-size-sm; font-size: $input-font-size-sm;
line-height: $input-line-height-sm; line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm); @include border-radius($input-border-radius-sm);
} }
@ -149,12 +150,12 @@ select.form-control {
.form-control-lg { .form-control-lg {
height: $input-height-lg; height: $input-height-lg;
padding: $input-padding-y-lg $input-padding-x-lg; padding: $input-padding-y-lg $input-padding-x-lg;
font-size: $font-size-lg; font-size: $input-font-size-lg;
line-height: $input-line-height-lg; line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg); @include border-radius($input-border-radius-lg);
} }
// stylelint-disable no-duplicate-selectors // stylelint-disable-next-line no-duplicate-selectors
select.form-control { select.form-control {
&[size], &[size],
&[multiple] { &[multiple] {
@ -162,10 +163,10 @@ select.form-control {
} }
} }
// stylelint-disable-next-line no-duplicate-selectors
textarea.form-control { textarea.form-control {
height: auto; height: auto;
} }
// stylelint-enable no-duplicate-selectors
// Form groups // Form groups
// //
@ -189,13 +190,13 @@ textarea.form-control {
.form-row { .form-row {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin-right: -5px; margin-right: -$form-grid-gutter-width / 2;
margin-left: -5px; margin-left: -$form-grid-gutter-width / 2;
> .col, > .col,
> [class*="col-"] { > [class*="col-"] {
padding-right: 5px; padding-right: $form-grid-gutter-width / 2;
padding-left: 5px; padding-left: $form-grid-gutter-width / 2;
} }
} }

8
src/sass/bootstrap4/_functions.scss
View File

@ -8,7 +8,7 @@
$prev-key: null; $prev-key: null;
$prev-num: null; $prev-num: null;
@each $key, $num in $map { @each $key, $num in $map {
@if $prev-num == null { @if $prev-num == null or unit($num) == "%" {
// Do nothing // Do nothing
} @else if not comparable($prev-num, $num) { } @else if not comparable($prev-num, $num) {
@warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !"; @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
@ -49,7 +49,7 @@
} }
// Color contrast // Color contrast
@function color-yiq($color) { @function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) {
$r: red($color); $r: red($color);
$g: green($color); $g: green($color);
$b: blue($color); $b: blue($color);
@ -57,9 +57,9 @@
$yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000; $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
@if ($yiq >= $yiq-contrasted-threshold) { @if ($yiq >= $yiq-contrasted-threshold) {
@return $yiq-text-dark; @return $dark;
} @else { } @else {
@return $yiq-text-light; @return $light;
} }
} }

2
src/sass/bootstrap4/_images.scss
View File

@ -32,7 +32,7 @@
} }
.figure-img { .figure-img {
margin-bottom: ($spacer / 2); margin-bottom: $spacer / 2;
line-height: 1; line-height: 1;
} }

28
src/sass/bootstrap4/_input-group.scss
View File

@ -12,6 +12,7 @@
width: 100%; width: 100%;
> .form-control, > .form-control,
> .form-control-plaintext,
> .custom-select, > .custom-select,
> .custom-file { > .custom-file {
position: relative; // For focus state's z-index position: relative; // For focus state's z-index
@ -75,6 +76,10 @@
.btn { .btn {
position: relative; position: relative;
z-index: 2; z-index: 2;
&:focus {
z-index: 3;
}
} }
.btn + .btn, .btn + .btn,
@ -122,30 +127,45 @@
// Remix the default form control sizing classes into new ones for easier // Remix the default form control sizing classes into new ones for easier
// manipulation. // manipulation.
.input-group-lg > .form-control:not(textarea),
.input-group-lg > .custom-select {
height: $input-height-lg;
}
.input-group-lg > .form-control, .input-group-lg > .form-control,
.input-group-lg > .custom-select,
.input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn, .input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn { .input-group-lg > .input-group-append > .btn {
height: $input-height-lg;
padding: $input-padding-y-lg $input-padding-x-lg; padding: $input-padding-y-lg $input-padding-x-lg;
font-size: $font-size-lg; font-size: $input-font-size-lg;
line-height: $input-line-height-lg; line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg); @include border-radius($input-border-radius-lg);
} }
.input-group-sm > .form-control:not(textarea),
.input-group-sm > .custom-select {
height: $input-height-sm;
}
.input-group-sm > .form-control, .input-group-sm > .form-control,
.input-group-sm > .custom-select,
.input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn { .input-group-sm > .input-group-append > .btn {
height: $input-height-sm;
padding: $input-padding-y-sm $input-padding-x-sm; padding: $input-padding-y-sm $input-padding-x-sm;
font-size: $font-size-sm; font-size: $input-font-size-sm;
line-height: $input-line-height-sm; line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm); @include border-radius($input-border-radius-sm);
} }
.input-group-lg > .custom-select,
.input-group-sm > .custom-select {
padding-right: $custom-select-padding-x + $custom-select-indicator-padding;
}
// Prepend and append rounded corners // Prepend and append rounded corners
// //

6
src/sass/bootstrap4/_list-group.scss
View File

@ -66,6 +66,7 @@
&.disabled, &.disabled,
&:disabled { &:disabled {
color: $list-group-disabled-color; color: $list-group-disabled-color;
pointer-events: none;
background-color: $list-group-disabled-bg; background-color: $list-group-disabled-bg;
} }
@ -89,6 +90,10 @@
border-right: 0; border-right: 0;
border-left: 0; border-left: 0;
@include border-radius(0); @include border-radius(0);
&:last-child {
margin-bottom: -$list-group-border-width;
}
} }
&:first-child { &:first-child {
@ -99,6 +104,7 @@
&:last-child { &:last-child {
.list-group-item:last-child { .list-group-item:last-child {
margin-bottom: 0;
border-bottom: 0; border-bottom: 0;
} }
} }

26
src/sass/bootstrap4/_modal.scss
View File

@ -18,11 +18,11 @@
.modal { .modal {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0;
bottom: 0;
left: 0; left: 0;
z-index: $zindex-modal; z-index: $zindex-modal;
display: none; display: none;
width: 100%;
height: 100%;
overflow: hidden; overflow: hidden;
// Prevent Chrome on Windows from adding a focus outline. For details, see // Prevent Chrome on Windows from adding a focus outline. For details, see
// https://github.com/twbs/bootstrap/pull/10951. // https://github.com/twbs/bootstrap/pull/10951.
@ -43,10 +43,10 @@
// When fading in the modal, animate it to slide down // When fading in the modal, animate it to slide down
.modal.fade & { .modal.fade & {
@include transition($modal-transition); @include transition($modal-transition);
transform: translate(0, -25%); transform: $modal-fade-transform;
} }
.modal.show & { .modal.show & {
transform: translate(0, 0); transform: $modal-show-transform;
} }
} }
@ -84,10 +84,10 @@
.modal-backdrop { .modal-backdrop {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0;
bottom: 0;
left: 0; left: 0;
z-index: $zindex-modal-backdrop; z-index: $zindex-modal-backdrop;
width: 100vw;
height: 100vh;
background-color: $modal-backdrop-bg; background-color: $modal-backdrop-bg;
// Fade for backdrop // Fade for backdrop
@ -108,7 +108,7 @@
.close { .close {
padding: $modal-header-padding; padding: $modal-header-padding;
// auto on the left force icon to the right even when there is no .modal-title // auto on the left force icon to the right even when there is no .modal-title
margin: (-$modal-header-padding) (-$modal-header-padding) (-$modal-header-padding) auto; margin: (-$modal-header-padding-y) (-$modal-header-padding-x) (-$modal-header-padding-y) auto;
} }
} }
@ -135,6 +135,7 @@
justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items
padding: $modal-inner-padding; padding: $modal-inner-padding;
border-top: $modal-footer-border-width solid $modal-footer-border-color; border-top: $modal-footer-border-width solid $modal-footer-border-color;
@include border-bottom-radius($modal-content-border-radius);
// Easily place margin between footer elements // Easily place margin between footer elements
> :not(:first-child) { margin-left: .25rem; } > :not(:first-child) { margin-left: .25rem; }
@ -164,7 +165,6 @@
&::before { &::before {
height: calc(100vh - (#{$modal-dialog-margin-y-sm-up} * 2)); height: calc(100vh - (#{$modal-dialog-margin-y-sm-up} * 2));
} }
} }
.modal-content { .modal-content {
@ -172,9 +172,15 @@
} }
.modal-sm { max-width: $modal-sm; } .modal-sm { max-width: $modal-sm; }
} }
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
.modal-lg { max-width: $modal-lg; } .modal-lg,
.modal-xl {
max-width: $modal-lg;
}
}
@include media-breakpoint-up(xl) {
.modal-xl { max-width: $modal-xl; }
} }

2
src/sass/bootstrap4/_nav.scss
View File

@ -22,6 +22,8 @@
// Disabled state lightens text // Disabled state lightens text
&.disabled { &.disabled {
color: $nav-link-disabled-color; color: $nav-link-disabled-color;
pointer-events: none;
cursor: default;
} }
} }

8
src/sass/bootstrap4/_navbar.scss
View File

@ -197,10 +197,10 @@
// Dark links against a light background // Dark links against a light background
.navbar-light { .navbar-light {
.navbar-brand { .navbar-brand {
color: $navbar-light-active-color; color: $navbar-light-brand-color;
@include hover-focus { @include hover-focus {
color: $navbar-light-active-color; color: $navbar-light-brand-hover-color;
} }
} }
@ -249,10 +249,10 @@
// White links against a dark background // White links against a dark background
.navbar-dark { .navbar-dark {
.navbar-brand { .navbar-brand {
color: $navbar-dark-active-color; color: $navbar-dark-brand-color;
@include hover-focus { @include hover-focus {
color: $navbar-dark-active-color; color: $navbar-dark-brand-hover-color;
} }
} }

2
src/sass/bootstrap4/_popover.scss
View File

@ -113,7 +113,7 @@
left: 50%; left: 50%;
display: block; display: block;
width: $popover-arrow-width; width: $popover-arrow-width;
margin-left: ($popover-arrow-width / -2); margin-left: -$popover-arrow-width / 2;
content: ""; content: "";
border-bottom: $popover-border-width solid $popover-header-bg; border-bottom: $popover-border-width solid $popover-header-bg;
} }

49
src/sass/bootstrap4/_reboot.scss
View File

@ -14,9 +14,7 @@
// 2. Change the default font family in all browsers. // 2. Change the default font family in all browsers.
// 3. Correct the line height in all browsers. // 3. Correct the line height in all browsers.
// 4. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. // 4. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.
// 5. Setting @viewport causes scrollbars to overlap content in IE11 and Edge, so // 5. Change the default tap highlight to be completely transparent in iOS.
// we force a non-overlapping, non-auto-hiding scrollbar to counteract.
// 6. Change the default tap highlight to be completely transparent in iOS.
*, *,
*::before, *::before,
@ -28,30 +26,21 @@ html {
font-family: sans-serif; // 2 font-family: sans-serif; // 2
line-height: 1.15; // 3 line-height: 1.15; // 3
-webkit-text-size-adjust: 100%; // 4 -webkit-text-size-adjust: 100%; // 4
-ms-text-size-adjust: 100%; // 4 -webkit-tap-highlight-color: rgba($black, 0); // 5
-ms-overflow-style: scrollbar; // 5
-webkit-tap-highlight-color: rgba($black, 0); // 6
} }
// IE10+ doesn't honor `<meta name="viewport">` in some cases.
@at-root {
@-ms-viewport {
width: device-width;
}
}
// stylelint-disable selector-list-comma-newline-after
// Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers) // Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers)
// TODO: remove in v5
// stylelint-disable-next-line selector-list-comma-newline-after
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
display: block; display: block;
} }
// stylelint-enable selector-list-comma-newline-after
// Body // Body
// //
// 1. Remove the margin in all browsers. // 1. Remove the margin in all browsers.
// 2. As a best practice, apply a default `background-color`. // 2. As a best practice, apply a default `background-color`.
// 3. Set an explicit initial text-align value so that we can later use the // 3. Set an explicit initial text-align value so that we can later use
// the `inherit` value on things like `<th>` elements. // the `inherit` value on things like `<th>` elements.
body { body {
@ -95,12 +84,11 @@ hr {
// //
// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top // By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
// margin for easier control within type scales as it avoids margin collapsing. // margin for easier control within type scales as it avoids margin collapsing.
// stylelint-disable selector-list-comma-newline-after // stylelint-disable-next-line selector-list-comma-newline-after
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
margin-top: 0; margin-top: 0;
margin-bottom: $headings-margin-bottom; margin-bottom: $headings-margin-bottom;
} }
// stylelint-enable selector-list-comma-newline-after
// Reset margins on paragraphs // Reset margins on paragraphs
// //
@ -113,17 +101,19 @@ p {
// Abbreviations // Abbreviations
// //
// 1. Remove the bottom border in Firefox 39-. // 1. Duplicate behavior to the data-* attribute for our tooltip plugin
// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. // 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
// 3. Add explicit cursor to indicate changed behavior. // 3. Add explicit cursor to indicate changed behavior.
// 4. Duplicate behavior to the data-* attribute for our tooltip plugin // 4. Remove the bottom border in Firefox 39-.
// 5. Prevent the text-decoration to be skipped.
abbr[title], abbr[title],
abbr[data-original-title] { // 4 abbr[data-original-title] { // 1
text-decoration: underline; // 2 text-decoration: underline; // 2
text-decoration: underline dotted; // 2 text-decoration: underline dotted; // 2
cursor: help; // 3 cursor: help; // 3
border-bottom: 0; // 1 border-bottom: 0; // 4
text-decoration-skip-ink: none; // 5
} }
address { address {
@ -159,16 +149,10 @@ blockquote {
margin: 0 0 1rem; margin: 0 0 1rem;
} }
dfn {
font-style: italic; // Add the correct font style in Android 4.3-
}
// stylelint-disable font-weight-notation
b, b,
strong { strong {
font-weight: bolder; // Add the correct font weight in Chrome, Edge, and Safari font-weight: $font-weight-bolder; // Add the correct font weight in Chrome, Edge, and Safari
} }
// stylelint-enable font-weight-notation
small { small {
font-size: 80%; // Add the correct font size in all browsers font-size: 80%; // Add the correct font size in all browsers
@ -199,7 +183,6 @@ a {
color: $link-color; color: $link-color;
text-decoration: $link-decoration; text-decoration: $link-decoration;
background-color: transparent; // Remove the gray background on active links in IE 10. background-color: transparent; // Remove the gray background on active links in IE 10.
-webkit-text-decoration-skip: objects; // Remove gaps in links underline in iOS 8+ and Safari 8+.
@include hover { @include hover {
color: $link-hover-color; color: $link-hover-color;
@ -247,9 +230,6 @@ pre {
margin-bottom: 1rem; margin-bottom: 1rem;
// Don't allow content to break outside // Don't allow content to break outside
overflow: auto; overflow: auto;
// We have @viewport set which causes scrollbars to overlap content in IE11 and Edge, so
// we force a non-overlapping, non-auto-hiding scrollbar to counteract.
-ms-overflow-style: scrollbar;
} }
@ -354,7 +334,7 @@ select {
// controls in Android 4. // controls in Android 4.
// 2. Correct the inability to style clickable types in iOS and Safari. // 2. Correct the inability to style clickable types in iOS and Safari.
button, button,
html [type="button"], // 1 [type="button"], // 1
[type="reset"], [type="reset"],
[type="submit"] { [type="submit"] {
-webkit-appearance: button; // 2 -webkit-appearance: button; // 2
@ -444,7 +424,6 @@ progress {
// Remove the inner padding and cancel buttons in Chrome and Safari on macOS. // Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
// //
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration { [type="search"]::-webkit-search-decoration {
-webkit-appearance: none; -webkit-appearance: none;
} }

53
src/sass/bootstrap4/_spinners.scss Normal file
View File

@ -0,0 +1,53 @@
//
// Rotating border
//
@keyframes spinner-border {
to { transform: rotate(360deg); }
}
.spinner-border {
display: inline-block;
width: $spinner-width;
height: $spinner-height;
vertical-align: text-bottom;
border: $spinner-border-width solid currentColor;
border-right-color: transparent;
border-radius: 50%;
animation: spinner-border .75s linear infinite;
}
.spinner-border-sm {
width: $spinner-width-sm;
height: $spinner-height-sm;
border-width: $spinner-border-width-sm;
}
//
// Growing circle
//
@keyframes spinner-grow {
0% {
transform: scale(0);
}
50% {
opacity: 1;
}
}
.spinner-grow {
display: inline-block;
width: $spinner-width;
height: $spinner-height;
vertical-align: text-bottom;
background-color: currentColor;
border-radius: 50%;
opacity: 0;
animation: spinner-grow .75s linear infinite;
}
.spinner-grow-sm {
width: $spinner-width-sm;
height: $spinner-height-sm;
}

4
src/sass/bootstrap4/_tables.scss
View File

@ -56,7 +56,7 @@
thead { thead {
th, th,
td { td {
border-bottom-width: (2 * $table-border-width); border-bottom-width: 2 * $table-border-width;
} }
} }
} }
@ -100,7 +100,7 @@
// inheritance to nested tables. // inheritance to nested tables.
@each $color, $value in $theme-colors { @each $color, $value in $theme-colors {
@include table-row-variant($color, theme-color-level($color, -9)); @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
} }
@include table-row-variant(active, $table-active-bg); @include table-row-variant(active, $table-active-bg);

43
src/sass/bootstrap4/_toasts.scss Normal file
View File

@ -0,0 +1,43 @@
.toast {
max-width: $toast-max-width;
overflow: hidden; // cheap rounded corners on nested items
font-size: $toast-font-size; // knock it down to 14px
background-color: $toast-background-color;
background-clip: padding-box;
border: $toast-border-width solid $toast-border-color;
border-radius: $toast-border-radius;
box-shadow: $toast-box-shadow;
backdrop-filter: blur(10px);
opacity: 0;
&:not(:last-child) {
margin-bottom: $toast-padding-x;
}
&.showing {
opacity: 1;
}
&.show {
display: block;
opacity: 1;
}
&.hide {
display: none;
}
}
.toast-header {
display: flex;
align-items: center;
padding: $toast-padding-y $toast-padding-x;
color: $toast-header-color;
background-color: $toast-header-background-color;
background-clip: padding-box;
border-bottom: $toast-border-width solid $toast-header-border-color;
}
.toast-body {
padding: $toast-padding-x; // apply to both vertical and horizontal
}

4
src/sass/bootstrap4/_type.scss
View File

@ -116,10 +116,10 @@ mark,
.blockquote-footer { .blockquote-footer {
display: block; display: block;
font-size: 80%; // back to default font-size font-size: $blockquote-small-font-size;
color: $blockquote-small-color; color: $blockquote-small-color;
&::before { &::before {
content: "\2014 \00A0"; // em dash, nbsp content: "\2014\00A0"; // em dash, nbsp
} }
} }

1
src/sass/bootstrap4/_utilities.scss
View File

@ -6,6 +6,7 @@
@import "utilities/embed"; @import "utilities/embed";
@import "utilities/flex"; @import "utilities/flex";
@import "utilities/float"; @import "utilities/float";
@import "utilities/overflow";
@import "utilities/position"; @import "utilities/position";
@import "utilities/screenreaders"; @import "utilities/screenreaders";
@import "utilities/shadows"; @import "utilities/shadows";

303
src/sass/bootstrap4/_variables.scss
View File

@ -3,10 +3,7 @@
// Variables should follow the `$component-state-property-size` formula for // Variables should follow the `$component-state-property-size` formula for
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
//
// Color system // Color system
//
$white: #fff !default; $white: #fff !default;
$gray-100: #f8f9fa !default; $gray-100: #f8f9fa !default;
@ -37,7 +34,6 @@ $grays: map-merge(
$grays $grays
); );
$blue: #007bff !default; $blue: #007bff !default;
$indigo: #6610f2 !default; $indigo: #6610f2 !default;
$purple: #6f42c1 !default; $purple: #6f42c1 !default;
@ -105,18 +101,21 @@ $yiq-contrasted-threshold: 150 !default;
$yiq-text-dark: $gray-900 !default; $yiq-text-dark: $gray-900 !default;
$yiq-text-light: $white !default; $yiq-text-light: $white !default;
// Options // Options
// //
// Quickly modify global styling by enabling or disabling optional features. // Quickly modify global styling by enabling or disabling optional features.
$enable-caret: true !default; $enable-caret: true !default;
$enable-rounded: true !default; $enable-rounded: true !default;
$enable-shadows: false !default; $enable-shadows: false !default;
$enable-gradients: false !default; $enable-gradients: false !default;
$enable-transitions: true !default; $enable-transitions: true !default;
$enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS $enable-prefers-reduced-motion-media-query: true !default;
$enable-grid-classes: true !default; $enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS
$enable-print-styles: true !default; $enable-grid-classes: true !default;
$enable-print-styles: true !default;
$enable-validation-icons: true !default;
// Spacing // Spacing
@ -154,6 +153,7 @@ $sizes: map-merge(
$sizes $sizes
); );
// Body // Body
// //
// Settings for the `<body>` element. // Settings for the `<body>` element.
@ -161,14 +161,17 @@ $sizes: map-merge(
$body-bg: $white !default; $body-bg: $white !default;
$body-color: $gray-900 !default; $body-color: $gray-900 !default;
// Links // Links
// //
// Style anchor elements. // Style anchor elements.
$link-color: theme-color("primary") !default; $link-color: theme-color("primary") !default;
$link-decoration: none !default; $link-decoration: none !default;
$link-hover-color: darken($link-color, 15%) !default; $link-hover-color: darken($link-color, 15%) !default;
$link-hover-decoration: underline !default; $link-hover-decoration: underline !default;
// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
$emphasized-link-hover-darken-percentage: 15% !default;
// Paragraphs // Paragraphs
// //
@ -182,13 +185,18 @@ $paragraph-margin-bottom: 1rem !default;
// Define the minimum dimensions at which your layout will change, // Define the minimum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries. // adapting to different screen sizes, for use in media queries.
$grid-breakpoints: ( $grid-breakpoints: () !default;
xs: 0, // stylelint-disable-next-line scss/dollar-variable-default
sm: 576px, $grid-breakpoints: map-merge(
md: 768px, (
lg: 992px, xs: 0,
xl: 1200px sm: 576px,
) !default; md: 768px,
lg: 992px,
xl: 1200px
),
$grid-breakpoints
);
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
@include _assert-starts-at-zero($grid-breakpoints); @include _assert-starts-at-zero($grid-breakpoints);
@ -198,12 +206,17 @@ $grid-breakpoints: (
// //
// Define the maximum width of `.container` for different screen sizes. // Define the maximum width of `.container` for different screen sizes.
$container-max-widths: ( $container-max-widths: () !default;
sm: 540px, // stylelint-disable-next-line scss/dollar-variable-default
md: 720px, $container-max-widths: map-merge(
lg: 960px, (
xl: 1140px sm: 540px,
) !default; md: 720px,
lg: 960px,
xl: 1140px
),
$container-max-widths
);
@include _assert-ascending($container-max-widths, "$container-max-widths"); @include _assert-ascending($container-max-widths, "$container-max-widths");
@ -215,6 +228,7 @@ $container-max-widths: (
$grid-columns: 12 !default; $grid-columns: 12 !default;
$grid-gutter-width: 30px !default; $grid-gutter-width: 30px !default;
// Components // Components
// //
// Define common padding and border radius sizes and more. // Define common padding and border radius sizes and more.
@ -229,6 +243,8 @@ $border-radius: .25rem !default;
$border-radius-lg: .3rem !default; $border-radius-lg: .3rem !default;
$border-radius-sm: .2rem !default; $border-radius-sm: .2rem !default;
$rounded-pill: 50rem !default;
$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default; $box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
$box-shadow: 0 .5rem 1rem rgba($black, .15) !default; $box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default; $box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
@ -242,13 +258,24 @@ $transition-base: all .2s ease-in-out !default;
$transition-fade: opacity .15s linear !default; $transition-fade: opacity .15s linear !default;
$transition-collapse: height .35s ease !default; $transition-collapse: height .35s ease !default;
$embed-responsive-aspect-ratios: () !default;
// stylelint-disable-next-line scss/dollar-variable-default
$embed-responsive-aspect-ratios: join(
(
(21 9),
(16 9),
(3 4),
(1 1),
),
$embed-responsive-aspect-ratios
);
// Fonts // Fonts
// //
// Font, line-height, and color for body text, headings, and more. // Font, line-height, and color for body text, headings, and more.
// stylelint-disable value-keyword-case // stylelint-disable value-keyword-case
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default; $font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default; $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
$font-family-base: $font-family-sans-serif !default; $font-family-base: $font-family-sans-serif !default;
// stylelint-enable value-keyword-case // stylelint-enable value-keyword-case
@ -257,9 +284,11 @@ $font-size-base: 1rem !default; // Assumes the browser default, typ
$font-size-lg: ($font-size-base * 1.25) !default; $font-size-lg: ($font-size-base * 1.25) !default;
$font-size-sm: ($font-size-base * .875) !default; $font-size-sm: ($font-size-base * .875) !default;
$font-weight-lighter: lighter !default;
$font-weight-light: 300 !default; $font-weight-light: 300 !default;
$font-weight-normal: 400 !default; $font-weight-normal: 400 !default;
$font-weight-bold: 700 !default; $font-weight-bold: 700 !default;
$font-weight-bolder: bolder !default;
$font-weight-base: $font-weight-normal !default; $font-weight-base: $font-weight-normal !default;
$line-height-base: 1.5 !default; $line-height-base: 1.5 !default;
@ -271,7 +300,7 @@ $h4-font-size: $font-size-base * 1.5 !default;
$h5-font-size: $font-size-base * 1.25 !default; $h5-font-size: $font-size-base * 1.25 !default;
$h6-font-size: $font-size-base !default; $h6-font-size: $font-size-base !default;
$headings-margin-bottom: ($spacer / 2) !default; $headings-margin-bottom: $spacer / 2 !default;
$headings-font-family: inherit !default; $headings-font-family: inherit !default;
$headings-font-weight: 500 !default; $headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default; $headings-line-height: 1.2 !default;
@ -296,6 +325,7 @@ $small-font-size: 80% !default;
$text-muted: $gray-600 !default; $text-muted: $gray-600 !default;
$blockquote-small-color: $gray-600 !default; $blockquote-small-color: $gray-600 !default;
$blockquote-small-font-size: $small-font-size !default;
$blockquote-font-size: ($font-size-base * 1.25) !default; $blockquote-font-size: ($font-size-base * 1.25) !default;
$hr-border-color: rgba($black, .1) !default; $hr-border-color: rgba($black, .1) !default;
@ -337,18 +367,23 @@ $table-dark-bg: $gray-900 !default;
$table-dark-accent-bg: rgba($white, .05) !default; $table-dark-accent-bg: rgba($white, .05) !default;
$table-dark-hover-bg: rgba($white, .075) !default; $table-dark-hover-bg: rgba($white, .075) !default;
$table-dark-border-color: lighten($gray-900, 7.5%) !default; $table-dark-border-color: lighten($gray-900, 7.5%) !default;
$table-dark-color: $body-bg !default; $table-dark-color: $white !default;
$table-striped-order: odd !default; $table-striped-order: odd !default;
$table-caption-color: $text-muted !default; $table-caption-color: $text-muted !default;
$table-bg-level: -9 !default;
$table-border-level: -6 !default;
// Buttons + Forms // Buttons + Forms
// //
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables. // Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
$input-btn-padding-y: .375rem !default; $input-btn-padding-y: .375rem !default;
$input-btn-padding-x: .75rem !default; $input-btn-padding-x: .75rem !default;
$input-btn-font-size: $font-size-base !default;
$input-btn-line-height: $line-height-base !default; $input-btn-line-height: $line-height-base !default;
$input-btn-focus-width: .2rem !default; $input-btn-focus-width: .2rem !default;
@ -357,10 +392,12 @@ $input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-colo
$input-btn-padding-y-sm: .25rem !default; $input-btn-padding-y-sm: .25rem !default;
$input-btn-padding-x-sm: .5rem !default; $input-btn-padding-x-sm: .5rem !default;
$input-btn-font-size-sm: $font-size-sm !default;
$input-btn-line-height-sm: $line-height-sm !default; $input-btn-line-height-sm: $line-height-sm !default;
$input-btn-padding-y-lg: .5rem !default; $input-btn-padding-y-lg: .5rem !default;
$input-btn-padding-x-lg: 1rem !default; $input-btn-padding-x-lg: 1rem !default;
$input-btn-font-size-lg: $font-size-lg !default;
$input-btn-line-height-lg: $line-height-lg !default; $input-btn-line-height-lg: $line-height-lg !default;
$input-btn-border-width: $border-width !default; $input-btn-border-width: $border-width !default;
@ -372,14 +409,17 @@ $input-btn-border-width: $border-width !default;
$btn-padding-y: $input-btn-padding-y !default; $btn-padding-y: $input-btn-padding-y !default;
$btn-padding-x: $input-btn-padding-x !default; $btn-padding-x: $input-btn-padding-x !default;
$btn-font-size: $input-btn-font-size !default;
$btn-line-height: $input-btn-line-height !default; $btn-line-height: $input-btn-line-height !default;
$btn-padding-y-sm: $input-btn-padding-y-sm !default; $btn-padding-y-sm: $input-btn-padding-y-sm !default;
$btn-padding-x-sm: $input-btn-padding-x-sm !default; $btn-padding-x-sm: $input-btn-padding-x-sm !default;
$btn-font-size-sm: $input-btn-font-size-sm !default;
$btn-line-height-sm: $input-btn-line-height-sm !default; $btn-line-height-sm: $input-btn-line-height-sm !default;
$btn-padding-y-lg: $input-btn-padding-y-lg !default; $btn-padding-y-lg: $input-btn-padding-y-lg !default;
$btn-padding-x-lg: $input-btn-padding-x-lg !default; $btn-padding-x-lg: $input-btn-padding-x-lg !default;
$btn-font-size-lg: $input-btn-font-size-lg !default;
$btn-line-height-lg: $input-btn-line-height-lg !default; $btn-line-height-lg: $input-btn-line-height-lg !default;
$btn-border-width: $input-btn-border-width !default; $btn-border-width: $input-btn-border-width !default;
@ -409,14 +449,18 @@ $label-margin-bottom: .5rem !default;
$input-padding-y: $input-btn-padding-y !default; $input-padding-y: $input-btn-padding-y !default;
$input-padding-x: $input-btn-padding-x !default; $input-padding-x: $input-btn-padding-x !default;
$input-font-size: $input-btn-font-size !default;
$input-font-weight: $font-weight-base !default;
$input-line-height: $input-btn-line-height !default; $input-line-height: $input-btn-line-height !default;
$input-padding-y-sm: $input-btn-padding-y-sm !default; $input-padding-y-sm: $input-btn-padding-y-sm !default;
$input-padding-x-sm: $input-btn-padding-x-sm !default; $input-padding-x-sm: $input-btn-padding-x-sm !default;
$input-font-size-sm: $input-btn-font-size-sm !default;
$input-line-height-sm: $input-btn-line-height-sm !default; $input-line-height-sm: $input-btn-line-height-sm !default;
$input-padding-y-lg: $input-btn-padding-y-lg !default; $input-padding-y-lg: $input-btn-padding-y-lg !default;
$input-padding-x-lg: $input-btn-padding-x-lg !default; $input-padding-x-lg: $input-btn-padding-x-lg !default;
$input-font-size-lg: $input-btn-font-size-lg !default;
$input-line-height-lg: $input-btn-line-height-lg !default; $input-line-height-lg: $input-btn-line-height-lg !default;
$input-bg: $white !default; $input-bg: $white !default;
@ -442,13 +486,13 @@ $input-plaintext-color: $body-color !default;
$input-height-border: $input-border-width * 2 !default; $input-height-border: $input-border-width * 2 !default;
$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default; $input-height-inner: ($input-btn-font-size * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
$input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default; $input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default;
$input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default; $input-height-inner-sm: ($input-btn-font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default;
$input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default; $input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default;
$input-height-inner-lg: ($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default; $input-height-inner-lg: ($input-btn-font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default;
$input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default; $input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default;
$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
@ -462,6 +506,7 @@ $form-check-input-margin-x: .25rem !default;
$form-check-inline-margin-x: .75rem !default; $form-check-inline-margin-x: .75rem !default;
$form-check-inline-input-margin-x: .3125rem !default; $form-check-inline-input-margin-x: .3125rem !default;
$form-grid-gutter-width: 10px !default;
$form-group-margin-bottom: 1rem !default; $form-group-margin-bottom: 1rem !default;
$input-group-addon-color: $input-color !default; $input-group-addon-color: $input-color !default;
@ -470,64 +515,86 @@ $input-group-addon-border-color: $input-border-color !default;
$custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
$custom-control-gutter: 1.5rem !default; $custom-control-gutter: .5rem !default;
$custom-control-spacer-x: 1rem !default; $custom-control-spacer-x: 1rem !default;
$custom-control-indicator-size: 1rem !default; $custom-control-indicator-size: 1rem !default;
$custom-control-indicator-bg: $gray-300 !default; $custom-control-indicator-bg: $input-bg !default;
$custom-control-indicator-bg-size: 50% 50% !default;
$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default;
$custom-control-indicator-disabled-bg: $gray-200 !default; $custom-control-indicator-bg-size: 50% 50% !default;
$custom-control-indicator-box-shadow: $input-box-shadow !default;
$custom-control-indicator-border-color: $gray-500 !default;
$custom-control-indicator-border-width: $input-border-width !default;
$custom-control-indicator-disabled-bg: $input-disabled-bg !default;
$custom-control-label-disabled-color: $gray-600 !default; $custom-control-label-disabled-color: $gray-600 !default;
$custom-control-indicator-checked-color: $component-active-color !default; $custom-control-indicator-checked-color: $component-active-color !default;
$custom-control-indicator-checked-bg: $component-active-bg !default; $custom-control-indicator-checked-bg: $component-active-bg !default;
$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; $custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default;
$custom-control-indicator-checked-box-shadow: none !default; $custom-control-indicator-checked-box-shadow: none !default;
$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default; $custom-control-indicator-focus-box-shadow: $input-btn-focus-box-shadow !default;
$custom-control-indicator-focus-border-color: $input-focus-border-color !default;
$custom-control-indicator-active-color: $component-active-color !default; $custom-control-indicator-active-color: $component-active-color !default;
$custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default; $custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default;
$custom-control-indicator-active-box-shadow: none !default; $custom-control-indicator-active-box-shadow: none !default;
$custom-control-indicator-active-border-color: $custom-control-indicator-active-bg !default;
$custom-checkbox-indicator-border-radius: $border-radius !default; $custom-checkbox-indicator-border-radius: $border-radius !default;
$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e"), "#", "%23") !default;
$custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default; $custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default;
$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default; $custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default;
$custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3e%3c/svg%3e"), "#", "%23") !default;
$custom-checkbox-indicator-indeterminate-box-shadow: none !default; $custom-checkbox-indicator-indeterminate-box-shadow: none !default;
$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;
$custom-radio-indicator-border-radius: 50% !default; $custom-radio-indicator-border-radius: 50% !default;
$custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3e%3c/svg%3e"), "#", "%23") !default;
$custom-select-padding-y: .375rem !default; $custom-switch-width: $custom-control-indicator-size * 1.75 !default;
$custom-select-padding-x: .75rem !default; $custom-switch-indicator-border-radius: $custom-control-indicator-size / 2 !default;
$custom-switch-indicator-size: calc(#{$custom-control-indicator-size} - #{$custom-control-indicator-border-width * 4}) !default;
$custom-select-padding-y: $input-btn-padding-y !default;
$custom-select-padding-x: $input-btn-padding-x !default;
$custom-select-height: $input-height !default; $custom-select-height: $input-height !default;
$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator $custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
$custom-select-line-height: $input-btn-line-height !default; $custom-select-font-weight: $input-font-weight !default;
$custom-select-line-height: $input-line-height !default;
$custom-select-color: $input-color !default; $custom-select-color: $input-color !default;
$custom-select-disabled-color: $gray-600 !default; $custom-select-disabled-color: $gray-600 !default;
$custom-select-bg: $input-bg !default; $custom-select-bg: $input-bg !default;
$custom-select-disabled-bg: $gray-200 !default; $custom-select-disabled-bg: $gray-200 !default;
$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions $custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
$custom-select-indicator-color: $gray-800 !default; $custom-select-indicator-color: $gray-800 !default;
$custom-select-indicator: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-select-indicator: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e"), "#", "%23") !default;
$custom-select-border-width: $input-btn-border-width !default; $custom-select-background: $custom-select-indicator no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
$custom-select-feedback-icon-padding-right: $input-height-inner * 3 / 4 + $custom-select-padding-x + $custom-select-indicator-padding !default;
$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
$custom-select-feedback-icon-size: ($input-height-inner / 2) ($input-height-inner / 2) !default;
$custom-select-border-width: $input-border-width !default;
$custom-select-border-color: $input-border-color !default; $custom-select-border-color: $input-border-color !default;
$custom-select-border-radius: $border-radius !default; $custom-select-border-radius: $border-radius !default;
$custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default; $custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default;
$custom-select-focus-border-color: $input-focus-border-color !default; $custom-select-focus-border-color: $input-focus-border-color !default;
$custom-select-focus-width: $input-btn-focus-width !default; $custom-select-focus-width: $input-focus-width !default;
$custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width rgba($custom-select-focus-border-color, .5) !default; $custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width rgba($custom-select-focus-border-color, .5) !default;
$custom-select-font-size-sm: 75% !default; $custom-select-padding-y-sm: $input-padding-y-sm !default;
$custom-select-padding-x-sm: $input-padding-x-sm !default;
$custom-select-font-size-sm: $input-btn-font-size-sm !default;
$custom-select-height-sm: $input-height-sm !default; $custom-select-height-sm: $input-height-sm !default;
$custom-select-font-size-lg: 125% !default; $custom-select-padding-y-lg: $input-padding-y-lg !default;
$custom-select-padding-x-lg: $input-padding-x-lg !default;
$custom-select-font-size-lg: $input-btn-font-size-lg !default;
$custom-select-height-lg: $input-height-lg !default; $custom-select-height-lg: $input-height-lg !default;
$custom-range-track-width: 100% !default; $custom-range-track-width: 100% !default;
@ -543,22 +610,24 @@ $custom-range-thumb-bg: $component-active-bg !default;
$custom-range-thumb-border: 0 !default; $custom-range-thumb-border: 0 !default;
$custom-range-thumb-border-radius: 1rem !default; $custom-range-thumb-border-radius: 1rem !default;
$custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default; $custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default; $custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
$custom-range-thumb-focus-box-shadow-width: $input-btn-focus-width !default; // For focus box shadow issue in IE/Edge $custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge
$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default; $custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
$custom-range-thumb-disabled-bg: $gray-500 !default;
$custom-file-height: $input-height !default; $custom-file-height: $input-height !default;
$custom-file-height-inner: $input-height-inner !default; $custom-file-height-inner: $input-height-inner !default;
$custom-file-focus-border-color: $input-focus-border-color !default; $custom-file-focus-border-color: $input-focus-border-color !default;
$custom-file-focus-box-shadow: $input-btn-focus-box-shadow !default; $custom-file-focus-box-shadow: $input-focus-box-shadow !default;
$custom-file-disabled-bg: $input-disabled-bg !default; $custom-file-disabled-bg: $input-disabled-bg !default;
$custom-file-padding-y: $input-btn-padding-y !default; $custom-file-padding-y: $input-padding-y !default;
$custom-file-padding-x: $input-btn-padding-x !default; $custom-file-padding-x: $input-padding-x !default;
$custom-file-line-height: $input-btn-line-height !default; $custom-file-line-height: $input-line-height !default;
$custom-file-font-weight: $input-font-weight !default;
$custom-file-color: $input-color !default; $custom-file-color: $input-color !default;
$custom-file-bg: $input-bg !default; $custom-file-bg: $input-bg !default;
$custom-file-border-width: $input-btn-border-width !default; $custom-file-border-width: $input-border-width !default;
$custom-file-border-color: $input-border-color !default; $custom-file-border-color: $input-border-color !default;
$custom-file-border-radius: $input-border-radius !default; $custom-file-border-radius: $input-border-radius !default;
$custom-file-box-shadow: $input-box-shadow !default; $custom-file-box-shadow: $input-box-shadow !default;
@ -570,11 +639,17 @@ $custom-file-text: (
// Form validation // Form validation
$form-feedback-margin-top: $form-text-margin-top !default; $form-feedback-margin-top: $form-text-margin-top !default;
$form-feedback-font-size: $small-font-size !default; $form-feedback-font-size: $small-font-size !default;
$form-feedback-valid-color: theme-color("success") !default; $form-feedback-valid-color: theme-color("success") !default;
$form-feedback-invalid-color: theme-color("danger") !default; $form-feedback-invalid-color: theme-color("danger") !default;
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
$form-feedback-icon-valid: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"), "#", "%23") !default;
$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;
$form-feedback-icon-invalid: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$form-feedback-icon-invalid-color}' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"), "#", "%23") !default;
// Dropdowns // Dropdowns
// //
@ -587,6 +662,7 @@ $dropdown-bg: $white !default;
$dropdown-border-color: rgba($black, .15) !default; $dropdown-border-color: rgba($black, .15) !default;
$dropdown-border-radius: $border-radius !default; $dropdown-border-radius: $border-radius !default;
$dropdown-border-width: $border-width !default; $dropdown-border-width: $border-width !default;
$dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default;
$dropdown-divider-bg: $gray-200 !default; $dropdown-divider-bg: $gray-200 !default;
$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default; $dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
@ -618,6 +694,7 @@ $zindex-modal: 1050 !default;
$zindex-popover: 1060 !default; $zindex-popover: 1060 !default;
$zindex-tooltip: 1070 !default; $zindex-tooltip: 1070 !default;
// Navs // Navs
$nav-link-padding-y: .5rem !default; $nav-link-padding-y: .5rem !default;
@ -637,18 +714,19 @@ $nav-pills-link-active-color: $component-active-color !default;
$nav-pills-link-active-bg: $component-active-bg !default; $nav-pills-link-active-bg: $component-active-bg !default;
$nav-divider-color: $gray-200 !default; $nav-divider-color: $gray-200 !default;
$nav-divider-margin-y: ($spacer / 2) !default; $nav-divider-margin-y: $spacer / 2 !default;
// Navbar // Navbar
$navbar-padding-y: ($spacer / 2) !default; $navbar-padding-y: $spacer / 2 !default;
$navbar-padding-x: $spacer !default; $navbar-padding-x: $spacer !default;
$navbar-nav-link-padding-x: .5rem !default; $navbar-nav-link-padding-x: .5rem !default;
$navbar-brand-font-size: $font-size-lg !default; $navbar-brand-font-size: $font-size-lg !default;
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
$nav-link-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default; $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default; $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default;
@ -661,16 +739,22 @@ $navbar-dark-color: rgba($white, .5) !default;
$navbar-dark-hover-color: rgba($white, .75) !default; $navbar-dark-hover-color: rgba($white, .75) !default;
$navbar-dark-active-color: $white !default; $navbar-dark-active-color: $white !default;
$navbar-dark-disabled-color: rgba($white, .25) !default; $navbar-dark-disabled-color: rgba($white, .25) !default;
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default; $navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
$navbar-dark-toggler-border-color: rgba($white, .1) !default; $navbar-dark-toggler-border-color: rgba($white, .1) !default;
$navbar-light-color: rgba($black, .5) !default; $navbar-light-color: rgba($black, .5) !default;
$navbar-light-hover-color: rgba($black, .7) !default; $navbar-light-hover-color: rgba($black, .7) !default;
$navbar-light-active-color: rgba($black, .9) !default; $navbar-light-active-color: rgba($black, .9) !default;
$navbar-light-disabled-color: rgba($black, .3) !default; $navbar-light-disabled-color: rgba($black, .3) !default;
$navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default; $navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
$navbar-light-toggler-border-color: rgba($black, .1) !default; $navbar-light-toggler-border-color: rgba($black, .1) !default;
$navbar-light-brand-color: $navbar-light-active-color !default;
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
$navbar-dark-brand-color: $navbar-dark-active-color !default;
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
// Pagination // Pagination
$pagination-padding-y: .5rem !default; $pagination-padding-y: .5rem !default;
@ -717,11 +801,12 @@ $card-border-radius: $border-radius !default;
$card-border-color: rgba($black, .125) !default; $card-border-color: rgba($black, .125) !default;
$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; $card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default;
$card-cap-bg: rgba($black, .03) !default; $card-cap-bg: rgba($black, .03) !default;
$card-cap-color: inherit !default;
$card-bg: $white !default; $card-bg: $white !default;
$card-img-overlay-padding: 1.25rem !default; $card-img-overlay-padding: 1.25rem !default;
$card-group-margin: ($grid-gutter-width / 2) !default; $card-group-margin: $grid-gutter-width / 2 !default;
$card-deck-margin: $card-group-margin !default; $card-deck-margin: $card-group-margin !default;
$card-columns-count: 3 !default; $card-columns-count: 3 !default;
@ -745,6 +830,14 @@ $tooltip-arrow-width: .8rem !default;
$tooltip-arrow-height: .4rem !default; $tooltip-arrow-height: .4rem !default;
$tooltip-arrow-color: $tooltip-bg !default; $tooltip-arrow-color: $tooltip-bg !default;
// Form tooltips must come after regular tooltips
$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;
$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;
$form-feedback-tooltip-font-size: $tooltip-font-size !default;
$form-feedback-tooltip-line-height: $line-height-base !default;
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
// Popovers // Popovers
@ -772,6 +865,22 @@ $popover-arrow-color: $popover-bg !default;
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default; $popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
// Toasts
$toast-max-width: 350px !default;
$toast-padding-x: .75rem !default;
$toast-padding-y: .25rem !default;
$toast-font-size: .875rem !default;
$toast-background-color: rgba($white, .85) !default;
$toast-border-width: 1px !default;
$toast-border-color: rgba(0, 0, 0, .1) !default;
$toast-border-radius: .25rem !default;
$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default;
$toast-header-color: $gray-600 !default;
$toast-header-background-color: rgba($white, .85) !default;
$toast-header-border-color: rgba(0, 0, 0, .05) !default;
// Badges // Badges
$badge-font-size: 75% !default; $badge-font-size: 75% !default;
@ -809,12 +918,17 @@ $modal-header-border-color: $gray-200 !default;
$modal-footer-border-color: $modal-header-border-color !default; $modal-footer-border-color: $modal-header-border-color !default;
$modal-header-border-width: $modal-content-border-width !default; $modal-header-border-width: $modal-content-border-width !default;
$modal-footer-border-width: $modal-header-border-width !default; $modal-footer-border-width: $modal-header-border-width !default;
$modal-header-padding: 1rem !default; $modal-header-padding-y: 1rem !default;
$modal-header-padding-x: 1rem !default;
$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
$modal-xl: 1140px !default;
$modal-lg: 800px !default; $modal-lg: 800px !default;
$modal-md: 500px !default; $modal-md: 500px !default;
$modal-sm: 300px !default; $modal-sm: 300px !default;
$modal-fade-transform: translate(0, -50px) !default;
$modal-show-transform: none !default;
$modal-transition: transform .3s ease-out !default; $modal-transition: transform .3s ease-out !default;
@ -846,6 +960,7 @@ $progress-bar-bg: theme-color("primary") !default;
$progress-bar-animation-timing: 1s linear infinite !default; $progress-bar-animation-timing: 1s linear infinite !default;
$progress-bar-transition: width .6s ease !default; $progress-bar-transition: width .6s ease !default;
// List group // List group
$list-group-bg: $white !default; $list-group-bg: $white !default;
@ -905,24 +1020,40 @@ $breadcrumb-border-radius: $border-radius !default;
// Carousel // Carousel
$carousel-control-color: $white !default; $carousel-control-color: $white !default;
$carousel-control-width: 15% !default; $carousel-control-width: 15% !default;
$carousel-control-opacity: .5 !default; $carousel-control-opacity: .5 !default;
$carousel-control-hover-opacity: .9 !default;
$carousel-control-transition: opacity .15s ease !default;
$carousel-indicator-width: 30px !default; $carousel-indicator-width: 30px !default;
$carousel-indicator-height: 3px !default; $carousel-indicator-height: 3px !default;
$carousel-indicator-spacer: 3px !default; $carousel-indicator-hit-area-height: 10px !default;
$carousel-indicator-active-bg: $white !default; $carousel-indicator-spacer: 3px !default;
$carousel-indicator-active-bg: $white !default;
$carousel-indicator-transition: opacity .6s ease !default;
$carousel-caption-width: 70% !default; $carousel-caption-width: 70% !default;
$carousel-caption-color: $white !default; $carousel-caption-color: $white !default;
$carousel-control-icon-width: 20px !default; $carousel-control-icon-width: 20px !default;
$carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"), "#", "%23") !default; $carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e"), "#", "%23") !default;
$carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"), "#", "%23") !default; $carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e"), "#", "%23") !default;
$carousel-transition: transform .6s ease !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`) $carousel-transition-duration: .6s !default;
$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
// Spinners
$spinner-width: 2rem !default;
$spinner-height: $spinner-width !default;
$spinner-border-width: .25em !default;
$spinner-width-sm: 1rem !default;
$spinner-height-sm: $spinner-width-sm !default;
$spinner-border-width-sm: .2em !default;
// Close // Close
@ -932,6 +1063,7 @@ $close-font-weight: $font-weight-bold !default;
$close-color: $black !default; $close-color: $black !default;
$close-text-shadow: 0 1px 0 $white !default; $close-text-shadow: 0 1px 0 $white !default;
// Code // Code
$code-font-size: 87.5% !default; $code-font-size: 87.5% !default;
@ -947,6 +1079,13 @@ $pre-color: $gray-900 !default;
$pre-scrollable-max-height: 340px !default; $pre-scrollable-max-height: 340px !default;
// Utilities
$overflows: auto, hidden !default;
$positions: static, relative, absolute, fixed, sticky !default;
// Printing // Printing
$print-page-size: a3 !default; $print-page-size: a3 !default;
$print-body-min-width: map-get($grid-breakpoints, "lg") !default; $print-body-min-width: map-get($grid-breakpoints, "lg") !default;

7
src/sass/bootstrap4/bootstrap-grid.scss vendored
View File

@ -1,14 +1,10 @@
/*! /*!
* Bootstrap Grid v4.1.3 (https://getbootstrap.com/) * Bootstrap Grid v4.2.1 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc. * Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/ */
@at-root {
@-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix
}
html { html {
box-sizing: border-box; box-sizing: border-box;
-ms-overflow-style: scrollbar; -ms-overflow-style: scrollbar;
@ -30,3 +26,4 @@ html {
@import "grid"; @import "grid";
@import "utilities/display"; @import "utilities/display";
@import "utilities/flex"; @import "utilities/flex";
@import "utilities/spacing";

2
src/sass/bootstrap4/bootstrap-reboot.scss vendored
View File

@ -1,5 +1,5 @@
/*! /*!
* Bootstrap Reboot v4.1.3 (https://getbootstrap.com/) * Bootstrap Reboot v4.2.1 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc. * Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)

4
src/sass/bootstrap4/bootstrap.scss vendored
View File

@ -1,5 +1,5 @@
/*! /*!
* Bootstrap v4.1.3 (https://getbootstrap.com/) * Bootstrap v4.2.1 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc. * Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
@ -34,9 +34,11 @@
@import "media"; @import "media";
@import "list-group"; @import "list-group";
@import "close"; @import "close";
@import "toasts";
@import "modal"; @import "modal";
@import "tooltip"; @import "tooltip";
@import "popover"; @import "popover";
@import "carousel"; @import "carousel";
@import "spinners";
@import "utilities"; @import "utilities";
@import "print"; @import "print";

3
src/sass/bootstrap4/mixins/_badge.scss
View File

@ -2,10 +2,9 @@
color: color-yiq($bg); color: color-yiq($bg);
background-color: $bg; background-color: $bg;
&[href] { @at-root a#{&} {
@include hover-focus { @include hover-focus {
color: color-yiq($bg); color: color-yiq($bg);
text-decoration: none;
background-color: darken($bg, 10%); background-color: darken($bg, 10%);
} }
} }

4
src/sass/bootstrap4/mixins/_breakpoints.scss
View File

@ -16,7 +16,7 @@
// md // md
@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) { @function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
$n: index($breakpoint-names, $name); $n: index($breakpoint-names, $name);
@return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null); @return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
} }
// Minimum breakpoint width. Null for the smallest (first) breakpoint. // Minimum breakpoint width. Null for the smallest (first) breakpoint.
@ -39,7 +39,7 @@
// 767.98px // 767.98px
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) { @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
$next: breakpoint-next($name, $breakpoints); $next: breakpoint-next($name, $breakpoints);
@return if($next, breakpoint-min($next, $breakpoints) - .02px, null); @return if($next, breakpoint-min($next, $breakpoints) - .02, null);
} }
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front. // Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.

16
src/sass/bootstrap4/mixins/_buttons.scss
View File

@ -19,9 +19,9 @@
&.focus { &.focus {
// Avoid using mixin so we can pass custom focus shadow properly // Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows { @if $enable-shadows {
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5); box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
} @else { } @else {
box-shadow: 0 0 0 $btn-focus-width rgba($border, .5); box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
} }
} }
@ -31,6 +31,10 @@
color: color-yiq($background); color: color-yiq($background);
background-color: $background; background-color: $background;
border-color: $border; border-color: $border;
// Remove CSS gradients if they're enabled
@if $enable-gradients {
background-image: none;
}
} }
&:not(:disabled):not(.disabled):active, &:not(:disabled):not(.disabled):active,
@ -46,9 +50,9 @@
&:focus { &:focus {
// Avoid using mixin so we can pass custom focus shadow properly // Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows { @if $enable-shadows {
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5); box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
} @else { } @else {
box-shadow: 0 0 0 $btn-focus-width rgba($border, .5); box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
} }
} }
} }
@ -56,11 +60,9 @@
@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) { @mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
color: $color; color: $color;
background-color: transparent;
background-image: none;
border-color: $color; border-color: $color;
&:hover { @include hover {
color: $color-hover; color: $color-hover;
background-color: $active-background; background-color: $active-background;
border-color: $active-border; border-color: $active-border;

4
src/sass/bootstrap4/mixins/_caret.scss
View File

@ -29,8 +29,6 @@
@if $enable-caret { @if $enable-caret {
&::after { &::after {
display: inline-block; display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85; margin-left: $caret-width * .85;
vertical-align: $caret-width * .85; vertical-align: $caret-width * .85;
content: ""; content: "";
@ -50,8 +48,6 @@
&::before { &::before {
display: inline-block; display: inline-block;
width: 0;
height: 0;
margin-right: $caret-width * .85; margin-right: $caret-width * .85;
vertical-align: $caret-width * .85; vertical-align: $caret-width * .85;
content: ""; content: "";

73
src/sass/bootstrap4/mixins/_forms.scss
View File

@ -41,21 +41,33 @@
z-index: 5; z-index: 5;
display: none; display: none;
max-width: 100%; // Contain to parent when possible max-width: 100%; // Contain to parent when possible
padding: $tooltip-padding-y $tooltip-padding-x; padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
margin-top: .1rem; margin-top: .1rem;
font-size: $tooltip-font-size; font-size: $form-feedback-tooltip-font-size;
line-height: $line-height-base; line-height: $form-feedback-tooltip-line-height;
color: color-yiq($color); color: color-yiq($color);
background-color: rgba($color, $tooltip-opacity); background-color: rgba($color, $form-feedback-tooltip-opacity);
@include border-radius($tooltip-border-radius); @include border-radius($form-feedback-tooltip-border-radius);
} }
.form-control, .form-control {
.custom-select {
.was-validated &:#{$state}, .was-validated &:#{$state},
&.is-#{$state} { &.is-#{$state} {
border-color: $color; border-color: $color;
@if $enable-validation-icons {
padding-right: $input-height-inner;
background-repeat: no-repeat;
background-position: center right calc(#{$input-height-inner} / 4);
background-size: calc(#{$input-height-inner} / 2) calc(#{$input-height-inner} / 2);
@if $state == "valid" {
background-image: $form-feedback-icon-valid;
} @else {
background-image: $form-feedback-icon-invalid;
}
}
&:focus { &:focus {
border-color: $color; border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25); box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
@ -68,6 +80,41 @@
} }
} }
// stylelint-disable-next-line selector-no-qualifying-type
textarea.form-control {
.was-validated &:#{$state},
&.is-#{$state} {
@if $enable-validation-icons {
padding-right: $input-height-inner;
background-position: top calc(#{$input-height-inner} / 4) right calc(#{$input-height-inner} / 4);
}
}
}
.custom-select {
.was-validated &:#{$state},
&.is-#{$state} {
border-color: $color;
@if $enable-validation-icons {
$form-feedback-icon: if($state == "valid", $form-feedback-icon-valid, $form-feedback-icon-invalid);
padding-right: $custom-select-feedback-icon-padding-right;
background: $custom-select-background, $form-feedback-icon no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size;
}
&:focus {
border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}
~ .#{$state}-feedback,
~ .#{$state}-tooltip {
display: block;
}
}
}
.form-control-file { .form-control-file {
.was-validated &:#{$state}, .was-validated &:#{$state},
&.is-#{$state} { &.is-#{$state} {
@ -99,7 +146,7 @@
color: $color; color: $color;
&::before { &::before {
background-color: lighten($color, 25%); border-color: $color;
} }
} }
@ -110,13 +157,18 @@
&:checked { &:checked {
~ .custom-control-label::before { ~ .custom-control-label::before {
border-color: lighten($color, 10%);
@include gradient-bg(lighten($color, 10%)); @include gradient-bg(lighten($color, 10%));
} }
} }
&:focus { &:focus {
~ .custom-control-label::before { ~ .custom-control-label::before {
box-shadow: 0 0 0 1px $body-bg, 0 0 0 $input-focus-width rgba($color, .25); box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}
&:not(:checked) ~ .custom-control-label::before {
border-color: $color;
} }
} }
} }
@ -128,8 +180,6 @@
&.is-#{$state} { &.is-#{$state} {
~ .custom-file-label { ~ .custom-file-label {
border-color: $color; border-color: $color;
&::after { border-color: inherit; }
} }
~ .#{$state}-feedback, ~ .#{$state}-feedback,
@ -139,6 +189,7 @@
&:focus { &:focus {
~ .custom-file-label { ~ .custom-file-label {
border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25); box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
} }
} }

7
src/sass/bootstrap4/mixins/_grid-framework.scss
View File

@ -8,9 +8,8 @@
%grid-column { %grid-column {
position: relative; position: relative;
width: 100%; width: 100%;
min-height: 1px; // Prevent columns from collapsing when empty padding-right: $gutter / 2;
padding-right: ($gutter / 2); padding-left: $gutter / 2;
padding-left: ($gutter / 2);
} }
@each $breakpoint in map-keys($breakpoints) { @each $breakpoint in map-keys($breakpoints) {
@ -37,7 +36,7 @@
.col#{$infix}-auto { .col#{$infix}-auto {
flex: 0 0 auto; flex: 0 0 auto;
width: auto; width: auto;
max-width: none; // Reset earlier grid tiers max-width: 100%; // Reset earlier grid tiers
} }
@for $i from 1 through $columns { @for $i from 1 through $columns {

19
src/sass/bootstrap4/mixins/_grid.scss
View File

@ -2,10 +2,10 @@
// //
// Generate semantic grid columns with these mixins. // Generate semantic grid columns with these mixins.
@mixin make-container() { @mixin make-container($gutter: $grid-gutter-width) {
width: 100%; width: 100%;
padding-right: ($grid-gutter-width / 2); padding-right: $gutter / 2;
padding-left: ($grid-gutter-width / 2); padding-left: $gutter / 2;
margin-right: auto; margin-right: auto;
margin-left: auto; margin-left: auto;
} }
@ -20,22 +20,21 @@
} }
} }
@mixin make-row() { @mixin make-row($gutter: $grid-gutter-width) {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin-right: ($grid-gutter-width / -2); margin-right: -$gutter / 2;
margin-left: ($grid-gutter-width / -2); margin-left: -$gutter / 2;
} }
@mixin make-col-ready() { @mixin make-col-ready($gutter: $grid-gutter-width) {
position: relative; position: relative;
// Prevent columns from becoming too narrow when at smaller grid tiers by // Prevent columns from becoming too narrow when at smaller grid tiers by
// always setting `width: 100%;`. This works because we use `flex` values // always setting `width: 100%;`. This works because we use `flex` values
// later on to override this initial width. // later on to override this initial width.
width: 100%; width: 100%;
min-height: 1px; // Prevent collapsing padding-right: $gutter / 2;
padding-right: ($grid-gutter-width / 2); padding-left: $gutter / 2;
padding-left: ($grid-gutter-width / 2);
} }
@mixin make-col($size, $columns: $grid-columns) { @mixin make-col($size, $columns: $grid-columns) {

11
src/sass/bootstrap4/mixins/_table-row.scss
View File

@ -1,6 +1,6 @@
// Tables // Tables
@mixin table-row-variant($state, $background) { @mixin table-row-variant($state, $background, $border: null) {
// Exact selectors below required to override `.table-striped` and prevent // Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables. // inheritance to nested tables.
.table-#{$state} { .table-#{$state} {
@ -9,6 +9,15 @@
> td { > td {
background-color: $background; background-color: $background;
} }
@if $border != null {
th,
td,
thead th,
tbody + tbody {
border-color: $border;
}
}
} }
// Hover states for `.table-hover` // Hover states for `.table-hover`

2
src/sass/bootstrap4/mixins/_text-emphasis.scss
View File

@ -8,7 +8,7 @@
} }
a#{$parent} { a#{$parent} {
@include hover-focus { @include hover-focus {
color: darken($color, 10%) !important; color: darken($color, $emphasized-link-hover-darken-percentage) !important;
} }
} }
} }

7
src/sass/bootstrap4/mixins/_transition.scss
View File

@ -1,3 +1,4 @@
// stylelint-disable property-blacklist
@mixin transition($transition...) { @mixin transition($transition...) {
@if $enable-transitions { @if $enable-transitions {
@if length($transition) == 0 { @if length($transition) == 0 {
@ -7,7 +8,9 @@
} }
} }
@media screen and (prefers-reduced-motion: reduce) { @if $enable-prefers-reduced-motion-media-query {
transition: none; @media screen and (prefers-reduced-motion: reduce) {
transition: none;
}
} }
} }

4
src/sass/bootstrap4/utilities/_borders.scss
View File

@ -54,6 +54,10 @@
border-radius: 50% !important; border-radius: 50% !important;
} }
.rounded-pill {
border-radius: $rounded-pill !important;
}
.rounded-0 { .rounded-0 {
border-radius: 0 !important; border-radius: 0 !important;
} }

27
src/sass/bootstrap4/utilities/_embed.scss
View File

@ -27,26 +27,13 @@
} }
} }
.embed-responsive-21by9 { @each $embed-responsive-aspect-ratio in $embed-responsive-aspect-ratios {
&::before { $embed-responsive-aspect-ratio-x: nth($embed-responsive-aspect-ratio, 1);
padding-top: percentage(9 / 21); $embed-responsive-aspect-ratio-y: nth($embed-responsive-aspect-ratio, 2);
}
}
.embed-responsive-16by9 { .embed-responsive-#{$embed-responsive-aspect-ratio-x}by#{$embed-responsive-aspect-ratio-y} {
&::before { &::before {
padding-top: percentage(9 / 16); padding-top: percentage($embed-responsive-aspect-ratio-y / $embed-responsive-aspect-ratio-x);
} }
}
.embed-responsive-4by3 {
&::before {
padding-top: percentage(3 / 4);
}
}
.embed-responsive-1by1 {
&::before {
padding-top: percentage(1 / 1);
} }
} }

5
src/sass/bootstrap4/utilities/_overflow.scss Normal file
View File

@ -0,0 +1,5 @@
// stylelint-disable declaration-no-important
@each $value in $overflows {
.overflow-#{$value} { overflow: $value !important; }
}

5
src/sass/bootstrap4/utilities/_position.scss
View File

@ -1,11 +1,6 @@
// stylelint-disable declaration-no-important // stylelint-disable declaration-no-important
// Common values // Common values
// Sass list not in variables since it's not intended for customization.
// stylelint-disable-next-line scss/dollar-variable-default
$positions: static, relative, absolute, fixed, sticky;
@each $position in $positions { @each $position in $positions {
.position-#{$position} { position: $position !important; } .position-#{$position} { position: $position !important; }
} }

8
src/sass/bootstrap4/utilities/_sizing.scss
View File

@ -10,3 +10,11 @@
.mw-100 { max-width: 100% !important; } .mw-100 { max-width: 100% !important; }
.mh-100 { max-height: 100% !important; } .mh-100 { max-height: 100% !important; }
// Viewport additional helpers
.min-vw-100 { min-width: 100vw !important; }
.min-vh-100 { min-height: 100vh !important; }
.vw-100 { width: 100vw !important; }
.vh-100 { height: 100vh !important; }

24
src/sass/bootstrap4/utilities/_spacing.scss
View File

@ -8,7 +8,6 @@
@each $prop, $abbrev in (margin: m, padding: p) { @each $prop, $abbrev in (margin: m, padding: p) {
@each $size, $length in $spacers { @each $size, $length in $spacers {
.#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; } .#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; }
.#{$abbrev}t#{$infix}-#{$size}, .#{$abbrev}t#{$infix}-#{$size},
.#{$abbrev}y#{$infix}-#{$size} { .#{$abbrev}y#{$infix}-#{$size} {
@ -29,6 +28,29 @@
} }
} }
// Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`)
@each $size, $length in $spacers {
@if $size != 0 {
.m#{$infix}-n#{$size} { margin: -$length !important; }
.mt#{$infix}-n#{$size},
.my#{$infix}-n#{$size} {
margin-top: -$length !important;
}
.mr#{$infix}-n#{$size},
.mx#{$infix}-n#{$size} {
margin-right: -$length !important;
}
.mb#{$infix}-n#{$size},
.my#{$infix}-n#{$size} {
margin-bottom: -$length !important;
}
.ml#{$infix}-n#{$size},
.mx#{$infix}-n#{$size} {
margin-left: -$length !important;
}
}
}
// Some special margin utils // Some special margin utils
.m#{$infix}-auto { margin: auto !important; } .m#{$infix}-auto { margin: auto !important; }
.mt#{$infix}-auto, .mt#{$infix}-auto,

17
src/sass/bootstrap4/utilities/_text.scss
View File

@ -9,6 +9,7 @@
// Alignment // Alignment
.text-justify { text-align: justify !important; } .text-justify { text-align: justify !important; }
.text-wrap { white-space: normal !important; }
.text-nowrap { white-space: nowrap !important; } .text-nowrap { white-space: nowrap !important; }
.text-truncate { @include text-truncate; } .text-truncate { @include text-truncate; }
@ -32,10 +33,12 @@
// Weight and italics // Weight and italics
.font-weight-light { font-weight: $font-weight-light !important; } .font-weight-light { font-weight: $font-weight-light !important; }
.font-weight-normal { font-weight: $font-weight-normal !important; } .font-weight-lighter { font-weight: $font-weight-lighter !important; }
.font-weight-bold { font-weight: $font-weight-bold !important; } .font-weight-normal { font-weight: $font-weight-normal !important; }
.font-italic { font-style: italic !important; } .font-weight-bold { font-weight: $font-weight-bold !important; }
.font-weight-bolder { font-weight: $font-weight-bolder !important; }
.font-italic { font-style: italic !important; }
// Contextual colors // Contextual colors
@ -56,3 +59,9 @@
.text-hide { .text-hide {
@include text-hide($ignore-warning: true); @include text-hide($ignore-warning: true);
} }
.text-decoration-none { text-decoration: none !important; }
// Reset
.text-reset { color: inherit !important; }

Some files were not shown because too many files have changed in this diff Show More