From aab8d307401cc78a81f9ec2e214c4a2231ac40b9 Mon Sep 17 00:00:00 2001 From: James Stuckey Weber Date: Tue, 26 Aug 2025 16:22:03 -0400 Subject: [PATCH 1/2] [ CodeStyle ] Prefer logical properties --- docs/style-guide.md | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/docs/style-guide.md b/docs/style-guide.md index 84c3d21..528757f 100644 --- a/docs/style-guide.md +++ b/docs/style-guide.md @@ -70,7 +70,12 @@ the primary implementations. *TODO: Add class naming rules* -*TODO: Add property usage rules, for instance preference for logical properties* +#### Prefer logical properties + +Use logical properties (`inset-block-start`, `margin-inline`) over physical +properties (`top`, `margin-left`), to allow the components to be used in +different writing systems. Physical properties can be used when the positioning +is not intended to be relative to the flow of the page. ## JavaScript From 31c4b374fc7e2084e18a5615f7dd17e44a955ca0 Mon Sep 17 00:00:00 2001 From: James Stuckey Weber Date: Wed, 27 Aug 2025 06:42:23 -0400 Subject: [PATCH 2/2] Link to logical properties spec --- docs/style-guide.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/docs/style-guide.md b/docs/style-guide.md index 528757f..6ea3055 100644 --- a/docs/style-guide.md +++ b/docs/style-guide.md @@ -72,10 +72,11 @@ the primary implementations. #### Prefer logical properties -Use logical properties (`inset-block-start`, `margin-inline`) over physical -properties (`top`, `margin-left`), to allow the components to be used in -different writing systems. Physical properties can be used when the positioning -is not intended to be relative to the flow of the page. +Use [logical properties](https://www.w3.org/TR/css-logical-1/) +(`inset-block-start`, `margin-inline`) over physical properties (`top`, +`margin-left`), to allow the components to be used in different writing systems. +Physical properties can be used when the positioning is not intended to be +relative to the flow of the page. ## JavaScript