notice: collapse borders if single code block is displayed #906

exampleSite/content/basics/migration/_index.en.md

@@ -18,6 +18,12 @@ This document shows you what's new in the latest release and flags it with one o
 
 ---
 
+## 6.4.0.beta (XXXX-XX-XX) {#640}
+
+- {{% badge style="note" title=" " %}}Change{{% /badge %}} If you now display a single code block in a `notice` box, its [margin and border will be removed](shortcodes/notice#code-with-collapsed-colored-borders) so only the colored notice border is visible.
+
+---
+
 ## 6.3.0 (2024-09-03) {#630}
 
 - {{% badge style="note" title=" " %}}Change{{% /badge %}} The [`expand` shortcode](shortcodes/expand) changed the naming of the `open` parameter to `expanded`. You don't need to change anything yet but may get deprecation warnings.

exampleSite/content/shortcodes/notice.en.md

@@ -309,3 +309,31 @@ Just a box
 > [!info] Can callouts be nested?
 > > [!important] Yes!, they can.
 > > > [!tip]  You can even use multiple layers of nesting.
+
+#### Code with Collapsed Colored Borders
+
+````
+```c
+// Normal code:
+printf( "Hello world\n" )
+```
+
+{{%/* notice style="red" title="" */%}}
+```c
+// With colored border
+printf( "Hello world\n" )
+```
+{{%/* /notice */%}}
+````
+
+```c
+// Normal code:
+printf( "Hello world\n" )
+```
+
+{{% notice style="red" title="" %}}
+```c
+// With colored border
+printf( "Hello world\n" )
+```
+{{% /notice %}}

static/css/theme.css

@@ -721,6 +721,14 @@ div.box > .box-content {
     padding-left: 1rem;
     padding-right: 1rem;
 }
+/* remove margin if only a single code block is contained in the tab */
+#R-body .box-content:has(> div.highlight:only-child){
+    padding: 0;
+}
+/* remove border from a code block if single  */
+#R-body .box-content > div.highlight:only-child > pre{
+    border: 0;
+}
 
 p:empty {
     /* in case of image render hook, Hugo may generate empty <p>s that we want to ignore */