From bad478dd91ce3e26715724e20273816ad75256c4 Mon Sep 17 00:00:00 2001
From: Elliott Marquez <emarquez@google.com>
Date: Wed, 13 Dec 2023 20:19:18 -0800
Subject: [PATCH] docs(menu): fix the popover demo and warning blockquote

PiperOrigin-RevId: 590796459
---
 catalog/eleventy-helpers/filters/md-markdown.cjs |  6 +++++-
 catalog/site/css/md-layout.css                   | 11 ++++++++++-
 docs/components/menu.md                          |  2 +-
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/catalog/eleventy-helpers/filters/md-markdown.cjs b/catalog/eleventy-helpers/filters/md-markdown.cjs
index 5bdb6e758d..93d8df2092 100644
--- a/catalog/eleventy-helpers/filters/md-markdown.cjs
+++ b/catalog/eleventy-helpers/filters/md-markdown.cjs
@@ -62,7 +62,7 @@ function blockquote($) {
     const $blockquote = $(blockquote);
     const $first = $blockquote.children().first();
     const text = $first.text().trim();
-    const iconRegex = /^(tip|important|note):\s*/i;
+    const iconRegex = /^(tip|important|note|warning):\s*/i;
     const match = text.match(iconRegex);
     const hasIcon = match;
 
@@ -85,6 +85,10 @@ function blockquote($) {
         $blockquote.addClass('important');
         icon = 'priority_high';
         break;
+      case 'warning':
+        $blockquote.addClass('warning');
+        icon = 'warning';
+        break;
       case 'note':
         $blockquote.addClass('note');
         icon = 'bookmark';
diff --git a/catalog/site/css/md-layout.css b/catalog/site/css/md-layout.css
index 1b307290f4..349af2b11f 100644
--- a/catalog/site/css/md-layout.css
+++ b/catalog/site/css/md-layout.css
@@ -237,6 +237,15 @@ blockquote.important {
 }
 
 blockquote.important,
-  blockquote.important a {
+blockquote.important a {
   color: var(--md-sys-color-on-primary-container);
 }
+
+blockquote.warning {
+  background-color: var(--md-sys-color-error-container);
+}
+
+blockquote.warning,
+blockquote.warning a {
+  color: var(--md-sys-color-on-error-container);
+}
diff --git a/docs/components/menu.md b/docs/components/menu.md
index 072ddb2744..321990e3c3 100644
--- a/docs/components/menu.md
+++ b/docs/components/menu.md
@@ -243,7 +243,7 @@ to the bottom of the button with three items, Apple, Banana, and
 Cucumber."](images/menu/usage-popover.webp)
 
 <!-- no-catalog-end -->
-<!-- catalog-include "figures/menu/usage-fixed.html" -->
+<!-- catalog-include "figures/menu/usage-popover.html" -->
 
 ```html
 <!-- Note the lack of position: relative parent. -->