moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'next' into 'next' 

next

See merge request soapbox-pub/soapbox-fe!1260
This commit is contained in:
Alex Gleason 2022-04-25 22:00:03 +00:00
parent 19d579c2a0 161f561b44
commit 26b89cb8b1
9 changed files with 60 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
app/soapbox/components/sidebar_menu.tsx
View File

@ -6,13 +6,14 @@ import { Link, NavLink } from 'react-router-dom';
import { logOut, switchAccount } from 'soapbox/actions/auth';
import { fetchOwnAccounts } from 'soapbox/actions/auth';
import { getSettings } from 'soapbox/actions/settings';
import { closeSidebar } from 'soapbox/actions/sidebar';
import Account from 'soapbox/components/account';
import { Stack } from 'soapbox/components/ui';
import ProfileStats from 'soapbox/features/ui/components/profile_stats';
import { useAppSelector, useSoapboxConfig, useFeatures } from 'soapbox/hooks';
import { closeSidebar } from '../actions/sidebar';
import { makeGetAccount, makeGetOtherAccounts } from '../selectors';
import { makeGetAccount, makeGetOtherAccounts } from 'soapbox/selectors';
import { getBaseURL } from 'soapbox/utils/accounts';
import { HStack, Icon, IconButton, Text } from './ui';
@ -32,6 +33,10 @@ const messages = defineMessages({
importData: { id: 'navigation_bar.import_data', defaultMessage: 'Import data' },
accountMigration: { id: 'navigation_bar.account_migration', defaultMessage: 'Move account' },
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
bookmarks: { id: 'column.bookmarks', defaultMessage: 'Bookmarks' },
lists: { id: 'column.lists', defaultMessage: 'Lists' },
invites: { id: 'navigation_bar.invites', defaultMessage: 'Invites' },
developers: { id: 'navigation.developers', defaultMessage: 'Developers' },
});
interface ISidebarLink {
@ -67,6 +72,9 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
const account = useAppSelector((state) => me ? getAccount(state, me) : null);
const otherAccounts: ImmutableList<AccountEntity> = useAppSelector((state) => getOtherAccounts(state));
const sidebarOpen = useAppSelector((state) => state.sidebar.sidebarOpen);
const settings = useAppSelector((state) => getSettings(state));
const baseURL = account ? getBaseURL(account) : '';
const closeButtonRef = React.useRef(null);
@ -192,6 +200,42 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
onClick={onClose}
/>
{features.bookmarks && (
<SidebarLink
to='/bookmarks'
icon={require('@tabler/icons/icons/bookmark.svg')}
text={intl.formatMessage(messages.bookmarks)}
onClick={onClose}
/>
)}
{features.lists && (
<SidebarLink
to='/lists'
icon={require('@tabler/icons/icons/list.svg')}
text={intl.formatMessage(messages.lists)}
onClick={onClose}
/>
)}
{instance.invites_enabled && (
<SidebarLink
to={`${baseURL}/invites`}
icon={require('@tabler/icons/icons/mailbox.svg')}
text={intl.formatMessage(messages.invites)}
onClick={onClose}
/>
)}
{settings.get('isDeveloper') && (
<SidebarLink
to='/developers'
icon={require('@tabler/icons/icons/code.svg')}
text={intl.formatMessage(messages.developers)}
onClick={onClose}
/>
)}
{features.publicTimeline && <>
<hr className='dark:border-slate-700' />

2
app/soapbox/components/ui/input/input.tsx
View File

@ -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')}

4
app/soapbox/features/auth_layout/index.tsx
View File

@ -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')}
/>

2
app/soapbox/features/auth_login/components/password_reset.js
View File

@ -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>

2
app/soapbox/features/public_layout/components/header.tsx
View File

@ -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>

2
app/soapbox/features/public_layout/index.js
View File

@ -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'>

2
app/soapbox/features/verification/waitlist_page.js
View File

@ -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'>

9
app/styles/about.scss
View File

@ -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 {

4
app/styles/forms.scss
View File

@ -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;