diff --git a/.changeset/lazy-turkeys-eat.md b/.changeset/lazy-turkeys-eat.md new file mode 100644 index 000000000..9518260b2 --- /dev/null +++ b/.changeset/lazy-turkeys-eat.md @@ -0,0 +1,5 @@ +--- +'@cloudfour/patterns': patch +--- + +Prevent border utility classes from accidentally setting `border-width` on all edges diff --git a/src/utilities/border/border.scss b/src/utilities/border/border.scss index 5b8292f54..95ff991c6 100644 --- a/src/utilities/border/border.scss +++ b/src/utilities/border/border.scss @@ -4,11 +4,15 @@ * To improve the convenience of using these classes without having to specify * a border style and color every time, we use the `:where` selector to set some * reasonable defaults with no specificity depth. + * + * 1. Set a default `border-width` so legacy utility classes won't immediately + * display visible borders on all sides. */ :where([class^='u-border'], [class*=' u-border']) { border-color: var(--theme-color-border-text-group); border-style: solid; + border-width: 0; /* 1 */ } /**