PHPackages                             yustintr/storyblend - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. yustintr/storyblend

ActiveDrupal-theme

yustintr/storyblend
===================

StoryBlend Base Theme for Drupal x Storybook

0.1.2(2y ago)05GPL-2.0-or-laterSCSS

Since Feb 13Pushed 2y ago1 watchersCompare

[ Source](https://github.com/yustinTR/StoryBlend)[ Packagist](https://packagist.org/packages/yustintr/storyblend)[ RSS](/packages/yustintr-storyblend/feed)WikiDiscussions 0.1.x Synced 1mo ago

READMEChangelog (3)DependenciesVersions (4)Used By (0)

 StoryBlend - Drupal Starter Theme with Storybook
==================================================

[](#-storyblend---drupal-starter-theme-with-storybook-)

StoryBlend is a powerful Drupal starter theme seamlessly integrated with Storybook, offering a robust foundation for building and showcasing dynamic Drupal themes. This theme follows the BEM (Block Element Modifier) methodology for writing modular and maintainable CSS. Getting Started

To get started with StoryBlend, follow these steps:
---------------------------------------------------

[](#to-get-started-with-storyblend-follow-these-steps)

Use StoryBlend:

```
composer require yustintr/storyblend

```

Clone the repository:

```
git clone  git@github.com:yustinTR/StoryBlend.git

```

Install dependencies:

```
npm install

```

Development Workflow
--------------------

[](#development-workflow)

### Run Storybook

[](#run-storybook)

Start Storybook to preview and develop your theme components:

```
npm run storybook

```

Visit  in your browser to view the Storybook.

### Compile CSS

[](#compile-css)

Compile and build your Drupal theme using the following command:

```
npm run dev/build

```

This command will process your CSS files following the BEM methodology, ensuring modularity and maintainability.

Create theme
------------

[](#create-theme)

To create a custom theme from this bases you can run the command `composer create-theme `from the StoryBlend folder. This will create the theme in the themes/custom folder. The argument is optional. When omitted the theme will be called StoryBlend.

BEM Methodology
---------------

[](#bem-methodology)

The CSS in StoryBlend is written following the BEM (Block Element Modifier) methodology. BEM is a naming convention that helps create clear and maintainable code. Here's a brief overview:

Block: Represents a standalone component that is meaningful on its own.

```
.block {}

```

Element: Represents a part of a block and has no standalone meaning.

```
.block__element {}

```

Modifier: Represents a different state or version of a block or an element.

```
.block--modifier {}
.block__element--modifier {}

```

Ensure your CSS adheres to the BEM methodology for consistency and scalability.

###  Health Score

17

—

LowBetter than 6% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity4

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity33

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~3 days

Total

3

Last Release

809d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/f9b8d05f71662dca3c86756709be253921bebc32b161622ccc32ffa65c97bb9d?d=identicon)[yustintr](/maintainers/yustintr)

---

Top Contributors

[![yustinTR](https://avatars.githubusercontent.com/u/36407624?v=4)](https://github.com/yustinTR "yustinTR (37 commits)")

---

Tags

drupaldrupal-10drupal-themestorybooktwigjs

### Embed Badge

![Health badge](/badges/yustintr-storyblend/health.svg)

```
[![Health](https://phpackages.com/badges/yustintr-storyblend/health.svg)](https://phpackages.com/packages/yustintr-storyblend)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)