From f00a1a4435552d55625d29e3d264d050114904af Mon Sep 17 00:00:00 2001
From: Geert Selderslaghs <geert@codemindit.com>
Date: Sun, 8 Dec 2024 21:03:36 +0100
Subject: [PATCH 1/3] fix(Collapsible) updated styling: updated header styling;
 implemented flex grow on header; implemented correct inner padding on body
 content wrapper #448

---
 sass/components/_collapsible.scss | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/sass/components/_collapsible.scss b/sass/components/_collapsible.scss
index 4b42e89703..2130a53eaf 100644
--- a/sass/components/_collapsible.scss
+++ b/sass/components/_collapsible.scss
@@ -34,17 +34,22 @@
   content: '▾';
   text-align: right;
   margin-right: 0.25rem;
-  width: 100%;
+  width: auto;
+  align-self: end;
 }
+
 .active .collapsible-header::after {
   content: "▴";
 }
 
-
 .keyboard-focused .collapsible-header:focus {
   background-color: rgba(0, 0, 0, 0.12);
 }
 
+.collapsible-header-content {
+  flex-grow: 1;
+}
+
 .collapsible-body {
   max-height: 0;
   border-bottom: 1px solid var(--md-sys-color-outline-variant);
@@ -53,6 +58,10 @@
   overflow: hidden;
 }
 
+.collapsible-body-content {
+  padding: 2rem 0;
+}
+
 // Popout Collapsible
 
 .collapsible.popout {

From fa294fcdb197b42a14714fcbebc2719b178ca9f6 Mon Sep 17 00:00:00 2001
From: Geert Selderslaghs <geert@codemindit.com>
Date: Wed, 11 Dec 2024 13:20:43 +0100
Subject: [PATCH 2/3] fix(Collapsible) revert collapsible body content from
 f00a1a44; configured header pseudo element positioning and margin;
 implemented Material icons

---
 sass/components/_collapsible.scss | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/sass/components/_collapsible.scss b/sass/components/_collapsible.scss
index 2130a53eaf..95cd0d10a1 100644
--- a/sass/components/_collapsible.scss
+++ b/sass/components/_collapsible.scss
@@ -31,15 +31,17 @@
 }
 
 .collapsible-header::after {
-  content: '▾';
-  text-align: right;
-  margin-right: 0.25rem;
-  width: auto;
-  align-self: end;
+  content: '\e5cf';
+  align-self: flex-end;
+  margin-left: .5rem;
+  font-family: 'Material Symbols Outlined', 'Material Symbols Rounded', 'Material Symbols Sharp', 'Material Icons';
+  font-size: 25px;
+  line-height: .9;
+  -webkit-font-smoothing: antialiased;
 }
 
 .active .collapsible-header::after {
-  content: "▴";
+  content: '\e5ce';
 }
 
 .keyboard-focused .collapsible-header:focus {
@@ -58,10 +60,6 @@
   overflow: hidden;
 }
 
-.collapsible-body-content {
-  padding: 2rem 0;
-}
-
 // Popout Collapsible
 
 .collapsible.popout {

From 6685ae4f39422489ca1ddfbf44a4d742f6c680b8 Mon Sep 17 00:00:00 2001
From: Geert Selderslaghs <geert@codemindit.com>
Date: Wed, 11 Dec 2024 14:19:57 +0100
Subject: [PATCH 3/3] fix(Collapsible) remove flex align since its breaking
 layout if we have a lot of text

---
 sass/components/_collapsible.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/sass/components/_collapsible.scss b/sass/components/_collapsible.scss
index 95cd0d10a1..2c106492c4 100644
--- a/sass/components/_collapsible.scss
+++ b/sass/components/_collapsible.scss
@@ -32,7 +32,6 @@
 
 .collapsible-header::after {
   content: '\e5cf';
-  align-self: flex-end;
   margin-left: .5rem;
   font-family: 'Material Symbols Outlined', 'Material Symbols Rounded', 'Material Symbols Sharp', 'Material Icons';
   font-size: 25px;