fix(ui5-button): align buttons with and without icons on same line (#796)

MapTo0 · web-flow · commit 842049248e96 · 2019-09-27T11:05:54.000+03:00
FIXES: #795
diff --git a/packages/main/src/themes/Button.css b/packages/main/src/themes/Button.css
@@ -73,6 +73,8 @@
 
 .ui5-button-root .ui5-button-icon {
 	font-size: var(--_ui5_button_base_icon_only_font_size);
+	height: 0;
+	top: -.5rem;
 	position: relative;
 	color: inherit;
 }
diff --git a/packages/main/test/sap/ui/webcomponents/main/pages/Button.html b/packages/main/test/sap/ui/webcomponents/main/pages/Button.html
@@ -33,6 +33,14 @@
 	<br />
 	<br />
 
+	<div>
+		<ui5-togglebutton design="Positive" icon="sap-icon://add"></ui5-togglebutton>
+		<ui5-togglebutton design="Negative"></ui5-togglebutton>
+	</div>
+
+	<br />
+	<br />
+
 	<ui5-input id="press-counter"></ui5-input>
 	<ui5-input id="click-counter"></ui5-input>
 

Original file line number	Diff line number	Diff line change
`@@ -73,6 +73,8 @@`
`73`	`73`
`74`	`74`	`.ui5-button-root .ui5-button-icon {`
`75`	`75`	`font-size: var(--_ui5_button_base_icon_only_font_size);`
	`76`	`+ height: 0;`
	`77`	`+ top: -.5rem;`
`76`	`78`	`position: relative;`
`77`	`79`	`color: inherit;`
`78`	`80`	`}`