Skip to content

Commit 297e12f

Browse files
author
sw-yx
committed
namespace styles and remove unused
1 parent 43bbe7b commit 297e12f

File tree

8 files changed

+86
-303
lines changed

8 files changed

+86
-303
lines changed

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ function AuthStatusView() {
4343
return (
4444
<div>
4545
<div>
46-
<button className="btn" onClick={() => setDialog(true)}>
46+
<button className="RNIW_btn" onClick={() => setDialog(true)}>
4747
{isLoggedIn ? `Hello ${name}, Log out here!` : 'Log In'}
4848
</button>
4949
</div>

src/app.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ function LoggedOutScreen(props: AuthProps) {
1515
return (
1616
<div>
1717
<Tabs defaultIndex={0}>
18-
<TabList className="header">
19-
<Tab className="btn btnHeader">Login</Tab>
20-
<Tab className="btn btnHeader">Sign Up</Tab>
18+
<TabList className="RNIW_header">
19+
<Tab className="RNIW_btn RNIW_btnHeader">Login</Tab>
20+
<Tab className="RNIW_btn RNIW_btnHeader">Sign Up</Tab>
2121
</TabList>
2222

2323
<TabPanels>

src/components/login.tsx

+8-8
Original file line numberDiff line numberDiff line change
@@ -29,35 +29,35 @@ export function Login({ onLogin }: LoginProps) {
2929
.catch((err) => void console.error(err) || setMsg('Error: ' + err.message))
3030
}}
3131
>
32-
<div className="formGroup" key="email">
32+
<div className="RNIW_formGroup" key="email">
3333
<label>
3434
<VisuallyHidden>Enter your email</VisuallyHidden>
3535
<input
36-
className="formControl"
36+
className="RNIW_formControl"
3737
type="email"
3838
name="email"
3939
placeholder="Email"
4040
autoCapitalize="off"
4141
required={true}
4242
/>
43-
<div className="inputFieldIcon inputFieldEmail" />
43+
<div className="RNIW_inputFieldIcon RNIW_inputFieldEmail" />
4444
</label>
4545
</div>
46-
<div className="formGroup" key="password">
46+
<div className="RNIW_formGroup" key="password">
4747
<label>
4848
<VisuallyHidden>Enter your password</VisuallyHidden>
49-
<input className="formControl" type="password" name="password" placeholder="Password" required={true} />
50-
<div className="inputFieldIcon inputFieldPassword" />
49+
<input className="RNIW_formControl" type="password" name="password" placeholder="Password" required={true} />
50+
<div className="RNIW_inputFieldIcon RNIW_inputFieldPassword" />
5151
</label>
5252
</div>
5353

5454
<div>
55-
<button type="submit" className={isLoading ? 'btn saving' : 'btn'}>
55+
<button type="submit" className={isLoading ? 'RNIW_btn RNIW_saving' : 'RNIW_btn'}>
5656
Log in
5757
</button>
5858
{msg && <pre style={{ background: 'salmon', padding: 10 }}>{msg}</pre>}
5959
</div>
60-
<button type="button" className="btnLink forgotPasswordLink">
60+
<button type="button" className="RNIW_btnLink forgotPasswordLink">
6161
Forgot password?
6262
</button>
6363
</form>

src/components/logout.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,15 @@ export function Logout({ onLogout }: LogoutProps) {
2121
.catch((err) => void console.error(err) || setMsg('Error: ' + err.message))
2222
return (
2323
<>
24-
<div className="header">
25-
<button className="btn btnHeader active">Logged in</button>
24+
<div className="RNIW_header">
25+
<button className="RNIW_btn RNIW_btnHeader active">Logged in</button>
2626
</div>
2727
<form className="form ">
28-
<p className="infoText">
28+
<p className="RNIW_infoText">
2929
Logged in as <br />
30-
<span className="infoTextEmail">{name}</span>
30+
<span className="RNIW_infoTextEmail">{name}</span>
3131
</p>
32-
<button type="submit" className={isLoading ? 'btn saving' : 'btn'} onClick={logout}>
32+
<button type="submit" className={isLoading ? 'RNIW_btn RNIW_saving' : 'RNIW_btn'} onClick={logout}>
3333
Log out
3434
</button>
3535
{msg && <pre style={{ background: 'salmon', padding: 10 }}>{msg}</pre>}

src/components/providers.tsx

+10-10
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,28 @@
1-
import React from "react"
2-
import { Settings, useIdentityContext } from "react-netlify-identity"
1+
import React from 'react'
2+
import { Settings, useIdentityContext } from 'react-netlify-identity'
33

44
export function Providers() {
55
const { settings } = useIdentityContext()
66
const hasProviders = Object.entries(settings.external).some(
7-
([k, v]) => ["github", "gitlab", "bitbucket", "google"].includes(k) && v
7+
([k, v]) => ['github', 'gitlab', 'bitbucket', 'google'].includes(k) && v,
88
)
99
if (!hasProviders) return null
1010
let isLocalhost = false
11-
if (typeof window !== "undefined") {
11+
if (typeof window !== 'undefined') {
1212
isLocalhost = Boolean(
13-
window.location.hostname === "localhost" ||
13+
window.location.hostname === 'localhost' ||
1414
// [::1] is the IPv6 localhost address.
15-
window.location.hostname === "[::1]" ||
15+
window.location.hostname === '[::1]' ||
1616
// 127.0.0.1/8 is considered localhost for IPv4.
17-
window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
17+
window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/),
1818
)
1919
}
2020
return (
2121
<div className="providersGroup">
2222
{isLocalhost && (
2323
<pre>⚠️Testing providers on localhost won't work because OAuth redirects to your production site</pre>
2424
)}
25-
<hr className="hr" />
25+
<hr className="RNIW_hr" />
2626
<ProviderButton settings={settings} provider="Google" />
2727
<ProviderButton settings={settings} provider="GitHub" />
2828
<ProviderButton settings={settings} provider="GitLab" />
@@ -38,9 +38,9 @@ function ProviderButton({ settings, provider }: { settings: Settings; provider:
3838
const ext = settings.external as Dict<{}>
3939
if (!ext[provider.toLowerCase()]) return null
4040
const { loginProvider } = useIdentityContext()
41-
const click = () => loginProvider(provider.toLowerCase() as "github" | "gitlab" | "bitbucket" | "google")
41+
const click = () => loginProvider(provider.toLowerCase() as 'github' | 'gitlab' | 'bitbucket' | 'google')
4242
return (
43-
<button onClick={click} className={`provider${provider} btn btnProvider`}>
43+
<button onClick={click} className={`provider${provider} RNIW_btn RNIW_btnProvider`}>
4444
Continue with {provider}
4545
</button>
4646
)

src/components/signup.tsx

+10-10
Original file line numberDiff line numberDiff line change
@@ -33,44 +33,44 @@ export function Signup({ onSignup }: SignupProps) {
3333
signup()
3434
}}
3535
>
36-
<div className="formGroup" key="username">
36+
<div className="RNIW_formGroup" key="username">
3737
<label>
3838
<VisuallyHidden>Enter your name</VisuallyHidden>
3939
<input
4040
id="username"
41-
className="formControl"
41+
className="RNIW_formControl"
4242
type="name"
4343
name="username"
4444
placeholder="Name"
4545
autoCapitalize="off"
4646
required={true}
4747
/>
48-
<div className="inputFieldIcon inputFieldName" />
48+
<div className="RNIW_inputFieldIcon RNIW_inputFieldName" />
4949
</label>
5050
</div>
51-
<div className="formGroup" key="email">
51+
<div className="RNIW_formGroup" key="email">
5252
<label>
5353
<VisuallyHidden>Enter your email</VisuallyHidden>
5454
<input
55-
className="formControl"
55+
className="RNIW_formControl"
5656
type="email"
5757
name="email"
5858
placeholder="Email"
5959
autoCapitalize="off"
6060
required={true}
6161
/>
62-
<div className="inputFieldIcon inputFieldEmail" />
62+
<div className="RNIW_inputFieldIcon RNIW_inputFieldEmail" />
6363
</label>
6464
</div>
65-
<div className="formGroup" key="password">
65+
<div className="RNIW_formGroup" key="password">
6666
<label>
6767
<VisuallyHidden>Enter your password</VisuallyHidden>
68-
<input className="formControl" type="password" name="password" placeholder="Password" required={true} />
69-
<div className="inputFieldIcon inputFieldPassword" />
68+
<input className="RNIW_formControl" type="password" name="password" placeholder="Password" required={true} />
69+
<div className="RNIW_inputFieldIcon RNIW_inputFieldPassword" />
7070
</label>
7171
</div>
7272
<div>
73-
<button type="submit" className={isLoading ? 'btn saving' : 'btn'}>
73+
<button type="submit" className={isLoading ? 'RNIW_btn RNIW_saving' : 'RNIW_btn'}>
7474
Sign Up
7575
</button>
7676
{msg && <pre style={{ background: 'salmon', padding: 10 }}>{msg}</pre>}

src/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ export function IdentityModal({ showDialog, onCloseDialog, ...authprops }: Modal
3232
maxWidth: 400,
3333
}}
3434
>
35-
<button className="btn btnClose" onClick={onCloseDialog}>
35+
<button className="RNIW_btn RNIW_btnClose" onClick={onCloseDialog}>
3636
<VisuallyHidden>Close</VisuallyHidden>
3737
</button>
3838
<Widget {...authprops} />

0 commit comments

Comments
 (0)