Bladeren bron

Implemented .ck-button_save and _cancel classes with distinctive colors.

Aleksander Nowodzinski 7 jaren geleden
bovenliggende
commit
e289073033

+ 0 - 15
packages/ckeditor5-theme-lark/theme/ckeditor5-link/link.css

@@ -3,23 +3,8 @@
  * For licensing, see LICENSE.md.
  */
 
-:root {
-	--ck-color-link-form-save-icon: hsl(120, 100%, 27%);
-	--ck-color-link-form-cancel-icon: hsl(15, 100%, 43%);
-}
-
 /* Class added to span element surrounding currently selected link. */
 .ck-link_selected {
 	background: var(--ck-color-link-selected-background);
 	outline: 1px solid var(--ck-color-link-selected-background);
 }
-
-.ck-link-form .ck-button {
-	&:first-of-type {
-		color: var(--ck-color-link-form-save-icon);
-	}
-
-	&:last-of-type {
-		color: var(--ck-color-link-form-cancel-icon);
-	}
-}

+ 8 - 0
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/components/button/button.css

@@ -68,6 +68,14 @@ a.ck-button {
 		@mixin ck-button-colors --ck-color-button-on;
 	}
 
+	&.ck-button_save {
+		color: var(--ck-color-button-save);
+	}
+
+	&.ck-button_cancel {
+		color: var(--ck-color-button-cancel);
+	}
+
 	& .ck-button__icon {
 		& use,
 		& use * {

+ 3 - 0
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/globals/_colors.css

@@ -42,6 +42,9 @@
 	--ck-color-button-action-disabled-background: 				hsl(104, 44%, 58%);
 	--ck-color-button-action-text: 								var(--ck-color-base-background);
 
+	--ck-color-button-save: 									hsl(120, 100%, 27%);
+	--ck-color-button-cancel: 									hsl(15, 100%, 43%);
+
 	/* -- Dropdown ------------------------------------------------------------------------------ */
 
 	--ck-color-dropdown-panel-background: 						var(--ck-color-base-background);