dark styles on public pages

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
revert-5af0e40a
marcin mikołajczak 2022-04-25 23:41:02 +02:00
rodzic 1ef6c55d44
commit 161f561b44
8 zmienionych plików z 13 dodań i 14 usunięć

Wyświetl plik

@ -70,7 +70,7 @@ const Input = React.forwardRef<HTMLInputElement, IInput>(
type='button'
onClick={togglePassword}
tabIndex={-1}
className='text-gray-400 hover:text-gray-500 h-full px-2 focus:ring-primary-500 focus:ring-2'
className='text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-400 h-full px-2 focus:ring-primary-500 focus:ring-2'
>
<SvgIcon
src={revealed ? require('@tabler/icons/icons/eye-off.svg') : require('@tabler/icons/icons/eye.svg')}

Wyświetl plik

@ -20,7 +20,7 @@ const AuthLayout = () => {
return (
<div>
<div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 via-white to-cyan-50' />
<div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-cyan-50 dark:to-cyan-900' />
<main className='relative flex flex-col h-screen'>
<header className='pt-10 flex justify-center relative'>
@ -29,7 +29,7 @@ const AuthLayout = () => {
<img src={logo} alt={siteTitle} className='h-7' />
) : (
<SvgIcon
className='w-7 h-7'
className='w-7 h-7 dark:text-white'
alt={siteTitle}
src={require('@tabler/icons/icons/home.svg')}
/>

Wyświetl plik

@ -42,7 +42,7 @@ class PasswordReset extends ImmutablePureComponent {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
{intl.formatMessage({ id: 'password_reset.header', defaultMessage: 'Reset Password' })}
</h1>

Wyświetl plik

@ -128,7 +128,7 @@ const Header = () => {
<Tooltip text={intl.formatMessage(messages.forgotPassword)}>
<IconButton
src={require('@tabler/icons/icons/help.svg')}
className='bg-transparent text-gray-400 hover:text-gray-700 cursor-pointer'
className='bg-transparent text-gray-400 dark:text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 cursor-pointer'
iconClassName='w-5 h-5'
/>
</Tooltip>

Wyświetl plik

@ -35,7 +35,7 @@ class PublicLayout extends ImmutablePureComponent {
return (
<div className='h-full'>
<div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 via-white to-cyan-50' />
<div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-cyan-50 dark:to-cyan-900' />
<div className='flex flex-col h-screen'>
<div className='flex-shrink-0'>

Wyświetl plik

@ -25,7 +25,7 @@ const WaitlistPage = ({ account }) => {
};
return (
<div className='h-screen w-full bg-gradient-to-tr from-primary-50 via-white to-cyan-50'>
<div className='h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-cyan-50 dark:to-cyan-900'>
<main className='relative flex flex-col h-screen max-w-7xl mx-auto px-2 sm:px-6 lg:px-8'>
<header className='relative flex justify-between h-16'>
<div className='flex-1 flex items-stretch justify-center relative'>

Wyświetl plik

@ -709,11 +709,11 @@ $fluid-breakpoint: $maximum-width + 20px;
}
.rich-formatting {
@apply text-gray-900 dark:text-gray-100;
font-family: var(--font-sans-serif), sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 30px;
color: $color-5-dark;
padding: 15px 30px;
.text-center {
@ -735,11 +735,11 @@ $fluid-breakpoint: $maximum-width + 20px;
p,
li {
@apply text-gray-900 dark:text-gray-100;
font-family: var(--font-sans-serif), sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 30px;
color: $color-5-dark;
a {
color: var(--highlight-text-color);
@ -760,10 +760,10 @@ $fluid-breakpoint: $maximum-width + 20px;
h4,
h5,
h6 {
@apply text-gray-900 dark:text-gray-100;
font-family: var(--font-display), sans-serif;
margin-top: 2em;
margin-bottom: 1.25em;
color: $color-5-dark;
}
hr + {
@ -1050,8 +1050,7 @@ $fluid-breakpoint: $maximum-width + 20px;
}
.simple_form .user_agreement .label_input > label {
font-weight: 400;
color: $color-5-dark;
@apply text-gray-900 dark:text-gray-100 font-normal;
}
.simple_form p.lead {

Wyświetl plik

@ -69,10 +69,10 @@ code {
position: relative;
.label_input > label {
@apply text-black dark:text-white;
font-family: inherit;
font-size: 14px;
padding-top: 5px;
color: var(--primary-text-color);
display: block;
width: auto;
}
@ -190,9 +190,9 @@ code {
.input {
.label_input > label {
@apply text-gray-700 dark:text-gray-400;
font-family: inherit;
font-size: 14px;
color: var(--gray-700);
display: block;
word-wrap: break-word;
font-weight: 500;