diff --git a/assets/admin/css/admin.css b/assets/admin/css/admin.css new file mode 100644 index 00000000..9e937f15 --- /dev/null +++ b/assets/admin/css/admin.css @@ -0,0 +1,10 @@ +/*-------------------------------------------------------------- +admin.css +Fix minor CSS issues in the backend editor screen +See /inc/enqueue.php +--------------------------------------------------------------*/ + +/* Fix pattern prreview iframe */ +.block-editor-block-preview__content iframe { + max-width: 1200px; +} diff --git a/assets/scss/_bootscore-style.scss b/assets/scss/_bootscore-style.scss index 2c2ce538..cb19ae1c 100644 --- a/assets/scss/_bootscore-style.scss +++ b/assets/scss/_bootscore-style.scss @@ -22,4 +22,4 @@ @import "bootscore/utilities"; @import "bootscore/widgets"; -@import "bootscore/blocks/block-widgets"; +@import "bootscore/blocks/blocks"; diff --git a/assets/scss/bootscore/blocks/_block-widgets.scss b/assets/scss/bootscore/blocks/_blocks.scss similarity index 53% rename from assets/scss/bootscore/blocks/_block-widgets.scss rename to assets/scss/bootscore/blocks/_blocks.scss index 6812b2ea..12026d2f 100644 --- a/assets/scss/bootscore/blocks/_block-widgets.scss +++ b/assets/scss/bootscore/blocks/_blocks.scss @@ -2,7 +2,31 @@ Block Widgets --------------------------------------------------------------*/ -// List groups +// Reset WP margin-top + :where(body .is-layout-flow) > * { + margin-block-start: 0 !important; + } + + +// Add rounded to block img if class added to img block +.rounded img { + border-radius: var(--#{$prefix}border-radius); +} + +// Add card-img-top to block img if class added to img block +.card-img-top img { + border-top-left-radius: $card-inner-border-radius; + border-top-right-radius: $card-inner-border-radius; +} + + +// Separator +.wp-block-separator { + border-top: var(--#{$prefix}border-width) solid; +} + + +// List-groups .bs-list-group { .list-group-item-action { a { @@ -20,10 +44,10 @@ Block Widgets color: $list-group-active-color; } } - } } +// List-group in card .card { .bs-list-group.list-group-flush { .list-group-item:last-child { diff --git a/inc/enqueue.php b/inc/enqueue.php index 15a757a0..84143f9b 100644 --- a/inc/enqueue.php +++ b/inc/enqueue.php @@ -51,6 +51,26 @@ function bootscore_scripts() { add_action('wp_enqueue_scripts', 'bootscore_scripts'); + +/* + * Register compiled CSS to editor + */ +function bootscore_add_editor_styles() { + add_theme_support('editor-styles'); + add_editor_style('assets/css/main.css'); + + // Check if the current page is the Gutenberg editor and enqueue CSS to tha main admin area to use variables in theme.json + $screen = get_current_screen(); + if ($screen && $screen->is_block_editor) { + wp_enqueue_style('main-editor-style', get_stylesheet_directory_uri() . '/assets/css/main.css', array(), '1.0', 'all'); + // Fix minor CSS issues in the backend editor screen + wp_enqueue_style('admin-style', get_template_directory_uri() . '/assets/admin/css/admin.css', array(), '1.0', 'all'); + } +} +add_action('enqueue_block_editor_assets', 'bootscore_add_editor_styles'); + + + /** * Preload Font Awesome */ diff --git a/inc/theme-setup.php b/inc/theme-setup.php index e4e8e706..6261c740 100644 --- a/inc/theme-setup.php +++ b/inc/theme-setup.php @@ -74,7 +74,15 @@ function bootscore_setup() { /* * Add theme support for block template-parts. */ - add_theme_support( 'block-template-parts' ); + add_theme_support( 'block-template-parts' ); + + /* + * Register pattern category + */ + register_block_pattern_category( + 'bootscore', + array( 'label' => __( 'Bootscore', 'bootscore' ) ) + ); } endif; add_action('after_setup_theme', 'bootscore_setup'); diff --git a/patterns/alert-danger.php b/patterns/alert-danger.php new file mode 100644 index 00000000..126cd267 --- /dev/null +++ b/patterns/alert-danger.php @@ -0,0 +1,18 @@ + + +

A dismissing danger alert with an icon and a link.

+ \ No newline at end of file diff --git a/patterns/alert-info.php b/patterns/alert-info.php new file mode 100644 index 00000000..7f6c8839 --- /dev/null +++ b/patterns/alert-info.php @@ -0,0 +1,18 @@ + + +

A simple info alert with a link.

+ \ No newline at end of file diff --git a/patterns/btn-danger-lg.php b/patterns/btn-danger-lg.php new file mode 100644 index 00000000..24ca34eb --- /dev/null +++ b/patterns/btn-danger-lg.php @@ -0,0 +1,18 @@ + + +

