michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

chore: correct description of attribute option in scopedStyleStrategy (#8506)

Browse source 
* chore: correct description of `attribute` option in `scopedStyleStrategy`

* chore: fix typo (specifity -> specificity)
This commit is contained in:
Masaki Koyanagi 2023-09-12 01:26:45 +09:00 committed by GitHub
parent 5e1099f686
commit 23f9536de0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/itchy-clouds-design.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
chore: correct description of `attribute` option in `scopedStyleStrategy`

8
packages/astro/src/@types/astro.ts
View file

@ -618,12 +618,12 @@ export interface AstroUserConfig {
* @description * @description
* *
* Specify the strategy used for scoping styles within Astro components. Choose from: * Specify the strategy used for scoping styles within Astro components. Choose from:
* - `'where'` - Use `:where` selectors, causing no specifity increase. * - `'where'` - Use `:where` selectors, causing no specificity increase.
* - `'class'` - Use class-based selectors, causing a +1 specifity increase. * - `'class'` - Use class-based selectors, causing a +1 specificity increase.
* - `'attribute'` - Use `data-` attributes, causing no specifity increase. * - `'attribute'` - Use `data-` attributes, causing a +1 specificity increase.
* *
* Using `'class'` is helpful when you want to ensure that element selectors within an Astro component override global style defaults (e.g. from a global stylesheet). * Using `'class'` is helpful when you want to ensure that element selectors within an Astro component override global style defaults (e.g. from a global stylesheet).
* Using `'where'` gives you more control over specifity, but requires that you use higher-specifity selectors, layers, and other tools to control which selectors are applied. * Using `'where'` gives you more control over specificity, but requires that you use higher-specificity selectors, layers, and other tools to control which selectors are applied.
* Using `'attribute'` is useful when you are manipulating the `class` attribute of elements and need to avoid conflicts between your own styling logic and Astro's application of styles. * Using `'attribute'` is useful when you are manipulating the `class` attribute of elements and need to avoid conflicts between your own styling logic and Astro's application of styles.
*/ */
scopedStyleStrategy?: 'where' | 'class' | 'attribute'; scopedStyleStrategy?: 'where' | 'class' | 'attribute';