Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2024-10-27 20:44:07 +00:00
Code Issues Projects Releases Wiki Activity

(core) Fix dark mode on welcome pages

Browse Source 
Summary:
The welcome pages were unreadable because dark mode CSS was not
being applied.

Test Plan: Tested manually.

Reviewers: jarek

Reviewed By: jarek

Differential Revision: https://phab.getgrist.com/D3827
This commit is contained in:
George Gevoian 2023-03-20 10:25:17 -04:00
parent 327c78aa95
commit 210aa92eed
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/client/ui/WelcomePage.ts
View File

@ -12,7 +12,8 @@ import { cssMemberImage, cssMemberListItem, cssMemberPrimary,
cssMemberSecondary, cssMemberText } from 'app/client/ui/UserItem';
import { basicButtonLink, bigBasicButtonLink, bigPrimaryButton, bigPrimaryButtonLink,
cssButton } from "app/client/ui2018/buttons";
import { colors, mediaSmall, testId, vars } from "app/client/ui2018/cssVars";
import { mediaSmall, testId, theme, vars } from "app/client/ui2018/cssVars";
import { cssLink } from "app/client/ui2018/links";
import { getOrgName, Organization } from "app/common/UserAPI";
// Redirect from ..../welcome/thing to .../welcome/${name}
@ -92,13 +93,13 @@ export class WelcomePage extends Disposable {
'form',
{ method: "post", action: action.href },
handleSubmitForm(pending, () => _redirectToSiblingPage('verify')),
dom('p',
cssParagraph(
`Welcome Sumo-ling! ` + // This flow currently only used with AppSumo.
`Your Grist site is almost ready. Let's get your account set up and verified. ` +
`If you already have a Grist account as `,
dom('b', email.get()),
` you can just `,
dom('a', {href: getLoginUrl()}, 'log in'),
cssLink({href: getLoginUrl('')}, 'log in'),
` now. Otherwise, please pick a password.`
),
cssSeparatedLabel('The email address you activated Grist with:'),
@ -112,7 +113,7 @@ export class WelcomePage extends Disposable {
// for some reason.
cssInput(
email, { onInput: true, },
{ name: "email" },
{ name: "email", style: 'visibility: hidden;' },
dom.boolAttr('hidden', true),
dom.attr('type', 'email'),
),
@ -160,9 +161,9 @@ export class WelcomePage extends Disposable {
window.location.reload();
}
}),
dom('p',
cssParagraph(
`Please check your email for a 6-digit verification code, and enter it here.`),
dom('p',
cssParagraph(
`If you've any trouble, try our full set of sign-up options. Do take care to use ` +
`the email address you activated with: `,
dom('b', email.get())),
@ -183,7 +184,7 @@ export class WelcomePage extends Disposable {
'Apply verification code' : 'Resend verification email')
),
bigBasicButtonLink('More sign-up options',
{href: getSignupUrl()})
{href: getSignupUrl('')})
)
);
}
@ -265,7 +266,7 @@ const cssUserItem = styled('div', `
margin-top: 16px;
}
&:hover {
background-color: ${colors.lightGrey};
background-color: ${theme.lightHover};
}
`);
@ -300,7 +301,7 @@ const cssTitle = styled('div', `
height: 32px;
line-height: 32px;
margin: 0 0 28px 0;
color: ${colors.dark};
color: ${theme.text};
font-size: ${vars.xxxlargeFontSize};
font-weight: ${vars.headerControlTextWeight};
`);
@ -308,7 +309,7 @@ const cssTitle = styled('div', `
const textStyle = `
font-weight: normal;
font-size: ${vars.mediumFontSize};
color: ${colors.dark};
color: ${theme.text};
`;
// TODO: there's probably a much better way to style labels with a bit of