Browse Source

Fix RTL styling in the table properties

panr 5 years ago
parent
commit
714d924b1a

+ 5 - 0
packages/ckeditor5-theme-lark/theme/ckeditor5-table/colorinput.css

@@ -67,6 +67,11 @@
 
 		& .ck.ck-icon {
 			margin-right: var(--ck-spacing-standard);
+
+			@mixin ck-dir rtl {
+				margin-right: 0;
+				margin-left: var(--ck-spacing-standard);
+			}
 		}
 	}
 }

+ 0 - 19
packages/ckeditor5-theme-lark/theme/ckeditor5-table/tablecellproperties.css

@@ -2,7 +2,6 @@
  * Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-@import "@ckeditor/ckeditor5-ui/theme/mixins/_dir.css";
 
 .ck.ck-table-cell-properties-form {
 	width: 320px;
@@ -16,24 +15,6 @@
 		&.ck-table-cell-properties-form__alignment-row {
 			& .ck.ck-toolbar {
 				background: none;
-
-				& .ck-button {
-					margin: 0;
-
-					@mixin ck-dir rtl {
-						&:first-child {
-							border-radius: var(--ck-border-radius);
-							border-top-left-radius: 0;
-							border-bottom-left-radius: 0;
-						}
-
-						&:last-child {
-							border-radius: var(--ck-border-radius);
-							border-top-right-radius: 0;
-							border-bottom-right-radius: 0;
-						}
-					}
-				}
 			}
 		}
 	}

+ 0 - 20
packages/ckeditor5-theme-lark/theme/ckeditor5-table/tableproperties.css

@@ -2,7 +2,6 @@
  * Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
- @import "@ckeditor/ckeditor5-ui/theme/mixins/_dir.css";
 
 .ck.ck-table-properties-form {
 	width: 320px;
@@ -17,25 +16,6 @@
 				& .ck-toolbar__items > * {
 					width: 40px;
 				}
-
-				& .ck-button {
-					margin: 0;
-
-					@mixin ck-dir rtl {
-						&:first-child {
-							border-radius: var(--ck-border-radius);
-							border-top-left-radius: 0;
-							border-bottom-left-radius: 0;
-						}
-
-						&:last-child {
-							border-radius: var(--ck-border-radius);
-							border-top-right-radius: 0;
-							border-bottom-right-radius: 0;
-						}
-					}
-				}
-
 			}
 		}
 	}

+ 30 - 8
packages/ckeditor5-theme-lark/theme/ckeditor5-ui/components/toolbar/toolbar.css

@@ -67,16 +67,38 @@
 			/* No spacing between items. */
 			margin: 0;
 
-			/* No rounded corners on the right side of the first child. */
-			&:first-child {
-				border-top-right-radius: 0;
-				border-bottom-right-radius: 0;
+			@mixin ck-dir rtl {
+				/* Reset margins in RTL as well if toolbar is compact.
+				This is needed because of the "(#11) Separate toolbar items." override later in the file. */
+				margin: 0;
 			}
 
-			/* No rounded corners on the left side of the last child. */
-			&:last-child {
-				border-top-left-radius: 0;
-				border-bottom-left-radius: 0;
+			@mixin ck-dir ltr {
+				/* No rounded corners on the right side of the first child. */
+				&:first-child {
+					border-top-right-radius: 0;
+					border-bottom-right-radius: 0;
+				}
+
+				/* No rounded corners on the left side of the last child. */
+				&:last-child {
+					border-top-left-radius: 0;
+					border-bottom-left-radius: 0;
+				}
+			}
+
+			@mixin ck-dir rtl {
+				/* No rounded corners on the right side of the first child. */
+				&:first-child {
+					border-top-left-radius: 0;
+					border-bottom-left-radius: 0;
+				}
+
+				/* No rounded corners on the left side of the last child. */
+				&:last-child {
+					border-top-right-radius: 0;
+					border-bottom-right-radius: 0;
+				}
 			}
 
 			/* "Middle" children should have no rounded corners. */