Button

+ \ No newline at end of file diff --git a/patterns/btn-outline-secondary-sm.php b/patterns/btn-outline-secondary-sm.php new file mode 100644 index 00000000..6da6c2f9 --- /dev/null +++ b/patterns/btn-outline-secondary-sm.php @@ -0,0 +1,18 @@ + + +

Button

+ \ No newline at end of file diff --git a/patterns/btn-primary.php b/patterns/btn-primary.php new file mode 100644 index 00000000..796b8577 --- /dev/null +++ b/patterns/btn-primary.php @@ -0,0 +1,18 @@ + + +

Button

+ \ No newline at end of file diff --git a/patterns/card-advanced.php b/patterns/card-advanced.php new file mode 100644 index 00000000..8c619251 --- /dev/null +++ b/patterns/card-advanced.php @@ -0,0 +1,42 @@ + + +
+

Card header

+ + + +
+ + + +
+

Card title

+ + + +

Some quick example text to build on the card title and make up the bulk of the card's content.

+ + + +

Button

+
+ + + +

Card footer

+
+ \ No newline at end of file diff --git a/patterns/card-basic.php b/patterns/card-basic.php new file mode 100644 index 00000000..879080b4 --- /dev/null +++ b/patterns/card-basic.php @@ -0,0 +1,34 @@ + + +
+
+ + + +
+

Card title

+ + + +

Some quick example text to build on the card title and make up the bulk of the card's content.

+ + + +

Button

+
+
+ \ No newline at end of file diff --git a/patterns/card-categories.php b/patterns/card-categories.php new file mode 100644 index 00000000..91b6e852 --- /dev/null +++ b/patterns/card-categories.php @@ -0,0 +1,22 @@ + + +
+

Categories

+ + +
+ \ No newline at end of file diff --git a/patterns/cards-pricing.php b/patterns/cards-pricing.php new file mode 100644 index 00000000..65288746 --- /dev/null +++ b/patterns/cards-pricing.php @@ -0,0 +1,124 @@ + + +
+
+
+

Free

+ + + +
+

$0/mo

+ + + +
    +
  • 10 users included
    • + + + +
  • 2 GB of storage
    • + + + +
  • Email support
    • + + + +
  • Help center access
    • +
+ + + +

Sign up for free

+
+
+
+ + + +
+
+

Pro

+ + + +
+

$15/mo

+ + + +
    +
  • 20 users included
    • + + + +
  • 10 GB of storage
    • + + + +
  • Priority email support
    • + + + +
  • Help center access
    • +
+ + + +

Get started

+
+
+
+ + + +
+
+

Enterprise

+ + + +
+

$29/mo

+ + + +
    +
  • 30 users included
    • + + + +
  • 15 GB of storage
    • + + + +
  • Phone and email support
    • + + + +
  • Help center access
    • +
+ + + +

Contact us

+
+
+
+
+ \ No newline at end of file diff --git a/patterns/container.php b/patterns/container.php new file mode 100644 index 00000000..8b34d602 --- /dev/null +++ b/patterns/container.php @@ -0,0 +1,20 @@ + + +
+

This is a container

+
+ \ No newline at end of file diff --git a/patterns/grid-col-3.php b/patterns/grid-col-3.php new file mode 100644 index 00000000..799b3c6d --- /dev/null +++ b/patterns/grid-col-3.php @@ -0,0 +1,48 @@ + + +
+
+
+

col-md-6 col-lg-3

+
+
+ + + +
+
+

col-md-6 col-lg-3

+
+
+ + + +
+
+

col-md-6 col-lg-3

+
+
+ + + +
+
+

col-md-6 col-lg-3

+
+
+
+ \ No newline at end of file diff --git a/patterns/grid-col-4-col-8.php b/patterns/grid-col-4-col-8.php new file mode 100644 index 00000000..b3c3ab87 --- /dev/null +++ b/patterns/grid-col-4-col-8.php @@ -0,0 +1,32 @@ + + +
+
+
+

col-lg-4

+
+
+ + + +
+
+

col-lg-8

+
+
+
+ \ No newline at end of file diff --git a/patterns/grid-col-6.php b/patterns/grid-col-6.php new file mode 100644 index 00000000..dd9e74eb --- /dev/null +++ b/patterns/grid-col-6.php @@ -0,0 +1,32 @@ + + +
+
+
+

col-lg-6

+
+
+ + + +
+
+

col-lg-6

+
+
+
+ \ No newline at end of file diff --git a/patterns/grid-col-8-col-4.php b/patterns/grid-col-8-col-4.php new file mode 100644 index 00000000..e1f8332f --- /dev/null +++ b/patterns/grid-col-8-col-4.php @@ -0,0 +1,32 @@ + + +
+
+
+

