Skip to content

Commit a85bdc2

Browse files
SgtPookiSgtPooki
authored
Revert "feat: add dark mode (#2322)" (#2339)
This reverts commit d751fc6.
1 parent 830a30d commit a85bdc2

18 files changed

Lines changed: 92 additions & 411 deletions

File tree

‎.storybook/preview.js‎

Lines changed: 11 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -9,27 +9,24 @@ import getStore from '../src/bundles/index.js'
99
import i18n from '../src/i18n.js'
1010
import DndBackend from '../src/lib/dnd-backend.js'
1111
import { HeliaProvider, ExploreProvider } from 'ipld-explorer-components/providers'
12-
import { ThemeProvider } from '../src/context/theme-provider.tsx'
1312

1413
/**
1514
* @type {import('@storybook/addons').BaseAnnotations}
1615
*/
1716
const baseAnnotations = {
1817
decorators: [
1918
(Story) => (
20-
<ThemeProvider>
21-
<Provider store={getStore(undefined)}>
22-
<I18nextProvider i18n={i18n} >
23-
<DndProvider backend={DndBackend}>
24-
<HeliaProvider>
25-
<ExploreProvider>
26-
<Story />
27-
</ExploreProvider>
28-
</HeliaProvider>
29-
</DndProvider>
30-
</I18nextProvider>
31-
</Provider>
32-
</ThemeProvider>
19+
<Provider store={getStore(undefined)}>
20+
<I18nextProvider i18n={i18n} >
21+
<DndProvider backend={DndBackend}>
22+
<HeliaProvider>
23+
<ExploreProvider>
24+
<Story />
25+
</ExploreProvider>
26+
</HeliaProvider>
27+
</DndProvider>
28+
</I18nextProvider>
29+
</Provider>
3330
)
3431
],
3532
/**

‎src/App.js‎

Lines changed: 34 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,6 @@ import Notify from './components/notify/Notify.js'
1818
import Connected from './components/connected/Connected.js'
1919
import TourHelper from './components/tour/TourHelper.js'
2020
import FilesExploreForm from './files/explore-form/files-explore-form.tsx'
21-
import { ThemeProvider, ThemeContext } from './context/theme-provider.tsx'
22-
import { ThemeToggle } from './components/theme-toggle/toggle.tsx'
2321

2422
export class App extends Component {
2523
static propTypes = {
@@ -34,8 +32,6 @@ export class App extends Component {
3432
isOver: PropTypes.bool.isRequired
3533
}
3634

37-
static contextType = ThemeContext
38-
3935
constructor (props) {
4036
super(props)
4137
props.doSetupLocalStorage()
@@ -67,49 +63,44 @@ export class App extends Component {
6763
render () {
6864
const { t, route: Page, ipfsReady, doFilesNavigateTo, routeInfo: { url }, connectDropTarget, canDrop, isOver, showTooltip } = this.props
6965
return connectDropTarget(
70-
<div>
71-
<ThemeProvider>
72-
{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
73-
<div className='sans-serif h-100 relative' onClick={getNavHelper(this.props.doUpdateUrl)}>
74-
{/* Tinted overlay that appears when dragging and dropping an item */}
75-
{ canDrop && isOver && <div className='h-100 top-0 right-0 fixed appOverlay' style={{ background: 'rgba(99, 202, 210, 0.2)' }} /> }
76-
<div className='flex flex-row-reverse-l flex-column-reverse justify-end justify-start-l' style={{ minHeight: '100vh' }}>
77-
<div className='flex-auto-l'>
78-
<div className='flex items-center ph3 ph4-l webui-header' style={{ WebkitAppRegion: 'drag', height: 75, background: '#F0F6FA', paddingTop: '20px', paddingBottom: '15px' }}>
79-
<div className='joyride-app-explore' style={{ width: 560 }}>
80-
<FilesExploreForm onBrowse={doFilesNavigateTo} />
81-
</div>
82-
<div className='dn flex-ns flex-auto items-center justify-end'>
83-
<TourHelper />
84-
<Connected className='joyride-app-status' />
85-
<div className='pa3'>
86-
<ThemeToggle />
87-
</div>
88-
</div>
89-
</div>
90-
<main className='bg-white pv3 pa3 pa4-l'>
91-
{ (ipfsReady || url === '/welcome' || url.startsWith('/settings'))
92-
? <Page />
93-
: <ComponentLoader />
94-
}
95-
</main>
66+
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
67+
<div className='sans-serif h-100 relative' onClick={getNavHelper(this.props.doUpdateUrl)}>
68+
{/* Tinted overlay that appears when dragging and dropping an item */}
69+
{ canDrop && isOver && <div className='h-100 top-0 right-0 fixed appOverlay' style={{ background: 'rgba(99, 202, 210, 0.2)' }} /> }
70+
<div className='flex flex-row-reverse-l flex-column-reverse justify-end justify-start-l' style={{ minHeight: '100vh' }}>
71+
<div className='flex-auto-l'>
72+
<div className='flex items-center ph3 ph4-l' style={{ WebkitAppRegion: 'drag', height: 75, background: '#F0F6FA', paddingTop: '20px', paddingBottom: '15px' }}>
73+
<div className='joyride-app-explore' style={{ width: 560 }}>
74+
<FilesExploreForm onBrowse={doFilesNavigateTo} />
9675
</div>
97-
<div className='navbar-container flex-none-l bg-navy'>
98-
<NavBar />
76+
<div className='dn flex-ns flex-auto items-center justify-end'>
77+
<TourHelper />
78+
<Connected className='joyride-app-status' />
9979
</div>
10080
</div>
101-
<ReactJoyride
102-
run={showTooltip}
103-
steps={appTour.getSteps({ t })}
104-
styles={appTour.styles}
105-
callback={this.handleJoyrideCb}
106-
scrollToFirstStep
107-
disableOverlay
108-
locale={getJoyrideLocales(t)}
109-
/>
110-
<Notify />
81+
<main className='bg-white pv3 pa3 pa4-l'>
82+
{ (ipfsReady || url === '/welcome' || url.startsWith('/settings'))
83+
? <Page />
84+
: <ComponentLoader />
85+
}
86+
</main>
87+
</div>
88+
<div className='navbar-container flex-none-l bg-navy'>
89+
<NavBar />
11190
</div>
112-
</ThemeProvider>
91+
</div>
92+
93+
<ReactJoyride
94+
run={showTooltip}
95+
steps={appTour.getSteps({ t })}
96+
styles={appTour.styles}
97+
callback={this.handleJoyrideCb}
98+
scrollToFirstStep
99+
disableOverlay
100+
locale={getJoyrideLocales(t)}
101+
/>
102+
103+
<Notify />
113104
</div>
114105
)
115106
}

