Reduce number of codes shown on mobile

src/OTPOutput.tsx

@@ -17,6 +17,8 @@ function OTPCode({code, delta}: { code: string; delta: number }) {
     'totp-newer': delta > 0,
     'totp-current': delta === 0,
     'totp-far': Math.abs(delta) > 5,
+    'totp-near-first': delta === -5,
+    'totp-near-last': delta === 5,
   })}>
     {code}
   </div>;

src/index.scss

@@ -83,3 +83,16 @@ nav {
     font-size: 2em;
   }
 }
+
+@include media-breakpoint-down(sm) {
+  .totp-code {
+    &.totp-far {
+      display: none;
+    }
+
+    &.totp-near-first, &.totp-near-last {
+      max-height: 0;
+      transform: scale(1, 0);
+    }
+  }
+}

src/main.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App.tsx';
 import './index.scss';
-import 'bootstrap/js/src/collapse.js';
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>