From 4ad313b35e8c8b1e1f79c1596c7a79fac0af233c Mon Sep 17 00:00:00 2001 From: James Stuckey Weber Date: Fri, 16 Jun 2023 11:49:43 -0400 Subject: [PATCH] Fix typos in Code styleguide --- source/styleguide/code.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/source/styleguide/code.md b/source/styleguide/code.md index cce52ff..10b23cf 100644 --- a/source/styleguide/code.md +++ b/source/styleguide/code.md @@ -36,12 +36,12 @@ otherwise. - `l-` is for **layouts**. Example: `sl-l-grid`. - `is-` and `has-` for states. Example: `sl-is-active`. - `js-` is for classes specifically created for JavaScript targeting. - Exampe: `sl-js-toggle-navigation` + Example: `sl-js-toggle-navigation`. - Use the [BEM][] syntax. - **Block** -- the overall component object. Example: `sl-c-card`. - **Element** -- any child of the block. Example: `sl-c-card__header`. - **Modifier** -- any variation. This can be put on a block. Example: - `sl-c-card--primary`. It can also be put on an element Example: + `sl-c-card--primary`. It can also be put on an element. Example: `sl-c-card__header--large`. - Keep classes as flat as possible, and avoid nesting too deep. - Avoid using element selectors **unless** you're using a wrapper utility to