Initial commit

.editorconfig

@@ -0,0 +1,14 @@
+# This file is for unifying the coding style for different editors and IDEs
+# editorconfig.org
+
+# WordPress Coding Standards
+# https://make.wordpress.org/core/handbook/coding-standards/
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+indent_style = tab

.gitignore

@@ -0,0 +1,13 @@
+# ignore OS generated files
+ehthumbs.db
+Thumbs.db
+.DS_Store
+
+# ignore dependencies
+node_modules/
+
+# ignore built style.css
+style.css
+
+# ignore build files
+build/

.vscode/settings.json

@@ -0,0 +1,27 @@
+{
+	"workbench.colorCustomizations": {
+		"activityBar.activeBackground": "#ffffff",
+		"activityBar.background": "#ffffff",
+		"activityBar.foreground": "#15202b",
+		"activityBar.inactiveForeground": "#15202b99",
+		"activityBarBadge.background": "#df9f9f",
+		"activityBarBadge.foreground": "#15202b",
+		"commandCenter.border": "#15202b99",
+		"sash.hoverBorder": "#ffffff",
+		"statusBar.background": "#ffffff",
+		"statusBar.foreground": "#15202b",
+		"statusBarItem.hoverBackground": "#e6e6e6",
+		"statusBarItem.remoteBackground": "#ffffff",
+		"statusBarItem.remoteForeground": "#15202b",
+		"titleBar.activeBackground": "#ffffff",
+		"titleBar.activeForeground": "#15202b",
+		"titleBar.inactiveBackground": "#ffffff99",
+		"titleBar.inactiveForeground": "#15202b99"
+	},
+	"peacock.color": "#ffffff",
+	"peacock.elementAdjustments": {
+		"activityBar": "none",
+		"statusBar": "none",
+		"titleBar": "none"
+	}
+}

.wp-env.json

@@ -0,0 +1,6 @@
+{
+	"themes": ["."],
+	"config": {
+		"WP_DEBUG_DISPLAY": true
+	}
+}

README.md

