src/accounts/SignIn.css

@@ -1,27 +0,0 @@
-.SignIn {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: 448px;
-
-  @media (max-width: 600px) {
-    & {
-      position: static;
-      height: 100vh;
-      width: 100%;
-      transform: none;
-      overflow: auto;
-    }
-  }
-
-  >.key-content {
-    height: 100%;
-
-    >form {
-      display: flex;
-      flex-flow: column;
-      gap: 16px;
-    }
-  }
-}

src/accounts/SignIn.tsx

@@ -18,7 +18,6 @@ import { createRestAPIClient } from "masto";
 import { getOrRegisterApp } from "./stores";
 import { useSearchParams } from "@solidjs/router";
 import { $settings } from "../settings/stores";
-import "./SignIn.css";
 
 type ErrorParams = {
   error: string;
@@ -37,6 +36,13 @@ const SignIn: Component = () => {
   const [targetSiteTitle, setTargetSiteTitle] = createSignal("");
 
   useDocumentTitle("Sign In");
+  css`
+    form {
+      display: flex;
+      flex-flow: column;
+      gap: 16px;
+    }
+  `;
 
   const serverUrl = () => {
     const url = rawServerUrl();
@@ -115,19 +121,19 @@ const SignIn: Component = () => {
   };
 
   return (
-    <main class="SignIn">
+    <div class={cards.layoutCentered}>
       <Show when={params.error || params.errorDescription}>
         <div class={cards.card} style={{ "margin-bottom": "20px" }}>
           <p>Authorization is failed.</p>
           <p>{params.errorDescription}</p>
           <p>
-            Please try again later. If the problem persists, you can ask for
+            Please try again later. If the problem persist, you can seek for
             help from the server administrator.
           </p>
         </div>
       </Show>
       <div
-        class={`${cards.card} key-content`}
+        class={/*once*/ cards.card}
         aria-busy={currentState() !== "inactive" ? "true" : "false"}
         aria-describedby={
           currentState() !== "inactive" ? progressId : undefined
@@ -163,7 +169,7 @@ const SignIn: Component = () => {
           </div>
         </form>
       </div>
-    </main>
+    </div>
   );
 };
 

src/platform/StackedRouter.tsx

@@ -1,4 +1,5 @@
 import {
+  Router,
   type RouterProps,
   type StaticRouterProps,
   createRouter,
@@ -15,6 +16,9 @@ import {
   useContext,
   onCleanup,
   type Accessor,
+  children,
+  createSignal,
+  createRoot,
 } from "solid-js";
 import { createStore, unwrap } from "solid-js/store";
 import "./StackedRouter.css";
@@ -574,11 +578,7 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
   createRenderEffect(() =>
     untrack(() => {
       if (stack.length === 0) {
-        const parts = [window.location.pathname] as string[];
+        pushFrame(window.location.pathname, {
-        if (window.location.search) {
-          parts.push(window.location.search);
-        }
-        pushFrame(parts.join(""), {
           replace: "all",
         });
       }

src/settings/Settings.tsx

@@ -163,7 +163,7 @@ const Settings: Component = () => {
       }>,
     () => import(`./i18n/generic.json`),
   );
-  const { pop, push } = useNavigator();
+  const { pop } = useNavigator();
   const settings$ = useStore($settings);
   const { needRefresh } = useServiceWorker();
   const dateFnLocale = useDateFnLocale();
@@ -172,10 +172,6 @@ const Settings: Component = () => {
 
   const doSignOut = (acct: Account) => {
     signOut((a) => a.site === acct.site && a.accessToken === acct.accessToken);
-
-    if (profiles().length == 0) {
-      push("/accounts/sign-in", { replace: "all" });
-    }
   };
 
   css`