diff --git a/ui/component/header/odysee.png b/ui/component/header/odysee.png new file mode 100644 index 000000000..e41d9b9c7 Binary files /dev/null and b/ui/component/header/odysee.png differ diff --git a/ui/component/header/odysee_logo.png b/ui/component/header/odysee_logo.png new file mode 100644 index 000000000..3b1a1a2a2 Binary files /dev/null and b/ui/component/header/odysee_logo.png differ diff --git a/ui/component/header/odysee_white.png b/ui/component/header/odysee_white.png new file mode 100644 index 000000000..cc7dcbd5e Binary files /dev/null and b/ui/component/header/odysee_white.png differ diff --git a/ui/component/userEmailNew/index.js b/ui/component/userEmailNew/index.js index 6cf78a253..d28181e9d 100644 --- a/ui/component/userEmailNew/index.js +++ b/ui/component/userEmailNew/index.js @@ -11,18 +11,19 @@ import { doSetWalletSyncPreference, doSetDaemonSetting } from 'redux/actions/set import { selectDaemonSettings, makeSelectClientSetting } from 'redux/selectors/settings'; import UserEmailNew from './view'; -const select = state => ({ +const select = (state) => ({ isPending: selectEmailNewIsPending(state), errorMessage: selectEmailNewErrorMessage(state), syncEnabled: makeSelectClientSetting(SETTINGS.ENABLE_SYNC)(state), daemonSettings: selectDaemonSettings(state), emailExists: selectEmailAlreadyExists(state), user: selectUser(state), + currentTheme: makeSelectClientSetting(SETTINGS.THEME)(state), }); -const perform = dispatch => ({ - setSync: value => dispatch(doSetWalletSyncPreference(value)), - setShareDiagnosticData: shouldShareData => +const perform = (dispatch) => ({ + setSync: (value) => dispatch(doSetWalletSyncPreference(value)), + setShareDiagnosticData: (shouldShareData) => dispatch(doSetDaemonSetting(DAEMON_SETTINGS.SHARE_USAGE_DATA, shouldShareData)), doSignUp: (email, password) => dispatch(doUserSignUp(email, password)), clearEmailEntry: () => dispatch(doClearEmailEntry()), diff --git a/ui/component/userEmailNew/view.jsx b/ui/component/userEmailNew/view.jsx index 9400d1dde..916f89723 100644 --- a/ui/component/userEmailNew/view.jsx +++ b/ui/component/userEmailNew/view.jsx @@ -1,6 +1,6 @@ // @flow import * as PAGES from 'constants/pages'; -import { SITE_NAME } from 'config'; +import { SITE_NAME, DOMAIN } from 'config'; import React, { useState } from 'react'; import { FormField, Form } from 'component/common/form'; import Button from 'component/button'; @@ -11,20 +11,24 @@ import { useHistory } from 'react-router-dom'; import Card from 'component/common/card'; import ErrorText from 'component/common/error-text'; import Nag from 'component/common/nag'; +import classnames from 'classnames'; +import OdyseeLogoWithWhiteText from 'component/header/odysee_white.png'; +import OdyseeLogoWithText from 'component/header/odysee.png'; type Props = { errorMessage: ?string, emailExists: boolean, isPending: boolean, syncEnabled: boolean, - setSync: boolean => void, + setSync: (boolean) => void, balance: number, daemonSettings: { share_usage_data: boolean }, - setShareDiagnosticData: boolean => void, + setShareDiagnosticData: (boolean) => void, doSignUp: (string, ?string) => Promise, clearEmailEntry: () => void, interestedInYoutubSync: boolean, doToggleInterestedInYoutubeSync: () => void, + currentTheme: string, }; function UserEmailNew(props: Props) { @@ -39,6 +43,7 @@ function UserEmailNew(props: Props) { emailExists, interestedInYoutubSync, doToggleInterestedInYoutubeSync, + currentTheme, } = props; const { share_usage_data: shareUsageData } = daemonSettings; const { push, location } = useHistory(); @@ -98,7 +103,7 @@ function UserEmailNew(props: Props) { subtitle={__('An account with lbry.tv allows you to earn rewards and backup your data.')} // @endif actions={ -
+
setEmail(e.target.value)} + onChange={(e) => setEmail(e.target.value)} /> setPassword(e.target.value)} + onChange={(e) => setPassword(e.target.value)} /> {/* @if TARGET='web' */} @@ -180,8 +185,38 @@ function UserEmailNew(props: Props) {
} - nag={errorMessage && {errorMessage}} />} + nag={ + <> + {IS_WEB && DOMAIN === 'lbry.tv' && ( + + ), + }} + > + {__( + 'lbry.tv is being retired in favor of %odysee% and new sign ups are disabled. Sign up on %odysee% instead' + )} + + } + /> + )} + {errorMessage && {errorMessage}} />} + + } /> + + {IS_WEB && DOMAIN === 'lbry.tv' && ( +
+ +
+ )}
); } diff --git a/ui/component/userEmailReturning/view.jsx b/ui/component/userEmailReturning/view.jsx index 9f0a24da5..07ad69efd 100644 --- a/ui/component/userEmailReturning/view.jsx +++ b/ui/component/userEmailReturning/view.jsx @@ -17,8 +17,8 @@ type Props = { emailDoesNotExist: boolean, doClearEmailEntry: () => void, doUserSignIn: (string, ?string) => void, - doUserCheckIfEmailExists: string => void, - doSetWalletSyncPreference: boolean => void, + doUserCheckIfEmailExists: (string) => void, + doSetWalletSyncPreference: (boolean) => void, doSetClientSetting: (string, boolean, ?boolean) => void, isPending: boolean, }; @@ -87,7 +87,7 @@ function UserEmailReturning(props: Props) { name="sign_in_email" label={__('Email')} value={email} - onChange={e => setEmail(e.target.value)} + onChange={(e) => setEmail(e.target.value)} /> {/* @if TARGET='app' */} @@ -119,7 +119,7 @@ function UserEmailReturning(props: Props) { } nag={ - + <> {!emailDoesNotExist && emailExistsFromUrl && ( )} @@ -134,7 +134,7 @@ function UserEmailReturning(props: Props) { {!emailExistsFromUrl && !emailDoesNotExist && errorMessage && ( )} - + } /> )} diff --git a/ui/page/home/view.jsx b/ui/page/home/view.jsx index 756bf8c66..7c37b8d76 100644 --- a/ui/page/home/view.jsx +++ b/ui/page/home/view.jsx @@ -1,12 +1,14 @@ // @flow import * as ICONS from 'constants/icons'; import * as PAGES from 'constants/pages'; -import { SITE_NAME, SIMPLE_SITE } from 'config'; +import { SITE_NAME, SIMPLE_SITE, DOMAIN } from 'config'; import React from 'react'; import Page from 'component/page'; import Button from 'component/button'; import ClaimTilesDiscover from 'component/claimTilesDiscover'; import Icon from 'component/common/icon'; +import I18nMessage from 'component/i18nMessage'; +import LbcSymbol from 'component/common/lbc-symbol'; type Props = { authenticated: boolean, @@ -35,6 +37,34 @@ function HomePage(props: Props) { return ( + {IS_WEB && DOMAIN === 'lbry.tv' && ( +
+

+ , + }} + > + lbry.tv is being retired in favor of %odysee% + +

+

+ + ), + odysee:

+ )} + {!SIMPLE_SITE && (authenticated || !IS_WEB) && !subscribedChannels.length && (

diff --git a/ui/scss/init/_gui.scss b/ui/scss/init/_gui.scss index 0e1f745bb..be1225020 100644 --- a/ui/scss/init/_gui.scss +++ b/ui/scss/init/_gui.scss @@ -371,9 +371,15 @@ textarea { background-color: var(--color-primary-alt); } -.notice-message--above-content { +.notice-message--loud { @extend .notice-message; - margin-bottom: var(--spacing-l); + background-color: #fef1f6; + color: var(--color-black); + font-weight: bold; + + .button { + color: #fa6165; + } } .privacy-img { @@ -431,3 +437,15 @@ textarea { max-height: 50vh; overflow: scroll; } + +.signup__odysee-logo { + display: flex; + width: 100%; + align-items: center; + justify-content: center; + + img { + margin-top: var(--spacing-xl); + height: 4rem; + } +}