diff --git a/.changeset/slow-breads-attack.md b/.changeset/slow-breads-attack.md
new file mode 100644
index 0000000000..3e45313be6
--- /dev/null
+++ b/.changeset/slow-breads-attack.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-documentation': patch
+---
+
+Added information in the migration guide regarding the removal of position helpers.
diff --git a/packages/documentation/src/stories/misc/migration-guide/migrationv9-10.component.ts b/packages/documentation/src/stories/misc/migration-guide/migrationv9-10.component.ts
index edf83564d3..85983c0e1e 100644
--- a/packages/documentation/src/stories/misc/migration-guide/migrationv9-10.component.ts
+++ b/packages/documentation/src/stories/misc/migration-guide/migrationv9-10.component.ts
@@ -192,9 +192,9 @@ export class MigrationV99Component extends LitElement {
+ 🪄 migration rule
The gap classes naming (gap-*
, row-gap-*
,
column-gap-*
) has changed to pixel-based names
- breaking 🪄 migration rule
*-1
is now *-4
@@ -210,7 +210,6 @@ export class MigrationV99Component extends LitElement {
-
- 🪄 migration rule
Changed the percentage sizing utility classes (w-*
,
h-*
, mh-*
, mw-*
) naming
@@ -279,7 +278,6 @@ export class MigrationV99Component extends LitElement {
We recommend using the .elevation-*
classes instead.
-
-
🪄 migration rule
@@ -367,6 +365,18 @@ export class MigrationV99Component extends LitElement {
.rounded-{top/bottom/start/end}
are now .rounded-{top/bottom/start/end}-4
+
+
+ 🪄 migration rule
+ Removed some position helper classes that can be replaced with a combination of other utilities
+
+
+ fixed-top
is now position-fixed top-0 start-0 end-0 z-fixed
+ fixed-bottom
is now position-fixed bottom-0 start-0 end-0 z-fixed
+ sticky-top
is now position-sticky top-0 z-header
+ sticky-bottom
is now position-sticky bottom-0 z-header
+
+
Removed all text color utility classes (.text-*
)
diff --git a/packages/eslint/docs/rules/html/migrations/no-deprecated-position-helpers.md b/packages/eslint/docs/rules/html/migrations/no-deprecated-position-helpers.md
new file mode 100644
index 0000000000..bac615a579
--- /dev/null
+++ b/packages/eslint/docs/rules/html/migrations/no-deprecated-position-helpers.md
@@ -0,0 +1,30 @@
+# `no-deprecated-position-helpers`
+
+Flags deprecated Bootstrap position helpers `fixed-[top/bottom]` and `sticky-[top/bottom]` classes and replace them with a combination of other utility classes.
+
+- Type: problem
+- 🔧 Supports autofix (--fix)
+
+## Rule Options
+
+This rule does not have any configuration options.
+
+## Example
+
+### ❌ Invalid Code
+
+```html
+
Content
+Content
+Content
+Content
+```
+
+### ✅ Valid Code
+
+```html
+Content
+Content
+
+
+```
diff --git a/packages/eslint/src/rules/html/migrations/index.ts b/packages/eslint/src/rules/html/migrations/index.ts
index 1f70871d0a..87b9238d45 100644
--- a/packages/eslint/src/rules/html/migrations/index.ts
+++ b/packages/eslint/src/rules/html/migrations/index.ts
@@ -29,6 +29,9 @@ import noDeprecatedFontSizesRule, {
import noDeprecatedChipFilter, {
name as noDeprecatedChipFilterName,
} from './no-deprecated-chip-filter';
+import noDeprecatedPositionHelpersRule, {
+ name as noDeprecatedPositionHelpersRuleName,
+} from './no-deprecated-position-helpers';
import {
rulePhase1 as noDeprecatedBreakpointsRulePhase1,
@@ -54,9 +57,10 @@ export const htmlMigrationRules = {
[noFormTextRuleName]: noFormTextRule,
[noDeprecatedFontWeightRuleName]: noDeprecatedFontWeightRule,
[noDeprecatedShadowUtilitiesRuleName]: noDeprecatedShadowUtilitiesRule,
- [noDeprecatedElevationUtilitiesRuleName]: noDeprecatedElevationUtilitiesRule,
[noDeprecatedHClearfixName]: noDeprecatedHClearfix,
[noDeprecatedHVisuallyhiddenRuleName]: noDeprecatedHVisuallyhiddenRule,
+ [noDeprecatedPositionHelpersRuleName]: noDeprecatedPositionHelpersRule,
+ [noDeprecatedElevationUtilitiesRuleName]: noDeprecatedElevationUtilitiesRule,
[noDeprecatedFontSizesRuleName]: noDeprecatedFontSizesRule,
[noDeprecatedChipFilterName]: noDeprecatedChipFilter,
};
diff --git a/packages/eslint/src/rules/html/migrations/no-deprecated-position-helpers.ts b/packages/eslint/src/rules/html/migrations/no-deprecated-position-helpers.ts
new file mode 100644
index 0000000000..22ad55e706
--- /dev/null
+++ b/packages/eslint/src/rules/html/migrations/no-deprecated-position-helpers.ts
@@ -0,0 +1,23 @@
+import { createClassUpdateRule } from '../../../utils/create-class-update-rule';
+import { generateReplacedClassMessages } from '../../../utils/generate-messages';
+import { generateReplacedClassMutations } from '../../../utils/generate-mutations';
+
+export const name = 'no-deprecated-position-helpers';
+
+const classesMap = [
+ { old: 'fixed-top', new: 'position-fixed top-0 start-0 end-0 z-fixed' },
+ { old: 'fixed-bottom', new: 'position-fixed bottom-0 start-0 end-0 z-fixed' },
+ { old: 'sticky-top', new: 'position-sticky top-0 z-header' },
+ { old: 'sticky-bottom', new: 'position-sticky bottom-0 z-header' },
+];
+
+export const data = generateReplacedClassMutations(classesMap);
+
+export default createClassUpdateRule({
+ name,
+ type: 'problem',
+ description:
+ 'Flags deprecated bootstrap position helpers "fixed-{top|bottom}" and "sticky-{top|bottom}" classes and replace them with a combination of other utility classes.',
+ messages: generateReplacedClassMessages(classesMap),
+ mutations: data,
+});
diff --git a/packages/eslint/test/rules/html/migrations/no-deprecated-position-helpers.spec.ts b/packages/eslint/test/rules/html/migrations/no-deprecated-position-helpers.spec.ts
new file mode 100644
index 0000000000..467fd68e4a
--- /dev/null
+++ b/packages/eslint/test/rules/html/migrations/no-deprecated-position-helpers.spec.ts
@@ -0,0 +1,14 @@
+import rule, {
+ name,
+ data,
+} from '../../../../src/rules/html/migrations/no-deprecated-position-helpers';
+import { generatedDataTester } from '../../../utils/generated-data-tester';
+
+const validData = [
+ 'position-fixed top-0 start-0 end-0 z-fixed',
+ 'position-fixed bottom-0 start-0 end-0 z-fixed',
+ 'position-sticky top-0 z-header',
+ 'position-sticky bottom-0 z-header',
+];
+
+generatedDataTester(name, rule, data, validData);