progress on inline svg with svgo
This commit is contained in:
parent
7325162871
commit
ac64cafac7
13 changed files with 327 additions and 3889 deletions
|
|
@ -7,12 +7,12 @@ import '../css/app.scss'
|
||||||
import "../raw/rdnyc-logo.svg"; // rdnyc logo
|
import "../raw/rdnyc-logo.svg"; // rdnyc logo
|
||||||
// other:
|
// other:
|
||||||
import "../../node_modules/@mdi/svg/svg/magnify.svg"; // search form button icon
|
import "../../node_modules/@mdi/svg/svg/magnify.svg"; // search form button icon
|
||||||
// import "../../node_modules/@mdi/svg/svg/home.svg";
|
import "../../node_modules/@mdi/svg/svg/home.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/information.svg";
|
// import "../../node_modules/@mdi/svg/svg/information.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/account.svg";
|
// import "../../node_modules/@mdi/svg/svg/account.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/briefcase-account.svg";
|
// import "../../node_modules/@mdi/svg/svg/briefcase-account.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/zip-disk.svg";
|
import "../../node_modules/@mdi/svg/svg/zip-disk.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/typewriter.svg";
|
import "../../node_modules/@mdi/svg/svg/typewriter.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/calendar-clock.svg";
|
// import "../../node_modules/@mdi/svg/svg/calendar-clock.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/tag-multiple.svg";
|
// import "../../node_modules/@mdi/svg/svg/tag-multiple.svg";
|
||||||
// import "../../node_modules/@mdi/svg/svg/rss.svg";
|
// import "../../node_modules/@mdi/svg/svg/rss.svg";
|
||||||
|
|
|
||||||
|
|
@ -25,15 +25,15 @@ namespace WP_RDNYC;
|
||||||
|
|
||||||
<div class="post-date font-monospace text-gray-300 <?php echo (has_tag() ? '' : 'mb-3'); ?>">
|
<div class="post-date font-monospace text-gray-300 <?php echo (has_tag() ? '' : 'mb-3'); ?>">
|
||||||
<?php
|
<?php
|
||||||
echo svg_icon_use("mdi-calendar-clock", "baseline me-2") . get_the_date('F j, Y');
|
// echo svg_icon_use("mdi-calendar-clock", "baseline me-2") . get_the_date('F j, Y');
|
||||||
echo ' by ' . svg_icon_use("mdi-account", "baseline me-1") . get_the_author();
|
// echo ' by ' . svg_icon_use("mdi-account", "baseline me-1") . get_the_author();
|
||||||
?>
|
?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php
|
<?php
|
||||||
if (has_tag()) {
|
if (has_tag()) {
|
||||||
echo '<div class="post-tags fs-smaller mb-4">';
|
echo '<div class="post-tags fs-smaller mb-4">';
|
||||||
echo svg_icon_use("mdi-tag-multiple", "baseline text-gray-300 me-1");
|
// echo svg_icon_use("mdi-tag-multiple", "baseline text-gray-300 me-1");
|
||||||
|
|
||||||
$tag_strings = array_map(function ($tag) {
|
$tag_strings = array_map(function ($tag) {
|
||||||
return '<span class="text-gray-300">#</span><a href="' . get_tag_link($tag) . '">' . $tag->name . '</a>';
|
return '<span class="text-gray-300">#</span><a href="' . get_tag_link($tag) . '">' . $tag->name . '</a>';
|
||||||
|
|
|
||||||
|
|
@ -3,18 +3,35 @@
|
||||||
/**
|
/**
|
||||||
* Function to support inline SVG icons by name with div wrapper
|
* Function to support inline SVG icons by name with div wrapper
|
||||||
*/
|
*/
|
||||||
function svg_icon_use($icon_name, $div_class = '') {
|
// function svg_icon_use($icon_name, $div_class = '') {
|
||||||
$div_class .= ' icon';
|
// $div_class .= ' icon';
|
||||||
$output = "<div class=\"$div_class $icon_name\"><svg class=\"$icon_name\" aria-hidden=\"true\">";
|
// $output = "<div class=\"$div_class $icon_name\"><svg class=\"$icon_name\" aria-hidden=\"true\">";
|
||||||
$output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icon-sprites.svg#$icon_name\"></use>";
|
// $output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icon-sprites.svg#$icon_name\"></use>";
|
||||||
return $output . "</svg></div>";
|
// return $output . "</svg></div>";
|
||||||
};
|
// };
|
||||||
|
|
||||||
function svg_logo_use($icon_name, $div_class = '', $svg_title = 'Logo') {
|
// function svg_logo_use($icon_name, $div_class = '', $svg_title = 'Logo') {
|
||||||
$div_class .= ' logo';
|
// $div_class .= ' logo';
|
||||||
$output = "<div class=\"$div_class $icon_name\"><svg class=\"$icon_name\" role=\"img\"><title>$svg_title</title>";
|
// $output = "<div class=\"$div_class $icon_name\"><svg class=\"$icon_name\" role=\"img\"><title>$svg_title</title>";
|
||||||
$output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icon-sprites.svg#$icon_name\"></use>";
|
// $output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icon-sprites.svg#$icon_name\"></use>";
|
||||||
return $output . "</svg></div>";
|
// return $output . "</svg></div>";
|
||||||
|
// };
|
||||||
|
|
||||||
|
function inline_svg(
|
||||||
|
$svg_name,
|
||||||
|
$div_class = 'icon',
|
||||||
|
$svg_class = '',
|
||||||
|
$svg_title = '',
|
||||||
|
$svg_role_img = false,
|
||||||
|
$svg_aria_hidden = true) {
|
||||||
|
$svg_content = file_get_contents( get_template_directory_uri() . '/dist/images/' . $svg_name . '.svg' );
|
||||||
|
$to_replace = $svg_class == '' ? 'class="{{class-name}}"' : '{{class-name}}';
|
||||||
|
$svg_content = str_replace($to_replace, $svg_class, $svg_content);
|
||||||
|
$svg_content = $svg_role_img ? str_replace('<svg ', '<svg role="img" ', $svg_content) : $svg_content;
|
||||||
|
$svg_content = $svg_aria_hidden ? str_replace('<svg ', '<svg aria-hidden="true" ', $svg_content) : $svg_content;
|
||||||
|
$svg_title = $svg_title == '' ? '' : '<title>' . $svg_title . '</title>';
|
||||||
|
$svg_content = substr_replace($svg_content, $svg_title, strpos($svg_content,'>') + 1, 0);
|
||||||
|
return '<div class="' . $div_class . '">' . $svg_content . '</div>';
|
||||||
};
|
};
|
||||||
|
|
||||||
?>
|
?>
|
||||||
|
|
@ -1,42 +1,42 @@
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
require_once( WP_RDNYC_DIR . '/socials.php' );
|
// require_once( WP_RDNYC_DIR . '/socials.php' );
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Shortcode to insert line of social icons
|
// * Shortcode to insert line of social icons
|
||||||
*/
|
// */
|
||||||
function social_icons_function( $atts = array() ) {
|
// function social_icons_function( $atts = array() ) {
|
||||||
// set up default parameter
|
// // set up default parameter
|
||||||
extract(shortcode_atts(array(
|
// extract(shortcode_atts(array(
|
||||||
'prof' => '0'
|
// 'prof' => '0'
|
||||||
), $atts));
|
// ), $atts));
|
||||||
|
|
||||||
if ($prof == '1') {
|
// if ($prof == '1') {
|
||||||
return get_social_icons_prof_str();
|
// return get_social_icons_prof_str();
|
||||||
} else {
|
// } else {
|
||||||
return get_social_icons_str();
|
// return get_social_icons_str();
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
add_shortcode('social_icons', 'social_icons_function');
|
// add_shortcode('social_icons', 'social_icons_function');
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Shortcode to insert single social icon by name
|
// * Shortcode to insert single social icon by name
|
||||||
* However, social icon MUST be imported in main.js !
|
// * However, social icon MUST be imported in main.js !
|
||||||
*/
|
// */
|
||||||
function single_social_icon_function( $atts = array() ) {
|
// function single_social_icon_function( $atts = array() ) {
|
||||||
// set up default parameter
|
// // set up default parameter
|
||||||
extract(shortcode_atts(array(
|
// extract(shortcode_atts(array(
|
||||||
'name' => '0',
|
// 'name' => '0',
|
||||||
'class' => 'baseline'
|
// 'class' => 'baseline'
|
||||||
), $atts));
|
// ), $atts));
|
||||||
|
|
||||||
if ($name == '0') {
|
// if ($name == '0') {
|
||||||
return 'social_icon shortcode requires "name" parameter, like "name=mdi-account"';
|
// return 'social_icon shortcode requires "name" parameter, like "name=mdi-account"';
|
||||||
} else {
|
// } else {
|
||||||
return svg_icon_use($name, $class);
|
// return svg_icon_use($name, $class);
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
add_shortcode('social_icon', 'single_social_icon_function');
|
// add_shortcode('social_icon', 'single_social_icon_function');
|
||||||
|
|
||||||
|
|
||||||
?>
|
?>
|
||||||
|
|
@ -51,7 +51,11 @@ namespace WP_RDNYC;
|
||||||
// printf( '<span class="font-handbrush">%1$s</span>',
|
// printf( '<span class="font-handbrush">%1$s</span>',
|
||||||
// esc_html( get_bloginfo( 'name' ) )
|
// esc_html( get_bloginfo( 'name' ) )
|
||||||
// );
|
// );
|
||||||
echo svg_logo_use("rdnyc-logo", "", "Recovery Dharma New York City");
|
// echo svg_logo_use("rdnyc-logo", "", "Recovery Dharma New York City");
|
||||||
|
echo inline_svg( 'svg-rdnyc-logo', 'logo', '', 'Recovery Dharma New York City', true, false );
|
||||||
|
// echo '<div class="logo">' . file_get_contents( get_template_directory_uri() . '/dist/images/svg-rdnyc-logo.svg' ) . '</div>';
|
||||||
|
// echo str_replace("{{class-name}}", 'logo',
|
||||||
|
// file_get_contents( get_template_directory_uri() . '/dist/images/svg-rdnyc-logo.svg' ));
|
||||||
|
|
||||||
echo "</a>";
|
echo "</a>";
|
||||||
?>
|
?>
|
||||||
|
|
|
||||||
3677
package-lock.json
generated
3677
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -39,7 +39,7 @@
|
||||||
"purgecss-webpack-plugin": "^4.x",
|
"purgecss-webpack-plugin": "^4.x",
|
||||||
"sass": "^1.x",
|
"sass": "^1.x",
|
||||||
"sass-loader": "^12.x",
|
"sass-loader": "^12.x",
|
||||||
"svg-sprite-loader": "^6.x",
|
"svgo-loader": "^3.0.0",
|
||||||
"webpack": "^5.x",
|
"webpack": "^5.x",
|
||||||
"webpack-cli": "^4.x"
|
"webpack-cli": "^4.x"
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
<?php
|
|
||||||
/**
|
|
||||||
* The 73k theme
|
|
||||||
*
|
|
||||||
* @author Recovery Dharma NYC
|
|
||||||
* @since 1.0.0
|
|
||||||
*/
|
|
||||||
|
|
||||||
namespace WP_RDNYC;
|
|
||||||
|
|
||||||
get_header(); ?>
|
|
||||||
<main class="container d-flex justify-content-center">
|
|
||||||
<div class="col-12 col-md-9 col-lg-8 col-xl-7 col-xxl-6 border-bottom border-gray pb-4 mb-3" id="tek-page-resume">
|
|
||||||
|
|
||||||
<?php
|
|
||||||
if ( have_posts() ) {
|
|
||||||
while ( have_posts() ) {
|
|
||||||
the_post(); ?>
|
|
||||||
|
|
||||||
<article itemscope itemtype="https://schema.org/CreativeWork">
|
|
||||||
|
|
||||||
<header>
|
|
||||||
<h2>
|
|
||||||
<?php
|
|
||||||
echo svg_icon_use('mdi-account', 'baseline');
|
|
||||||
echo ' ' . get_the_author_meta('display_name');
|
|
||||||
?>
|
|
||||||
</h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="article">
|
|
||||||
<?php the_content(); ?>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
} ?>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
<?php
|
|
||||||
get_footer();
|
|
||||||
|
|
@ -21,7 +21,7 @@ $seventythreek_aria_label = ! empty( $args['aria_label'] ) ? 'aria-label="' . es
|
||||||
<label id="<?php echo esc_attr( $seventythreek_unique_id ) . '-label'; ?>" for="<?php echo esc_attr( $seventythreek_unique_id ); ?>" aria-hidden class="form-label d-none"><?php _e( 'Search…', 'seventythreek' ); // phpcs:ignore: WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></label>
|
<label id="<?php echo esc_attr( $seventythreek_unique_id ) . '-label'; ?>" for="<?php echo esc_attr( $seventythreek_unique_id ); ?>" aria-hidden class="form-label d-none"><?php _e( 'Search…', 'seventythreek' ); // phpcs:ignore: WordPress.Security.EscapeOutput.UnsafePrintingFunction -- core trusts translations ?></label>
|
||||||
<input type="search" id="<?php echo esc_attr( $seventythreek_unique_id ); ?>" class="form-control me-2 tek-search-input" value="<?php echo get_search_query(); ?>" name="s" aria-labelledby="<?php echo esc_attr( $seventythreek_unique_id ) . '-label'; ?>" placeholder="Search blog…" />
|
<input type="search" id="<?php echo esc_attr( $seventythreek_unique_id ); ?>" class="form-control me-2 tek-search-input" value="<?php echo get_search_query(); ?>" name="s" aria-labelledby="<?php echo esc_attr( $seventythreek_unique_id ) . '-label'; ?>" placeholder="Search blog…" />
|
||||||
<button type="submit" class="btn btn-outline-light" title="Search">
|
<button type="submit" class="btn btn-outline-light" title="Search">
|
||||||
<?php echo svg_icon_use('mdi-magnify', 'baseline'); ?>
|
<?php echo inline_svg('mdi-magnify', 'icon baseline') ?>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
||||||
160
socials.php
160
socials.php
|
|
@ -4,91 +4,91 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// definition of social icons:
|
// definition of social icons:
|
||||||
$social_icons = array(
|
// $social_icons = array(
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-typewriter",
|
// 'icon' => "mdi-typewriter",
|
||||||
'url' => '/blog',
|
// 'url' => '/blog',
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_self"
|
// 'target' => "_self"
|
||||||
),
|
// ),
|
||||||
array('icon' => "mdi-rss", 'url' => '/feed', 'prof' => false, 'target' => "_blank"),
|
// array('icon' => "mdi-rss", 'url' => '/feed', 'prof' => false, 'target' => "_blank"),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-linkedin",
|
// 'icon' => "mdi-linkedin",
|
||||||
'url' => "https://www.linkedin.com/in/adampiontek/",
|
// 'url' => "https://www.linkedin.com/in/adampiontek/",
|
||||||
'prof' => true,
|
// 'prof' => true,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array('icon' => "mdi-github", 'url' => "https://github.com/apiontek", 'prof' => true, 'target' => "_blank"),
|
// array('icon' => "mdi-github", 'url' => "https://github.com/apiontek", 'prof' => true, 'target' => "_blank"),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-key-variant",
|
// 'icon' => "mdi-key-variant",
|
||||||
'url' => '/DF185CEE29A3D443_public_key.asc',
|
// 'url' => '/DF185CEE29A3D443_public_key.asc',
|
||||||
'prof' => true,
|
// 'prof' => true,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-goodreads",
|
// 'icon' => "mdi-goodreads",
|
||||||
'url' => "https://www.goodreads.com/user/show/2450014-adam-piontek",
|
// 'url' => "https://www.goodreads.com/user/show/2450014-adam-piontek",
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-twitter",
|
// 'icon' => "mdi-twitter",
|
||||||
'url' => "https://twitter.com/adampiontek",
|
// 'url' => "https://twitter.com/adampiontek",
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array('icon' => "mdi-facebook", 'url' => "https://facebook.com/damek", 'prof' => false, 'target' => "_blank"),
|
// array('icon' => "mdi-facebook", 'url' => "https://facebook.com/damek", 'prof' => false, 'target' => "_blank"),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-instagram",
|
// 'icon' => "mdi-instagram",
|
||||||
'url' => "https://www.instagram.com/adampiontek/",
|
// 'url' => "https://www.instagram.com/adampiontek/",
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-steam",
|
// 'icon' => "mdi-steam",
|
||||||
'url' => "https://steamcommunity.com/id/apiontek/",
|
// 'url' => "https://steamcommunity.com/id/apiontek/",
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
),
|
// ),
|
||||||
array(
|
// array(
|
||||||
'icon' => "mdi-discord",
|
// 'icon' => "mdi-discord",
|
||||||
'url' => "https://discordapp.com/users/328583977629646848",
|
// 'url' => "https://discordapp.com/users/328583977629646848",
|
||||||
'prof' => false,
|
// 'prof' => false,
|
||||||
'target' => "_blank"
|
// 'target' => "_blank"
|
||||||
)
|
// )
|
||||||
);
|
// );
|
||||||
|
|
||||||
function social_icon_is_prof($icon) {
|
// function social_icon_is_prof($icon) {
|
||||||
return $icon['prof'];
|
// return $icon['prof'];
|
||||||
}
|
// }
|
||||||
|
|
||||||
function get_social_icons() {
|
// function get_social_icons() {
|
||||||
global $social_icons;
|
// global $social_icons;
|
||||||
return $social_icons;
|
// return $social_icons;
|
||||||
}
|
// }
|
||||||
|
|
||||||
function get_social_icons_prof() {
|
// function get_social_icons_prof() {
|
||||||
global $social_icons;
|
// global $social_icons;
|
||||||
return array_values(array_filter($social_icons, 'social_icon_is_prof'));
|
// return array_values(array_filter($social_icons, 'social_icon_is_prof'));
|
||||||
}
|
// }
|
||||||
|
|
||||||
function social_icons_str($icons_arr) {
|
// function social_icons_str($icons_arr) {
|
||||||
$out_str = '<div id="social-icons">';
|
// $out_str = '<div id="social-icons">';
|
||||||
foreach ($icons_arr as $i=>$social) {
|
// foreach ($icons_arr as $i=>$social) {
|
||||||
$pad = $i == 0 ? 'pe-1' : ($i == (count($icons_arr) - 1) ? 'ps-1' : 'px-1');
|
// $pad = $i == 0 ? 'pe-1' : ($i == (count($icons_arr) - 1) ? 'ps-1' : 'px-1');
|
||||||
$out_str .= '<a href="' . $social['url'] . '" rel="noreferrer" target="' . $social['target'];
|
// $out_str .= '<a href="' . $social['url'] . '" rel="noreferrer" target="' . $social['target'];
|
||||||
$out_str .= '" class="fs-3 link-light text-decoration-none ' . $pad . '">';
|
// $out_str .= '" class="fs-3 link-light text-decoration-none ' . $pad . '">';
|
||||||
$out_str .= svg_icon_use($social['icon'], "baseline") . "</a>";
|
// $out_str .= svg_icon_use($social['icon'], "baseline") . "</a>";
|
||||||
}
|
// }
|
||||||
return $out_str . '</div>';
|
// return $out_str . '</div>';
|
||||||
}
|
// }
|
||||||
|
|
||||||
function get_social_icons_str() {
|
// function get_social_icons_str() {
|
||||||
return social_icons_str(get_social_icons());
|
// return social_icons_str(get_social_icons());
|
||||||
}
|
// }
|
||||||
|
|
||||||
function get_social_icons_prof_str() {
|
// function get_social_icons_prof_str() {
|
||||||
return social_icons_str(get_social_icons_prof());
|
// return social_icons_str(get_social_icons_prof());
|
||||||
}
|
// }
|
||||||
|
|
||||||
?>
|
?>
|
||||||
|
|
@ -50,47 +50,47 @@ add_filter( 'nav_menu_link_attributes' , function( $atts, $item, $args ) {
|
||||||
return $atts;
|
return $atts;
|
||||||
}, 2, 3 );
|
}, 2, 3 );
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Filter to add icons to navbar menu items
|
// * Filter to add icons to navbar menu items
|
||||||
*/
|
// */
|
||||||
add_filter( 'wp_nav_menu_objects', function($items, $args) {
|
// add_filter( 'wp_nav_menu_objects', function($items, $args) {
|
||||||
$svgicon_prefix = 'icon-';
|
// $svgicon_prefix = 'icon-';
|
||||||
foreach ( $items as $k => $object ) {
|
// foreach ( $items as $k => $object ) {
|
||||||
foreach ($object->classes as $c) {
|
// foreach ($object->classes as $c) {
|
||||||
if (substr( $c, 0, strlen( $svgicon_prefix ) ) === $svgicon_prefix) {
|
// if (substr( $c, 0, strlen( $svgicon_prefix ) ) === $svgicon_prefix) {
|
||||||
$icon_slug = str_replace($svgicon_prefix, '', $c);
|
// $icon_slug = str_replace($svgicon_prefix, '', $c);
|
||||||
$object->title = svg_icon_use($icon_slug, 'baseline') . "\\" . $object->title;
|
// $object->title = svg_icon_use($icon_slug, 'baseline') . "\\" . $object->title;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
return $items;
|
// return $items;
|
||||||
}, 1, 2 );
|
// }, 1, 2 );
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Filter to remove syntax-highlighting-code-block plugin styles from frontend
|
// * Filter to remove syntax-highlighting-code-block plugin styles from frontend
|
||||||
*/
|
// */
|
||||||
add_filter('syntax_highlighting_code_block_styling', '__return_false');
|
// add_filter('syntax_highlighting_code_block_styling', '__return_false');
|
||||||
|
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Set document title (in html head) to be reversed with '\' separator
|
// * Set document title (in html head) to be reversed with '\' separator
|
||||||
*/
|
// */
|
||||||
add_filter( 'document_title_separator', function ( $separator ) {
|
// add_filter( 'document_title_separator', function ( $separator ) {
|
||||||
return '\\';
|
// return '\\';
|
||||||
} );
|
// } );
|
||||||
add_filter('document_title_parts', function ($title) {
|
// add_filter('document_title_parts', function ($title) {
|
||||||
return (is_home() || is_front_page()) ? $title : array_reverse($title);
|
// return (is_home() || is_front_page()) ? $title : array_reverse($title);
|
||||||
});
|
// });
|
||||||
|
|
||||||
|
|
||||||
/**
|
// /**
|
||||||
* Exclude pages from WordPress Search
|
// * Exclude pages from WordPress Search
|
||||||
*/
|
// */
|
||||||
if (!is_admin()) {
|
// if (!is_admin()) {
|
||||||
add_filter('pre_get_posts',function($query) {
|
// add_filter('pre_get_posts',function($query) {
|
||||||
if ($query->is_search) {
|
// if ($query->is_search) {
|
||||||
$query->set('post_type', 'post');
|
// $query->set('post_type', 'post');
|
||||||
}
|
// }
|
||||||
return $query;
|
// return $query;
|
||||||
});
|
// });
|
||||||
}
|
// }
|
||||||
|
|
|
||||||
67
svgo.config.js
Normal file
67
svgo.config.js
Normal file
|
|
@ -0,0 +1,67 @@
|
||||||
|
module.exports = {
|
||||||
|
multipass: false, // boolean. false by default
|
||||||
|
plugins: [
|
||||||
|
'cleanupAttrs',
|
||||||
|
'mergeStyles',
|
||||||
|
'inlineStyles',
|
||||||
|
'removeDoctype',
|
||||||
|
'removeXMLProcInst',
|
||||||
|
'removeComments',
|
||||||
|
'removeMetadata',
|
||||||
|
'removeTitle',
|
||||||
|
'removeDesc',
|
||||||
|
'removeUselessDefs',
|
||||||
|
'removeXMLNS',
|
||||||
|
'removeEditorsNSData',
|
||||||
|
'removeEmptyAttrs',
|
||||||
|
'removeHiddenElems',
|
||||||
|
'removeEmptyText',
|
||||||
|
'removeEmptyContainers',
|
||||||
|
'removeViewBox',
|
||||||
|
'cleanupEnableBackground',
|
||||||
|
'minifyStyles',
|
||||||
|
// 'convertStyleToAttrs',
|
||||||
|
'convertColors',
|
||||||
|
'convertPathData',
|
||||||
|
'convertTransform',
|
||||||
|
'removeUnknownsAndDefaults',
|
||||||
|
'removeNonInheritableGroupAttrs',
|
||||||
|
'removeUselessStrokeAndFill',
|
||||||
|
'removeUnusedNS',
|
||||||
|
// 'prefixIds',
|
||||||
|
'cleanupIDs',
|
||||||
|
'cleanupNumericValues',
|
||||||
|
// 'cleanupListOfValues',
|
||||||
|
'moveElemsAttrsToGroup',
|
||||||
|
'moveGroupAttrsToElems',
|
||||||
|
'collapseGroups',
|
||||||
|
// 'removeRasterImages',
|
||||||
|
'mergePaths',
|
||||||
|
'convertShapeToPath',
|
||||||
|
'convertEllipseToCircle',
|
||||||
|
'sortAttrs',
|
||||||
|
'sortDefsChildren',
|
||||||
|
// 'removeDimensions',
|
||||||
|
// 'removeAttrs',
|
||||||
|
{
|
||||||
|
name: 'removeAttrs',
|
||||||
|
params: {
|
||||||
|
attrs: 'svg:id'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 'removeAttributesBySelector',
|
||||||
|
// 'removeElementsByAttr',
|
||||||
|
// 'addClassesToSVGElement',
|
||||||
|
{
|
||||||
|
name: 'addClassesToSVGElement',
|
||||||
|
params: {
|
||||||
|
className: '{{class-placeholder}}'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 'addAttributesToSVGElement',
|
||||||
|
// 'removeOffCanvasPaths',
|
||||||
|
'removeStyleElement',
|
||||||
|
// 'removeScriptElement',
|
||||||
|
// 'reusePaths',
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
@ -3,7 +3,7 @@ const glob = require("glob-all");
|
||||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||||
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
|
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
|
||||||
const CopyWebpackPlugin = require('copy-webpack-plugin');
|
const CopyWebpackPlugin = require('copy-webpack-plugin');
|
||||||
const SpriteLoaderPlugin = require("svg-sprite-loader/plugin");
|
// const SpriteLoaderPlugin = require("svg-sprite-loader/plugin");
|
||||||
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
|
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
|
||||||
const PurgecssPlugin = require("purgecss-webpack-plugin");
|
const PurgecssPlugin = require("purgecss-webpack-plugin");
|
||||||
|
|
||||||
|
|
@ -50,28 +50,57 @@ const config = {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
test: /\.svg$/,
|
test: /\.svg$/,
|
||||||
loader: "svg-sprite-loader",
|
type: 'asset/resource',
|
||||||
|
generator: {
|
||||||
|
filename: (pathData) => {
|
||||||
|
if (pathData.filename.includes('@mdi')) {
|
||||||
|
return 'images/mdi-[name][ext]';
|
||||||
|
} else if (pathData.filename.includes("bootstrap-icons")) {
|
||||||
|
return 'images/bsi-[name][ext]';
|
||||||
|
} else if (pathData.filename.includes("heroicons")) {
|
||||||
|
if (pathData.filename.includes("outline")) {
|
||||||
|
return 'images/hio-[name][ext]';
|
||||||
|
} else {
|
||||||
|
return 'images/his-[name][ext]';
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
return 'images/svg-[name][ext]';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
use: [
|
||||||
|
{
|
||||||
|
loader: 'svgo-loader',
|
||||||
options: {
|
options: {
|
||||||
extract: true,
|
configFile: path.resolve('svgo.config.js'),
|
||||||
spriteFilename: "icon-sprites.svg",
|
|
||||||
publicPath: "./images/",
|
|
||||||
symbolId: (filePath) => {
|
|
||||||
if (filePath.includes("bootstrap-icons")) {
|
|
||||||
return `bi-${path.basename(filePath).slice(0, -4)}`;
|
|
||||||
} else if (filePath.includes("@mdi")) {
|
|
||||||
return `mdi-${path.basename(filePath).slice(0, -4)}`;
|
|
||||||
} else if (filePath.includes("heroicons")) {
|
|
||||||
if (filePath.includes("outline")) {
|
|
||||||
return `hio-${path.basename(filePath).slice(0, -4)}`;
|
|
||||||
} else {
|
|
||||||
return `his-${path.basename(filePath).slice(0, -4)}`;
|
|
||||||
}
|
}
|
||||||
} else {
|
|
||||||
return `${path.basename(filePath).slice(0, -4)}`;
|
|
||||||
}
|
}
|
||||||
|
],
|
||||||
},
|
},
|
||||||
},
|
// {
|
||||||
},
|
// test: /\.svg$/,
|
||||||
|
// loader: "svg-sprite-loader",
|
||||||
|
// options: {
|
||||||
|
// extract: true,
|
||||||
|
// spriteFilename: "icon-sprites.svg",
|
||||||
|
// publicPath: "./images/",
|
||||||
|
// symbolId: (filePath) => {
|
||||||
|
// if (filePath.includes("bootstrap-icons")) {
|
||||||
|
// return `bi-${path.basename(filePath).slice(0, -4)}`;
|
||||||
|
// } else if (filePath.includes("@mdi")) {
|
||||||
|
// return `mdi-${path.basename(filePath).slice(0, -4)}`;
|
||||||
|
// } else if (filePath.includes("heroicons")) {
|
||||||
|
// if (filePath.includes("outline")) {
|
||||||
|
// return `hio-${path.basename(filePath).slice(0, -4)}`;
|
||||||
|
// } else {
|
||||||
|
// return `his-${path.basename(filePath).slice(0, -4)}`;
|
||||||
|
// }
|
||||||
|
// } else {
|
||||||
|
// return `${path.basename(filePath).slice(0, -4)}`;
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
optimization: {
|
optimization: {
|
||||||
|
|
@ -86,7 +115,7 @@ const config = {
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
new MiniCssExtractPlugin({ filename: `[name]${prefix}.css` }),
|
new MiniCssExtractPlugin({ filename: `[name]${prefix}.css` }),
|
||||||
new SpriteLoaderPlugin({ plainSprite: true }),
|
// new SpriteLoaderPlugin({ plainSprite: true }),
|
||||||
new CopyWebpackPlugin({
|
new CopyWebpackPlugin({
|
||||||
patterns: [{
|
patterns: [{
|
||||||
from: './assets/images/',
|
from: './assets/images/',
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue