updated deps, removed imagemin, fixed some issues

This commit is contained in:
Adam Piontek 2021-07-07 15:40:18 -04:00
parent 85bb55c10d
commit 2eea21ff01
10 changed files with 619 additions and 7467 deletions

View file

@ -25,9 +25,17 @@ The sass for the hamburgers package throws warnings unless fixed:
```bash
npm i -g sass-migrator
cd node_modules/hamburgers
find _sass/hamburgers/ -type f | while read f; do npx sass-migrator division -d ${f}; done
cd ../..
HBPATH="./node_modules/hamburgers/_sass/hamburgers/"
find ${HBPATH} -type f | while read f; do npx sass-migrator division -d ${f}; done
```
Clean node_modules testing:
```bash
rm -rf node_modules && rm -rf dist && npm i && HBPATH="./node_modules/hamburgers/_sass/hamburgers/"
find ${HBPATH} -type f | while read f; do npx sass-migrator division -d ${f}; done
NODE_ENV=development node --trace-deprecation node_modules/webpack/bin/webpack.js
NODE_ENV=production node --trace-deprecation node_modules/webpack/bin/webpack.js
```
## Deployment

View file

@ -1,7 +1,7 @@
/* Bootstrap custom variable overrides */
// Typography
$font-size-base: 1.125rem;
$font-size-base: 1.1rem;
$font-family-serif: "Source Serif Pro", "Iowan Old Style", "Apple Garamond",
Baskerville, "Times New Roman", "Droid Serif", Times, serif,

View file

@ -16,7 +16,7 @@
.icon.baseline svg,
.icon img {
top: 0.125em;
top: 0.17em;
position: relative;
}

View file

@ -112,17 +112,23 @@ a {
}
blockquote {
p {
margin-bottom: 0 !important;
}
&.wp-block-quote {
@extend .blockquote;
@extend .border-start;
@extend .border-gray;
@extend .border-5;
@extend .ms-0;
@extend .my-4;
@extend .ps-3;
p {
@extend .blockquote;
margin-bottom: -0.25rem !important;
// font-size: 1.25rem !important;
}
cite {
@extend .blockquote-footer;
@extend .text-gray-300;
font-size: 0.75em;
margin-top: -1rem;
margin-bottom: 0 !important;
@extend .mb-0;
font-size: 0.85em;
font-style: normal;
}
}

View file

@ -23,21 +23,21 @@ namespace WP_73k;
} ?>
</h2>
<?php $posttags = get_the_tags(); ?>
<div class="post-date font-monospace text-gray-300 <?php if (count($posttags) == 0) { echo 'mb-3'; } ?>">
<div class="post-date font-monospace text-gray-300 <?php echo (has_tag() ? '' : 'mb-3'); ?>">
<?php echo svg_icon_use("mdi-calendar-clock", "icon baseline me-2") . get_the_date('F j, Y'); ?>
by <?php echo svg_icon_use("mdi-account", "icon baseline me-1") . get_the_author(); ?>
</div>
<?php
if (count($posttags) > 0) {
if (has_tag()) {
echo '<div class="post-tags fs-smaller mb-4">' . svg_icon_use("mdi-tag-multiple", "icon baseline text-gray-300 me-1");
$tag_strings = array_map(function ($tag) {
$tag_str = '<span class="text-gray-300">#</span>';
$tag_str .= '<a href="' . get_bloginfo('url') . '/tag/' . $tag->slug . '">' . $tag->name . '</a>';
return $tag_str;
}, $posttags);
}, get_the_tags());
echo implode(", ", $tag_strings) . '</div>';
}
?>

View file