col-lg-8

+
+
+ + + +
+
+

col-lg-4

+
+
+
+ \ No newline at end of file diff --git a/patterns/hero-img-left.php b/patterns/hero-img-left.php new file mode 100644 index 00000000..5dccb414 --- /dev/null +++ b/patterns/hero-img-left.php @@ -0,0 +1,42 @@ + + +
+
+
+
+
+
+ + + +
+
+
+

Hero

+ + + +

This is a two column hero with left aligned image and CTA buttons.

+ + + +

Button Button

+
+
+
+
+ \ No newline at end of file diff --git a/patterns/hero-img-right.php b/patterns/hero-img-right.php new file mode 100644 index 00000000..d05acd6d --- /dev/null +++ b/patterns/hero-img-right.php @@ -0,0 +1,42 @@ + + +
+
+
+
+
+
+ + + +
+
+
+

Hero

+ + + +

This is a two column hero with right aligned image and CTA buttons.

+ + + +

Button Button

+
+
+
+
+ \ No newline at end of file diff --git a/patterns/hero-jumbotron.php b/patterns/hero-jumbotron.php new file mode 100644 index 00000000..334eac0a --- /dev/null +++ b/patterns/hero-jumbotron.php @@ -0,0 +1,24 @@ + + +
+

Basic jumbotron

+ + + +

This is a simple Bootstrap jumbotron, recreated with built-in utility classes.

+
+ \ No newline at end of file diff --git a/patterns/section-heading-subtitle.php b/patterns/section-heading-subtitle.php new file mode 100644 index 00000000..93671047 --- /dev/null +++ b/patterns/section-heading-subtitle.php @@ -0,0 +1,30 @@ + + +
+
+

Section with heading

+ + + +

This is a section with heading and subtitle wrapped in a container. Use it on the page-blank template.

+ + + +

Some content inside the container.

+
+
+ \ No newline at end of file diff --git a/patterns/section-hero-img-left.php b/patterns/section-hero-img-left.php new file mode 100644 index 00000000..cb0376d3 --- /dev/null +++ b/patterns/section-hero-img-left.php @@ -0,0 +1,46 @@ + + +
+
+
+
+
+
+
+
+ + + +
+
+
+

Section with hero

+ + + +

This section features a two-column hero with a left-aligned image and CTA buttons wrapped in a container. Use it on the page-blank template.

+ + + +

Button Button

+
+
+
+
+
+
+ \ No newline at end of file diff --git a/patterns/section-hero-img-right.php b/patterns/section-hero-img-right.php new file mode 100644 index 00000000..dfa6a7b9 --- /dev/null +++ b/patterns/section-hero-img-right.php @@ -0,0 +1,44 @@ + + +
+
+
+
+
+
+

Section with hero

+ + + +

This section features a two-column hero with a right-aligned image and CTA buttons wrapped in a container. Use it on the page-blank template.

+ + + +

Button Button

+
+
+
+ + + +
+
+
+
+
+
+ \ No newline at end of file diff --git a/patterns/section-hero-jumbotron.php b/patterns/section-hero-jumbotron.php new file mode 100644 index 00000000..00fcb34a --- /dev/null +++ b/patterns/section-hero-jumbotron.php @@ -0,0 +1,32 @@ + + +
+
+
+

Section jumbotron

+ + + +

This is a section with a simple centered jumbotron pattern wrapped in a container. Use it on the page-blank template.

+ + + +

Button Button

+
+
+
+ \ No newline at end of file diff --git a/theme.json b/theme.json new file mode 100644 index 00000000..91e8c45c --- /dev/null +++ b/theme.json @@ -0,0 +1,66 @@ +{ + "$schema":"https:\/\/schemas.wp.org\/trunk\/theme.json", + "version":2, + "settings":{ + "appearanceTools":true, + "color":{ + "palette":[ + { + "slug":"primary", + "color":"var(--bs-primary)", + "name":"Primary" + }, + { + "slug":"secondary", + "color":"var(--bs-secondary)", + "name":"Secondary" + }, + { + "slug":"success", + "color":"var(--bs-success)", + "name":"Success" + }, + { + "slug":"info", + "color":"var(--bs-info)", + "name":"Info" + }, + { + "slug":"warning", + "color":"var(--bs-warning)", + "name":"Warning" + }, + { + "slug":"danger", + "color":"var(--bs-danger)", + "name":"Danger" + }, + { + "slug":"light", + "color":"var(--bs-light)", + "name":"Light" + }, + { + "slug":"dark", + "color":"var(--bs-dark)", + "name":"Dark" + } + ] + }, + "spacing":[ + { + "units":[ + "px", + "em", + "rem", + "vh", + "vw" + ] + } + ], + "layout":{ + "contentSize":"840px", + "wideSize":"1100px" + } + } +} \ No newline at end of file