From ef072ee4165138cd3d8ebce88c23d7f872e94e88 Mon Sep 17 00:00:00 2001
From: Lam Nguyen <la.nguyen@f5.com>
Date: Wed, 12 Mar 2025 03:29:23 -0700
Subject: [PATCH 1/2] feat: Added side callout CSS

---
 assets/css/v2/style.css          | 6 ++++++
 layouts/shortcodes/call-out.html | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
index 5cca11b3..18f20a39 100644
--- a/assets/css/v2/style.css
+++ b/assets/css/v2/style.css
@@ -328,6 +328,7 @@ nav {
         --side-gutter-width
       );
     column-gap: var(--component-gap);
+    align-items: start;
   }
 }
 
@@ -863,6 +864,11 @@ blockquote p:last-child {
   margin: 0 auto;
 }
 
+blockquote.side-callout {
+  grid-column: 2 !important;
+  grid-row: span 2;
+}
+
 /* Tabs */
 .nav-tabs {
   list-style: none;
diff --git a/layouts/shortcodes/call-out.html b/layouts/shortcodes/call-out.html
index 4a7b20ed..b63b53fa 100644
--- a/layouts/shortcodes/call-out.html
+++ b/layouts/shortcodes/call-out.html
@@ -1,5 +1,5 @@
 <!-- Blockquote element with a class that is the first parameter passed to the shortcode -->
-<blockquote class="{{ .Get 0 }}">
+<blockquote class="{{ .Get 0 }} side-callout">
    <div>
      <!-- Check if the third parameter (icon class) is provided -->
      {{ with .Get 2 }}

From 0eeb1d40cc71267aea4fec70b0b70fda71bee2f3 Mon Sep 17 00:00:00 2001
From: Lam Nguyen <la.nguyen@f5.com>
Date: Wed, 12 Mar 2025 10:05:33 -0700
Subject: [PATCH 2/2] fix: Add default option to callout to be inline

---
 assets/css/v2/style.css          |  3 +++
 layouts/shortcodes/call-out.html | 11 ++++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
index 18f20a39..184546ef 100644
--- a/assets/css/v2/style.css
+++ b/assets/css/v2/style.css
@@ -775,6 +775,9 @@ h2 {
 
 /* tables */
 table {
+  position: relative;
+  z-index: -1;
+
   td {
     padding: var(--table-row-space-between) 0;
   }
diff --git a/layouts/shortcodes/call-out.html b/layouts/shortcodes/call-out.html
index b63b53fa..1efd53e7 100644
--- a/layouts/shortcodes/call-out.html
+++ b/layouts/shortcodes/call-out.html
@@ -1,5 +1,14 @@
+{{ $class := .Get 0 }}
+{{ $sideOption := "side-callout" }}
+{{ $inlineOption := "inline-callout" }}
+
+<!-- Add default option for callouts that are "inline" if one is not provided -->
+{{ if and (not (strings.Contains $class $inlineOption)) (not (strings.Contains $class $sideOption)) }}
+{{ $class = printf "%s %s" $class $inlineOption }}
+{{ end }}
+
 <!-- Blockquote element with a class that is the first parameter passed to the shortcode -->
-<blockquote class="{{ .Get 0 }} side-callout">
+<blockquote class="{{ $class }}">
    <div>
      <!-- Check if the third parameter (icon class) is provided -->
      {{ with .Get 2 }}