Features/dark mode (#37)

* Added use local storage hook
* Added theme
* Added theme support
* Added theme provider
* Added dark theme for sidebar
* Added dark theme for main content area
* Added theme
* Added theme support
* Added theme provider
* Added dark theme for sidebar
* Added dark theme for main content area
This commit is contained in:
Sean
2022-10-21 03:14:09 +08:00
committed by GitHub
parent 3c3c9a6026
commit cbdfabb4db
16 changed files with 248 additions and 50 deletions

View File

@@ -1,6 +1,8 @@
import styled from 'styled-components';
const StyledWrapper = styled.div`
color: ${(props) => props.theme.theme['primary-text']};
.create-request {
color: #737373;
font-size: 0.75rem;
@@ -21,4 +23,8 @@ const StyledWrapper = styled.div`
}
`;
export const SiteTitle = styled.div`
color: ${(props) => props.theme.theme['primary-text']};
`;
export default StyledWrapper;

View File

@@ -1,17 +1,18 @@
import React, { useState } from 'react';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { IconPlus, IconUpload, IconFiles, IconFolders, IconPlayerPlay, IconBrandChrome, IconSpeakerphone, IconDeviceDesktop } from '@tabler/icons';
import { isElectron } from 'utils/common/platform';
import { useSelector, useDispatch } from 'react-redux';
import { collectionImported } from 'providers/ReduxStore/slices/collections';
import { openLocalCollection } from 'providers/ReduxStore/slices/collections/actions';
import { addCollectionToWorkspace } from 'providers/ReduxStore/slices/workspaces/actions';
import { IconPlus, IconUpload, IconFiles, IconFolders, IconPlayerPlay, IconBrandChrome, IconSpeakerphone, IconDeviceDesktop } from '@tabler/icons';
import Bruno from 'components/Bruno';
import GithubSvg from 'assets/github.svg';
import StyledWrapper, { SiteTitle } from './StyledWrapper';
import CreateCollection from 'components/Sidebar/CreateCollection';
import SelectCollection from 'components/Sidebar/Collections/SelectCollection';
import importCollection, { importSampleCollection } from 'utils/collections/import';
import { isElectron } from 'utils/common/platform';
import GithubSvg from 'assets/github.svg';
import StyledWrapper from './StyledWrapper';
const Welcome = () => {
const dispatch = useDispatch();
@@ -66,7 +67,7 @@ const Welcome = () => {
<div className="">
<Bruno width={50} />
</div>
<div className="text-xl font-semibold select-none">bruno</div>
<SiteTitle className="text-xl font-semibold select-none">bruno</SiteTitle>
<div className="mt-4">Opensource API Client.</div>
<div className="uppercase font-semibold create-request mt-10">Collections</div>