some-css-updated (#5720)

* style: use CSS variables for Badge dimensions

Update the Badge component to utilize CSS variables for height and 
minimum width. This should help to improve consistency.

* fix: brighter warning color

Author: PavelLaptev

packages/ui/src/lib/Badge.svelte

@@ -22,8 +22,8 @@
 		align-items: center;
 		justify-content: center;
 		text-align: center;
-		height: 14px;
-		min-width: 14px;
+		height: var(--size-icon);
+		min-width: var(--size-icon);
 		border-radius: 14px;
 		padding: 0 4px;
 		line-height: 90%;

packages/ui/src/lib/data/design-tokens.json

@@ -649,7 +649,7 @@
 			},
 			"50": {
 				"$type": "color",
-				"$value": "#d99611",
+				"$value": "#e89b17",
 				"$description": "",
 				"$extensions": {
 					"mode": {},
@@ -665,7 +665,7 @@
 			},
 			"60": {
 				"$type": "color",
-				"$value": "#f4c06c",
+				"$value": "#f4c26c",
 				"$description": "",
 				"$extensions": {
 					"mode": {},
@@ -4373,7 +4373,7 @@
 			"useDTCGKeys": true,
 			"colorMode": "hex",
 			"variableCollections": ["clr-core", "clr", "size", "radius", "text"],
-			"createdAt": "2024-11-21T15:52:26.375Z"
+			"createdAt": "2024-11-29T01:38:33.041Z"
 		}
 	}
 }

packages/ui/src/styles/core/design-tokens.css

@@ -43,8 +43,8 @@
 	--clr-core-warn-20: color(srgb 0.3764705882352941 0.24705882352941178 0.06666666666666667);
 	--clr-core-warn-30: color(srgb 0.5411764705882353 0.3333333333333333 0.043137254901960784);
 	--clr-core-warn-40: color(srgb 0.7450980392156863 0.44313725490196076 0.0196078431372549);
-	--clr-core-warn-50: color(srgb 0.8509803921568627 0.5882352941176471 0.06666666666666667);
-	--clr-core-warn-60: color(srgb 0.9568627450980393 0.7529411764705882 0.4235294117647059);
+	--clr-core-warn-50: color(srgb 0.9098039215686274 0.6078431372549019 0.09019607843137255);
+	--clr-core-warn-60: color(srgb 0.9568627450980393 0.7607843137254902 0.4235294117647059);
 	--clr-core-warn-70: color(srgb 0.996078431372549 0.8823529411764706 0.6823529411764706);
 	--clr-core-warn-80: color(srgb 1 0.9254901960784314 0.7803921568627451);
 	--clr-core-warn-90: color(srgb 1 0.9686274509803922 0.8784313725490196);