From a2ec08348c28d69b1122ace71de142f76f050278 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 13:35:29 +0800
Subject: [PATCH 1/8] Update breadcrumb icons

---
 packages/vue-components/src/Breadcrumb.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/vue-components/src/Breadcrumb.vue b/packages/vue-components/src/Breadcrumb.vue
index a760e08015..4487d18583 100644
--- a/packages/vue-components/src/Breadcrumb.vue
+++ b/packages/vue-components/src/Breadcrumb.vue
@@ -1,7 +1,10 @@
 <template>
   <div>
-    <nav aria-label="breadcrumb">
+    <nav aria-label="breadcrumb" class="breadcrumb-divider">
       <ol class="breadcrumb">
+        <li class="notlink">
+          >>&nbsp;
+        </li>
         <li
           v-for="(item, index) in items"
           :key="index"
@@ -80,4 +83,8 @@ export default {
     .notlink {
         color: #6d757d;
     }
+
+    .breadcrumb-divider {
+        --bs-breadcrumb-divider: '>';
+    }
 </style>

From a3ed488958464f05e331261e2e1634daee1427b3 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 13:38:58 +0800
Subject: [PATCH 2/8] Update tests

---
 .../__snapshots__/Breadcrumb.spec.js.snap     | 87 ++++++++++++++++++-
 1 file changed, 85 insertions(+), 2 deletions(-)

diff --git a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
index afbc15df00..8d9a8d3d25 100644
--- a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
+++ b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
@@ -4,10 +4,19 @@ exports[`Breadcrumb dropdown link from sitenav 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item"
@@ -43,10 +52,19 @@ exports[`Breadcrumb dropdown non-link from sitenav 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item notlink"
@@ -80,10 +98,20 @@ exports[`Breadcrumb empty breadcrumb 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
-    />
+    >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
+    </ol>
   </nav>
 </div>
 `;
@@ -92,10 +120,20 @@ exports[`Breadcrumb no sitenav 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
-    />
+    >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
+    </ol>
   </nav>
 </div>
 `;
@@ -104,10 +142,19 @@ exports[`Breadcrumb one link 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item"
@@ -129,10 +176,19 @@ exports[`Breadcrumb one link from sitenav 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item notlink"
@@ -154,10 +210,19 @@ exports[`Breadcrumb one non-link 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item notlink"
@@ -177,10 +242,19 @@ exports[`Breadcrumb two link 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item"
@@ -214,10 +288,19 @@ exports[`Breadcrumb two non-link 1`] = `
 <div>
   <nav
     aria-label="breadcrumb"
+    class="breadcrumb-divider"
   >
     <ol
       class="breadcrumb"
     >
+      <li
+        class="notlink"
+      >
+        
+        &gt;&gt; 
+      
+      </li>
+       
       <li
         aria-current="[object Object]"
         class="breadcrumb-item notlink"

From e0b82a0a1adf2cd53c8b85e6e41a1e32abb0b33e Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 15:54:28 +0800
Subject: [PATCH 3/8] Update breadcrumb icons

---
 packages/vue-components/src/Breadcrumb.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/vue-components/src/Breadcrumb.vue b/packages/vue-components/src/Breadcrumb.vue
index 4487d18583..c9b2b2d95a 100644
--- a/packages/vue-components/src/Breadcrumb.vue
+++ b/packages/vue-components/src/Breadcrumb.vue
@@ -3,7 +3,7 @@
     <nav aria-label="breadcrumb" class="breadcrumb-divider">
       <ol class="breadcrumb">
         <li class="notlink">
-          >>&nbsp;
+          [&nbsp;
         </li>
         <li
           v-for="(item, index) in items"
@@ -20,6 +20,9 @@
             {{ item.title }}
           </a>
         </li>
+        <li class="notlink">
+          &nbsp;]
+        </li>
       </ol>
     </nav>
   </div>
@@ -85,6 +88,6 @@ export default {
     }
 
     .breadcrumb-divider {
-        --bs-breadcrumb-divider: '>';
+        --bs-breadcrumb-divider: '|';
     }
 </style>

From 40eb70e5aa38497e12c2759391fb38593f210579 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 15:58:40 +0800
Subject: [PATCH 4/8] Update tests

---
 .../__snapshots__/Breadcrumb.spec.js.snap     | 92 ++++++++++++++++---
 1 file changed, 81 insertions(+), 11 deletions(-)

diff --git a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
index 8d9a8d3d25..ce0d7c3094 100644
--- a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
+++ b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
@@ -13,7 +13,7 @@ exports[`Breadcrumb dropdown link from sitenav 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -43,6 +43,14 @@ Link
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -61,7 +69,7 @@ exports[`Breadcrumb dropdown non-link from sitenav 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -89,6 +97,14 @@ Link
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -107,10 +123,17 @@ exports[`Breadcrumb empty breadcrumb 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
+      
+      </li>
+        
+      <li
+        class="notlink"
+      >
+        
+         ]
       
       </li>
-       
     </ol>
   </nav>
 </div>
@@ -129,10 +152,17 @@ exports[`Breadcrumb no sitenav 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
+      
+      </li>
+        
+      <li
+        class="notlink"
+      >
+        
+         ]
       
       </li>
-       
     </ol>
   </nav>
 </div>
@@ -151,7 +181,7 @@ exports[`Breadcrumb one link 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -167,6 +197,14 @@ exports[`Breadcrumb one link 1`] = `
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -185,7 +223,7 @@ exports[`Breadcrumb one link from sitenav 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -201,6 +239,14 @@ Link
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -219,7 +265,7 @@ exports[`Breadcrumb one non-link 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -233,6 +279,14 @@ exports[`Breadcrumb one non-link 1`] = `
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -251,7 +305,7 @@ exports[`Breadcrumb two link 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -279,6 +333,14 @@ exports[`Breadcrumb two link 1`] = `
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>
@@ -297,7 +359,7 @@ exports[`Breadcrumb two non-link 1`] = `
         class="notlink"
       >
         
-        &gt;&gt; 
+        [ 
       
       </li>
        
@@ -321,6 +383,14 @@ exports[`Breadcrumb two non-link 1`] = `
         
         </a>
       </li>
+       
+      <li
+        class="notlink"
+      >
+        
+         ]
+      
+      </li>
     </ol>
   </nav>
 </div>

From 1fdff7f1ddfb4755bc456231864e569a7d026c99 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 18:08:21 +0800
Subject: [PATCH 5/8] Change icons to arrows

---
 packages/vue-components/src/Breadcrumb.vue | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/packages/vue-components/src/Breadcrumb.vue b/packages/vue-components/src/Breadcrumb.vue
index c9b2b2d95a..6fc4205330 100644
--- a/packages/vue-components/src/Breadcrumb.vue
+++ b/packages/vue-components/src/Breadcrumb.vue
@@ -2,8 +2,8 @@
   <div>
     <nav aria-label="breadcrumb" class="breadcrumb-divider">
       <ol class="breadcrumb">
-        <li class="notlink">
-          [&nbsp;
+        <li class="notlink breadcrumb-marker">
+          >>&nbsp;&nbsp;
         </li>
         <li
           v-for="(item, index) in items"
@@ -20,9 +20,6 @@
             {{ item.title }}
           </a>
         </li>
-        <li class="notlink">
-          &nbsp;]
-        </li>
       </ol>
     </nav>
   </div>
@@ -88,6 +85,15 @@ export default {
     }
 
     .breadcrumb-divider {
-        --bs-breadcrumb-divider: '|';
+        --bs-breadcrumb-divider: '>';
+    }
+
+    /* Change font size to center arrows */
+    .breadcrumb-marker {
+        font-size: 15px;
+    }
+
+    .breadcrumb-item::before {
+        font-size: 15px;
     }
 </style>

From 05546efe90e227d45d93f4b5bce3fc1d01cd0db4 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 18:17:33 +0800
Subject: [PATCH 6/8] Update tests

---
 .../__snapshots__/Breadcrumb.spec.js.snap     | 110 ++++--------------
 1 file changed, 20 insertions(+), 90 deletions(-)

diff --git a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
index ce0d7c3094..99dc68ea0d 100644
--- a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
+++ b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
@@ -10,10 +10,10 @@ exports[`Breadcrumb dropdown link from sitenav 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -43,14 +43,6 @@ Link
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -66,10 +58,10 @@ exports[`Breadcrumb dropdown non-link from sitenav 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -97,14 +89,6 @@ Link
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -120,20 +104,13 @@ exports[`Breadcrumb empty breadcrumb 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
-      >
-        
-        [ 
-      
-      </li>
-        
-      <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-         ]
+        &gt;&gt;  
       
       </li>
+       
     </ol>
   </nav>
 </div>
@@ -149,20 +126,13 @@ exports[`Breadcrumb no sitenav 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
-      >
-        
-        [ 
-      
-      </li>
-        
-      <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-         ]
+        &gt;&gt;  
       
       </li>
+       
     </ol>
   </nav>
 </div>
@@ -178,10 +148,10 @@ exports[`Breadcrumb one link 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -197,14 +167,6 @@ exports[`Breadcrumb one link 1`] = `
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -220,10 +182,10 @@ exports[`Breadcrumb one link from sitenav 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -239,14 +201,6 @@ Link
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -262,10 +216,10 @@ exports[`Breadcrumb one non-link 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -279,14 +233,6 @@ exports[`Breadcrumb one non-link 1`] = `
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -302,10 +248,10 @@ exports[`Breadcrumb two link 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -333,14 +279,6 @@ exports[`Breadcrumb two link 1`] = `
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>
@@ -356,10 +294,10 @@ exports[`Breadcrumb two non-link 1`] = `
       class="breadcrumb"
     >
       <li
-        class="notlink"
+        class="notlink breadcrumb-marker"
       >
         
-        [ 
+        &gt;&gt;  
       
       </li>
        
@@ -383,14 +321,6 @@ exports[`Breadcrumb two non-link 1`] = `
         
         </a>
       </li>
-       
-      <li
-        class="notlink"
-      >
-        
-         ]
-      
-      </li>
     </ol>
   </nav>
 </div>

From cfc2354a18a21256fcaa874005dca9ebbda54738 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 20:15:13 +0800
Subject: [PATCH 7/8] Update breadcrumb separator

---
 packages/vue-components/src/Breadcrumb.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/vue-components/src/Breadcrumb.vue b/packages/vue-components/src/Breadcrumb.vue
index 6fc4205330..adf57aee47 100644
--- a/packages/vue-components/src/Breadcrumb.vue
+++ b/packages/vue-components/src/Breadcrumb.vue
@@ -3,7 +3,7 @@
     <nav aria-label="breadcrumb" class="breadcrumb-divider">
       <ol class="breadcrumb">
         <li class="notlink breadcrumb-marker">
-          >>&nbsp;&nbsp;
+          ››&nbsp;&nbsp;
         </li>
         <li
           v-for="(item, index) in items"
@@ -85,7 +85,7 @@ export default {
     }
 
     .breadcrumb-divider {
-        --bs-breadcrumb-divider: '>';
+        --bs-breadcrumb-divider: '›';
     }
 
     /* Change font size to center arrows */

From f6521cbd2b6fa4d1af6894b48dcff6870c928727 Mon Sep 17 00:00:00 2001
From: itsyme <e0524723@u.nus.edu>
Date: Mon, 3 Apr 2023 20:34:36 +0800
Subject: [PATCH 8/8] Update tests

---
 .../__snapshots__/Breadcrumb.spec.js.snap      | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
index 99dc68ea0d..0d7c49f499 100644
--- a/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
+++ b/packages/vue-components/src/__tests__/__snapshots__/Breadcrumb.spec.js.snap
@@ -13,7 +13,7 @@ exports[`Breadcrumb dropdown link from sitenav 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -61,7 +61,7 @@ exports[`Breadcrumb dropdown non-link from sitenav 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -107,7 +107,7 @@ exports[`Breadcrumb empty breadcrumb 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -129,7 +129,7 @@ exports[`Breadcrumb no sitenav 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -151,7 +151,7 @@ exports[`Breadcrumb one link 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -185,7 +185,7 @@ exports[`Breadcrumb one link from sitenav 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -219,7 +219,7 @@ exports[`Breadcrumb one non-link 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -251,7 +251,7 @@ exports[`Breadcrumb two link 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>
        
@@ -297,7 +297,7 @@ exports[`Breadcrumb two non-link 1`] = `
         class="notlink breadcrumb-marker"
       >
         
-        &gt;&gt;  
+        ››  
       
       </li>