themes-wordpress/seedlet
Jack Lenox 826f42c624
Seedlet: Remove word-break style in tables
The `word-break: break-all` style creates unwanted and unexpected breaks
in text in tables. Let's remove it.

Fixes #2410, fixes #2375, fixes #2120.
2021-01-18 18:11:08 +00:00
..
assets Seedlet: Remove word-break style in tables 2021-01-18 18:11:08 +00:00
classes Merge pull request #3026 from Automattic/fix/2701-spearhead-custom-colors 2021-01-14 20:55:52 +00:00
inc Seedlet: Fix full width Video block 2021-01-18 13:25:34 +01:00
languages Returning .pot files to git version control 2020-11-12 09:36:04 -05:00
template-parts Only hide site header/footer if the homepage is set to a static page. 2021-01-12 09:12:35 -05:00
404.php Seedlet: fix landmark roles (#2395) 2020-08-27 10:45:39 -04:00
archive.php Add description to category pages with styling 2021-01-04 00:23:41 +01:00
comments.php Replace with esc translation. (#2430) 2020-09-03 10:13:02 -04:00
footer.php dry blank canvas and seedlet 2021-01-08 16:42:41 +00:00
functions.php Fix merge conflicts and editor stylesheet location. 2020-11-12 16:03:38 -05:00
header.php refactor seedlet and blank canvas so they share more code 2021-01-11 12:32:15 +00:00
image.php Seedlet: fix landmark roles (#2395) 2020-08-27 10:45:39 -04:00
index.php Refactor customizer class and add ability to toggle excerpts. 2020-10-22 14:22:30 -04:00
LICENSE Adding 1.0 seedlet theme. 2020-06-10 12:58:55 -04:00
package-lock.json Add description to category pages with styling 2021-01-04 00:23:41 +01:00
package.json Fix RTL comment syntax and update version numbers 2021-01-08 11:12:57 +00:00
page.php Seedlet: fix landmark roles (#2395) 2020-08-27 10:45:39 -04:00
postcss.config.js Seedlet: Fix layout grid margins (#2219) 2020-07-07 12:04:08 -04:00
README.md Add an acknowledgement for the CSS Vars ponyfill 2020-10-05 11:23:59 +01:00
readme.txt Bump version to 1.1.2 2020-11-04 14:49:41 -05:00
screenshot.png Seedlet: Optimize the screenshot 2020-07-24 02:11:15 +02:00
search.php Use correct template tags for navigation + pagination. 2020-10-14 10:23:00 -04:00
single.php Use correct template tags for navigation + pagination. 2020-10-14 10:23:00 -04:00
style-rtl.css Add subscriptions block css. 2021-01-13 10:05:15 -05:00
style.css Add subscriptions block css. 2021-01-13 10:05:15 -05:00

Seedlet

Seedlet is simple, text-driven WordPress theme.

Along with being an excellent standalone theme, Seedlet is designed to be a parent-theme that allows folks to quickly create Gutenberg-ready child-themes for WordPress. [Instructions for how to make child themes are coming soon]

Development

To make changes to the styles, node.js is recommended:

  1. npm i to install the required development dependencies
  2. npm start to start the development server
  3. Make changes in assets/sass

Technical Overview

Principles

When you reduce a theme design down to a set of systematic design decisions, you end up with something called a Style Guide. The Seedlet system works by taking the rules of a Style Guide and expressing them through carefully placed variables or design tokens that influence the appearance of a WordPress site.

This unifies the design decisions needed to style the aesthetic appearance of Gutenberg Blocks, the theme Header + Footer areas, WooCommerce, Jetpack and more. It also syncs styles between the editor and the frontend so that you dont need to hand-write CSS for both. This greatly speeds up the Gutenberg theme development process and reduces the amount of manual styling that typically goes into developing a theme.

Controls

The theme is built to offer the following controls:

  • Fonts - Font-family, size, weight, and line-height rules.
  • Colors - Primary, secondary, background, foreground and border colors.
  • Spacing - A default 8px vertical rhythm between all blocks and major components. It also includes utility spacing classes for negative margins.
  • Responsive Logic - Built-in responsive behavior across Blocks and Components.

Structure

The system itself lives in the /assets/sass directory as a collection of Sass partials broken up by scope and hierarchy. The partials get compiled down to singular CSS files that live in the main Seedlet directory and cascade downward like so:

Frontend

  • /assets/css/variables.css
  • /style.css

Editor

  • /assets/css/variables-editor.css
  • /style-editor.css

In each view, the variables are loaded first and then the stylesheet is loaded which applies the variables.

License

GNU General Public License v2 or later.

URI: LICENSE

Acknowledgments

CSS vars ponyfill: https://github.com/jhildenbiddle/css-vars-ponyfill