fix: scroll on refresh (#1118)

Author: jer3m01

app.config.ts

@@ -71,6 +71,11 @@ export default defineConfig(
 					themes: ["min-light", "material-theme-ocean"],
 					themeCssSelector: (theme) => `[data-theme="${theme.type}"]`,
 					frames: false,
+					styleOverrides: {
+						twoSlash: {
+							cursorColor: "var(--twoslash-cursor)",
+						},
+					},
 				},
 				toc: {
 					minDepth: 2,

src/routes/solid-meta/reference/meta/title.mdx

@@ -15,7 +15,7 @@ import { Title } from "@solidjs/meta";
 
 ### Setting the title for your site
 
-```tsx twoslash filename="root.tsx" {5}
+```tsx twoslash title="root.tsx" {5}
 import { MetaProvider, Title } from "@solidjs/meta";
 export default function Root() {
 	return (

src/routes/solid-start/advanced/request-events.mdx

@@ -11,7 +11,7 @@ SolidStart uses `event.locals` to pass around a local context where needed.
 
 When adding fields to `event.locals`, the fields can be typed:
 
-```tsx filename="global.d.ts'
+```tsx title="global.d.ts"
 /// <reference types="@solidjs/start/env" />
 declare module App {
   interface RequestEventLocals {

src/routes/solid-start/building-your-application/routing.mdx

@@ -43,7 +43,7 @@ Without this, you could see some unexpected hydration errors.
 `<FileRoutes />` will generate a route for each file in the `routes` directory and its subdirectories. For a route to be rendered as a page, it must default export a component.
 This component represents the content that will be rendered when users visit the page:
 
-```tsx filename="routes/index.tsx"
+```tsx title="routes/index.tsx"
 export default function Index() {
 	return <div>Welcome to my site!</div>;
 }
@@ -91,7 +91,7 @@ by using `props.children` in the layout.
 
 <TabsCodeBlocks>
   <div id="ts">
-```tsx filename="routes/blog.tsx" title="blog.tsx"
+```tsx title="routes/blog.tsx"
 import { RouteSectionProps } from "@solidjs/router";
 
 export default function BlogLayout(props: RouteSectionProps) {
@@ -100,7 +100,7 @@ export default function BlogLayout(props: RouteSectionProps) {
 ```
    </div>
    <div id="js">
- ```jsx filename="routes/blog.jsx" title="blog.tsx"
+ ```jsx title="routes/blog.jsx"
 export default function BlogLayout(props) {
 	return <div>{props.children}</div>;
 }

src/styles.css

@@ -18,7 +18,6 @@
 
 	html,
 	.custom-scrollbar {
-		scroll-behavior: smooth;
 		scroll-padding-top: 6rem;
 
 		scrollbar-color: #778292 #e7ecf2;
@@ -127,4 +126,13 @@
 /* pace from solidbase */
 :root {
 	--bprogress-color: theme('colors.blue.500') !important;
+}
+
+/* twoslash from solidbase */
+html {
+	--twoslash-cursor: #24292E;
+}
+
+html[data-theme="dark"] {
+	--twoslash-cursor: #BABED8;
 }

src/ui/page-issue-link.tsx

@@ -1,4 +1,4 @@
-import { Component, createMemo } from "solid-js";
+import { Component, createMemo, createSignal, onMount } from "solid-js";
 import { Icon } from "solid-heroicons";
 import { exclamationTriangle } from "solid-heroicons/outline";
 import { useI18n } from "~/i18n/i18n-context";
@@ -7,6 +7,10 @@ import { getEntryFileName } from "~/i18n/helpers";
 export const PageIssueLink: Component = () => {
 	const i18n = useI18n();
 
+	const [mounted, setMounted] = createSignal(false);
+	
+	onMount(() => setMounted(true));
+
 	const srcPath = createMemo(() => {
 		return (
 			"https://github.com/solidjs/solid-docs-next/issues/new" +
@@ -16,7 +20,7 @@ export const PageIssueLink: Component = () => {
 			"&template=CONTENT.yml" +
 			"&title=[Content]:" +
 			`&subject=${getEntryFileName()}` +
-			`&page=${window.location.href}`
+			`&page=${mounted() ? window.location.href : ""}`
 		);
 	});