fix(theme-base): correct inavlid CSS vars (#2427)

ilhan007 · web-flow · commit 3674dbcaf99d · 2020-11-02T10:01:26.000+02:00
diff --git a/packages/fiori/src/themes/ProductSwitchItem.css b/packages/fiori/src/themes/ProductSwitchItem.css
@@ -79,7 +79,7 @@
 }
 
 .ui5-product-switch-item-root .ui5-product-switch-item-text-content .ui5-product-switch-item-heading {
-	font-size:var( --sapMFontHeader6Size);
+	font-size:var( --sapFontHeader6Size);
 	color:var(--sapGroup_TitleTextColor);
 }
 
diff --git a/packages/fiori/src/themes/UploadCollection.css b/packages/fiori/src/themes/UploadCollection.css
@@ -111,7 +111,7 @@
 
 .uc-dnd-overlay .dnd-overlay-text {
 	font-family: "72override", var(--sapFontFamily);
-	font-size: var(--sapMFontHeader4Size);
+	font-size: var(--sapFontHeader4Size);
 	color: var(--sapContent_NonInteractiveIconColor);
 }
 
diff --git a/packages/main/src/themes/Card.css b/packages/main/src/themes/Card.css
@@ -107,7 +107,7 @@
 
 .ui5-card-header .ui5-card-header-text .ui5-card-heading {
 	font-family: "72override", var(--sapFontFamily);
-	font-size: var(--sapMFontHeader5Size);
+	font-size: var(--sapFontHeader5Size);
 	font-weight: normal;
 	color: var(--sapTile_TitleTextColor);
 	max-height: 3.5rem;
diff --git a/packages/main/src/themes/GroupHeaderListItem.css b/packages/main/src/themes/GroupHeaderListItem.css
@@ -9,7 +9,7 @@
 .ui5-li-root.ui5-ghli-root {
 	padding-top: 1rem;
 	color: currentColor;
-	font-size: var(--sapMFontHeader6Size);
+	font-size: var(--sapFontHeader6Size);
 	font-weight: normal;
 	line-height: 2rem;
 }
diff --git a/packages/main/src/themes/List.css b/packages/main/src/themes/List.css
@@ -39,7 +39,7 @@
 	white-space: nowrap;
 	text-overflow: ellipsis;
 	box-sizing: border-box;
-	font-size: var(--sapMFontHeader4Size);
+	font-size: var(--sapFontHeader4Size); 
 	font-family: "72override", var(--sapFontFamily);
 	color: var(--sapGroup_TitleTextColor);
 	height: 3rem;
diff --git a/packages/main/src/themes/ResponsivePopoverCommon.css b/packages/main/src/themes/ResponsivePopoverCommon.css
@@ -48,8 +48,8 @@
 
 [inner-input]::selection,
 [inner-input]::-moz-selection {
-	background: var(--sapSelected);
-	color: var(--sapContent_contrastTextColor);
+	background: var(--sapSelectedColor);
+	color: var(--sapContent_ContrastTextColor);
 }
 
 /* Input placeholder */
diff --git a/packages/main/src/themes/Select.css b/packages/main/src/themes/Select.css
@@ -8,7 +8,6 @@
 	outline: none;
 	cursor: pointer;
 	overflow: hidden;
-	box-shadow: var(--sapUiContentShadow1);
 }
 
 .ui5-select-label-root {
diff --git a/packages/main/src/themes/TextArea.css b/packages/main/src/themes/TextArea.css
@@ -142,7 +142,7 @@
 
 :host([value-state]:not([value-state="None"])) .ui5-textarea-inner,
 :host([exceeding]) .ui5-textarea-inner {
-	border-width: var(--_ui5_textarea_error_warning_border_width);
+	border-width: var(--_ui5_textarea_state_border_width);
 }
 
 :host([value-state="Error"]) .ui5-textarea-inner,
@@ -193,7 +193,7 @@
 
 :host([value-state="Information"]:not([readonly]):not([exceeding])) .ui5-textarea-inner {
 	background-color: var(--sapField_InformationBackground);
-	border-width: var(--_ui5_textarea_information_border_width);
+	border-width: var(--_ui5_textarea_state_border_width);
 }
 
 .ui5-textarea-exceeded-text {
diff --git a/packages/main/src/themes/ValueStateMessage.css b/packages/main/src/themes/ValueStateMessage.css
@@ -6,7 +6,7 @@
 .ui5-valuestatemessage-root {
 	box-sizing: border-box;
 	display: inline-block;
-	color: var(--sapUiBaseColor);
+	color: var(--sapTextColor);
 	font-size: var(--sapFontSmallSize);
 	font-family: "72override", var(--sapFontFamily);
 	padding: .3rem .625rem;
diff --git a/packages/main/src/themes/base/TextArea-parameters.css b/packages/main/src/themes/base/TextArea-parameters.css
@@ -1,5 +1,5 @@
 :root {
 	--_ui5_textarea_focus_after_width: 1px;
 	--_ui5_textarea_warning_border_style: solid;
-	--_ui5_textarea_warning_border_width: 2px;
+	--_ui5_textarea_state_border_width: 0.125rem;
 }
diff --git a/packages/main/src/themes/base/sizes-parameters.css b/packages/main/src/themes/base/sizes-parameters.css
@@ -25,7 +25,7 @@
 	--_ui5_input_value_state_icon_padding: var(--_ui5-input-icon-padding);
 	--_ui5_list_no_data_height: 3rem;
 	--_ui5_list_item_cb_margin_right: 0;
-	--_ui5_list_item_title_size: var(--sapMFontLargeSize);
+	--_ui5_list_item_title_size: var(--sapFontLargeSize);
 	--_ui5_list_item_img_size: 3rem;
 	--_ui5_list_item_img_margin: 0.5rem 0.75rem 0.5rem 0rem;
 	--_ui5_list_item_base_height: 2.75rem;
diff --git a/packages/main/src/themes/sap_belize_hcb/TextArea-parameters.css b/packages/main/src/themes/sap_belize_hcb/TextArea-parameters.css
@@ -3,5 +3,4 @@
 :root {
 	--_ui5_textarea_focus_after_width: 2px;
 	--_ui5_textarea_warning_border_style: dashed;
-	--_ui5_textarea_warning_border_width: 1px;
 }
diff --git a/packages/main/src/themes/sap_belize_hcw/TextArea-parameters.css b/packages/main/src/themes/sap_belize_hcw/TextArea-parameters.css
@@ -3,5 +3,4 @@
 :root {
 	--_ui5_textarea_focus_after_width: 2px;
 	--_ui5_textarea_warning_border_style: dashed;
-	--_ui5_textarea_warning_border_width: 1px;
 }
diff --git a/packages/theme-base/css-vars-usage.json b/packages/theme-base/css-vars-usage.json
@@ -61,7 +61,6 @@
   "--sapContent_BadgeBackground",
   "--sapContent_ContrastFocusColor",
   "--sapContent_ContrastTextColor",
-  "--sapContent_contrastTextColor",
   "--sapContent_DisabledOpacity",
   "--sapContent_DisabledTextColor",
   "--sapContent_DragAndDropActiveColor",
@@ -107,6 +106,7 @@
   "--sapField_WarningBackground",
   "--sapField_WarningColor",
   "--sapFontFamily",
+  "--sapFontHeader4Size",
   "--sapFontHeader5Size",
   "--sapFontHeader6Size",
   "--sapFontHeaderFamily",
@@ -168,10 +168,6 @@
   "--sapList_SelectionBorderColor",
   "--sapList_TableGroupHeaderBorderColor",
   "--sapList_TableGroupHeaderTextColor",
-  "--sapMFontHeader4Size",
-  "--sapMFontHeader5Size",
-  "--sapMFontHeader6Size",
-  "--sapMFontLargeSize",
   "--sapNegativeColor",
   "--sapNegativeElementColor",
   "--sapNegativeTextColor",
@@ -188,7 +184,6 @@
   "--sapPositiveColor",
   "--sapPositiveElementColor",
   "--sapPositiveTextColor",
-  "--sapSelected",
   "--sapSelectedColor",
   "--sapShell_Active_Background",
   "--sapShell_Active_TextColor",
@@ -207,8 +202,6 @@
   "--sapTile_SeparatorColor",
   "--sapTile_TextColor",
   "--sapTile_TitleTextColor",
-  "--sapUiBaseColor",
-  "--sapUiContentShadow1",
   "--sapWarningBackground",
   "--sapWarningBorderColor"
 ]

Original file line number	Diff line number	Diff line change
`@@ -79,7 +79,7 @@`
`79`	`79`	`}`
`80`	`80`
`81`	`81`	`.ui5-product-switch-item-root .ui5-product-switch-item-text-content .ui5-product-switch-item-heading {`
`82`		`- font-size:var( --sapMFontHeader6Size);`
	`82`	`+ font-size:var( --sapFontHeader6Size);`
`83`	`83`	`color:var(--sapGroup_TitleTextColor);`
`84`	`84`	`}`
`85`	`85`
Original file line number	Diff line number	Diff line change
`@@ -111,7 +111,7 @@`
`111`	`111`
`112`	`112`	`.uc-dnd-overlay .dnd-overlay-text {`
`113`	`113`	`font-family: "72override", var(--sapFontFamily);`
`114`		`- font-size: var(--sapMFontHeader4Size);`
	`114`	`+ font-size: var(--sapFontHeader4Size);`
`115`	`115`	`color: var(--sapContent_NonInteractiveIconColor);`
`116`	`116`	`}`
`117`	`117`
Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@`
`9`	`9`	`.ui5-li-root.ui5-ghli-root {`
`10`	`10`	`padding-top: 1rem;`
`11`	`11`	`color: currentColor;`
`12`		`- font-size: var(--sapMFontHeader6Size);`
	`12`	`+ font-size: var(--sapFontHeader6Size);`
`13`	`13`	`font-weight: normal;`
`14`	`14`	`line-height: 2rem;`
`15`	`15`	`}`
Original file line number	Diff line number	Diff line change
`@@ -48,8 +48,8 @@`
`48`	`48`
`49`	`49`	`[inner-input]::selection,`
`50`	`50`	`[inner-input]::-moz-selection {`
`51`		`- background: var(--sapSelected);`
`52`		`- color: var(--sapContent_contrastTextColor);`
	`51`	`+ background: var(--sapSelectedColor);`
	`52`	`+ color: var(--sapContent_ContrastTextColor);`
`53`	`53`	`}`
`54`	`54`
`55`	`55`	`/* Input placeholder */`
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,6 @@`
`8`	`8`	`outline: none;`
`9`	`9`	`cursor: pointer;`
`10`	`10`	`overflow: hidden;`
`11`		`- box-shadow: var(--sapUiContentShadow1);`
`12`	`11`	`}`
`13`	`12`
`14`	`13`	`.ui5-select-label-root {`
Original file line number	Diff line number	Diff line change
`@@ -142,7 +142,7 @@`
`142`	`142`
`143`	`143`	`:host([value-state]:not([value-state="None"])) .ui5-textarea-inner,`
`144`	`144`	`:host([exceeding]) .ui5-textarea-inner {`
`145`		`- border-width: var(--_ui5_textarea_error_warning_border_width);`
	`145`	`+ border-width: var(--_ui5_textarea_state_border_width);`
`146`	`146`	`}`
`147`	`147`
`148`	`148`	`:host([value-state="Error"]) .ui5-textarea-inner,`
`@@ -193,7 +193,7 @@`
`193`	`193`
`194`	`194`	`:host([value-state="Information"]:not([readonly]):not([exceeding])) .ui5-textarea-inner {`
`195`	`195`	`background-color: var(--sapField_InformationBackground);`
`196`		`- border-width: var(--_ui5_textarea_information_border_width);`
	`196`	`+ border-width: var(--_ui5_textarea_state_border_width);`
`197`	`197`	`}`
`198`	`198`
`199`	`199`	`.ui5-textarea-exceeded-text {`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`:root {`
`2`	`2`	`--_ui5_textarea_focus_after_width: 1px;`
`3`	`3`	`--_ui5_textarea_warning_border_style: solid;`
`4`		`- --_ui5_textarea_warning_border_width: 2px;`
	`4`	`+ --_ui5_textarea_state_border_width: 0.125rem;`
`5`	`5`	`}`
Original file line number	Diff line number	Diff line change
`@@ -3,5 +3,4 @@`
`3`	`3`	`:root {`
`4`	`4`	`--_ui5_textarea_focus_after_width: 2px;`
`5`	`5`	`--_ui5_textarea_warning_border_style: dashed;`
`6`		`- --_ui5_textarea_warning_border_width: 1px;`
`7`	`6`	`}`