malhuda/fictioneer
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 112 Wiki Activity

Add customizer option for card shadow

Browse Source
This commit is contained in:
Tetrakern 2024-03-02 03:21:31 +01:00
parent f3238fbc53
commit 653a0df4bb
5 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/complete.css
View File

File diff suppressed because one or more lines are too long

2
css/editor.css
View File

File diff suppressed because one or more lines are too long

2
css/properties.css
View File

File diff suppressed because one or more lines are too long

3
includes/functions/_customizer.php
View File

@ -715,6 +715,7 @@ function fictioneer_build_customize_css( $content = null ) {
$card_cover_width_mod = get_theme_mod( 'card_cover_width_mod', 1 );
$card_grid_column_gap_mod = get_theme_mod( 'card_grid_column_gap_mod', 1 );
$card_grid_row_gap_mod = get_theme_mod( 'card_grid_row_gap_mod', 1 );
$card_box_shadow = get_theme_mod( 'card_shadow', 'var(--box-shadow-m)' );
$font_primary = fictioneer_get_custom_font( 'primary_font_family_value', 'var(--ff-system)', 'Open Sans' );
$font_secondary = fictioneer_get_custom_font( 'secondary_font_family_value', 'var(--ff-base)', 'Lato' );
$font_heading = fictioneer_get_custom_font( 'heading_font_family_value', 'var(--ff-base)', 'Open Sans' );
@ -754,6 +755,8 @@ function fictioneer_build_customize_css( $content = null ) {
--ff-card-list-link: {$font_card_list_link};
--ff-nav-item: {$font_nav_item};
--card-cover-width-mod: {$card_cover_width_mod};
--card-box-shadow: {$card_box_shadow};
--card-drop-shadow: " . str_replace( 'box-', 'drop-', $card_box_shadow ) . ";
}";
// Only light mode

2
src/scss/common/_properties.scss
View File

@ -322,6 +322,7 @@
// === SHADOWS ===============================================================
--box-shadow-border: 0 0 0 1px rgb(0 0 0 / 12%);
--box-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 12%);
--box-shadow-s: 0 1px 3px 0 rgb(0 0 0 / 11%), 0 1px 2px -1px rgb(0 0 0 / 10%);
--box-shadow: 0 3px 6px -1px rgb(0 0 0 / 12%), 0 -1px 4px -2px rgb(0 0 0 / 15%);
@ -329,6 +330,7 @@
--box-shadow-l: rgb(0 0 0 / 10%) 0 6px 12px -2px, rgb(0 0 0 / 15%) 0 3px 7px -3px;
--box-shadow-xl: 0 3px 8px -1px rgb(0 0 0 / 9%), 0 3px 12px -1px rgb(0 0 0 / 17%);
--drop-shadow-border: drop-shadow(0 0 1px rgb(0 0 0 / 30%));
--drop-shadow-xs: drop-shadow(0 1px 2px rgb(0 0 0 / 12%));
--drop-shadow-s: drop-shadow(0 1px 3px rgb(0 0 0 / 9%)) drop-shadow(0 1px 2px rgb(0 0 0 / 7%));
--drop-shadow: drop-shadow(0 2px 4px rgb(0 0 0 / 10%)) drop-shadow(0 -1px 3px rgb(0 0 0 / 5%));