@@ -0,0 +1,105 @@
+# Block Theme Starter
+
+![Theme screenshot](screenshot.png)
+
+## What is this?
+
+This is a barebones WordPress block theme starter. Use it to build your next block theme!
+
+## Quick Start
+
+1. Make sure you're on node version `18.12.1` or later.
+1. Run `npm install` from this directory to install dependencies.
+1. Run `npm run watch` to watch [CSS](#css), [JavaScript](#editor-and-frontend-javascript),
+   and [Custom Blocks](#custom-blocks).
+1. Optionally follow the [local environment](#optional-local-environment) 
+   instructions below to spin up a wp-env environment.
+
+## CSS
+
+This theme uses PostCSS to process CSS. The main CSS entrypoint is
+`assets/main.css`. All CSS with be compiled to `style.css` which is enqueued in
+`functions.php` **for both the editor and the frontend**.
+
+To build the CSS, run the following command in your terminal:
+
+```bash
+npm run build:css
+```
+
+This will take the `assets/main.css` file, run it and all imports through
+PostCSS, and output the result to style.css. To watch for changes to your CSS
+and automatically rebuild, run the following command in your terminal:
+
+```bash
+npm run watch:css
+```
+
+## Editor and Frontend JavaScript
+
+This theme uses wp-scripts to build editor and frontend JS. The main editor
+entry is at `assets/js/editor/index.js` and the main frontend entry is at
+`assets/js/frontend/index.js`.
+
+To build the JS, run the following command in your terminal:
+
+```bash
+npm run build:js
+```
+
+This will take the entry files, build them and all imports with wp-scripts, and
+output the files to `build/editor.js` and `build/frontend.js`. To watch for
+changes to your JS and automatically rebuild, run the following command in your
+terminal:
+
+```bash
+npm run watch:js
+```
+
+## Custom Blocks
+
+This theme uses wp-scripts to build custom Gutenberg blocks. Add your custom
+blocks in the `blocks/` directory. Each block should have its own directory.
+
+To build the blocks, run the following command in your terminal:
+
+```bash
+npm run build:blocks
+```
+
+This will take all of your blocks inside `blocks/`, build them with wp-scripts
+and output them to `build/blocks/` directory. Make sure to enqueue the built
+blocks in the theme like this:
+
+```php
+// functions.php
+include get_template_directory() . '/build/blocks/block-name/index.php';
+```
+
+To watch for changes to your blocks and automatically rebuild, run the following
+command in your terminal:
+
+```bash
+npm run watch:blocks
+```
+
+## Optional Local Environment
+
+This theme includes a `.wp-env.json`. To spin up a WordPress environment with
+`wp-env` first make sure
+[Docker](https://www.docker.com/products/docker-desktop/) is installed.
+Then run the following command to start the environment:
+
+```bash
+npm run env:start
+```
+
+You can stop the environment with Docker Desktop or the stop command:
+
+```bash
+npm run env:stop
+```
+
+See the
+[wp-env documentation](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/#installation)
+for more details.

assets/css/blocks/core/README.md

@@ -0,0 +1,6 @@
+# Core Block CSS
+
+Add custom CSS for core blocks here.
+
+Example - `button.css` would be the file name for the core button block. All
+CSS in this file should be scoped under the class `.wp-block-button`.

assets/css/blocks/core/wp-block-comments.css

@@ -0,0 +1,20 @@
+/* Comments
+--------------------------------------------- */
+
+.wp-block-post-comments-form .comment-reply-title {
+	margin-bottom: var(--wp--custom--spacing--gap);
+}
+
+.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
+.wp-block-post-comments-form textarea {
+	border-color: var(--wp--preset--color--contrast);
+	padding: 8px 16px;
+}
+
+.wp-block-post-comments-form p:not(.form-submit) {
+	margin-bottom: 24px;
+}
+
+.wp-block-post-comments-form .comment-form-cookies-consent label {
+	font-size: var(--wp--preset--font-size--x-small);
+}

assets/css/blocks/core/wp-block-navigation.css

@@ -0,0 +1,77 @@
+/* Navigation
+--------------------------------------------- */
+
+.wp-block-navigation__responsive-container.is-menu-open {
+	padding: 32px var(--wp--custom--spacing--gap);
+}
+
+.wp-block-navigation__responsive-container-close,
+.wp-block-navigation__responsive-container-open {
+	padding: 2px;
+}
+
+/* Navigation Submenu
+  --------------------------------------------- */
+
+.wp-block-navigation:not(.has-background)
+	.wp-block-navigation__submenu-container {
+	border-color: var(--wp--preset--color--contrast);
+	min-width: 180px !important;
+	padding: 8px;
+}
+
+.wp-block-navigation
+	:where(.wp-block-navigation__submenu-container)
+	.wp-block-navigation-item__content {
+	padding: 2px 8px;
+}
+
+.wp-block-navigation__responsive-container.is-menu-open
+	.wp-block-navigation__submenu-container {
+	padding-left: 8px !important;
+	padding-right: 8px !important;
+	padding-top: 4px !important;
+}
+
+@media only screen and (min-width: 800px) {
+	/* Navigation Link
+	  --------------------------------------------- */
+
+	.wp-block-navigation-item.is-style-outline a {
+		border: 1px solid currentColor;
+		border-radius: 4px;
+		padding: 4px 16px;
+	}
+}
+
+/* Part of the default navigation styles */
+.wp-block-navigation__responsive-container-open {
+	display: flex;
+}
+
+@media (min-width: 600px) {
+	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(
+			.is-menu-open
+		) {
+		display: none;
+	}
+}
+
+/* Reset core style */
+@media (min-width: 600px) {
+	.wp-block-navigation__responsive-container-open:not(.always-shown) {
+		display: flex;
+	}
+}
+
+/* Apply the core style at 1280px again */
+@media (min-width: 1280px) {
+	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(
+			.is-menu-open
+		) {
+		display: block;
+	}
+	.wp-block-navigation__responsive-container-open:not(.always-shown) {
+		display: none;
+	}
+}

assets/css/blocks/core/wp-block-pullquote.css

@@ -0,0 +1,17 @@
+/* Pullquote
+--------------------------------------------- */
+
+@media only screen and (min-width: 800px) {
+	.wp-block-pullquote.alignleft,
+	.wp-block-pullquote.alignright {
+		max-width: 300px;
+	}
+
+	.wp-block-pullquote.alignleft {
+		margin-right: var(--wp--custom--spacing--gap) !important;
+	}
+
+	.wp-block-pullquote.alignright {
+		margin-left: var(--wp--custom--spacing--gap) !important;
+	}
+}

assets/css/blocks/core/wp-block-separator.css

@@ -0,0 +1,20 @@
+/* Separator
+--------------------------------------------- */
+
+.wp-block-separator.is-style-dots:before {
+	font-family: inherit;
+	font-size: var(--wp--preset--font-size--large);
+	letter-spacing: 8px;
+	padding-left: 8px;
+}
+
+.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
+	width: 100px;
+}
+
+.wp-block-separator:not(.is-style-dots),
+.wp-block-separator.has-background:not(.is-style-dots) {
+	border-bottom: 1px solid currentColor;
+	border-top: none;
+	height: 1px;
+}

assets/css/blocks/core/wp-block-table.css

@@ -0,0 +1,40 @@
+/* Table
+--------------------------------------------- */
+
+.wp-block-table.is-style-stripes {
+	border-bottom: none;
+}
+
+.wp-block-table table {
+	border-collapse: collapse;
+}
+
+.wp-block-table thead {
+	border-bottom: 4px solid var(--wp--preset--color--contrast);
+}
+
+.wp-block-table tfoot {
+	border-top: 4px solid var(--wp--preset--color--contrast);
+}
+
+.wp-block-table td,
+.wp-block-table th,
+.wp-block-table tr,
+.wp-block-table.is-style-stripes td,
+.wp-block-table.is-style-stripes th,
+.wp-block-table.is-style-stripes tr {
+	border: 1px solid var(--wp--preset--color--contrast);
+}
+
+.wp-block-table th {
+	font-weight: var(--wp--custom--font-weight--regular);
+}
+
+.wp-block-table td,
+.wp-block-table th {
+	padding: 4px;
+}
+
+.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
+	background-color: var(--wp--preset--color--neutral);
+}

assets/css/blocks/custom/README.md

@@ -0,0 +1,7 @@
+# Custom Block CSS
+
+Add custom block CSS here. Each CSS file should be scoped to a single block.
+
+Example - `example-block.css` would be the file name for a block named
+`bts/example-block`. All CSS in this file should be scoped under the class
+`.wp-block-bts-example-block`.