From 1cd09a5e698352f9d2e676f9c696d0f354f93ec1 Mon Sep 17 00:00:00 2001
From: Martin Wortschack <mwortschack@gitlab.com>
Date: Tue, 18 Apr 2023 11:44:51 +0000
Subject: [PATCH] Explain when to avoid utility mixins

---
 doc/development/fe_guide/style/scss.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/development/fe_guide/style/scss.md b/doc/development/fe_guide/style/scss.md
index 472182b16d6b9..e760b0adaaaa9 100644
--- a/doc/development/fe_guide/style/scss.md
+++ b/doc/development/fe_guide/style/scss.md
@@ -76,7 +76,7 @@ These mixins should be used to replace _magic values_ in our code.
 For example a `margin-top: 8px` is a good candidate for the `@include gl-mt-3` mixin replacement.
 
 Avoid using utility mixins for [pre-defined CSS keywords](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Values_and_Units#pre-defined_keyword_values).
-For example prefer `display: flex` over `@include gl-display-flex`.
+For example prefer `display: flex` over `@include gl-display-flex`. Utility mixins are particularly useful for encapsulating our design system but there is no need to encapsulate simple properties.
 
 ```scss
 // Bad
-- 
GitLab