fix: Update Expensify Help version badges to look like badges

Author: daledah

docs/_sass/_main.scss

@@ -1125,6 +1125,17 @@ button {
     line-height: 16px;
 }
 
+#platform-tabs > .badge{
+    border-style: solid;
+    border-width: 2px;
+    border-color: var(--color-borders); 
+    background-color: transparent;
+    border-radius: 4px;
+    text-align: center;
+    cursor: unset;
+    padding: 8px 12px;
+}
+
 #platform-tabs > .active {
     color: var(--color-text);
     background-color: var(--color-button-background);

docs/assets/js/main.js

@@ -236,7 +236,7 @@ mobileBreakpoint.addEventListener('change', handleBreakpointChange);
 handleBreakpointChange();
 
 function selectNewExpensify(newExpensifyTab, newExpensifyContent, expensifyClassicTab, expensifyClassicContent) {
-    newExpensifyTab.classList.add('active');
+    newExpensifyTab.classList.add(!expensifyClassicTab && !expensifyClassicContent ? 'badge' : 'active');
     newExpensifyContent.classList.remove('hidden');
 
     if (expensifyClassicTab && expensifyClassicContent) {
@@ -250,7 +250,7 @@ function selectNewExpensify(newExpensifyTab, newExpensifyContent, expensifyClass
 }
 
 function selectExpensifyClassic(newExpensifyTab, newExpensifyContent, expensifyClassicTab, expensifyClassicContent) {
-    expensifyClassicTab.classList.add('active');
+    expensifyClassicTab.classList.add(!newExpensifyContent && !newExpensifyTab ? 'badge' : 'active');
     expensifyClassicContent.classList.remove('hidden');
 
     if (newExpensifyTab && newExpensifyContent) {

docs/assets/js/platform-tabs.js

@@ -13,7 +13,12 @@ if (expensifyClassicContent || showExpensifyClassicBadge) {
     const tab = document.createElement('div');
     tab.innerHTML = 'Expensify Classic';
     tab.id = 'platform-tab-expensify-classic';
-    tab.classList.add('active');
+    if (!newExpensifyContent) {
+        tab.classList.toggle('badge');
+    } else {
+        console.log('here 1');
+        tab.classList.toggle('active');
+    }
     platformTabs.appendChild(tab);
 }
 
@@ -22,13 +27,17 @@ if (path.length >= 3 && path[2] == 'new-expensify') {
     showNewExpensifyBadge = true;
 }
 
+console.log(newExpensifyContent, expensifyClassicContent);
+
 if (newExpensifyContent || showNewExpensifyBadge) {
     const tab = document.createElement('div');
     tab.innerHTML = 'New Expensify';
     tab.id = 'platform-tab-new-expensify';
-
     if (!expensifyClassicContent) {
-        tab.classList.add('active');
+        tab.classList.toggle('badge');
+    } else {
+        console.log('here 2');
+        tab.classList.toggle('active');
     }
     platformTabs.appendChild(tab);
 }