From 4f70a38e21f92f0109bc4a207fa650a3cdc0b76e Mon Sep 17 00:00:00 2001
From: Miles Malerba <mmalerba@google.com>
Date: Wed, 4 Oct 2023 16:03:50 +0000
Subject: [PATCH] fix(material/theming): Fix subtle bug in
 current-selector-or-root

There was a sublte bug in the previous implementation. Consider the case:

```scss
div {
  @include current-selector-or-root() {
    color: red;
  }
  color: green;
}
```

The previous implementation lifted the `color: red;` into a separate
selector block that came *after* the initial one, resulting in the order
being flipped:

```css
div {
  color: green;
}
div {
  color: red;
}
```

The new code will produce the correct ordering:

```css
div {
  color: red;
  color: green;
}
```
---
 src/material/core/style/_sass-utils.scss | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/material/core/style/_sass-utils.scss b/src/material/core/style/_sass-utils.scss
index 413d341bd6a7..e944be17610e 100644
--- a/src/material/core/style/_sass-utils.scss
+++ b/src/material/core/style/_sass-utils.scss
@@ -10,9 +10,14 @@
 /// @content Content to output under the current selector, or root selector if there is no current
 ///     selector.
 @mixin current-selector-or-root($root: html) {
-  @at-root #{& or $root} {
+  @if & {
     @content;
   }
+  @else {
+    #{$root} {
+      @content;
+    }
+  }
 }
 
 /// A version of the standard `map.merge` function that takes a variable number of arguments.