浏览代码

Changed the strategy of rendering button children (icons, labels) to fix bugs with misaligned elements since the default font size has changed in Lark.

Aleksander Nowodzinski 8 年之前
父节点
当前提交
8dc9141cfc

+ 4 - 6
packages/ckeditor5-ui/theme/components/button/button.css

@@ -12,16 +12,14 @@ a.ck-button {
 	@mixin ck-unselectable;
 	@mixin ck-tooltip_enabled;
 
-	display: inline-block;
+	display: inline-flex;
+	flex-flow: row nowrap;
+	align-items: center;
 	position: relative;
 
-	@mixin ck-button-icon {
-		display: inline-block;
-	}
-
 	&.ck-button_with-text {
 		& .ck-button__label {
-			display: inline-block;
+			display: inline;
 		}
 	}
 

+ 3 - 2
packages/ckeditor5-ui/theme/components/icon/icon.css

@@ -4,11 +4,12 @@
  */
 
 svg.ck-icon {
-	font-size: 1em;
+	/* Multiplied by the height of the line in "px" should give SVG "viewport" dimensions */
+	font-size: 0.833333em;
 
 	/* Must be consistent with .ck-button__label's vertical align. Otherwise, buttons with and
 	without labels (but with icons) have different sizes in Chrome */
-	vertical-align: top;
+	vertical-align: middle;
 
 	color: inherit;