Improve dark mode

This commit is contained in:
Alex Gleason 2022-03-24 18:56:22 -05:00
parent ee691e0cc8
commit ef0de13c91
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
4 changed files with 7 additions and 5 deletions

View file

@ -4,6 +4,8 @@ import InlineSVG from 'react-inlinesvg';
import { defineMessages, useIntl } from 'react-intl';
import { Link } from 'react-router-dom';
import { Text } from 'soapbox/components/ui';
const sizes = {
md: 'p-4 sm:rounded-xl',
lg: 'p-4 sm:p-6 sm:rounded-xl',
@ -51,7 +53,7 @@ const CardHeader: React.FC<ICardHeader> = ({ children, backHref, onBackClick }):
const backAttributes = backHref ? { to: backHref } : { onClick: onBackClick };
return (
<Comp {...backAttributes} className='mr-2' aria-label={intl.formatMessage(messages.back)}>
<Comp {...backAttributes} className='mr-2 text-gray-900 dark:text-gray-100' aria-label={intl.formatMessage(messages.back)}>
<InlineSVG src={require('@tabler/icons/icons/arrow-left.svg')} className='h-6 w-6' />
<span className='sr-only'>Back</span>
</Comp>
@ -72,7 +74,7 @@ interface ICardTitle {
}
const CardTitle = ({ title }: ICardTitle): JSX.Element => (
<h1 className='text-xl font-bold'>{title}</h1>
<Text size='xl' weight='bold' tag='h1'>{title}</Text>
);
const CardBody: React.FC = ({ children }): JSX.Element => (

View file

@ -120,7 +120,7 @@ const Search = (props: ISearch) => {
<div className='relative'>
<Component
className='block w-full pl-3 pr-10 py-2 border border-gray-100 rounded-full leading-5 bg-gray-100 placeholder-gray-500 focus:bg-white focus:outline-none focus:placeholder-gray-400 focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm'
className='block w-full pl-3 pr-10 py-2 border border-gray-100 dark:border-slate-600 rounded-full leading-5 bg-gray-100 placeholder-gray-500 dark:bg-slate-900 focus:bg-white focus:outline-none focus:placeholder-gray-400 focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm'
type='text'
id='search'
placeholder={intl.formatMessage(messages.placeholder)}

Binary file not shown.

View file

@ -168,7 +168,7 @@
}
.thread {
@apply sm:bg-white p-4 sm:shadow-xl sm:p-6 sm:rounded-xl;
@apply sm:bg-white sm:dark:bg-slate-800 p-4 sm:shadow-xl sm:p-6 sm:rounded-xl;
&__status {
@apply relative;
@ -222,7 +222,7 @@
// }
&__connector {
@apply bg-gray-200 absolute w-0.5 left-5 hidden;
@apply bg-gray-200 dark:bg-gray-600 absolute w-0.5 left-5 hidden;
&--bottom {
@apply block;