Improved UX for self-hosted users

This commit is contained in:
Alicia Sykes 2024-05-06 23:30:09 +01:00
parent 42d6e0394f
commit 390b8b9df7
6 changed files with 22 additions and 33 deletions

View File

@ -1,16 +1,19 @@
---
const isBossServer = import.meta.env.BOSS_SERVER === 'true';
---
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
<title>Results</title>
<meta charset="UTF-8">
{!isBossServer && (
<meta http-equiv="refresh" content="0; url=/check" />
<script type="text/javascript">window.location.href = '/check';</script>
)}
</head>
<body>
<h1>TODO: Web Check</h1>
<h1>hi</h1>
</body>
</html>

View File

@ -1,16 +0,0 @@
---
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
</head>
<body>
<h1>TEST</h1>
</body>
</html>

View File

@ -15,6 +15,7 @@ interface ButtonProps {
fgColor?: string,
styles?: string,
title?: string,
type?: 'button' | 'submit' | 'reset' | undefined,
loadState?: LoadState,
};
@ -67,7 +68,7 @@ const Loader = (props: { loadState: LoadState }) => {
};
const Button = (props: ButtonProps): JSX.Element => {
const { children, size, bgColor, fgColor, onClick, styles, title, loadState } = props;
const { children, size, bgColor, fgColor, onClick, styles, title, loadState, type } = props;
return (
<StyledButton
onClick={onClick || (() => null) }
@ -76,6 +77,7 @@ const Button = (props: ButtonProps): JSX.Element => {
fgColor={fgColor}
styles={styles}
title={title?.toString()}
type={type || 'button'}
>
{ loadState && <Loader loadState={loadState} /> }
{children}

View File

@ -50,7 +50,7 @@ const Footer = (props: { isFixed?: boolean }): JSX.Element => {
View source at <Link href={githubUrl}>github.com/lissy93/web-check</Link>
</span>
<span>
<Link href="/about">Web-Check</Link> is
<Link href="/check/about">Web-Check</Link> is
licensed under <Link href={licenseUrl}>MIT</Link> -
© <Link href={authorUrl}>Alicia Sykes</Link> 2023
</span>

View File

@ -214,7 +214,7 @@ const Home = (): JSX.Element => {
/>
{/* <FindIpButton onClick={findIpAddress}>Or, find my IP</FindIpButton> */}
{ errorMsg && <ErrorMessage>{errorMsg}</ErrorMessage>}
<Button styles="width: calc(100% - 1rem);" size="large" onClick={submit}>Analyze!</Button>
<Button type="submit" styles="width: calc(100% - 1rem);" size="large" onClick={submit}>Analyze!</Button>
</UserInputMain>
<SponsorCard>
<Heading as="h2" size="small" color={colors.primary}>Sponsored by</Heading>
@ -243,7 +243,7 @@ const Home = (): JSX.Element => {
<Heading as="h2" size="small" color={colors.primary}>Supported Checks</Heading>
<ul>
{docs.map((doc, index) => (<li key={index}>{doc.title}</li>))}
<li><a href="/about">+ more!</a></li>
<li><a href="/check/about">+ more!</a></li>
</ul>
</div>
<div className="links">

View File

@ -909,8 +909,8 @@ const Results = (props: { address?: string } ): JSX.Element => {
<div className="control-options">
<span className="toggle-filters" onClick={() => setShowFilters(true)}>Show Filters</span>
<a href="#view-download-raw-data"><span className="toggle-filters">Export Data</span></a>
<a href="/about"><span className="toggle-filters">Learn about the Results</span></a>
<a href="/about#additional-resources"><span className="toggle-filters">More tools</span></a>
<a href="/check/about"><span className="toggle-filters">Learn about the Results</span></a>
<a href="/check/about#additional-resources"><span className="toggle-filters">More tools</span></a>
<a target="_blank" rel="noreferrer" href="https://github.com/lissy93/web-check"><span className="toggle-filters">View GitHub</span></a>
</div>
) }