updating to v1.0.3, 2021-08-04

README.md

@@ -1,58 +1,41 @@
 # RDNYC WordPress Bootstrap 5/PurgeCSS Theme
-The WordPress theme for rdnyc.org, based on Bootstrap 5 and PurgeCSS.
+The WordPress theme for recoverydharma.org, based on Webpack 5, Bootstrap 5, and some development conveniences.
 
-## Requirements
+Originally forked from [WP 73k](https://github.com/apiontek/wp-73k/), itself forked from [WP Tailwind](https://github.com/cjkoepke/wp-tailwind)
+
+## Development Requirements
 - [NodeJS](https://nodejs.org)
 - [Composer](https://getcomposer.org)
 
-## How to get started
+### How to get started
-1. Clone or [download](https://github.com/apiontek/wp-rdnyc/archive/refs/heads/master.zip "Download the WP RDNYC Zip") the project onto your `themes` directory `(./wp-content/themes)`
-2. Run a find/replace for the following strings:
-- `wp-rdnyc`
-- `WP_RDNYC`
-- `wp_rdnyc_`
-3. Run `composer install`
-4. Run `npm install` 
-5. Set environment variables for BrowserSyncPlugin to the domain/ports you need (see `webpack.config.js` for variables needed).
-6. Run `npm start` to begin development server.
 
-## Webpack
+1. Clone or download the project into your `themes` directory (`./wp-content/themes`)
-The theme uses Webpack as its bundler with ES6 modules for JavaScript files.
+2. Run `composer install`
+3. Run `npm install` 
+4. Set environment variables for BrowserSyncPlugin to the domain/ports you need (see `webpack.config.js` for variables needed).
+5. Run `npm run start` to begin development server, `npm run dev` for simple dev build, `npm run prod` for a production build, or `npm run build` to build both dev & prod concurrently.
 
-### SpriteLoaderPlugin
+### SVGs
+
+#### Optimization
+
+Images placed in `assets/images` will be copied to `dist/images` -- however, SVGs can be optimized by placing them in `assets/raw` and importing them in `main.js`, e.g.:
+
+```js
+import '../raw/rdnyc-logo.svg';
+```
+This will output an optimized version to `dist/images`
 
 SVG icons can be pulled into a sprite file (output to `dist/images/icon-sprites.svg`). For this to work, `@import` them in main.js (see examples). Sprite names are set by the config in `webpack.config.js` with prefixes supported for some icon packs ([@mdi/svg](https://www.npmjs.com/package/@mdi/svg), [bootstrap-icons](https://www.npmjs.com/package/bootstrap-icons), [heroicons](https://www.npmjs.com/package/heroicons)). They can then be used for menus (put `icon-<PREFIX>-<ICON-NAME>` in the class for a menu item), or used in the theme php files with the `svg_icon_use($icon_name, $div_class)` function from `custom-functions.php` to get a div containing the correct svg use tag. `$div_class` should usually include `baseline` for proper layout.
 
-## Syntax Highlighting
+#### Including
 
-This theme supports server-side syntax highlighting via the [Syntax-highlighting Code Block](https://wordpress.org/plugins/syntax-highlighting-code-block/) plugin. In `classes.php` the plugin-provided styling is disabled, and the theme incorporates sass styling from the highlight.js node package, imported in `_code-highlight.scss` (to change the highlight style, change the import there).
+SVG images can be implemented two ways:
 
-However, the plugin doesn't support highlighting inline code, but I like that option, so the theme also incorporates highlight.js in `main.js` with a DOM Loaded action to highlight any code blocks tagged with the class `to-highlight` (must also have `language-$LANG` class) -- this should be done in WordPress in the editor, where you can edit a paragraph as HTML and add the classes (e.g. `<code class="to-highlight language-python">`).
+- A normal `<img src="<?php echo get_template_directory_uri() . '/dist/images/svg-roll-mandala.svg'; ?>" ... >` tag
-
+  - This cannot be colored but preserves SVG styling
-## Static Files via nginx
+  - Since resource is loaded separately, it can be cached.
-
+- An inline SVG using the `inline_svg( $svg_name, $atts )` function in `custom-functions.php` -- see that file for supported `$atts` array keys.
-Static files under `assets/_root` cal be served by nginx with location config like below - otherwise they (or your versions of whatever you want served from your WordPress site root) should be moved to your WordPress site root.
+  - This can be colored from parent element
-
+  - SVG class requires `{{class-placeholder}}` for 'svg_class' `$atts` key to work
-```conf
+  - Since resource is inline, cannot be cached.
-location ~ /(robots.txt|favicon.ico|android-chrome-192x192.png|android-chrome-512x512.png|browserconfig.xml|mstile-150x150.png) {
-    root /var/www/dev1/wordpress-5.8-RC2/wp-content/themes/wp-rdnyc/assets/_root/;
-    allow all;
-    log_not_found off;
-    access_log off;
-}
-```
-
-## Deployment 
-
-```bash
-npm run build
-```
-This will run both a production and development set of webpack tasks. The enqueue hook will load the correct version of the JS file, based on whether your development/staging server's `SCRIPT_DEBUG` constant is set to `true`.
-
-## Bootstrap
-
-You can customize Bootstrap SCSS & JavaScript imports in the `assets/css/app.scss` and `assets/js/main.js` files.
-
-## PurgeCSS
-
-*WP RDNYC* uses PurgeCSS to remove unused styles from the production build. It scans your project directory for strings that match SCSS declarations. You can modify the directories to search for in the `webpack.config.js` file. **Always check your production build to make sure styles you were developing with compiled correctly.**

assets/css/_basic-additions.scss

@@ -28,12 +28,6 @@
 }
 
 /* general additional spacing style */
-.mt-ltmd-125 {
-  @include media-breakpoint-down(md) {
-    margin-top: 1.25rem !important;
-  }
-}
-
 /* general additional border style */
 .border-bottom {
   &.border-dashed {

assets/css/_bs-vars-pre.scss

@@ -4,9 +4,9 @@ $blue:    #0d6efd;
 $indigo:  #6610f2;
 $purple:  #6f42c1;
 $pink:    #d63384;
-$red:     #eb2744;
+$red:     #DD3940;
 $orange:  #fd7e14;
-$yellow:  #EECF6D;
+$yellow:  #FFFF82;
 $green:   #1db954;
 $teal:    #20c997;
 $cyan:    #0dcaf0;
@@ -47,7 +47,7 @@ $spaceblue-900: #151c28;
 
 // scss-docs-start theme-color-variables
 $primary:       #51A39F;
-$secondary:     #b198bf;
+$secondary:     $orange;
 $success:       $green;
 $info:          $cyan;
 $warning:       $yellow;

assets/css/_meetings-plugin.scss

@@ -3,9 +3,29 @@
   a {
     @extend a;
   }
+  .page-header { margin: 20px 0; }
   .form-control {
     background-color: $input-bg;
     border: 1px solid $primary;
+    &[disabled] {
+      background-color: tint-color($input-bg, 10%);
+      border: 1px solid shade-color($primary, 35%);
+      &::-ms-clear,
+      &::-ms-reveal { display: none; }
+      &::-webkit-input-placeholder, /* WebKit, Blink, Edge */
+      &:-ms-input-placeholder, /* Internet Explorer 10-11 */
+      &::-ms-input-placeholder, /* Microsoft Edge */
+      &::placeholder /* Most modern browsers support this now. */
+      { 
+        color:    shade-color($gray-200, 40%)    !important;
+      }
+      &:-moz-placeholder, /* Mozilla Firefox 4 to 18 */
+      &::-moz-placeholder { /* Mozilla Firefox 19+ */
+        color:    shade-color($gray-200, 40%)    !important;
+        opacity:  1;
+      }
+  
+    }
     &::-ms-clear,
     &::-ms-reveal { display: none; }
     &::-webkit-input-placeholder, /* WebKit, Blink, Edge */
@@ -47,12 +67,12 @@
         color: $dark;
         background-color: $primary;
         border: 1px solid $primary;
-        box-shadow: none !important;
+        box-shadow: null !important;
         &:hover {
           color: $dark;
           background-color: tint-color($primary, $btn-hover-bg-tint-amount) !important;
           border: 1px solid $primary;
-          box-shadow: none !important;
+          box-shadow: null !important;
         }
       }
     }
@@ -82,13 +102,24 @@
 }
 
 /* 12 step meeting list (tsml) main table & widget table styling */
-.tsml-widget-upcoming table.tsml_next_meetings tbody tr td {
+section.tsml-widget-upcoming.widget_tsml_widget_upcoming.widget div.tsml-no-upcoming-meetings {
+  color: $input-focus-color;
+  // background-color: $input-bg;
+  background-color: rgba(21,28,40,0.85);
+  border-color: $input-border-color;
+}
+.tsml-widget-upcoming {
+  h2 { margin-bottom: 1rem; }
+  table.tsml_next_meetings {
+    opacity: 0.90;
+    tbody tr td {
       margin-left: .5rem;
       &:first-of-type {
         margin-left: 0 !important;
       }
+    }
+  }
 }
-.tsml-widget-upcoming h2 { margin-bottom: 1rem; }
 #tsml #meetings .results table,
 .tsml-widget-upcoming table.tsml_next_meetings {
   @extend .table;
@@ -117,9 +148,10 @@
 
 #tsml .results {
   .alert-warning {
-    background-color: #f5e2a7;
+    color: $input-focus-color;
-    border-color: #f3dd99;
+    // background-color: $input-bg;
-    color: #5f532c;
+    background-color: rgba(21,28,40,0.85);
+    border-color: $input-border-color;
   }
 }
 

assets/css/_nav-burger.scss

@@ -1,18 +1,7 @@
 // /* Hamburger settings overrides */
-// $hamburger-padding-x: 0.95rem !default;
-// $hamburger-padding-y: 0.625rem !default;
 $hamburger-padding-x: 0 !default;
 $hamburger-padding-y: 0 !default;
-// $hamburger-layer-width: 1.5rem !default;
-// $hamburger-layer-height: 2px !default;
-// $hamburger-layer-spacing: 6px !default;
-// // * skipping default color, using color from bootstrap instead, below
 $hamburger-layer-color: $primary !default;
-// $hamburger-layer-border-radius: 0.25rem !default;
-// $hamburger-hover-opacity: 0.7 !default;
-// // * skipping default color, using color from bootstrap instead, below
-// // $hamburger-active-layer-color: $hamburger-layer-color !default;
-// $hamburger-active-hover-opacity: $hamburger-hover-opacity !default;
 
 /* import hamburgers sass */
 @import "../../node_modules/hamburgers/_sass/hamburgers/hamburgers.scss";
@@ -27,43 +16,3 @@ button#btn-burger {
     box-shadow: inherit;
   }
 }
-
-// /* correct colors to match bootstrap defaults */
-// .navbar-light {
-//   .hamburger {
-//     &.navbar-toggler {
-//       border: 1px $navbar-light-toggler-border-color solid !important;
-//       .hamburger-inner {
-//         &,
-//         &::before,
-//         &::after {
-//           background-color: $primary;
-//         }
-//       }
-//       &.is-active {
-//         .hamburger-inner::after {
-//           background-color: $primary;
-//         }
-//       }
-//     }
-//   }
-// }
-// .navbar-dark {
-//   .hamburger {
-//     &.navbar-toggler {
-//       border: 1px $navbar-dark-toggler-border-color solid !important;
-//       .hamburger-inner {
-//         &,
-//         &::before,
-//         &::after {
-//           background-color: $primary;
-//         }
-//       }
-//       &.is-active {
-//         .hamburger-inner::after {
-//           background-color: $primary;
-//         }
-//       }
-//     }
-//   }
-// }

assets/css/_rolling-mandala.scss

@@ -0,0 +1,130 @@
+/* rolling mandala */
+// @-webkit-keyframes roll-in {
+//   0% {
+//     -webkit-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -moz-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -ms-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -o-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//   }
+
+//   100% {
+//     -webkit-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -moz-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -ms-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -o-transform: rotate(0) translateY(-50%) translateX(0px);
+//     transform: rotate(0) translateY(-50%) translateX(0px);
+//   }
+// }
+// @-moz-keyframes roll-in {
+//   0% {
+//     -webkit-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -moz-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -ms-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     -o-transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//     transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//   }
+
+//   100% {
+//     -webkit-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -moz-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -ms-transform: rotate(0) translateY(-50%) translateX(0px);
+//     -o-transform: rotate(0) translateY(-50%) translateX(0px);
+//     transform: rotate(0) translateY(-50%) translateX(0px);
+//   }
+// }
+
+
+
+
+
+
+
+
+
+
+
+
+
+// @keyframes roll-in {
+//   0% {
+//     transform: rotate(90deg) translateY(-50%) translateX(-50%);
+//   }
+
+//   100% {
+//     transform: rotate(0) translateY(-50%) translateX(0px);
+//   }
+// }
+// .roll-mandala {
+//   position: absolute;
+//   right: $mandala_distance_right;
+//   top: 50%;
+//   width: $mandala_width;
+//   pointer-events: none;
+//   opacity: .5;
+//   z-index: -999;
+//   animation: roll-in 2s cubic-bezier(0.51, 0.04, 0.68, 1.08);
+//   transform: translateY(-50%);
+// }
+
+
+
+
+
+
+
+@use "sass:math";
+
+
+$mandala_height_base: 76vh;
+$mandala_right_shift: math.div($mandala_height_base, -2);
+$mandala_final_opacity_base: 0.33;
+$mandala_final_opacity_md: 0.66;
+
+@keyframes roll-in-down-md {
+  0% {
+    transform: rotate(80deg) translateY(-50%) translateX(-50%);
+    opacity: 1.0;
+  }
+
+  100% {
+    transform: rotate(0) translateY(-50%) translateX(0px);
+    opacity: $mandala_final_opacity_base;
+  }
+}
+@keyframes roll-in-up-md {
+  0% {
+    transform: rotate(80deg) translateY(-50%) translateX(-50%);
+    opacity: 1.0;
+  }
+
+  100% {
+    transform: rotate(0) translateY(-50%) translateX(0px);
+    opacity: $mandala_final_opacity_md;
+  }
+}
+
+.roll-mandala {
+  height: $mandala_height_base;
+  max-width: inherit !important;
+  position: absolute;
+  right: $mandala_right_shift;
+  top: 50%;
+  pointer-events: none;
+  z-index: -999;
+  transform: translateY(-50%);
+
+  @include media-breakpoint-down(md) {
+    opacity: $mandala_final_opacity_base;
+    animation: roll-in-down-md 1.5s cubic-bezier(0.51, 0.04, 0.68, 1.08);
+  }
+
+  @include media-breakpoint-up(md) {
+    opacity: $mandala_final_opacity_md;
+    animation: roll-in-up-md 1.5s cubic-bezier(0.51, 0.04, 0.68, 1.08);
+  }
+  
+}
+
+
+

assets/css/app.scss

@@ -16,11 +16,28 @@
 /* Navbar & Main layout styling */
 @import "layout-top-navbar-main";
 
+/* Navbar & Main layout styling */
+@import "rolling-mandala";
+
 /* main */
 html,
 body {
   height: 100%;
 }
+body {
+  display: flex;
+  flex-direction: column;
+  @include media-breakpoint-down(md) {
+    padding-top: 1.25rem !important;
+  }
+  @include media-breakpoint-up(md) {
+    padding-top: 3rem !important;
+  }
+  &.front-page {
+    height: 100vh !important;
+    overflow-x: hidden;
+  }
+}
 
 /* links */
 a {
@@ -34,7 +51,7 @@ a {
 article.post.sticky,
 .rpwwt-widget li.rpwwt-sticky {
   border-radius: .25rem !important;
-  background-color: rgba(0, 0, 0, 0.33);
+  background-color: rgba(0, 0, 0, 0.50);
   border-bottom: inherit !important;
   margin-bottom: inherit !important;
   margin-left: 0 !important;
@@ -155,6 +172,7 @@ figure.wp-caption {
 }
 .btn-primary {
   color: $dark;
+  box-shadow: inherit !important;
 }
 .has-drop-cap:not(:focus)::first-letter {
   font-size: 5em;
@@ -268,13 +286,7 @@ main#fp-main > div.fp-grid {
   grid-column-gap: 2rem;
   grid-row-gap: 2rem;
   @include media-breakpoint-up(md) {
-    grid-template-columns: 20rem auto;
+    grid-template-columns: auto 20rem;
-  }
-  > section.tsml-widget-upcoming.widget_tsml_widget_upcoming.widget {
-    @include media-breakpoint-up(md) {
-      grid-column-start: 1;
-      grid-row-start: 1;
-    }
   }
   h2.widgettitle {
     font-size: 1.75rem;

assets/js/main.js

@@ -3,6 +3,7 @@ import '../css/app.scss'
 
 // Import svg files for webpack handling
 import '../raw/rdnyc-logo.svg';           // rdnyc logo
+import '../raw/roll-mandala.svg';         // rolling mandala decoration
 // other:
 import '../../node_modules/bootstrap-icons/icons/chevron-down.svg';
 import '../../node_modules/bootstrap-icons/icons/chevron-left.svg';

assets/raw/rdnyc-logo.svg

@@ -3,9 +3,9 @@
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 224 85" style="enable-background:new 0 0 224 85;" xml:space="preserve">
 <style type="text/css">
-	.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#BEB5B0;}
+	.st0{fill-rule:evenodd;clip-rule:evenodd;fill:currentColor;}
 	.st1{enable-background:new    ;}
-	.st2{fill:#BEB5B0;}
+	.st2{fill:currentColor;}
 </style>
 <title>Group 42</title>
 <desc>Created with Sketch.</desc>

dist/images/bsi-chevron-down.svg

@@ -1 +1 @@
-<svg fill="currentColor" class="bi bi-chevron-down {{class-placeholder}}" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>

dist/images/bsi-chevron-left.svg

@@ -1 +1 @@
-<svg fill="currentColor" class="bi bi-chevron-left {{class-placeholder}}" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-chevron-left" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/></svg>

dist/images/bsi-chevron-right.svg

@@ -1 +1 @@
-<svg fill="currentColor" class="bi bi-chevron-right {{class-placeholder}}" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-chevron-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/></svg>

dist/images/bsi-search.svg

@@ -1 +1 @@
-<svg fill="currentColor" class="bi bi-search {{class-placeholder}}" viewBox="0 0 16 16"><path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16"><path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/></svg>

footer.php

@@ -13,9 +13,9 @@ namespace WP_RDNYC;
 
 ?>
 
-    <footer class="d-flex flex-column align-items-center mt-2 px-3 py-3">
+    <footer class="footer mt-auto py-3 text-center">
 
-      <span class="text-gray-400 mt-3">&copy; <?php echo date("Y") ?> Recovery Dharma NYC</span>
+      <span class="text-gray-400 fs-smaller">&copy; <?php echo date("Y") ?> Recovery Dharma NYC</span>
 
     </footer>
 

front-page.php

@@ -10,7 +10,7 @@ namespace WP_RDNYC;
 
 get_header(); ?>
 
-<main id="fp-main" class="container-xl mt-4 mt-md-6 mt-lg-7 mb-3">
+<main id="fp-main" class="container-xl mt-0 mt-md-3">
   <div class="fp-grid">
 
 

header.php

@@ -42,7 +42,18 @@ namespace WP_RDNYC;
 
 <body <?php body_class(); ?> itemscope itemtype="https://schema.org/WebPage">
 
-  <nav id="nt-out" class="container-fluid  mt-ltmd-125 mt-md-5  mb-4 mb-sm-4-2 mb-lg-4-25 mb-xl-5 mb-xxl-7">
+  <?php
+    if (is_front_page()) :
+  ?>
+    <img 
+      src="<?php echo get_template_directory_uri() . '/dist/images/svg-roll-mandala.svg'; ?>"
+      class="img roll-mandala" aria_hidden="true"
+    >
+  <?php
+    endif;
+  ?>
+
+  <nav id="nt-out" class="container-fluid  mb-4 mb-sm-4-2 mb-lg-4-25 mb-xl-5 mb-xxl-7">
 
     <div class="nt-brand">
       <h1>

index.php

@@ -10,7 +10,7 @@ namespace WP_RDNYC;
 
 get_header(); ?>
 
-<main class="container-lg d-flex justify-content-center  mt-4 mb-3">
+<main class="container-lg d-flex justify-content-center  mt-0 mt-md-3 mb-3">
   <div class="content w-100">
 
     <?php

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "wp-rdnyc-theme",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "wp-rdnyc-theme",
-      "version": "1.0.2",
+      "version": "1.0.3",
       "license": "MIT",
       "dependencies": {
         "@fontsource/open-sans": "^4.x",
@@ -1672,9 +1672,9 @@
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "16.4.10",
+      "version": "16.4.11",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.10.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.11.tgz",
-      "integrity": "sha512-TmVHsm43br64js9BqHWqiDZA+xMtbUpI1MBIA0EyiBmoV9pcEYFOSdj5fr6enZNfh4fChh+AGOLIzGwJnkshyQ==",
+      "integrity": "sha512-nWSFUbuNiPKJEe1IViuodSI+9cM+vpM8SWF/O6dJK7wmGRNq55U7XavJHrlRrPkSMuUZUFzg1xaZ1B+ZZCrRWw==",
       "dev": true
     },
     "node_modules/@types/normalize-package-data": {
@@ -3454,9 +3454,9 @@
       "dev": true
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.3.793",
+      "version": "1.3.795",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.793.tgz",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.795.tgz",
-      "integrity": "sha512-l9NrGV6Mr4ov5mayYPvIWcwklNw5ROmy6rllzz9dCACw9nKE5y+s5uQk+CBJMetxrWZ6QJFsvEfG6WDcH2IGUg=="
+      "integrity": "sha512-4TPxrLf9Fzsi4rVgTlDm+ubxoXm3/TN67/LGHx/a4UkVubKILa6L26O6eTnHewixG/knzU9L3lLmfL39eElwlQ=="
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
@@ -6386,9 +6386,9 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "node_modules/sass": {
-      "version": "1.37.2",
+      "version": "1.37.5",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.37.2.tgz",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.37.5.tgz",
-      "integrity": "sha512-+XMg8QOg7OGLo4F5R3fLYEti/3MxFkyX0NxYbqWycU8xYMAhPDN5FuCO2ZJudnM1wcnZ3CeJRnpqUBZpLOitCQ==",
+      "integrity": "sha512-Cx3ewxz9QB/ErnVIiWg2cH0kiYZ0FPvheDTVC6BsiEGBTZKKZJ1Gq5Kq6jy3PKtL6+EJ8NIoaBW/RSd2R6cZOA==",
       "dev": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0"
@@ -8964,9 +8964,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "16.4.10",
+      "version": "16.4.11",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.10.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.11.tgz",
-      "integrity": "sha512-TmVHsm43br64js9BqHWqiDZA+xMtbUpI1MBIA0EyiBmoV9pcEYFOSdj5fr6enZNfh4fChh+AGOLIzGwJnkshyQ==",
+      "integrity": "sha512-nWSFUbuNiPKJEe1IViuodSI+9cM+vpM8SWF/O6dJK7wmGRNq55U7XavJHrlRrPkSMuUZUFzg1xaZ1B+ZZCrRWw==",
       "dev": true
     },
     "@types/normalize-package-data": {
@@ -10330,9 +10330,9 @@
       "dev": true
     },
     "electron-to-chromium": {
-      "version": "1.3.793",
+      "version": "1.3.795",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.793.tgz",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.795.tgz",
-      "integrity": "sha512-l9NrGV6Mr4ov5mayYPvIWcwklNw5ROmy6rllzz9dCACw9nKE5y+s5uQk+CBJMetxrWZ6QJFsvEfG6WDcH2IGUg=="
+      "integrity": "sha512-4TPxrLf9Fzsi4rVgTlDm+ubxoXm3/TN67/LGHx/a4UkVubKILa6L26O6eTnHewixG/knzU9L3lLmfL39eElwlQ=="
     },
     "emoji-regex": {
       "version": "8.0.0",
@@ -12490,9 +12490,9 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "sass": {
-      "version": "1.37.2",
+      "version": "1.37.5",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.37.2.tgz",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.37.5.tgz",
-      "integrity": "sha512-+XMg8QOg7OGLo4F5R3fLYEti/3MxFkyX0NxYbqWycU8xYMAhPDN5FuCO2ZJudnM1wcnZ3CeJRnpqUBZpLOitCQ==",
+      "integrity": "sha512-Cx3ewxz9QB/ErnVIiWg2cH0kiYZ0FPvheDTVC6BsiEGBTZKKZJ1Gq5Kq6jy3PKtL6+EJ8NIoaBW/RSd2R6cZOA==",
       "dev": true,
       "requires": {
         "chokidar": ">=3.0.0 <4.0.0"

package.json

@@ -1,7 +1,7 @@
 {
   "name": "wp-rdnyc-theme",
   "author": "Adam Piontek <adam@73k.us> (https://73k.us)",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "Wordpress theme for Recovery Dharma NYC",
   "homepage": "https://github.com/apiontek/wp-rdnyc",
   "contributors": [

style.css

@@ -3,7 +3,7 @@
  * Theme URI: https://github.com/apiontek/wp-rdnyc
  * Author: Adam Piontek
  * Author URI: https://73k.us
- * Version: 1.0.2
+ * Version: 1.0.3
  * License: GNU General Public License v3 or later
  * License URI: https://www.gnu.org/licenses/gpl-3.0.html
  * Text Domain: wp-rdnyc

svgo.config.js

@@ -4,14 +4,14 @@ module.exports = {
     'cleanupAttrs',
     'mergeStyles',
     'inlineStyles',
-    'removeDoctype',
+    // 'removeDoctype',
     'removeXMLProcInst',
     'removeComments',
     'removeMetadata',
     'removeTitle',
     'removeDesc',
     'removeUselessDefs',
-    'removeXMLNS',
+    // 'removeXMLNS',
     'removeEditorsNSData',
     'removeEmptyAttrs',
     'removeHiddenElems',
@@ -46,21 +46,21 @@ module.exports = {
     {
       name: 'removeAttrs',
       params: {
-        attrs: 'svg:id'
+        attrs: ['svg:id', 'svg:style', 'g:id']
       }
     },
     // 'removeAttributesBySelector',
     // 'removeElementsByAttr',
     // 'addClassesToSVGElement',
-    {
+    // {
-      name: 'addClassesToSVGElement',
+    //   name: 'addClassesToSVGElement',
-      params: {
+    //   params: {
-        className: '{{class-placeholder}}'
+    //     className: '{{class-placeholder}}'
-      }
+    //   }
-    },
+    // },
-    // 'addAttributesToSVGElement',
+    // // 'addAttributesToSVGElement',
     // 'removeOffCanvasPaths',
-    'removeStyleElement',
+    // 'removeStyleElement',
     // 'removeScriptElement',
     // 'reusePaths',
   ]

webpack.config.js

@@ -12,6 +12,10 @@ const isProduction          = 'production' === process.env.NODE_ENV;
 let prefix = isProduction ? '.min' : '';
 
 const config = {
+  performance: {
+    maxEntrypointSize: 320000,
+    maxAssetSize: 640000,
+  },
   entry: './assets/js/main.js',
   output: {
     filename: `[name]${prefix}.js`,
@@ -186,6 +190,9 @@ function getCSSWhitelistPatterns() {
     /^h.$/,
     /^pre$/,
     /^code$/,
+    /^fp-(.*)$/,
+    /^rpwwt-(.*)$/,
+    /^dropdown-(.*)$/,
   ];
 }