FLOW-1084 : tokens added for and variant. (#220)

ollionorg · Jan 15, 2024 · b5a3bc2 · b5a3bc2
1 parent bec10f3
commit b5a3bc2
Show file tree

Hide file tree

Showing 4 changed files with 75 additions and 1 deletion.
diff --git a/packages/flow-core/CHANGELOG.md b/packages/flow-core/CHANGELOG.md
@@ -2,6 +2,12 @@
 
 # Change Log
 
+## [2.7.5] - 2024-01-11
+
+### Improvements
+
+- `f-text` : `x-large` tokens added for `para` and `code` variant.
+
 ## [2.7.4] - 2024-01-08
 
 ### Bug Fixes

diff --git a/packages/flow-core/package.json b/packages/flow-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ollion/flow-core",
-  "version": "2.7.4",
+  "version": "2.7.5",
   "description": "Core package of flow design system",
   "module": "dist/flow-core.es.js",
   "main": "dist/flow-core.cjs.js",

diff --git a/packages/flow-core/src/components/f-text/_f-text-variables-dynamic.scss b/packages/flow-core/src/components/f-text/_f-text-variables-dynamic.scss
@@ -39,6 +39,16 @@ $variants: (
 				"regular": var(--text-code-x-small-regular)
 			),
 			"fontFamily": var(--text-code-x-small-fontfamily)
+		),
+		"x-large": (
+			"fontSize": var(--text-code-x-large-font),
+			"lineHeight": var(--text-code-x-large-lineheight),
+			"weight": (
+				"medium": var(--text-code-x-large-medium),
+				"bold": var(--text-code-x-large-bold),
+				"regular": var(--text-code-x-large-regular)
+			),
+			"fontFamily": var(--text-code-x-large-fontfamily)
 		)
 	),
 	"para": (
@@ -81,6 +91,16 @@ $variants: (
 				"regular": var(--text-para-small-regular)
 			),
 			"fontFamily": var(--text-para-small-fontfamily)
+		),
+		"x-large": (
+			"fontSize": var(--text-para-x-large-font),
+			"lineHeight": var(--text-para-x-large-lineheight),
+			"weight": (
+				"medium": var(--text-para-x-large-medium),
+				"bold": var(--text-para-x-large-bold),
+				"regular": var(--text-para-x-large-regular)
+			),
+			"fontFamily": var(--text-para-x-large-fontfamily)
 		)
 	),
 	"heading": (

diff --git a/packages/flow-core/src/mixins/scss/_text-tokens.scss b/packages/flow-core/src/mixins/scss/_text-tokens.scss
@@ -48,6 +48,18 @@
 
 	--text-code-x-small-fontfamily: "Operator Mono", monospace;
 
+	--text-code-x-large-font: 20px;
+
+	--text-code-x-large-lineheight: 32px;
+
+	--text-code-x-large-medium: 350;
+
+	--text-code-x-large-bold: 400;
+
+	--text-code-x-large-regular: 325;
+
+	--text-code-x-large-fontfamily: "Operator Mono", monospace;
+
 	--text-para-x-small-font: 10px;
 
 	--text-para-x-small-lineheight: 16px;
@@ -96,6 +108,18 @@
 
 	--text-para-small-fontfamily: "Montserrat", "Montserrat", sans-serif;
 
+	--text-para-x-large-font: 20px;
+
+	--text-para-x-large-lineheight: 28px;
+
+	--text-para-x-large-medium: 500;
+
+	--text-para-x-large-bold: 700;
+
+	--text-para-x-large-regular: 400;
+
+	--text-para-x-large-fontfamily: "Montserrat", "Montserrat", sans-serif;
+
 	--text-heading-x-small-font: 12px;
 
 	--text-heading-x-small-lineheight: 18px;
@@ -271,6 +295,18 @@
 
 	--text-para-large-fontfamily: "ABC Oracle", "Montserrat", sans-serif;
 
+	--text-para-x-large-font: 20px;
+
+	--text-para-x-large-lineheight: 1.4;
+
+	--text-para-x-large-medium: 500;
+
+	--text-para-x-large-bold: 700;
+
+	--text-para-x-large-regular: 400;
+
+	--text-para-x-large-fontfamily: "ABC Oracle", "Montserrat", sans-serif;
+
 	--text-code-medium-font: 14px;
 
 	--text-code-medium-lineheight: 1.4;
@@ -319,6 +355,18 @@
 
 	--text-code-small-fontfamily: "Inter", monospace;
 
+	--text-code-x-large-font: 20px;
+
+	--text-code-x-large-lineheight: 1.4;
+
+	--text-code-x-large-medium: 350;
+
+	--text-code-x-large-bold: 400;
+
+	--text-code-x-large-regular: 325;
+
+	--text-code-x-large-fontfamily: "Operator Mono", monospace;
+
 	--flow-font: "ABC Oracle", "Montserrat", sans-serif;
 
 	--flow-code-font: "Operator Mono", monospace;