feat: use o-private-foundation's o-normalise

Financial-Times · Nov 7, 2024 · ddd6376 · ddd6376
1 parent a27875a
commit ddd6376
Show file tree

Hide file tree

Showing 57 changed files with 134 additions and 108 deletions.
diff --git a/components/ft-concept-button/main.scss b/components/ft-concept-button/main.scss
@@ -1,7 +1,6 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/mixins' as *;
 @import '@financial-times/o-typography/main';
-@financial-times/o-normalise/main
 @import '@financial-times/o-fonts/main';
-
 /// @access private
 $_ftConceptButtonThemes: (
 	link: (
@@ -129,8 +128,8 @@ $_ftConceptButtonThemes: (
 
 @mixin _ftConceptButtonTheme($theme: standard, $with-toggle-icon: false) {
 	@include _ftConceptButtonWithTheme($theme) {
-		@include oNormaliseFocusApply() {
-			@include oNormaliseFocusContentForElementColour(
+		@include oPrivateNormaliseFocusApply() {
+			@include oPrivateNormaliseFocusContentForElementColour(
 				_ftConceptButtonGetThemeColor(background)
 			);
 		}
@@ -203,7 +202,7 @@ $_ftConceptButtonThemes: (
 	}
 
 	.ft-concept-button__announcement {
-		@include oNormaliseVisuallyHidden();
+		@include oPrivateNormaliseVisuallyHidden();
 	}
 
 	@each $theme in map-keys($_ftConceptButtonThemes) {

diff --git a/components/ft-concept-button/stories/concept-button.scss b/components/ft-concept-button/stories/concept-button.scss
@@ -1,5 +1,5 @@
 @import "@financial-times/o-fonts/main";
-@import "@financial-times/o-private-foundation/o-normalise/main";
+@import "@financial-times/o-normalise/main";
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/n-notification/demos/src/main.scss b/components/n-notification/demos/src/main.scss
@@ -1,7 +1,7 @@
 $n-notification-is-silent: false;
 @import "../../main";
 @import "@financial-times/o-buttons/main";
-@import "@financial-times/o-private-foundation/o-normalise/main";
+@import "@financial-times/o-normalise/main";
 @import '@financial-times/o-fonts/main';
 
 @include oButtons();

diff --git a/components/o-autocomplete/demos/src/shared.scss b/components/o-autocomplete/demos/src/shared.scss
@@ -1,5 +1,5 @@
 @import '../../main';
-@import "@financial-times/o-private-foundation/o-normalise/main";
+@import "@financial-times/o-normalise/main";
 @import "@financial-times/o-forms/main";
 
 @include oNormalise();

diff --git a/components/o-autocomplete/main.scss b/components/o-autocomplete/main.scss
@@ -1,10 +1,10 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/_mixins';
 @import '@financial-times/math';
 @import '@financial-times/o-brand/main';
 @import '@financial-times/o-colors/main';
 @import '@financial-times/o-grid/main';
 @import '@financial-times/o-icons/main';
 @import '@financial-times/o-loading/main';
-@financial-times/o-normalise/main
 @import '@financial-times/o-spacing/main';
 @import '@financial-times/o-typography/main';
 @import '@financial-times/o-visual-effects/main';
@@ -33,7 +33,7 @@
 	}
 
 	.o-autocomplete__visually-hidden {
-		@include oNormaliseVisuallyHidden;
+		@include oPrivateNormaliseVisuallyHidden;
 	}
 
 	.o-autocomplete__clear {

diff --git a/components/o-banner/demos/src/demo.scss b/components/o-banner/demos/src/demo.scss
@@ -2,7 +2,7 @@
 @include oBanner();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 body {

diff --git a/components/o-banner/package.json b/components/o-banner/package.json
@@ -31,7 +31,8 @@
     "@financial-times/o-icons": "^7.0.1",
     "@financial-times/o-spacing": "^3.0.0",
     "@financial-times/o-typography": "^7.4.1",
-    "@financial-times/o-visual-effects": "^4.0.1"
+    "@financial-times/o-visual-effects": "^4.0.1",
+    "@financial-times/o-private-foundation": "0.0.0"
   },
   "devDependencies": {
     "@financial-times/o-fonts": "^5",

diff --git a/components/o-banner/src/scss/themes/_theme.scss b/components/o-banner/src/scss/themes/_theme.scss
@@ -1,3 +1,4 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/mixins' as *;
 @mixin _oBannerTheme($theme, $include-layout-styles: true) {
 
 	// Get and default the colour-based theme properties. Link, button, and rule
@@ -78,8 +79,8 @@
 	.o-banner__close {
 		@include oIconsContent('cross', $text-color, $size: $_o-banner-close-button-size);
 
-		@include oNormaliseFocusApply() {
-			@include oNormaliseFocusContentForElementColour($text-color);
+		@include oPrivateNormaliseFocusApply() {
+			@include oPrivateNormaliseFocusContentForElementColour($text-color);
 		};
 	}
 

diff --git a/components/o-banner/stories/banner.scss b/components/o-banner/stories/banner.scss
@@ -1,5 +1,5 @@
 @import "@financial-times/o-fonts/main";
-@import "@financial-times/o-private-foundation/o-normalise/main";
+@import "@financial-times/o-normalise/main";
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/o-big-number/demos/src/demo.scss b/components/o-big-number/demos/src/demo.scss
@@ -2,5 +2,5 @@
 @include oBigNumber();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
diff --git a/components/o-big-number/stories/big-number.scss b/components/o-big-number/stories/big-number.scss
@@ -2,5 +2,5 @@
 @include oBigNumber();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
diff --git a/components/o-buttons/demos/src/demo.scss b/components/o-buttons/demos/src/demo.scss
@@ -1,7 +1,7 @@
 @import "../../main";
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 html {

diff --git a/components/o-buttons/main.scss b/components/o-buttons/main.scss
@@ -1,8 +1,8 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/mixins' as *;
 @import '@financial-times/o-brand/main';
 @import '@financial-times/o-colors/main';
 @import '@financial-times/o-typography/main';
 @import '@financial-times/o-icons/main';
-@financial-times/o-normalise/main
 
 @import './src/scss/brand';
 @import './src/scss/variables';
@@ -97,7 +97,7 @@
 		}
 
 		.o-buttons-icon__label {
-			@include oNormaliseVisuallyHidden();
+			@include oPrivateNormaliseVisuallyHidden();
 		}
 	}
 

diff --git a/components/o-buttons/package.json b/components/o-buttons/package.json
@@ -25,7 +25,8 @@
 		"@financial-times/o-colors": "^6.5.0",
 		"@financial-times/o-icons": "^7.0.0",
 		"@financial-times/o-normalise": "^3.3.0",
-		"@financial-times/o-typography": "^7.4.1"
+		"@financial-times/o-typography": "^7.4.1",
+		"@financial-times/o-private-foundation": "0.0.0"
 	},
 	"devDependencies": {
 		"@financial-times/o-fonts": "^5.2.0",

diff --git a/components/o-buttons/src/scss/_mixins.scss b/components/o-buttons/src/scss/_mixins.scss
@@ -1,3 +1,4 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/mixins' as *;
 /// @output Styles for a custom button theme `.o-buttons--[$name]`.
 /// @example - Add a new claret theme for both primary and secondary buttons.
 ///     // Outputs class .o-buttons--my-special-button
@@ -243,8 +244,8 @@
 		text-decoration: none;
 	}
 
-	@include oNormaliseFocusApply() {
-		@include oNormaliseFocusContentForElementColour(map-get($button-colors-map, 'focus-background'));
+	@include oPrivateNormaliseFocusApply() {
+		@include oPrivateNormaliseFocusContentForElementColour(map-get($button-colors-map, 'focus-background'));
 		background-color: map-get($button-colors-map, 'focus-background');
 		color: map-get($button-colors-map, 'focus-color');
 		border-color: map-get($button-colors-map, 'focus-border');

diff --git a/components/o-buttons/stories/button.scss b/components/o-buttons/stories/button.scss
@@ -1,5 +1,5 @@
 @import '@financial-times/o-fonts/main';
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/o-colors/demos/src/color-mixer/color-mixer.scss b/components/o-colors/demos/src/color-mixer/color-mixer.scss
@@ -3,7 +3,7 @@
 @include oColors();
 @import '@financial-times/o-forms/main';
 @include oForms();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 @import '@financial-times/o-syntax-highlight/main';
 @include oSyntaxHighlight();

diff --git a/components/o-colors/demos/src/contrast-checker/contrast-checker.scss b/components/o-colors/demos/src/contrast-checker/contrast-checker.scss
@@ -5,7 +5,7 @@
 @include oTabs();
 @import '@financial-times/o-forms/main';
 @include oForms();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 @import '@financial-times/o-buttons/main';
 @include oButtons();

diff --git a/components/o-colors/demos/src/demo.scss b/components/o-colors/demos/src/demo.scss
@@ -3,7 +3,7 @@
 @include oColors();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import "@financial-times/o-normalise/main";
 @include oNormalise();
 
 

diff --git a/components/o-comments/package.json b/components/o-comments/package.json
@@ -28,7 +28,7 @@
     "@financial-times/o-colors": "^6.5.0",
     "@financial-times/o-editorial-typography": "^2.0.1",
     "@financial-times/o-forms": "^9.2.0",
-    "@financial-times/o-normalise": "^3.3.0",
+    "@financial-times/o-private-foundation": "0.0.0",
     "@financial-times/o-overlay": "^4.2.1",
     "@financial-times/o-spacing": "^3.0.0",
     "@financial-times/o-typography": "^7.4.1",

diff --git a/components/o-comments/src/scss/_mixins.scss b/components/o-comments/src/scss/_mixins.scss
@@ -1,3 +1,4 @@
+@use '@financial-times/o-private-foundation/o-normalise/src/scss/_mixins.scss' as *;
 /// Output All oComments Features
 @mixin oComments($opts: ('coral-talk-iframe': true)) {
 
@@ -45,7 +46,7 @@
 	}
 
 	.o-comments__edit-display-name-descriptive {
-		@include oNormaliseVisuallyHidden();
+		@include oPrivateNormaliseVisuallyHidden();
 	}
 
 	.o-overlay.o-comments__displayname-prompt {

diff --git a/components/o-cookie-message/demos/src/demo.scss b/components/o-cookie-message/demos/src/demo.scss
@@ -2,7 +2,7 @@
 @include oCookieMessage();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 body {

diff --git a/components/o-cookie-message/stories/cookie-message.scss b/components/o-cookie-message/stories/cookie-message.scss
@@ -1,5 +1,5 @@
 @import "@financial-times/o-fonts/main";
-@import "@financial-times/o-private-foundation/o-normalise/main";
+@import "@financial-times/o-normalise/main";
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/o-editorial-layout/demos/src/demo.scss b/components/o-editorial-layout/demos/src/demo.scss
@@ -4,5 +4,5 @@
 @include oGrid();
 @import '@financial-times/o-colors/main';
 @include oColors();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
diff --git a/components/o-editorial-layout/stories/core/editorialLayout.scss b/components/o-editorial-layout/stories/core/editorialLayout.scss
@@ -1,5 +1,5 @@
 @import '@financial-times/o-fonts/main';
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/o-expander/demos/src/demo.scss b/components/o-expander/demos/src/demo.scss
@@ -1,7 +1,7 @@
 @import "./../../main";
 
 @include oExpander();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 .o-expander--initialized[data-o-expander-shrink-to="height"] .o-expander__content {

diff --git a/components/o-expander/main.scss b/components/o-expander/main.scss
@@ -1,5 +1,5 @@
+@use "@financial-times/o-private-foundation/o-normalise/src/scss/mixins";
 @import "@financial-times/o-icons/main";
-@import "@financial-times/o-private-foundation/o-normalise/main";
 @import 'src/scss/variables';
 
 /// @outputs All o-expander CSS, including the expander content area and toggle.
@@ -72,7 +72,7 @@
 	}
 
 	.o-expander__visually-hidden {
-		@include oNormaliseVisuallyHidden;
+		@include oPrivateNormaliseVisuallyHidden;
 	}
 }
 

diff --git a/components/o-expander/package.json b/components/o-expander/package.json
@@ -33,6 +33,7 @@
     "@financial-times/o-viewport": "^5.0.0"
   },
   "devDependencies": {
+    "@financial-times/o-private-foundation": "0.0.0",
     "@financial-times/o-normalise": "^3.3.0"
   },
   "engines": {

diff --git a/components/o-expander/stories/expander.scss b/components/o-expander/stories/expander.scss
@@ -1,5 +1,5 @@
 @import '@financial-times/o-fonts/main';
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oFonts();
 @include oNormalise();
 

diff --git a/components/o-footer-services/demos/src/demo.scss b/components/o-footer-services/demos/src/demo.scss
@@ -1,7 +1,7 @@
 @import '../../main';
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 .demo {

diff --git a/components/o-footer/demos/src/demo.scss b/components/o-footer/demos/src/demo.scss
@@ -3,7 +3,7 @@
 @include oFooter();
 @import '@financial-times/o-fonts/main';
 @include oFonts();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 
 body {

diff --git a/components/o-footer/main.scss b/components/o-footer/main.scss
@@ -1,5 +1,5 @@
+@use "@financial-times/o-private-foundation/o-normalise/src/scss/mixins";
 @import '@financial-times/math';
-@import "@financial-times/o-private-foundation/o-normalise/main";
 @import "@financial-times/o-spacing/main";
 @import "@financial-times/o-colors/main";
 @import "@financial-times/o-typography/main";
@@ -109,7 +109,7 @@
 	}
 
 	.o-footer-visually-hidden {
-		@include oNormaliseVisuallyHidden();
+		@include oPrivateNormaliseVisuallyHidden();
 	}
 }
 

diff --git a/components/o-footer/package.json b/components/o-footer/package.json
@@ -39,7 +39,8 @@
   },
   "devDependencies": {
     "@financial-times/o-fonts": "^5.2.0",
-    "@financial-times/o-normalise": "^3.3.0"
+    "@financial-times/o-normalise": "^3.3.0",
+    "@financial-times/o-private-foundation": "0.0.0"
   },
   "engines": {
     "npm": ">7"

diff --git a/components/o-forms/demos/src/demo.scss b/components/o-forms/demos/src/demo.scss
@@ -3,7 +3,7 @@
 @include oFonts();
 @import '@financial-times/o-buttons/main';
 @include oButtons();
-@financial-times/o-normalise/main
+@import '@financial-times/o-normalise/main';
 @include oNormalise();
 body {
 	background: oColorsByUsecase(page, background);

diff --git a/components/o-forms/main.scss b/components/o-forms/main.scss
@@ -4,7 +4,7 @@
 @import '@financial-times/o-grid/main';
 @import '@financial-times/o-icons/main';
 @import '@financial-times/o-loading/main';
-@financial-times/o-normalise/main
+@use '@financial-times/o-private-foundation/o-normalise/src/_mixins.scss' as *;
 @import '@financial-times/o-typography/main';
 
 @import 'src/scss/main';
@@ -82,8 +82,8 @@
 					}
 				}
 				.o-forms-field--#{$theme} input {
-					@include oNormaliseFocusApply() {
-						@include oNormaliseFocusContentInverse();
+					@include oPrivateNormaliseFocusApply() {
+						@include oPrivateNormaliseFocusContentInverse();
 					}
 				}
 			}

diff --git a/components/o-forms/package.json b/components/o-forms/package.json
@@ -35,7 +35,7 @@
     "@financial-times/o-grid": "^6.0.0",
     "@financial-times/o-icons": "^7.0.0",
     "@financial-times/o-loading": "^5.0.0",
-    "@financial-times/o-normalise": "^3.3.0",
+    "@financial-times/o-private-foundation": "0.0.0",
     "@financial-times/o-spacing": "^3.0.0",
     "@financial-times/o-typography": "^7.4.1",
     "@financial-times/o-utils": "^2.2.0"