Fix modals with horizontal form components.

Fix invite / friends menu having sidebars.

src/components/ui/Modal.tsx

@@ -55,6 +55,11 @@ const ModalContent = styled.div<{ [key in 'attachment' | 'noBackground' | 'borde
         margin-top: 0;
     }
 
+    form {
+        display: flex;
+        flex-direction: column;
+    }
+
     ${ props => !props.noBackground && css`
         background: var(--secondary-header);
     ` }

src/context/intermediate/modals/Input.tsx

@@ -54,6 +54,7 @@ export function InputModal({
             ]}
             onClose={onClose}
         >
+            <form>
                 { field ? <Overline error={error} block>
                     {field}
                 </Overline> : (error && <Overline error={error} type="error" block />) }
@@ -61,6 +62,7 @@ export function InputModal({
                     value={value}
                     onChange={e => setValue(e.currentTarget.value)}
                 />
+            </form>
         </Modal>
     );
 }

src/pages/RevoltApp.tsx

@@ -34,14 +34,15 @@ const Routes = styled.div`
 export default function App() {
     const path = useLocation().pathname;
     const fixedBottomNav = (path === '/' || path === '/settings' || path.startsWith("/friends"));
-    const inSettings = path === '/settings';
+    const inSettings = path.includes('/settings');
     const inChannel = path.includes('/channel');
+    const inSpecial = path.startsWith('/invite') || path.startsWith("/friends") || path.startsWith("/settings");
 
     return (
         <OverlappingPanels
             width="100vw"
             height="100vh"
-            leftPanel={inSettings ? undefined : { width: 292, component: <LeftSidebar /> }}
+            leftPanel={inSpecial ? undefined : { width: 292, component: <LeftSidebar /> }}
             rightPanel={(!inSettings && inChannel) ? { width: 240, component: <RightSidebar /> } : undefined}
             bottomNav={{
                 component: <BottomNavigation />,

src/pages/settings/server/Panes.module.scss

@@ -81,6 +81,7 @@
     .overview {
         height: 85vh; //TOFIX change later
         display: flex;
+        
         .list {
             overflow-y: scroll;
         }