‎src/components/api-address-form/ApiAddressForm.js‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,12 @@ import { connect } from 'redux-bundler-react'
33
import { withTranslation } from 'react-i18next'
44
import Button from '../button/button.tsx'
55
import { checkValidAPIAddress } from '../../bundles/ipfs-provider.js'
6-
import { useTheme } from '../../hooks/theme'
76

87
const ApiAddressForm = ({ t, doUpdateIpfsApiAddress, ipfsApiAddress, ipfsInitFailed }) => {
98
const [value, setValue] = useState(asAPIString(ipfsApiAddress))
109
const initialIsValidApiAddress = !checkValidAPIAddress(value)
1110
const [showFailState, setShowFailState] = useState(initialIsValidApiAddress || ipfsInitFailed)
1211
const [isValidApiAddress, setIsValidApiAddress] = useState(initialIsValidApiAddress)
13-
const { isDarkTheme } = useTheme()
1412

1513
// Updates the border of the input to indicate validity
1614
useEffect(() => {
@@ -48,14 +46,12 @@ const ApiAddressForm = ({ t, doUpdateIpfsApiAddress, ipfsApiAddress, ipfsInitFai
4846
onChange={onChange}
4947
onKeyPress={onKeyPress}
5048
value={value}
51-
style={{ background: isDarkTheme ? 'var(--filter-peers-dark)' : '', border: isDarkTheme ? '0.4px solid var(--border-color)' : '' }}
5249
/>
5350
<div className='tr'>
5451
<Button
5552
minWidth={100}
5653
height={40}
5754
className='mt2 mt0-l ml2-l tc'
58-
style={{ background: isDarkTheme ? 'var(--input-btn-bg)' : '' }}
5955
disabled={!isValidApiAddress || value === ipfsApiAddress}>
6056
{t('actions.submit')}
6157
</Button>

‎src/components/box/Box.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,14 @@
11
import React from 'react'
2-
import { useTheme } from '../../hooks/theme'
32
import ErrorBoundary from '../error/ErrorBoundary.js'
43

54
export const Box = ({
65
className = 'pa4',
76
style,
8-
themed,
97
children,
108
...props
119
}) => {
12-
const { isDarkTheme } = useTheme()
1310
return (
14-
<section className={className} style={{ background: isDarkTheme ? 'var(--element-bg)' : 'var(--element-bg-light)', ...style }}>
11+
<section className={className} style={{ background: '#fbfbfb', ...style }}>
1512
<ErrorBoundary>
1613
{children}
1714
</ErrorBoundary>

‎src/components/public-gateway-form/PublicGatewayForm.js‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,13 @@ import { connect } from 'redux-bundler-react'
33
import { withTranslation } from 'react-i18next'
44
import Button from '../button/button.tsx'
55
import { checkValidHttpUrl, checkViaImgSrc, DEFAULT_PATH_GATEWAY } from '../../bundles/gateway.js'
6-
import { useTheme } from '../../hooks/theme'
76

87
const PublicGatewayForm = ({ t, doUpdatePublicGateway, publicGateway }) => {
98
const [value, setValue] = useState(publicGateway)
109
const initialIsValidGatewayUrl = !checkValidHttpUrl(value)
1110
const [showFailState, setShowFailState] = useState(initialIsValidGatewayUrl)
1211
const [isValidGatewayUrl, setIsValidGatewayUrl] = useState(initialIsValidGatewayUrl)
13-
const { isDarkTheme } = useTheme()
12+
1413
// Updates the border of the input to indicate validity
1514
useEffect(() => {
1615
setShowFailState(!isValidGatewayUrl)
@@ -61,7 +60,6 @@ const PublicGatewayForm = ({ t, doUpdatePublicGateway, publicGateway }) => {
6160
onChange={onChange}
6261
onKeyPress={onKeyPress}
6362
value={value}
64-
style={{ background: isDarkTheme ? 'var(--filter-peers-dark)' : '', border: isDarkTheme ? '0.4px solid var(--border-color)' : '' }}
6563
/>
6664
<div className='tr'>
6765
<Button
@@ -70,7 +68,6 @@ const PublicGatewayForm = ({ t, doUpdatePublicGateway, publicGateway }) => {
7068
height={40}
7169
bg='bg-charcoal'
7270
className='tc'
73-
style={{ background: isDarkTheme ? 'var(--input-btn-bg)' : '' }}
7471
disabled={value === DEFAULT_PATH_GATEWAY}
7572
onClick={onReset}>
7673
{t('app:actions.reset')}
@@ -80,7 +77,6 @@ const PublicGatewayForm = ({ t, doUpdatePublicGateway, publicGateway }) => {
8077
minWidth={100}
8178
height={40}
8279
className='mt2 mt0-l ml2-l tc'
83-
style={{ background: isDarkTheme ? 'var(--input-btn-bg)' : '' }}
8480
disabled={!isValidGatewayUrl || value === publicGateway}>
8581
{t('actions.submit')}
8682
</Button>

‎src/components/public-subdomain-gateway-form/PublicSubdomainGatewayForm.js‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,11 @@ import { connect } from 'redux-bundler-react'
33
import { withTranslation } from 'react-i18next'
44
import Button from '../button/button.tsx'
55
import { checkValidHttpUrl, checkSubdomainGateway, DEFAULT_SUBDOMAIN_GATEWAY } from '../../bundles/gateway.js'
6-
import { useTheme } from '../../hooks/theme'
76

87
const PublicSubdomainGatewayForm = ({ t, doUpdatePublicSubdomainGateway, publicSubdomainGateway }) => {
98
const [value, setValue] = useState(publicSubdomainGateway)
109
const initialIsValidGatewayUrl = !checkValidHttpUrl(value)
1110
const [isValidGatewayUrl, setIsValidGatewayUrl] = useState(initialIsValidGatewayUrl)
12-
const { isDarkTheme } = useTheme()
1311

1412
// Updates the border of the input to indicate validity
1513
useEffect(() => {
@@ -66,7 +64,6 @@ const PublicSubdomainGatewayForm = ({ t, doUpdatePublicSubdomainGateway, publicS
6664
onChange={onChange}
6765
onKeyPress={onKeyPress}
6866
value={value}
69-
style={{ background: isDarkTheme ? 'var(--filter-peers-dark)' : '', border: isDarkTheme ? '0.4px solid var(--border-color)' : '' }}
7067
/>
7168
<div className='tr'>
7269
<Button
@@ -75,7 +72,6 @@ const PublicSubdomainGatewayForm = ({ t, doUpdatePublicSubdomainGateway, publicS
7572
height={40}
7673
bg='bg-charcoal'
7774
className='tc'
78-
style={{ background: isDarkTheme ? 'var(--input-btn-bg)' : '' }}
7975
disabled={value === DEFAULT_SUBDOMAIN_GATEWAY}
8076
onClick={onReset}>
8177
{t('app:actions.reset')}
@@ -84,7 +80,6 @@ const PublicSubdomainGatewayForm = ({ t, doUpdatePublicSubdomainGateway, publicS
8480
id='public-subdomain-gateway-submit-button'
8581
minWidth={100}
8682
height={40}
87-
style={{ background: isDarkTheme ? 'var(--input-btn-bg)' : '' }}
8883
className='mt2 mt0-l ml2-l tc'
8984
disabled={!isValidGatewayUrl || value === publicSubdomainGateway}>
9085
{t('actions.submit')}

‎src/components/theme-toggle/theme-toggle.css‎

Lines changed: 0 additions & 53 deletions
This file was deleted.

‎src/components/theme-toggle/toggle.tsx‎

Lines changed: 0 additions & 50 deletions
This file was deleted.

0 commit comments

Comments
 (0)