@ -14,7 +14,7 @@ get_header('', array('fixednav'=>true)); ?>
<div class="col-auto mt-3 mt-lg-0">
<img src="<?php echo get_stylesheet_directory_uri() ?>/dist/images/cat-roof_portrait.webp"
<img src="<?php echo get_stylesheet_directory_uri() . '/dist/images/cat-roof_portrait.webp'; ?>"
class="img-fluid border border-20 border-gray-900 rounded-2"
alt="My cat Babka, stuck on a roof when she was still just a stray."
title="My cat Babka, stuck on a roof when she was still just a stray."
@ -24,7 +24,7 @@ get_header('', array('fixednav'=>true)); ?>
<div class="col-auto justify-content-start ms-lg-3">
<h2 class="fs-2 fw-600 mb-0">
<?php echo svg_icon_use("mdi-account", "icon baseline") . "<span>Adam Piontek</span>"; ?>
<?php echo svg_icon_use("mdi-account", "icon baseline") . '<span>Adam Piontek</span>'; ?>
</h2>
<div class="font-monospace text-gray-300 fs-5">Desktop Systems Engineer. Human.</div>

View file

@ -14,7 +14,7 @@ define( 'WP_73k_URL', get_template_directory_uri() );
*/
function svg_icon_use($icon_name, $div_class) {
$output = "<div class=\"$div_class $icon_name\"><svg class=\"$icon_name\" aria-hidden=\"true\">";
$output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icons.svg#$icon_name\"></use>";
$output .= "<use xlink:href=\"" . get_stylesheet_directory_uri() . "/dist/images/icon-sprites.svg#$icon_name\"></use>";
return $output . "</svg></div>";
};

7999
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -11,10 +11,10 @@
"build": "concurrently \"npm run prod\" \"npm run dev\""
},
"dependencies": {
"@fontsource/jetbrains-mono": "^4.2.2",
"@fontsource/open-sans": "^4.2.2",
"@fontsource/jetbrains-mono": "^4.x",
"@fontsource/open-sans": "^4.x",
"@fontsource/righteous": "^4.x",
"@fontsource/source-serif-pro": "^4.2.3",
"@fontsource/source-serif-pro": "^4.x",
"@mdi/svg": "^5.x",
"@popperjs/core": "^2.x",
"bootstrap": "^5.x",
@ -26,21 +26,20 @@
"@babel/preset-env": "^7.x",
"autoprefixer": "^10.x",
"babel-loader": "^8.x",
"browser-sync": "^2.26.10",
"browser-sync-webpack-plugin": "^2.2.2",
"concurrently": "^5.2.0",
"browser-sync": "^2.x",
"browser-sync-webpack-plugin": "^2.x",
"concurrently": "^6.x",
"copy-webpack-plugin": "^9.x",
"cross-env": "^7.0.2",
"cross-env": "^7.x",
"css-loader": "^5.x",
"css-minimizer-webpack-plugin": "^3.x",
"file-loader": "^6.2.0",
"glob-all": "^3.2.1",
"imagemin-webpack-plugin": "^2.4.2",
"mini-css-extract-plugin": "^1.x",
"postcss": "^8.2.6",
"postcss-loader": "^5.0.0",
"postcss-scss": "^3.0.4",
"purgecss-webpack-plugin": "^4.0.2",
"file-loader": "^6.x",
"glob-all": "^3.x",
"mini-css-extract-plugin": "^2.x",
"postcss": "^8.x",
"postcss-loader": "^6.x",
"postcss-scss": "^4.x",
"purgecss-webpack-plugin": "^4.x",
"sass": "^1.x",
"sass-loader": "^12.x",
"svg-sprite-loader": "^6.x",

View file

@ -4,8 +4,6 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const SpriteLoaderPlugin = require("svg-sprite-loader/plugin");
const ImageminPlugin = require('imagemin-webpack-plugin').default;
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
const PurgecssPlugin = require("purgecss-webpack-plugin");
@ -61,7 +59,7 @@ const config = {
loader: "svg-sprite-loader",
options: {
extract: true,
spriteFilename: "icons.svg",
spriteFilename: "icon-sprites.svg",
publicPath: "./images/",
symbolId: (filePath) => {
if (filePath.includes("bootstrap-icons")) {
@ -106,7 +104,6 @@ const config = {
}
}]
}),
new ImageminPlugin({ test: /\.(jpe?g|png|gif)$/i })
].concat(
isProduction
? [
@ -179,6 +176,7 @@ function getCSSWhitelistPatterns() {
/^(.*)?-?paged(-.*)?$/,
/^depth(-.*)?$/,
/^children(-.*)?$/,
/^mt--05r$/,
];
}