8
0
Просмотр исходного кода

Merge branch 'master' into t/ckeditor5/816

Aleksander Nowodzinski 7 лет назад
Родитель
Сommit
5167856416

+ 20 - 3
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/components/dropdown/splitbutton.css

@@ -5,6 +5,11 @@
 
 @import "../../../mixins/_rounded.css";
 
+:root {
+	--ck-color-split-button-hover-background: hsl(0, 0%, 92%);
+	--ck-color-split-button-hover-border: hsl(0, 0%, 70%);
+}
+
 .ck-splitbutton {
 	& > .ck-splitbutton__action {
 		/* Don't round the first button on the right side */
@@ -15,9 +20,6 @@
 	}
 
 	& > .ck-splitbutton__arrow {
-		/* Disable a double border between the button and the arrow button. */
-		border-left: 0;
-
 		/* It's a text-less button but still, it should not be square. */
 		min-width: unset;
 
@@ -31,4 +33,19 @@
 			width: var(--ck-dropdown-arrow-size);
 		}
 	}
+
+	/* When the split button is "open" (the arrow is on) or being hovered, it should get some styling
+	as a whole. The background of both buttons should stand out and there should be a visual
+	separation between both buttons. */
+	&.ck-splitbutton_open,
+	&:hover {
+		/* When the split button hovered as a whole, not as individual buttons. */
+		& > .ck-button:not(.ck-on):not(:hover) {
+			background: var(--ck-color-split-button-hover-background);
+		}
+
+		& > .ck-splitbutton__arrow {
+			border-left-color: var(--ck-color-split-button-hover-border);
+		}
+	}
 }

+ 6 - 1
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/components/editorui/editorui.css

@@ -25,7 +25,12 @@
 
 	/* https://github.com/ckeditor/ckeditor5-theme-lark/issues/116 */
 	& > *:first-child {
-		margin-top: var(--ck-spacing-standard);
+		margin-top: var(--ck-spacing-large);
+	}
+
+	/* https://github.com/ckeditor/ckeditor5/issues/847 */
+	& > *:last-child {
+		margin-bottom: var(--ck-spacing-large);
 	}
 }