Skip to content

Commit

Permalink
add example for block styles
Browse files Browse the repository at this point in the history
  • Loading branch information
fabiankaegy committed Sep 24, 2024
1 parent ad888a7 commit 2d70dcb
Show file tree
Hide file tree
Showing 5 changed files with 10 additions and 14 deletions.
3 changes: 3 additions & 0 deletions themes/10up-theme/assets/css/blocks/core/group.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.wp-block-group {

}
3 changes: 0 additions & 3 deletions themes/10up-theme/assets/css/blocks/example-block.css

This file was deleted.

7 changes: 0 additions & 7 deletions themes/10up-theme/assets/css/blocks/index.css

This file was deleted.

7 changes: 7 additions & 0 deletions themes/10up-theme/assets/css/blocks/readme.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
# Block Specific Styles

This directory contains block-specific styles. And file you create in this directory will be automatically included in the editor and on the front end when the block is used. The file should be named after the blocks name and be placed in a directory named after the blocks namespace.

So if you have some styles you want to only load when the `core/paragraph` block is used, you would create a file at `wp-content/themes/10up-theme/assets/css/blocks/core/paragraph.css`.

Similarly if you work with a block from a plugin that has a namespace of `acme`, you would create a file at `wp-content/themes/10up-theme/assets/css/blocks/acme/block-name.css`.
4 changes: 0 additions & 4 deletions themes/10up-theme/assets/css/frontend/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,3 @@
/* Components */

@import url("components/index.css");

/* Gutenberg blocks */

/* @import url("../blocks/index.css"); */

0 comments on commit 2d70dcb

Please sign in to comment.