Merge pull request #4602 from nextcloud/chore/css-logical

make rtl checks error level and apply fixes

Author: hamza221

src/components/ChartTemplate.vue

@@ -121,8 +121,8 @@ export default {
 		margin: -34px -1px 0 -1px;
 		background-color: var(--color-primary-element);
 		height: 15px;
-		border-top-left-radius: var(--border-radius-large);
-		border-top-right-radius: var(--border-radius-large);
+		border-start-start-radius: var(--border-radius-large);
+		border-start-end-radius: var(--border-radius-large);
 	}
 }
 </style>

src/components/CircleDetails.vue

@@ -441,7 +441,7 @@ export default {
 		}
 
 		.circle-details__main-content {
-			margin-left: 99px;
+			margin-inline-start: 99px;
 		}
 	}
 
@@ -507,7 +507,7 @@ export default {
 
 			// Remove left padding added in ListItem (external component)
 			:deep(.list-item__wrapper) {
-				padding-left: 0;
+				padding-inline-start: 0;
 			}
 
 			.resource {

stylelint.config.cjs

@@ -2,6 +2,33 @@
  * SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
-const stylelintConfig = require('@nextcloud/stylelint-config')
 
-module.exports = stylelintConfig
+module.exports = {
+	extends: '@nextcloud/stylelint-config',
+	plugins: ['stylelint-use-logical'],
+	// TODO: Remove this when the Nextcloud stylelint config is updated to include this rule (planned)
+	rules: {
+		'csstools/use-logical': [
+			'always',
+			{
+				severity: 'error',
+				// Only lint LTR-RTL properties for now
+				except: [
+					// Position properties
+					'top',
+					'bottom',
+					// Position properties with directional suffixes
+					/-top$/,
+					/-bottom$/,
+					// Size properties
+					'width',
+					'max-width',
+					'min-width',
+					'height',
+					'max-height',
+					'min-height',
+				],
+			},
+		],
+	},
+}