8
0
Pārlūkot izejas kodu

Display a check icon in the GridTileView when is on.

Aleksander Nowodzinski 6 gadi atpakaļ
vecāks
revīzija
2dd6cdb2d3

+ 14 - 0
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/components/colorgrid/colorgrid.css

@@ -21,6 +21,7 @@
 	height: var(--ck-color-grid-tile-size);
 	min-width: var(--ck-color-grid-tile-size);
 	min-height: var(--ck-color-grid-tile-size);
+	padding: 0;
 	transition: 200ms ease box-shadow;
 
 	&.ck-disabled {
@@ -32,6 +33,19 @@
 		box-shadow: 0 0 0 1px var(--ck-color-base-border);
 	}
 
+	& .ck.ck-icon {
+		display: none;
+		filter: drop-shadow(0 0 1px var(--ck-color-base-background));
+	}
+
+	&.ck-on {
+		box-shadow: 0 0 0 1px var(--ck-color-base-background), 0 0 0 2px var(--ck-color-base-text);
+
+		& .ck.ck-icon {
+			display: block;
+		}
+	}
+
 	&:hover:not( .ck-disabled ) {
 		box-shadow: 0 0 0 2px var(--ck-color-focus-border);
 	}