From 64598f4aad6cbb14a83ae3aa1fb115dc884c622d Mon Sep 17 00:00:00 2001
From: Adam Piontek <adam@73k.us>
Date: Tue, 27 Jul 2021 19:12:18 -0400
Subject: [PATCH] progress on styling news/blog listing & content
---
assets/css/_bs-colors.scss | 2 +
assets/css/_bs-custom.scss | 10 +-
assets/css/_fonts.scss | 40 +--
...{_nav-burger.scss => _top-nav-burger.scss} | 0
.../{_nav-bar-help.scss => _top-navbar.scss} | 2 +-
assets/css/app.scss | 280 +++++++++++++-----
assets/js/main.js | 8 +-
content-templates/content-article.php | 18 +-
custom-functions.php | 5 +-
header.php | 2 +-
index.php | 11 +-
package-lock.json | 14 +-
package.json | 2 +-
searchform.php | 2 +-
src/classes.php | 21 +-
15 files changed, 282 insertions(+), 135 deletions(-)
rename assets/css/{_nav-burger.scss => _top-nav-burger.scss} (100%)
rename assets/css/{_nav-bar-help.scss => _top-navbar.scss} (98%)
diff --git a/assets/css/_bs-colors.scss b/assets/css/_bs-colors.scss
index 33f9f70..0fdcded 100644
--- a/assets/css/_bs-colors.scss
+++ b/assets/css/_bs-colors.scss
@@ -32,7 +32,9 @@ $spaceblue-400: #5d79ac;
$spaceblue-500: #4c6594;
$spaceblue-600: #3e5379;
$spaceblue-700: #31415e;
+$spaceblue-750: #2a3751;
$spaceblue-800: #212c40;
+$spaceblue-850: #1c2536;
$spaceblue-900: #151c28;
$light: $spaceblue-200;
diff --git a/assets/css/_bs-custom.scss b/assets/css/_bs-custom.scss
index 076f353..ed210d7 100644
--- a/assets/css/_bs-custom.scss
+++ b/assets/css/_bs-custom.scss
@@ -6,11 +6,10 @@ $line-height-base: 1.35;
$line-height-sm: 1.15;
$line-height-lg: 1.75;
-
// 'native font stack' for sans via https://getbootstrap.com/docs/5.0/content/reboot/#native-font-stack
$font-family-sans-serif:
// custom theme font
- Overpass,
+ "Open Sans",
// Cross-platform generic font family (default user interface font)
system-ui,
// Safari for macOS and iOS (San Francisco)
@@ -30,10 +29,11 @@ $font-family-sans-serif:
// Emoji fonts
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
-$font-family-base: $font-family-sans-serif;
+// handbrush / handwriting / special / emphasis font stack
+$font-family-handbrush: "Permanent Marker", Caveat, Besom, Fjord, "Goudy Old Style", "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
-// handbrush / special / emphasis / impact font stack
-$font-family-handbrush: "Permanent Marker", Besom, Fjord, Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;
+// base bootstrap font
+$font-family-base: $font-family-sans-serif;
// Features
$enable-shadows: true;
diff --git a/assets/css/_fonts.scss b/assets/css/_fonts.scss
index 731c919..55054cd 100644
--- a/assets/css/_fonts.scss
+++ b/assets/css/_fonts.scss
@@ -1,21 +1,23 @@
+/* font-family-sans-serif : Fontsource Open Sans */
+// @import "../../node_modules/@fontsource/open-sans/100.css"; /* Thin (Hairline) | normal */
+// @import "../../node_modules/@fontsource/open-sans/100-italic.css"; /* Thin (Hairline) | italic */
+// @import "../../node_modules/@fontsource/open-sans/200.css"; /* Extra Light (Ultra Light) | normal */
+// @import "../../node_modules/@fontsource/open-sans/200-italic.css"; /* Extra Light (Ultra Light) | italic */
+@import "../../node_modules/@fontsource/open-sans/300.css"; /* Light | normal */
+@import "../../node_modules/@fontsource/open-sans/300-italic.css"; /* Light | italic */
+@import "../../node_modules/@fontsource/open-sans/400.css"; /* Normal (Regular) | normal */
+@import "../../node_modules/@fontsource/open-sans/400-italic.css"; /* Normal (Regular) | italic */
+// @import "../../node_modules/@fontsource/open-sans/500.css"; /* Medium | normal */
+// @import "../../node_modules/@fontsource/open-sans/500-italic.css"; /* Medium | italic */
+@import "../../node_modules/@fontsource/open-sans/600.css"; /* Semi Bold (Demi Bold) | normal */
+@import "../../node_modules/@fontsource/open-sans/600-italic.css"; /* Semi Bold (Demi Bold) | italic */
+@import "../../node_modules/@fontsource/open-sans/700.css"; /* Bold | normal */
+@import "../../node_modules/@fontsource/open-sans/700-italic.css"; /* Bold | italic */
+@import "../../node_modules/@fontsource/open-sans/800.css"; /* Extra Bold (Ultra Bold) | normal */
+@import "../../node_modules/@fontsource/open-sans/800-italic.css"; /* Extra Bold (Ultra Bold) | italic */
+// @import "../../node_modules/@fontsource/open-sans/900.css"; /* Black (Heavy) | normal */
+// @import "../../node_modules/@fontsource/open-sans/900-italic.css"; /* Black (Heavy) | italic */
+
+
/* emphasis/special : Fontsource Permanent Marker */
@import "../../node_modules/@fontsource/permanent-marker/400.css"; /* Normal (Regular) | normal */
-
-
-/* font-family-sans-serif : Fontsource Overpass */
-@import "../../node_modules/@fontsource/overpass/100.css"; /* Thin (Hairline) | normal */
-@import "../../node_modules/@fontsource/overpass/100-italic.css"; /* Thin (Hairline) | italic */
-@import "../../node_modules/@fontsource/overpass/200.css"; /* Extra Light (Ultra Light) | normal */
-@import "../../node_modules/@fontsource/overpass/200-italic.css"; /* Extra Light (Ultra Light) | italic */
-@import "../../node_modules/@fontsource/overpass/300.css"; /* Light | normal */
-@import "../../node_modules/@fontsource/overpass/300-italic.css"; /* Light | italic */
-@import "../../node_modules/@fontsource/overpass/400.css"; /* Normal (Regular) | normal */
-@import "../../node_modules/@fontsource/overpass/400-italic.css"; /* Normal (Regular) | italic */
-@import "../../node_modules/@fontsource/overpass/600.css"; /* Semi Bold (Demi Bold) | normal */
-@import "../../node_modules/@fontsource/overpass/600-italic.css"; /* Semi Bold (Demi Bold) | italic */
-@import "../../node_modules/@fontsource/overpass/700.css"; /* Bold | normal */
-@import "../../node_modules/@fontsource/overpass/700-italic.css"; /* Bold | italic */
-@import "../../node_modules/@fontsource/overpass/800.css"; /* Extra Bold (Ultra Bold) | normal */
-@import "../../node_modules/@fontsource/overpass/800-italic.css"; /* Extra Bold (Ultra Bold) | italic */
-@import "../../node_modules/@fontsource/overpass/900.css"; /* Black (Heavy) | normal */
-@import "../../node_modules/@fontsource/overpass/900-italic.css"; /* Black (Heavy) | italic */
diff --git a/assets/css/_nav-burger.scss b/assets/css/_top-nav-burger.scss
similarity index 100%
rename from assets/css/_nav-burger.scss
rename to assets/css/_top-nav-burger.scss
diff --git a/assets/css/_nav-bar-help.scss b/assets/css/_top-navbar.scss
similarity index 98%
rename from assets/css/_nav-bar-help.scss
rename to assets/css/_top-navbar.scss
index e830d44..f43fdd0 100644
--- a/assets/css/_nav-bar-help.scss
+++ b/assets/css/_top-navbar.scss
@@ -174,7 +174,7 @@ nav#top-navbar-grid-outer {
li.menu-item {
.dropdown-item.top-navbar-grid-main-menu-item-link {
@extend .fw-normal;
- padding: 0.25rem 1rem 0 1rem !important;
+ // padding: 0.25rem 1rem 0 1rem !important;
text-transform: inherit !important;
&:hover {
@extend .text-decoration-none;
diff --git a/assets/css/app.scss b/assets/css/app.scss
index 3f5f443..1409f26 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -8,10 +8,10 @@
@import "svg-icons";
/* Navbar toggler icon override */
-@import "nav-burger";
+@import "top-nav-burger";
-/* Navbar custom styling */
-@import "nav-bar-help";
+/* Top Navbar styling */
+@import "top-navbar";
/* main */
html,
@@ -20,6 +20,108 @@ body {
background-color: $spaceblue-800;
height: 100%;
}
+a {
+ @extend .text-decoration-none;
+ &:hover {
+ @extend .text-decoration-underline;
+ color: $primary;
+ }
+}
+
+/* general additional text style */
+.font-family-handbrush {
+ font-family: $font-family-handbrush;
+}
+.text-gray-100 {
+ color: $gray-100;
+}
+.text-gray-200 {
+ color: $gray-200;
+}
+.text-gray-300 {
+ color: $gray-300;
+}
+.text-gray-400 {
+ color: $gray-400;
+}
+.text-gray-500 {
+ color: $gray-500;
+}
+.text-gray-600 {
+ color: $gray-600;
+}
+.text-gray-700 {
+ color: $gray-700;
+}
+.fs-larger {
+ font-size: larger;
+}
+.fs-smaller {
+ font-size: smaller;
+}
+
+/* general additional spacing style */
+.mb-two-rem {
+ margin-bottom: 2rem;
+}
+
+/* general additional border style */
+.border-bottom {
+ &.border-dashed {
+ border-bottom-style: dashed !important;
+ }
+ &.border-gray-300 {
+ border-bottom-color: $gray-300 !important;
+ }
+ &.border-gray-400 {
+ border-bottom-color: $gray-400 !important;
+ }
+ &.border-gray-500 {
+ border-bottom-color: $gray-500 !important;
+ }
+ &.border-gray-600 {
+ border-bottom-color: $gray-600 !important;
+ }
+ &.border-gray-700 {
+ border-bottom-color: $gray-700 !important;
+ }
+ &.border-gray-750 {
+ border-bottom-color: $gray-750 !important;
+ }
+ &.border-gray-800 {
+ border-bottom-color: $gray-800 !important;
+ }
+}
+
+/* post styling */
+article.post.sticky {
+ @extend .card;
+ background-color: shade-color($gray-800, 50%);
+ border-bottom: inherit !important;
+ margin-bottom: inherit !important;
+ padding-bottom: inherit !important;
+ header.post-header {
+ @extend .card-header;
+ @extend .pb-0;
+ }
+ div.post-body {
+ @extend .card-body;
+ @extend .pt-0;
+ &:last-child {
+ padding-bottom: 0 !important;
+ margin-bottom: .25rem !important;
+ }
+ }
+}
+.more-link-outer {
+ @extend .text-end;
+ @extend .mb-0;
+ .more-link {
+ @extend .text-decoration-none;
+ @extend .font-family-handbrush;
+ }
+}
+
// a {
// color: rgba($white, 0.75);
// // border-bottom: $gray-600 2px solid;
@@ -54,18 +156,6 @@ body {
// .border-gray-900 {
// border-color: $gray-900 !important;
// }
-.text-gray-200 {
- color: $gray-200;
-}
-.text-gray-300 {
- color: $gray-300;
-}
-.text-gray-400 {
- color: $gray-400;
-}
-.text-gray-500 {
- color: $gray-500;
-}
// .border-10 {
// border-width: 10px !important;
// }
@@ -81,47 +171,93 @@ body {
// .fw-600 {
// font-weight: 600;
// }
-// .fs-larger {
-// font-size: larger;
-// }
-// .fs-smaller {
-// font-size: smaller;
-// }
/* blockquote handling */
-blockquote {
- &.wp-block-quote {
- @extend .border-start;
- @extend .border-gray;
- @extend .border-5;
- @extend .ms-0;
- @extend .my-4;
- @extend .ps-3;
- @extend .py-2;
- background-color: $gray-750;
- p {
- @extend .blockquote;
- font-size: 1em;
- &:last-of-type {
- @extend .my-0;
- @extend .py-0;
- }
- }
- cite {
- @extend .blockquote-footer;
- @extend .text-gray-300;
+blockquote.wp-block-quote {
+ background-color: tint-color($spaceblue-800, 5%) !important;
+ @extend .border-start;
+ @extend .border-5;
+ border-left-color: tint-color($spaceblue-800, 15%) !important;
+ @extend .ms-0;
+ @extend .my-4;
+ @extend .px-3;
+ @extend .py-2;
+ quotes: "\201C" "\201D" "\201C" "\201D";
+ position: relative;
+ p {
+ @extend .blockquote;
+ &:last-of-type {
@extend .my-0;
@extend .py-0;
- font-size: 0.85em;
- font-style: normal;
}
- :last-child {
- @extend .py-1;
+ }
+ &.is-style-large {
+ p {
+ font-size: 1.7em;
}
}
+ cite {
+ @extend .blockquote-footer;
+ @extend .text-gray-300;
+ @extend .my-0;
+ @extend .py-0;
+ font-size: 0.85em;
+ font-style: normal;
+ }
+ &:last-child {
+ @extend .py-1;
+ }
+}
+figure.wp-block-pullquote {
+ &:not(.is-style-solid-color) {
+ background-color: tint-color($spaceblue-800, 5%) !important;
+ @extend .border-top;
+ @extend .border-bottom;
+ @extend .border-5;
+ border-top-color: tint-color($spaceblue-800, 15%) !important;
+ border-bottom-color: tint-color($spaceblue-800, 15%) !important;
+ }
}
+/* other wp styling */
+.btn-primary {
+ color: $spaceblue-800;
+}
+.has-drop-cap:not(:focus)::first-letter {
+ font-size: 5em;
+ margin: 0.05em 0.05em 0 0;
+}
+.wp-block-button {
+ .wp-block-button__link {
+ @extend .btn;
+ @extend .text-decoration-none;
+ @extend .mb-1;
+ }
+ &:not(.is-style-outline) .wp-block-button__link {
+ @extend .btn-primary;
+ }
+ &.is-style-outline .wp-block-button__link {
+ @extend .btn-outline-primary;
+ }
+ &.alignleft {
+ @extend .text-start;
+ }
+ &.aligncenter {
+ @extend .text-center;
+ }
+ &.alignright {
+ @extend .text-end;
+ }
+}
+
+
+// &:not(.is-style-outline) {
+ // @extend .btn-primary;
+ // }
+ // &.is-style-outline {
+ // @extend .btn-outline-primary;
+ // }
// /* blog */
// .post-title a {
@@ -177,8 +313,8 @@ blockquote {
/* search form */
.search-form .form-control {
color: $gray-100 !important;
- background-color: $gray-800 !important;
- border-color: $gray-500;
+ background-color: $spaceblue-900 !important;
+ border-color: $spaceblue-600;
}
.search-form .form-control:focus {
border-color: $input-focus-border-color;
@@ -188,40 +324,40 @@ input.form-control::-ms-clear,
.form-control::-ms-reveal,
input.form-control::-ms-reveal { display: none; }
.form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
- color: $gray-500 !important;
+ color: $spaceblue-700 !important;
}
.form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
- color: $gray-500 !important;
+ color: $spaceblue-700 !important;
opacity: 1;
}
.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
- color: $gray-500 !important;
+ color: $spaceblue-700 !important;
opacity: 1;
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
- color: $gray-500 !important;
+ color: $spaceblue-700 !important;
}
.form-control::-ms-input-placeholder { /* Microsoft Edge */
- color: $gray-500 !important;
+ color: $spaceblue-700 !important;
}
.form-control::placeholder { /* Most modern browsers support this now. */
- color: $gray-500 !important;
-}
-.search-form {
- .btn {
- padding: .25rem .75rem;
- &.btn-outline-light {
- color: $gray-300;
- border-color: $gray-500;
- &:hover {
- color: $primary;
- background-color: inherit;
- border-color: $secondary;
- }
- }
- .icon {
- font-size: 1.375rem;
- margin-top: 1px;
- }
- }
+ color: $spaceblue-700 !important;
}
+// .search-form {
+// .btn {
+// padding: .25rem .75rem;
+// &.btn-outline-light {
+// color: $gray-300;
+// border-color: $spaceblue-500;
+// &:hover {
+// color: $primary;
+// background-color: inherit;
+// border-color: $secondary;
+// }
+// }
+// // .icon {
+// // font-size: 1.375rem;
+// // margin-top: 1px;
+// // }
+// }
+// }
diff --git a/assets/js/main.js b/assets/js/main.js
index 45222ff..4afd742 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -6,13 +6,7 @@ import '../raw/rdnyc-logo.svg'; // rdnyc logo
// other:
import '../../node_modules/bootstrap-icons/icons/chevron-down.svg';
import '../../node_modules/bootstrap-icons/icons/search.svg';
-// 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/information.svg";
-// import "../../node_modules/@mdi/svg/svg/account.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/rss.svg";
+// import '../../node_modules/bootstrap-icons/icons/person.svg';
// Import Bootstrap JS
import 'bootstrap/js/dist/collapse';
diff --git a/content-templates/content-article.php b/content-templates/content-article.php
index 0a12565..9ce611e 100644
--- a/content-templates/content-article.php
+++ b/content-templates/content-article.php
@@ -9,8 +9,8 @@
namespace WP_RDNYC;
?>
-<article class="post border-bottom border-gray pb-4 mb-3" itemscope itemtype="https://schema.org/CreativeWork">
- <header>
+<article <?php echo post_class( 'post border-bottom border-gray-750 pb-4 mb-two-rem' ); ?> itemscope itemtype="https://schema.org/CreativeWork">
+ <header class="post-header">
<h2 class="post-title fs-2 fw-600 mb-2">
<?php
if ( is_archive() || is_search() || is_home() ) {
@@ -23,17 +23,15 @@ namespace WP_RDNYC;
} ?>
</h2>
- <div class="post-date font-monospace text-gray-300 <?php echo (has_tag() ? '' : 'mb-3'); ?>">
- <?php
- // 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();
- ?>
+ <div class="post-date text-gray-400 mb-3" style="margin-top: -.33rem;">
+ <!-- inline_svg( 'bsi-clock', array( 'div_class' => 'icon baseline me-2' ) ) . -->
+ <?php echo get_the_date('F j, Y'); ?>
</div>
- <?php
+ <!-- < ?php
if (has_tag()) {
echo '<div class="post-tags fs-smaller mb-4">';
- // echo svg_icon_use("mdi-tag-multiple", "baseline text-gray-300 me-1");
+ // echo inline_svg( 'bsi-tags', array( 'div_class' => 'icon baseline text-gray-300 me-1' ) );
$tag_strings = array_map(function ($tag) {
return '<span class="text-gray-300">#</span><a href="' . get_tag_link($tag) . '">' . $tag->name . '</a>';
@@ -41,7 +39,7 @@ namespace WP_RDNYC;
echo implode(", ", $tag_strings) . '</div>';
}
- ?>
+ ?> -->
</header>
diff --git a/custom-functions.php b/custom-functions.php
index 018b9b4..2ff0681 100644
--- a/custom-functions.php
+++ b/custom-functions.php
@@ -29,11 +29,8 @@ function inline_svg( $svg_name, $atts = array() ) {
// load initial svg content
$svg_content = file_get_contents( get_template_directory_uri() . '/dist/images/' . $svg_name . '.svg' );
- // set svg class
- $class_target = $svg_class == '' ? 'class="{{class-placeholder}}"' : '{{class-placeholder}}';
-
// replace svg class
- $svg_content = str_replace($class_target, $svg_class, $svg_content);
+ $svg_content = str_replace('{{class-placeholder}}', $svg_class, $svg_content);
// handle if role=img
$svg_content = $svg_role_img ? str_replace('<svg ', '<svg role="img" ', $svg_content) : $svg_content;
diff --git a/header.php b/header.php
index 425e7d4..d2588f5 100644
--- a/header.php
+++ b/header.php
@@ -20,7 +20,7 @@ namespace WP_RDNYC;
<meta name="description" content="Recovery Dharma NYC: a peer-led movement using Buddhist practices and principles to overcome addiction through meditation, personal inquiry, and community">
- <link rel="preload" href="<?php echo get_stylesheet_directory_uri() . '/dist/fonts/overpass-latin-400-normal.woff2'; ?>" as="font" type="font/woff2" crossorigin="anonymous">
+ <link rel="preload" href="<?php echo get_stylesheet_directory_uri() . '/dist/fonts/open-sans-latin-400-normal.woff2'; ?>" as="font" type="font/woff2" crossorigin="anonymous">
<link rel="preload" href="<?php echo get_stylesheet_directory_uri() . '/dist/fonts/permanent-marker-latin-400-normal.woff2'; ?>" as="font" type="font/woff2" crossorigin="anonymous">
<link rel="apple-touch-icon" sizes="180x180" href="<?php echo get_stylesheet_directory_uri() . '/dist/images/apple-touch-icon.png'; ?>">
diff --git a/index.php b/index.php
index 55663f6..f0d69e0 100644
--- a/index.php
+++ b/index.php
@@ -9,14 +9,17 @@
namespace WP_RDNYC;
get_header(); ?>
-<main class="container-fluid">
+<main class="container d-flex justify-content-center mt-3">
<div class="col-12 col-md-10 col-lg-9 col-xl-8 col-xxl-7 pb-2 mb-4 mt-3">
- <?php if (is_archive()) : ?>
- <h1 class="text-gray-300 fst-italic mb-4 tek-border-bottom-gray-dashed"><?= get_the_archive_title(); ?></h1>
+ <h1 class="fw-light text-gray-300 mb-4 border-bottom border-dashed border-gray-600">
+ <?php if (is_archive()) : get_the_archive_title();
+ else : single_post_title();
+ endif;
+ ?>
+ </h1>
<?php
- endif;
if ( have_posts() ) :
while ( have_posts() ) :
the_post();
diff --git a/package-lock.json b/package-lock.json
index 3c8b658..2077868 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
"version": "1.0.1",
"license": "ISC",
"dependencies": {
- "@fontsource/overpass": "^4.x",
+ "@fontsource/open-sans": "^4.x",
"@fontsource/permanent-marker": "^4.x",
"@popperjs/core": "^2.x",
"bootstrap": "^5.x",
@@ -1576,10 +1576,10 @@
"node": ">=10.0.0"
}
},
- "node_modules/@fontsource/overpass": {
+ "node_modules/@fontsource/open-sans": {
"version": "4.5.0",
- "resolved": "https://registry.npmjs.org/@fontsource/overpass/-/overpass-4.5.0.tgz",
- "integrity": "sha512-UEf8emYYzXWsGXMON+Q3ovzAZDcLbRO+dYa0eS6FqEHVYvtJUiEfultXTOTKc4FauJ0zoktjZpAhKH49XI3tRg=="
+ "resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-4.5.0.tgz",
+ "integrity": "sha512-49+A0IkTTv3cpS1YecrZNCqvlVTThUt/qioiAIZsXfgC3TqavgRqwXXvroXmhVeP/f0sqZw5CRDMS1Hj4aSTbQ=="
},
"node_modules/@fontsource/permanent-marker": {
"version": "4.5.0",
@@ -8862,10 +8862,10 @@
"integrity": "sha512-Fxt+AfXgjMoin2maPIYzFZnQjAXjAL0PHscM5pRTtatFqB+vZxAM9tLp2Optnuw3QOQC40jTNeGYFOMvyf7v9g==",
"dev": true
},
- "@fontsource/overpass": {
+ "@fontsource/open-sans": {
"version": "4.5.0",
- "resolved": "https://registry.npmjs.org/@fontsource/overpass/-/overpass-4.5.0.tgz",
- "integrity": "sha512-UEf8emYYzXWsGXMON+Q3ovzAZDcLbRO+dYa0eS6FqEHVYvtJUiEfultXTOTKc4FauJ0zoktjZpAhKH49XI3tRg=="
+ "resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-4.5.0.tgz",
+ "integrity": "sha512-49+A0IkTTv3cpS1YecrZNCqvlVTThUt/qioiAIZsXfgC3TqavgRqwXXvroXmhVeP/f0sqZw5CRDMS1Hj4aSTbQ=="
},
"@fontsource/permanent-marker": {
"version": "4.5.0",
diff --git a/package.json b/package.json
index 51cf9a1..9106175 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
"build": "concurrently \"npm run prod\" \"npm run dev\""
},
"dependencies": {
- "@fontsource/overpass": "^4.x",
+ "@fontsource/open-sans": "^4.x",
"@fontsource/permanent-marker": "^4.x",
"@popperjs/core": "^2.x",
"bootstrap": "^5.x",
diff --git a/searchform.php b/searchform.php
index fecf046..2a96149 100644
--- a/searchform.php
+++ b/searchform.php
@@ -20,7 +20,7 @@ $seventythreek_aria_label = ! empty( $args['aria_label'] ) ? 'aria-label="' . es
<div class="d-flex flex-nowrap">
<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…" />
- <button type="submit" class="btn btn-outline-light" title="Search">
+ <button type="submit" class="btn btn-primary" title="Search">
<?php echo inline_svg( 'bsi-search', array( 'div_class' => 'icon baseline' ) ); ?>
</button>
</div>
diff --git a/src/classes.php b/src/classes.php
index 4be1d62..b99a08c 100644
--- a/src/classes.php
+++ b/src/classes.php
@@ -7,11 +7,14 @@
*/
namespace WP_RDNYC;
-
use \Walker_Nav_Menu;
-add_filter( 'body_class', function( $classes ) {
+
+/**
+ * Filter to add special body class for front page & singular posts/pages
+ */
+add_filter( 'body_class', function( $classes ) {
if ( is_singular( ['post', 'page'] ) ) {
$classes[] = 'singular';
}
@@ -21,9 +24,9 @@ add_filter( 'body_class', function( $classes ) {
}
return $classes;
-
});
+
/**
* Filter to add CSS class to navbar menu <li> items
*/
@@ -36,6 +39,7 @@ add_filter( 'nav_menu_css_class' , function( $classes, $item, $args, $depth ) {
return $classes;
}, 3, 4 );
+
/**
* Filter to add CSS class to navbar menu item <a> links
*/
@@ -53,6 +57,17 @@ add_filter( 'nav_menu_link_attributes' , function( $atts, $item, $args ) {
}, 2, 3 );
+/**
+ * filter to globally alter the '(more...)' text of the post excertp "read more" link
+ */
+add_filter( 'the_content_more_link', function () {
+ return '<div class="more-link-outer"><a class="btn btn-primary btn-sm more-link" href="' . get_permalink() . '">'
+ . '<span aria-label="Continue reading ' . get_the_title() . '">Read More…</span></a></div>';
+});
+
+
+
+
/**
* custom walker to handle nav main menu dropdowns (one level deep, bs5 doesn't have native submenu support)
*/