From 5ff207c81da7e787777254317c818992d9aaa0ac Mon Sep 17 00:00:00 2001 From: Tetrakern <26898880+Tetrakern@users.noreply.github.com> Date: Sun, 21 Jan 2024 11:07:40 +0100 Subject: [PATCH] Update DEVELOPMENT.md --- DEVELOPMENT.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/DEVELOPMENT.md b/DEVELOPMENT.md index 97b30e8c..a4439fbe 100644 --- a/DEVELOPMENT.md +++ b/DEVELOPMENT.md @@ -48,6 +48,8 @@ However, there are a few guidelines: ## CSS/SCSS +**Required feature support:** Container Queries + Fictioneer was originally styled with [BEM](https://getbem.com/) — and still is, although with some modifications. While BEM offers great structure and prevents cascading issues, this comes with a bag of redundancy and heavy markup. You easily end up with extremely long class signatures and lists that break several lines. BEM also does not work well with utility classes which escape the idea of scoped concerns, causing cascading issues again. But adding redundant modifiers for each and every block is not great either. To alleviate these drawbacks, Fictioneer makes two changes to the default BEM methodology. Modifiers are no longer suffixes but classes that start with an underscore (`._modifier`), always within a block scope. Modifiers are chained to the block parent (`.block._modifier` or `.block__element._modifier`), granting them a higher specificity to override parent styles and single-specificity utility classes. Of course this is no silver bullet either, as it is slightly less efficient.