diff --git a/static/img/favicon.png b/static/img/favicon.png
index 4570d2248..20e725d6e 100644
Binary files a/static/img/favicon.png and b/static/img/favicon.png differ
diff --git a/static/img/lbry-favicon.png b/static/img/lbry-favicon.png
new file mode 100644
index 000000000..4570d2248
Binary files /dev/null and b/static/img/lbry-favicon.png differ
diff --git a/ui/component/channelThumbnail/spaceman.png b/ui/component/channelThumbnail/spaceman.png
new file mode 100644
index 000000000..4300ae1c1
Binary files /dev/null and b/ui/component/channelThumbnail/spaceman.png differ
diff --git a/ui/component/claimTilesDiscover/view.jsx b/ui/component/claimTilesDiscover/view.jsx
index 069c8f7ca..5a55a1537 100644
--- a/ui/component/claimTilesDiscover/view.jsx
+++ b/ui/component/claimTilesDiscover/view.jsx
@@ -291,7 +291,7 @@ function ClaimTilesDiscover(props: Props) {
};
const modifiedUris = uris ? uris.slice() : [];
- const fixUris = pinUrls || ['lbry://@AlisonMorrow#6/LBRY#8'];
+ const fixUris = pinUrls || ['lbry://@Odysee#8/Does-Google-Own-Odysee#4'];
if (pin && modifiedUris && modifiedUris.length > 2 && window.location.pathname === '/') {
fixUris.forEach((fixUri) => {
@@ -308,7 +308,13 @@ function ClaimTilesDiscover(props: Props) {
<ul className="claim-grid">
{modifiedUris && modifiedUris.length
? modifiedUris.map((uri, index) => (
- <ClaimPreviewTile key={uri} uri={uri} properties={renderProperties} live={resolveLive(index)} />
+ <ClaimPreviewTile
+ showNoSourceClaims={hasNoSource || showNoSourceClaims}
+ key={uri}
+ uri={uri}
+ properties={renderProperties}
+ live={resolveLive(index)}
+ />
))
: new Array(pageSize)
.fill(1)
diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx
index 12028b6de..1fce8fb04 100644
--- a/ui/component/commentCreate/view.jsx
+++ b/ui/component/commentCreate/view.jsx
@@ -42,7 +42,10 @@ type Props = {
isReply: boolean,
activeChannel: string,
activeChannelClaim: ?ChannelClaim,
- livestream?: boolean,
+ bottom: boolean,
+ onSubmit: (string, string) => void,
+ livestream: boolean,
+ embed?: boolean,
toast: (string) => void,
claimIsMine: boolean,
sendTip: ({}, (any) => void, (any) => void) => void,
@@ -63,7 +66,11 @@ export function CommentCreate(props: Props) {
isReply,
parentId,
activeChannelClaim,
+ onSubmit,
+ bottom,
livestream,
+ embed,
+ toast,
claimIsMine,
sendTip,
doToast,
@@ -106,7 +113,7 @@ export function CommentCreate(props: Props) {
function altEnterListener(e: SyntheticKeyboardEvent<*>) {
const KEYCODE_ENTER = 13;
- if ((e.ctrlKey || e.metaKey) && e.keyCode === KEYCODE_ENTER) {
+ if ((livestream || e.ctrlKey || e.metaKey) && e.keyCode === KEYCODE_ENTER) {
e.preventDefault();
buttonref.current.click();
}
@@ -256,6 +263,10 @@ export function CommentCreate(props: Props) {
setIsSupportComment(false);
setCommentFailure(false);
+ if (onSubmit) {
+ onSubmit(commentValue, activeChannelClaim.name);
+ }
+
if (onDoneReplying) {
onDoneReplying();
}
@@ -280,6 +291,11 @@ export function CommentCreate(props: Props) {
<div
role="button"
onClick={() => {
+ if (embed) {
+ window.open(`https://odysee.com/$/${PAGES.AUTH}?redirect=/$/${PAGES.LIVESTREAM}`);
+ return;
+ }
+
const pathPlusRedirect = `/$/${PAGES.CHANNEL_NEW}?redirect=${pathname}`;
if (livestream) {
window.open(pathPlusRedirect);
@@ -344,6 +360,7 @@ export function CommentCreate(props: Props) {
className={classnames('comment__create', {
'comment__create--reply': isReply,
'comment__create--nested-reply': isNested,
+ 'comment__create--bottom': bottom,
})}
>
<FormField
diff --git a/ui/component/fileReactions/view.jsx b/ui/component/fileReactions/view.jsx
index 7221b40ea..a6f60ebb5 100644
--- a/ui/component/fileReactions/view.jsx
+++ b/ui/component/fileReactions/view.jsx
@@ -1,4 +1,5 @@
// @flow
+import * as REACTION_TYPES from 'constants/reactions';
import * as ICONS from 'constants/icons';
import React from 'react';
import classnames from 'classnames';
@@ -15,18 +16,44 @@ type Props = {
likeCount: number,
dislikeCount: number,
myReaction: ?string,
+ livestream?: boolean,
};
function FileReactions(props: Props) {
- const { claim, uri, doFetchReactions, doReactionLike, doReactionDislike, likeCount, dislikeCount } = props;
+ const {
+ claim,
+ uri,
+ doFetchReactions,
+ doReactionLike,
+ doReactionDislike,
+ myReaction,
+ likeCount,
+ dislikeCount,
+ livestream,
+ } = props;
const claimId = claim && claim.claim_id;
const channel = claim && claim.signing_channel && claim.signing_channel.name;
const isCollection = claim && claim.value_type === 'collection'; // hack because nudge gets cut off by card on cols.
React.useEffect(() => {
- if (claimId) {
+ function fetchReactions() {
doFetchReactions(claimId);
}
- }, [claimId, doFetchReactions]);
+
+ let fetchInterval;
+ if (claimId) {
+ fetchReactions();
+
+ if (livestream) {
+ fetchInterval = setInterval(fetchReactions, 45000);
+ }
+ }
+
+ return () => {
+ if (fetchInterval) {
+ clearInterval(fetchInterval);
+ }
+ };
+ }, [claimId, doFetchReactions, livestream]);
return (
<>
@@ -41,20 +68,46 @@ function FileReactions(props: Props) {
title={__('I like this')}
requiresAuth={IS_WEB}
authSrc="filereaction_like"
- className={classnames('button--file-action')}
- label={formatNumberWithCommas(likeCount, 0)}
+ className={classnames('button--file-action', { 'button--fire': myReaction === REACTION_TYPES.LIKE })}
+ label={
+ <>
+ {myReaction === REACTION_TYPES.LIKE && (
+ <>
+ <div className="button__fire-glow" />
+ <div className="button__fire-particle1" />
+ <div className="button__fire-particle2" />
+ <div className="button__fire-particle3" />
+ <div className="button__fire-particle4" />
+ <div className="button__fire-particle5" />
+ <div className="button__fire-particle6" />
+ </>
+ )}
+ {formatNumberWithCommas(likeCount, 0)}
+ </>
+ }
iconSize={18}
- icon={ICONS.UPVOTE}
+ icon={myReaction === REACTION_TYPES.LIKE ? ICONS.FIRE_ACTIVE : ICONS.FIRE}
onClick={() => doReactionLike(uri)}
/>
<Button
requiresAuth={IS_WEB}
authSrc={'filereaction_dislike'}
title={__('I dislike this')}
- className={classnames('button--file-action')}
- label={formatNumberWithCommas(dislikeCount, 0)}
+ className={classnames('button--file-action', { 'button--slime': myReaction === REACTION_TYPES.DISLIKE })}
+ label={
+ <>
+ {myReaction === REACTION_TYPES.DISLIKE && (
+ <>
+ <div className="button__slime-stain" />
+ <div className="button__slime-drop1" />
+ <div className="button__slime-drop2" />
+ </>
+ )}
+ {formatNumberWithCommas(dislikeCount, 0)}
+ </>
+ }
iconSize={18}
- icon={ICONS.DOWNVOTE}
+ icon={myReaction === REACTION_TYPES.DISLIKE ? ICONS.SLIME_ACTIVE : ICONS.SLIME}
onClick={() => doReactionDislike(uri)}
/>
</>
diff --git a/ui/component/fileViewerEmbeddedTitle/view.jsx b/ui/component/fileViewerEmbeddedTitle/view.jsx
index e97b56e73..da5f00df0 100644
--- a/ui/component/fileViewerEmbeddedTitle/view.jsx
+++ b/ui/component/fileViewerEmbeddedTitle/view.jsx
@@ -5,7 +5,8 @@ import FilePrice from 'component/filePrice';
import { formatLbryUrlForWeb } from 'util/url';
import { withRouter } from 'react-router';
import { URL } from 'config';
-import * as ICONS from 'constants/icons';
+import OdyseeLogo from 'component/header/odysee_logo.png';
+import OdyseeLogoWithText from 'component/header/odysee_white.png';
type Props = {
uri: string,
@@ -36,7 +37,10 @@ function FileViewerEmbeddedTitle(props: Props) {
{...contentLinkProps}
/>
<div className="file-viewer__embedded-info">
- <Button className="file-viewer__overlay-logo" icon={ICONS.LBRY} aria-label={__('Home')} {...lbryLinkProps} />
+ <Button className="file-viewer__overlay-logo" aria-label={__('Home')} {...lbryLinkProps}>
+ <img src={OdyseeLogo} className=" mobile-only" />
+ <img src={OdyseeLogoWithText} className=" mobile-hidden" />
+ </Button>
{isInApp && <FilePrice uri={uri} />}
</div>
</div>
diff --git a/ui/component/header/view.jsx b/ui/component/header/view.jsx
index feca6bcc3..bc0596d75 100644
--- a/ui/component/header/view.jsx
+++ b/ui/component/header/view.jsx
@@ -19,6 +19,8 @@ import ChannelThumbnail from 'component/channelThumbnail';
import { remote } from 'electron';
import { IS_MAC } from 'component/app/view';
// @endif
+import OdyseeLogoWithWhiteText from './odysee_white.png';
+import OdyseeLogoWithText from './odysee.png';
type Props = {
user: ?User,
@@ -251,14 +253,7 @@ const Header = (props: Props) => {
</span>
)}
<Button
- className="header__navigation-item header__navigation-item--lbry"
- // @if TARGET='app'
- label={'LBRY'}
- // @endif
- // @if TARGET='web'
- label={LOGO_TITLE} // eslint-disable-line
- // @endif
- icon={ICONS.LBRY}
+ className="header__navigation-item header__navigation-item--lbry header__navigation-item--button-mobile"
onClick={() => {
if (history.location.pathname === '/') window.location.reload();
}}
@@ -268,7 +263,12 @@ const Header = (props: Props) => {
}}
// @endif
{...homeButtonNavigationProps}
- />
+ >
+ <img
+ src={currentTheme === 'light' ? OdyseeLogoWithText : OdyseeLogoWithWhiteText}
+ className="header__odysee"
+ />
+ </Button>
{!authHeader && (
<div className="header__center">
diff --git a/ui/component/publishFile/view.jsx b/ui/component/publishFile/view.jsx
index 0187af809..35b0b3e62 100644
--- a/ui/component/publishFile/view.jsx
+++ b/ui/component/publishFile/view.jsx
@@ -612,7 +612,7 @@ function PublishFile(props: Props) {
{/* @if TARGET='app' */}
{showFileUpload && (
<FileSelector
- label={__('File')}
+ label={__('Video file')}
disabled={disabled}
currentPath={currentFile}
onFileChosen={handleFileChange}
diff --git a/ui/component/publishForm/view.jsx b/ui/component/publishForm/view.jsx
index b2f353d13..19dc6b761 100644
--- a/ui/component/publishForm/view.jsx
+++ b/ui/component/publishForm/view.jsx
@@ -182,9 +182,9 @@ function PublishForm(props: Props) {
}
} else {
if (editingURI) {
- customSubtitle = __('Update your video');
+ customSubtitle = __('Update your video/audio');
} else {
- customSubtitle = __('Upload that unlabeled video you found behind the TV in 1991');
+ customSubtitle = __('Upload that unlabeled video or cassette you found behind the TV in 1991');
}
}
@@ -566,6 +566,7 @@ function PublishForm(props: Props) {
<Button
key={String(modeName)}
icon={modeName}
+ iconSize={18}
label={__(MODE_TO_I18N_STR[String(modeName)] || '---')}
button="alt"
onClick={() => {
diff --git a/ui/component/userChannelFollowIntro/view.jsx b/ui/component/userChannelFollowIntro/view.jsx
index 970d41f69..be66658a4 100644
--- a/ui/component/userChannelFollowIntro/view.jsx
+++ b/ui/component/userChannelFollowIntro/view.jsx
@@ -11,7 +11,6 @@ import { AUTO_FOLLOW_CHANNELS, CUSTOM_HOMEPAGE } from 'config';
type Props = {
subscribedChannels: Array<Subscription>,
onContinue: () => void,
- onBack: () => void,
channelSubscribe: (sub: Subscription) => void,
homepageData: any,
prefsReady: boolean,
@@ -49,25 +48,26 @@ function UserChannelFollowIntro(props: Props) {
<Card
title={__('Find channels to follow')}
subtitle={__(
- 'LBRY works better if you find and follow a couple creators you like. You can also block channels you never want to see.'
+ 'Odysee works better if you find and follow a couple creators you like. You can also block channels you never want to see.'
)}
actions={
<React.Fragment>
- <div className="section__actions--between">
- <Button button="secondary" onClick={onBack} label={__('Back')} />
- <Button
- button={subscribedChannels.length < 1 ? 'alt' : 'primary'}
- onClick={onContinue}
- label={subscribedChannels.length < 1 ? __('Skip') : __('Continue')}
- />
- </div>
<div className="section__body">
<ClaimListDiscover
- defaultOrderBy={CS.ORDER_BY_TOP}
+ hideFilters
+ meta={
+ <Button
+ button={subscribedChannels.length < 1 ? 'alt' : 'primary'}
+ onClick={onContinue}
+ label={subscribedChannels.length < 1 ? __('Skip') : __('Continue')}
+ />
+ }
+ defaultOrderBy={CS.ORDER_BY_TRENDING}
defaultFreshness={CS.FRESH_ALL}
claimType="channel"
claimIds={CUSTOM_HOMEPAGE && channelIds ? channelIds : undefined}
defaultTags={followingCount > 3 ? CS.TAGS_FOLLOWED : undefined}
+ maxPages={3}
/>
{followingCount > 0 && (
<Nag
diff --git a/ui/component/userVerify/view.jsx b/ui/component/userVerify/view.jsx
index bbade808d..9849a8b9c 100644
--- a/ui/component/userVerify/view.jsx
+++ b/ui/component/userVerify/view.jsx
@@ -60,7 +60,7 @@ class UserVerify extends React.PureComponent<Props> {
SITE_NAME,
}}
>
- Verified accounts are eligible to earn LBRY Credits for views, watching and reposting content, sharing
+ Verified accounts are eligible to earn LBRY Credits for views, watching and reposting videos, sharing
invite links etc. Verifying also helps us keep the %SITE_NAME% community safe too! %Refresh% or %Skip%.
</I18nMessage>
</p>
diff --git a/ui/modal/modalPublish/view.jsx b/ui/modal/modalPublish/view.jsx
index 34075e3c3..077020f6c 100644
--- a/ui/modal/modalPublish/view.jsx
+++ b/ui/modal/modalPublish/view.jsx
@@ -46,6 +46,7 @@ class ModalPublishSuccess extends React.PureComponent<Props> {
} else {
publishMessage = __('Your content will be live shortly.');
}
+ clearPublish();
function handleClose() {
closeModal();
diff --git a/ui/page/channelsFollowingDiscover/view.jsx b/ui/page/channelsFollowingDiscover/view.jsx
index bf4b88fe5..afd0bc755 100644
--- a/ui/page/channelsFollowingDiscover/view.jsx
+++ b/ui/page/channelsFollowingDiscover/view.jsx
@@ -127,6 +127,9 @@ function ChannelsFollowingDiscover(props: Props) {
claimType={CS.CLAIM_CHANNEL}
claimIds={CUSTOM_HOMEPAGE && channelIds ? channelIds : undefined}
scrollAnchor={MORE_CHANNELS_ANCHOR}
+ maxPages={3}
+ hideFilters
+ header={<h1 className="section__title">{__('Moon cheese is an acquired taste')}</h1>}
/>
</Page>
);
diff --git a/ui/page/discover/view.jsx b/ui/page/discover/view.jsx
index 59a7a49d3..7ef6ba797 100644
--- a/ui/page/discover/view.jsx
+++ b/ui/page/discover/view.jsx
@@ -2,6 +2,7 @@
import { SHOW_ADS, DOMAIN, SIMPLE_SITE, ENABLE_NO_SOURCE_CLAIMS } from 'config';
import * as ICONS from 'constants/icons';
import * as PAGES from 'constants/pages';
+import * as CS from 'constants/claim_search';
import React, { useRef } from 'react';
import Page from 'component/page';
import ClaimListDiscover from 'component/claimListDiscover';
@@ -11,11 +12,11 @@ import { useIsMobile } from 'effects/use-screensize';
import analytics from 'analytics';
import HiddenNsfw from 'component/common/hidden-nsfw';
import Icon from 'component/common/icon';
-import * as CS from 'constants/claim_search';
import Ads from 'web/component/ads';
import LbcSymbol from 'component/common/lbc-symbol';
import I18nMessage from 'component/i18nMessage';
import useGetLivestreams from 'effects/use-get-livestreams';
+import moment from 'moment';
type Props = {
location: { search: string },
@@ -97,8 +98,8 @@ function DiscoverPage(props: Props) {
} else {
headerLabel = (
<span>
- <Icon icon={(dynamicRouteProps && dynamicRouteProps.icon) || ICONS.DISCOVER} size={10} />
- {(dynamicRouteProps && dynamicRouteProps.title) || __('All Content')}
+ <Icon icon={(dynamicRouteProps && dynamicRouteProps.icon) || ICONS.WILD_WEST} size={10} />
+ {(dynamicRouteProps && dynamicRouteProps.title) || __('Wild West')}
</span>
);
}
@@ -106,9 +107,11 @@ function DiscoverPage(props: Props) {
return (
<Page noFooter fullWidthPage={tileLayout}>
<ClaimListDiscover
- limitClaimsPerChannel={3}
+ hideAdvancedFilter
+ hideFilters={!dynamicRouteProps}
header={repostedUri ? <span /> : undefined}
tileLayout={repostedUri ? false : tileLayout}
+ defaultOrderBy={dynamicRouteProps ? undefined : CS.ORDER_BY_TRENDING}
claimType={claimType ? [claimType] : undefined}
headerLabel={headerLabel}
tags={tags}
@@ -117,9 +120,18 @@ function DiscoverPage(props: Props) {
injectedItem={
SHOW_ADS && IS_WEB ? (SIMPLE_SITE ? false : !isAuthenticated && <Ads small type={'video'} />) : false
}
+ // Assume wild west page if no dynamicRouteProps
+ // Not a very good solution, but just doing it for now
+ // until we are sure this page will stay around
+ releaseTime={!dynamicRouteProps && `>${Math.floor(moment().subtract(1, 'day').startOf('week').unix())}`}
+ feeAmount={!dynamicRouteProps && CS.FEE_AMOUNT_ANY}
channelIds={
(dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.channelIds) || undefined
}
+ limitClaimsPerChannel={
+ (dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.limitClaimsPerChannel) ||
+ undefined
+ }
meta={
!dynamicRouteProps ? (
<a
diff --git a/ui/page/file/view.jsx b/ui/page/file/view.jsx
index a75d497da..987b6bcac 100644
--- a/ui/page/file/view.jsx
+++ b/ui/page/file/view.jsx
@@ -1,4 +1,5 @@
// @flow
+import * as PAGES from 'constants/pages';
import * as React from 'react';
import classnames from 'classnames';
import { lazyImport } from 'util/lazyImport';
@@ -11,6 +12,9 @@ import FileRenderDownload from 'component/fileRenderDownload';
import RecommendedContent from 'component/recommendedContent';
import CollectionContent from 'component/collectionContentSidebar';
import CommentsList from 'component/commentsList';
+import { Redirect } from 'react-router';
+import Button from 'component/button';
+import I18nMessage from 'component/i18nMessage';
import Empty from 'component/common/empty';
const PostViewer = lazyImport(() => import('component/postViewer' /* webpackChunkName: "postViewer" */));
@@ -32,7 +36,9 @@ type Props = {
collection?: Collection,
collectionId: string,
videoTheaterMode: boolean,
+ claimIsMine: boolean,
commentsDisabled: boolean,
+ isLivestream: boolean,
};
function FilePage(props: Props) {
@@ -49,9 +55,12 @@ function FilePage(props: Props) {
linkedCommentId,
setPrimaryUri,
videoTheaterMode,
+
+ claimIsMine,
commentsDisabled,
collection,
collectionId,
+ isLivestream,
} = props;
const cost = costInfo ? costInfo.cost : null;
const hasFileInfo = fileInfo !== undefined;
@@ -136,6 +145,10 @@ function FilePage(props: Props) {
);
}
+ if (!claimIsMine && isLivestream) {
+ return <Redirect to={`/$/${PAGES.LIVESTREAM}`} />;
+ }
+
if (obscureNsfw && isMature) {
return (
<Page className="file-page" filePage isMarkdown={isMarkdown}>
@@ -156,6 +169,18 @@ function FilePage(props: Props) {
{!isMarkdown && (
<div className="file-page__secondary-content">
<div>
+ {claimIsMine && isLivestream && (
+ <div className="livestream__creator-message">
+ <h4>{__('Only visible to you')}</h4>
+ <I18nMessage>
+ People who view this link will be redirected to your livestream. Make sure to use this for sharing
+ so your title and thumbnail are displayed properly.
+ </I18nMessage>
+ <div className="section__actions">
+ <Button button="primary" navigate={`/$/${PAGES.LIVESTREAM}`} label={__('View livestream')} />
+ </div>
+ </div>
+ )}
{RENDER_MODES.FLOATING_MODES.includes(renderMode) && <FileTitleSection uri={uri} />}
{commentsDisabled && <Empty text={__('The creator of this content has disabled comments.')} />}
{!commentsDisabled && <CommentsList uri={uri} linkedCommentId={linkedCommentId} />}
diff --git a/ui/page/settings/view.jsx b/ui/page/settings/view.jsx
index f0cf63325..2147a3b14 100644
--- a/ui/page/settings/view.jsx
+++ b/ui/page/settings/view.jsx
@@ -1,6 +1,6 @@
// @flow
import * as PAGES from 'constants/pages';
-import * as MODALS from 'constants/modal_types';
+// import * as MODALS from 'constants/modal_types';
import * as ICONS from 'constants/icons';
import * as React from 'react';
import { SETTINGS } from 'lbry-redux';
@@ -17,7 +17,7 @@ import classnames from 'classnames';
import { getPasswordFromCookie } from 'util/saved-passwords';
// $FlowFixMe
import homepages from 'homepages';
-import { Lbryio } from 'lbryinc';
+// import { Lbryio } from 'lbryinc';
import Yrbl from 'component/yrbl';
type Price = {
@@ -171,7 +171,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
const {
daemonSettings,
allowAnalytics,
- showNsfw,
+ // showNsfw,
isAuthenticated,
currentTheme,
themes,
@@ -184,13 +184,13 @@ class SettingsPage extends React.PureComponent<Props, State> {
setClientSetting,
toggle3PAnalytics,
floatingPlayer,
- hideReposts,
+ // hideReposts,
clearPlayingUri,
darkModeTimes,
clearCache,
- openModal,
myChannelUrls,
user,
+ // openModal,
} = this.props;
const { storedPassword } = this.state;
const noDaemonSettings = !daemonSettings || Object.keys(daemonSettings).length === 0;
@@ -225,6 +225,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
{/* @endif */}
{/* @if TARGET='web' */}
+ {isAuthenticated &&
<Card
title={__('Payment Methods')}
subtitle={__('Add a credit card to tip creators in their local currency')}
@@ -239,6 +240,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
</div>
}
/>
+ }
{/* @endif */}
<Card title={__('Language')} actions={<SettingLanguage />} />
@@ -394,7 +396,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
)}
/>
- <FormField
+ {/* <FormField
type="checkbox"
name="hide_reposts"
onChange={(e) => {
@@ -408,7 +410,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
checked={hideReposts}
label={__('Hide reposts')}
helper={__('You will not see reposts by people you follow or receive email notifying about them.')}
- />
+ /> */}
{/* <FormField
type="checkbox"
@@ -419,7 +421,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
helper={__('Anonymous content is published without a channel.')}
/> */}
- <FormField
+ {/* <FormField
type="checkbox"
name="show_nsfw"
onChange={() =>
@@ -432,7 +434,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
helper={__(
'Mature content may include nudity, intense sexuality, profanity, or other adult content. By displaying mature content, you are affirming you are of legal age to view mature content in your country or jurisdiction. '
)}
- />
+ /> */}
</React.Fragment>
}
/>
diff --git a/ui/redux/reducers/search.js b/ui/redux/reducers/search.js
index 3253c95b2..462a865fa 100644
--- a/ui/redux/reducers/search.js
+++ b/ui/redux/reducers/search.js
@@ -11,9 +11,9 @@ const defaultState: SearchState = {
[SEARCH_OPTIONS.CLAIM_TYPE]: SEARCH_OPTIONS.INCLUDE_FILES_AND_CHANNELS,
[SEARCH_OPTIONS.MEDIA_AUDIO]: true,
[SEARCH_OPTIONS.MEDIA_VIDEO]: true,
- [SEARCH_OPTIONS.MEDIA_TEXT]: true,
- [SEARCH_OPTIONS.MEDIA_IMAGE]: true,
- [SEARCH_OPTIONS.MEDIA_APPLICATION]: true,
+ [SEARCH_OPTIONS.MEDIA_TEXT]: false,
+ [SEARCH_OPTIONS.MEDIA_IMAGE]: false,
+ [SEARCH_OPTIONS.MEDIA_APPLICATION]: false,
},
urisByQuery: {},
hasReachedMaxResultsLength: {},
diff --git a/ui/scss/component/_file-render.scss b/ui/scss/component/_file-render.scss
index 60d64bc99..ae8feb4fb 100644
--- a/ui/scss/component/_file-render.scss
+++ b/ui/scss/component/_file-render.scss
@@ -230,13 +230,28 @@
}
.file-viewer__overlay-logo {
- color: var(--color-white);
- font-weight: bold;
+ height: 3.5rem;
+ width: 12rem;
+ display: flex;
+ align-items: center;
- .icon {
- height: 30px;
- stroke-width: 5px;
+ &:hover {
+ filter: drop-shadow(1px 2px 10px var(--color-gray-3));
}
+
+ @media (max-width: $breakpoint-small) {
+ margin-right: var(--spacing-m);
+ width: 2.5rem;
+
+ .button__label {
+ display: none;
+ }
+ }
+}
+
+.file-viewer__overlay-logo--videoend {
+ height: 3.5rem;
+ width: 12rem;
}
.file-viewer--is-playing:not(:hover) .file-viewer__embedded-header {
@@ -246,11 +261,15 @@
.file-viewer__embedded-header {
position: absolute;
display: flex;
+ align-items: center;
justify-content: space-between;
width: 100%;
top: 0;
opacity: 1;
z-index: 2;
+ height: 4rem;
+ padding-left: var(--spacing-m);
+ padding-right: var(--spacing-s);
font-size: var(--font-large);
overflow-x: hidden;
overflow-y: hidden;
@@ -260,7 +279,6 @@
border-top-right-radius: var(--border-radius);
.button {
- padding: var(--spacing-s);
color: var(--color-white);
z-index: 2;
diff --git a/ui/scss/component/_form-field.scss b/ui/scss/component/_form-field.scss
index 71ad82eb6..8c2b63f7b 100644
--- a/ui/scss/component/_form-field.scss
+++ b/ui/scss/component/_form-field.scss
@@ -203,7 +203,7 @@ input-submit {
height: var(--height-checkbox);
width: var(--height-checkbox);
border: 1px solid var(--color-input-border);
- border-radius: var(--border-radius);
+ border-radius: 3px;
left: 0px;
top: -1px;
}
diff --git a/ui/scss/component/_header.scss b/ui/scss/component/_header.scss
index 0c1d0fbd8..d5ad3246a 100644
--- a/ui/scss/component/_header.scss
+++ b/ui/scss/component/_header.scss
@@ -58,7 +58,6 @@
justify-content: center;
align-items: center;
border-radius: var(--border-radius);
- color: var(--color-text);
position: relative;
font-weight: var(--font-weight-bold);
diff --git a/ui/scss/init/_color.scss b/ui/scss/init/_color.scss
deleted file mode 100644
index 70573ea47..000000000
--- a/ui/scss/init/_color.scss
+++ /dev/null
@@ -1,57 +0,0 @@
-:root {
- // Generic colors
- --color-primary: #257761;
- --color-primary-alt: #e4f4ef;
- --color-primary-alt-2: #4b8576;
- --color-secondary: #295284;
- --color-secondary-alt: #d9eaff;
- --color-tertiary: #552470;
- --color-tertiary-alt: #f7e8ff;
- --color-danger: #9b2023;
- --color-danger-alt: #fccdce;
- --color-warning: #fff58c;
- --color-cost: #ffd580;
- --color-focus: #93cff2;
- --color-notification: #f02849;
- --color-live: #cc190f;
-
- --color-black: #111;
- --color-white: #fdfdfd;
- --color-white-alt: #fafafa;
- --color-gray-1: #eff1f4;
- --color-gray-2: #d8dde1;
- --color-gray-3: #ced4da;
- --color-gray-4: #abb1b7;
- --color-gray-5: #666a6d;
-
- // Text
- --color-text: var(--color-black);
- --color-text-subtitle: var(--color-gray-5);
- --color-text-inverse: #fdfdfd;
-
- // Components
-
- // Button
- --color-button-primary-bg: var(--color-primary);
- --color-button-primary-text: var(--color-primary-alt);
- --color-button-primary-bg-hover: var(--color-primary-alt-2);
- --color-button-primary-hover-text: var(--color-primary-alt);
- --color-button-secondary-bg: var(--color-secondary-alt);
- --color-button-secondary-border: var(--color-secondary-alt);
- --color-button-secondary-text: var(--color-secondary);
- --color-button-secondary-bg-hover: #b9d0e9;
- --color-button-alt-bg: var(--color-gray-1);
- --color-button-alt-text: var(--color-text);
- --color-button-alt-bg-hover: var(--color-gray-2);
- --color-link: var(--color-primary);
- --color-link-hover: var(--color-black);
-
- // Table
- --color-table-highlight: var(--color-white-alt);
-
- // Tag
- --color-tag: var(--color-gray-5);
- --color-tag-bg: var(--color-button-alt-bg);
- --color-tag-hover: var(--color-button-alt-text);
- --color-tag-bg-hover: var(--color-button-alt-bg-hover);
-}
diff --git a/ui/scss/init/_gui.scss b/ui/scss/init/_gui.scss
index 1ab69ce7d..44133dfbb 100644
--- a/ui/scss/init/_gui.scss
+++ b/ui/scss/init/_gui.scss
@@ -60,8 +60,12 @@ ol {
position: relative;
list-style-position: outside;
margin: var(--spacing-xs) 0;
- margin-left: var(--spacing-xl);
+ margin-left: var(--spacing-s);
margin-bottom: 0;
+
+ @media (min-width: $breakpoint-small) {
+ margin-left: var(--spacing-xl);
+ }
}
}
@@ -267,10 +271,10 @@ textarea {
margin-top: var(--spacing-s);
&:not(:last-child) {
- margin-bottom: var(--spacing-s);
+ margin-bottom: var(--spacing-m);
}
- .button--link ~ .button--link {
+ .button--link + .button--link {
margin-left: var(--spacing-s);
}
@@ -282,7 +286,6 @@ textarea {
.help--warning {
@extend .help;
padding: var(--spacing-s);
- color: var(--color-black);
border-radius: var(--border-radius);
background-color: var(--color-help-warning-bg);
color: var(--color-help-warning-text);
@@ -499,3 +502,16 @@ textarea {
height: 4rem;
}
}
+
+.home__meme {
+ text-align: center;
+ font-weight: bold;
+ line-height: 1;
+ font-size: 1rem;
+ margin-bottom: var(--spacing-m);
+
+ @media (min-width: $breakpoint-small) {
+ font-size: 1.2rem;
+ margin-bottom: var(--spacing-l);
+ }
+}
diff --git a/ui/scss/init/_vars.scss b/ui/scss/init/_vars.scss
index 7775a9abc..381da76f0 100644
--- a/ui/scss/init/_vars.scss
+++ b/ui/scss/init/_vars.scss
@@ -9,7 +9,7 @@ $breakpoint-medium: 1150px;
$breakpoint-large: 1600px;
:root {
- --border-radius: 5px;
+ --border-radius: 10px;
--height-input: 2.5rem;
--height-button: 2.5rem;
--height-checkbox: 24px;
diff --git a/ui/scss/themes/dark.scss b/ui/scss/themes/dark.scss
index b244eefa6..6cae5e194 100644
--- a/ui/scss/themes/dark.scss
+++ b/ui/scss/themes/dark.scss
@@ -1,30 +1,30 @@
[theme='dark'] {
// Color overrides
- --color-primary: #2bbb90;
- --color-primary-alt: #3e675d;
- --color-primary-alt-2: #065f46;
- --color-primary-alt-3: #34e5b0;
- --color-secondary: #204166;
- --color-secondary-alt: #dbeafe;
- --color-secondary-alt-2: #bfdbfe;
- --color-secondary-alt-3: #2c5c8c;
+ --color-primary: #e50054;
+ --color-primary-alt: #66001880;
+ --color-fire: #ff6635;
+ --color-fire-outside: #ff9b20;
// Structure
- --color-background: var(--color-gray-9);
- --color-background-overlay: #21252999;
- --color-border: #333338;
- --color-card-background: var(--color-gray-8);
- --color-card-background-highlighted: var(--color-gray-7);
+ --color-background: #140e1b;
+ --color-background-overlay: #0c0d0e95;
+ --color-border: #30243d;
+ --color-card-background: #181021;
+ --color-card-background-highlighted: #241c30;
// Text
- --color-text: var(--color-white);
+ --color-text: var(--color-gray-1);
--color-text-subtitle: var(--color-gray-4);
--color-text-empty: var(--color-text-subtitle);
--color-text-help: #bbbbbb;
--color-text-warning: #212529;
--color-text-warning--background: var(--lbry-yellow-1);
- --color-text-error: #f87171;
- --color-error: #61373f;
+ --color-text-error: var(--color-danger);
+ --color-error: var(--color-danger-alt);
+ --color-blockquote: var(--color-gray-5);
+ --color-blockquote-bg: var(--color-card-background-highlighted);
+ --color-help-warning-text: var(--color-white-alt);
+ --color-help-warning-bg: #fbbf2450;
// Tags (words)
--color-tag-words: var(--color-text);
@@ -33,87 +33,73 @@
--color-tag-words-bg-hover: var(--color-gray-4);
// Header
- --color-header-background: var(--color-gray-8);
- --color-header-button: var(--color-gray-6);
- --color-header-button-hover: var(--color-gray-6);
- --color-header-button-active: var(--color-gray-6);
+ --color-header-button: #38274c;
+ --color-header-background: #231830;
// Button
- --color-button-primary-bg: var(--color-primary-alt);
- --color-button-primary-bg-hover: var(--color-primary-alt-2);
- --color-button-primary-text: var(--color-gray-2);
+ --color-button-primary-text: white;
--color-button-primary-hover-text: var(--color-primary-alt);
- --color-button-secondary-bg: var(--color-secondary);
- --color-button-secondary-border: var(--color-secondary);
- --color-button-secondary-bg-hover: var(--color-secondary-alt-3);
- --color-button-secondary-text: var(--color-gray-2);
- --color-button-alt-bg: var(--color-gray-7);
- --color-button-alt-bg-hover: var(--color-gray-6);
- --color-button-alt-text: var(--color-gray-1);
- --color-button-border: var(--color-gray-5);
- --color-button-toggle-text: var(--color-gray-1);
- --color-link: var(--color-primary-alt-3);
- --color-link-hover: var(--color-text);
- --color-link-focus-bg: var(--color-gray-7);
+ --color-button-secondary-bg: #2c1543;
+ --color-button-secondary-border: #4f1c82;
+ --color-button-secondary-bg-hover: #3b1c5b;
+ --color-button-secondary-text: #efefef;
+ --color-button-alt-bg: var(--color-header-button);
+ --color-button-alt-bg-hover: #2b2037;
+ --color-button-toggle-text: var(--color-text);
+ --color-button-toggle-bg: var(--color-primary-alt);
+ --color-button-toggle-bg-hover: var(--color-primary-alt);
+ --color-button-alt-text: #e2e9f0;
+ --color-button-border: #5b4475;
+ --color-link: var(--color-primary);
+ --color-link-hover: #d75673;
+ --color-link-active: #ec1d4c;
+ --color-link-focus-bg: #3d2d4e;
// Input
- --color-input: var(--color-white);
- --color-input-label: var(--color-gray-3);
- --color-input-placeholder: var(--color-gray-1);
+ --color-input: #f4f4f5;
+ --color-input-label: #a7a7a7;
+ --color-input-placeholder: #f4f4f5;
--color-input-bg: var(--color-header-button);
- --color-input-bg-copyable: var(--color-gray-6);
+ --color-input-bg-copyable: #4c3861;
--color-input-border: var(--color-border);
--color-input-border-active: var(--color-secondary);
--color-input-toggle: var(--color-primary-alt-3);
--color-input-toggle-bg: var(--color-input-bg);
--color-input-toggle-bg-hover: var(--color-secondary);
--color-input-bg-selected: var(--color-primary-alt);
- --color-input-prefix-bg: var(--color-gray-5);
+ --color-input-prefix-bg: var(--color-input-bg-copyable);
--color-input-prefix-border: var(--color-gray-4);
--select-toggle-background: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg' fill='%23ffffff'%3E%3Cpath d='M17.172, 31.172c1.562, -1.562 4.095, -1.562 5.656, 0l25.172, 25.171l25.172, -25.171c1.562, -1.562 4.095, -1.562 5.656, 0c1.562, 1.562 1.562, 4.095 0, 5.656l-28, 28c-1.562, 1.562 -4.095, 1.562 -5.656, 0l-28, -28c-0.781, -0.781 -1.172, -1.805 -1.172, -2.828c0, -1.023 0.391, -2.047 1.172, -2.828Z'/%3E%3C/svg%3E%0A");
// Navigation
- --color-navigation-icon: var(--color-gray-4);
- --color-navigation-link: var(--color-gray-4);
- --color-navigation-active: var(--color-gray-7);
- --color-navigation-active-text: var(--color-gray-3);
- --color-navigation-hover: var(--color-gray-6);
- --color-navigation-hover-text: var(--color-gray-3);
+ --color-navigation-icon: #76808a;
+ --color-navigation-link: #b9c3ce;
+ --color-navigation-active: #2b2037;
+ --color-navigation-active-text: #c6bcd2;
+ --color-navigation-hover: #21182a;
+ --color-navigation-hover-text: #c6bcd2;
// Tags
- --color-tag: var(--color-primary-alt-3);
- --color-tag-bg: var(--color-gray-7);
+ --color-tag: #ff85b1;
+ --color-tag-bg: var(--color-navigation-hover);
--color-tag-hover: var(--color-white);
- --color-tag-bg-hover: var(--color-primary-alt);
+ --color-tag-bg-hover: var(--color-primary-alt-2);
+ --color-tag-mature-bg: var(--color-primary-alt-2);
// Menu
--color-menu-background: var(--color-header-background);
- --color-menu-background--active: var(--color-gray-7);
- --color-menu-icon: var(--color-gray-4);
+ --color-menu-background--active: var(--color-primary-alt);
+ --color-menu-icon: #928b9b;
+ --color-menu-icon-active: #d6d6d6;
// Comments
- --color-comment-menu: var(--color-gray-5);
- --color-comment-menu-hovering: var(--color-gray-2);
- --color-comment-threadline: #434b54;
- --color-comment-threadline-hover: var(--color-gray-4);
+ --color-comment-menu: #6a6a6a;
+ --color-comment-menu-hovering: #e0e0e0;
--color-comment-highlighted: #484734;
-
- // Snack
- --color-snack-bg: var(--color-secondary);
-
- // Superchat
- --color-superchat-text: var(--color-black);
- --color-superchat-text__light: var(--color-text);
- --color-superchat: #fcd34d;
- --color-superchat__light: #ef4e1647;
- --color-superchat-2: #fde68a;
- --color-superchat-3: #fef3c7;
- --color-superchat-3__light: #58066087;
- --color-superchat-4: #fffbeb;
+ --color-comment-threadline: #24192f;
+ --color-comment-threadline-hover: var(--color-gray-4);
// Other
- --color-focus: #93c5fd50;
- --color-nag: var(--color-orange);
--color-tab-text: var(--color-white);
--color-tabs-background: var(--color-card-background);
--color-tab-divider: var(--color-white);
@@ -121,14 +107,12 @@
--color-notice: #58563b;
--color-purchased: #ffd580;
--color-purchased-alt: var(--color-purchased);
- --color-purchased-text: var(--color-gray-5);
+ --color-purchased-text: black;
--color-thumbnail-background: var(--color-gray-5);
--color-tooltip-bg: #2f3337;
- --color-help-warning-bg: #d97706;
- --color-help-warning-text: white;
- --color-blockquote: var(--color-gray-5);
- --color-placeholder-background: #4e5862;
- --color-spinner-light: #5a6570;
+ --color-focus: #e91e6329;
+ --color-placeholder-background: #261a35;
+ --color-spinner-light: white;
--color-spinner-dark: #212529;
--color-login-graphic-background: var(--color-background);
diff --git a/ui/scss/themes/light.scss b/ui/scss/themes/light.scss
index 5a4260fca..fe75e4586 100644
--- a/ui/scss/themes/light.scss
+++ b/ui/scss/themes/light.scss
@@ -1,2 +1,155 @@
:root {
+ // Color overrides
+ --color-primary: #fa6165;
+ --color-primary-alt: #fef1f6;
+ --color-primary-alt-2: #fb7e82;
+ --color-primary-alt-3: #fbcbdd;
+ --color-secondary: #f9902a;
+ --color-secondary-alt: #fee8d2;
+ --color-secondary-alt-2: #fefcf6;
+
+ // Structure
+ --color-border: #ededed;
+ --color-background: #fafafa;
+ --color-background-overlay: #21252980;
+ --color-card-background: #ffffff;
+ --color-card-background-highlighted: #fff5f5;
+
+ // Text
+ --color-text-selection-bg: var(--color-primary-alt);
+ --color-text-selection: var(--color-primary);
+ --color-text-error: var(--color-danger);
+ --color-text-empty: #999999;
+ --color-text-help: #999999;
+ --color-text-subtitle: #767676;
+ --color-text-warning: #212529;
+ --color-help-warning-bg: #fef3c7;
+ --color-text-warning--background: var(--lbry-yellow-1);
+ --color-blockquote: var(--color-gray-3);
+ --color-blockquote-bg: var(--color-gray-1);
+ --color-tooltip-bg: #222;
+ --color-tooltip-text: #fafafa;
+
+ // Header
+ --color-header-button: var(--color-button-alt-bg);
+ --color-header-background: #ffffff;
+
+ // Button
+ --color-button-alt-bg: var(--color-gray-1);
+ --color-button-alt-bg-hover: var(--color-gray-2);
+ --color-button-alt-text: black;
+ --color-button-primary-bg: var(--color-primary);
+ --color-button-primary-bg-hover: var(--color-primary-alt-2);
+ --color-button-primary-text: var(--color-primary-alt);
+ --color-button-primary-hover-text: var(--color-white);
+ --color-button-secondary-bg: var(--color-primary-alt);
+ --color-button-secondary-border: var(--color-primary-alt-3);
+ --color-button-secondary-text: var(--color-primary);
+ --color-button-secondary-bg-hover: var(--color-primary-alt-3);
+ --color-button-toggle-text: var(--color-primary);
+ --color-button-toggle-bg: var(--color-primary-alt);
+ --color-button-toggle-bg-hover: var(--color-primary-alt);
+ --color-button-border: var(--color-gray-3);
+ --color-link-active: var(--color-primary);
+ --color-link-focus-bg: #f1f1f1;
+ --color-link: var(--color-primary);
+
+ // Input
+ --color-input-bg-selected: var(--color-primary-alt);
+ --color-input-color: #111111;
+ --color-input-label: var(--color-gray-5);
+ --color-input-placeholder: #212529;
+ --color-input-bg: var(--color-gray-1);
+ --color-input-border: var(--color-border);
+ --color-input-border-active: var(--color-secondary);
+ --color-input-toggle: var(--color-secondary);
+ --color-input-toggle-bg: var(--color-gray-1);
+ --color-input-toggle-bg-hover: var(--color-secondary-alt);
+ --color-input-prefix-bg: var(--color-gray-2);
+ --color-input-prefix-border: var(--color-gray-5);
+ --select-toggle-background: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg' fill='%23212529'%3E%3Cpath d='M17.172, 31.172c1.562, -1.562 4.095, -1.562 5.656, 0l25.172, 25.171l25.172, -25.171c1.562, -1.562 4.095, -1.562 5.656, 0c1.562, 1.562 1.562, 4.095 0, 5.656l-28, 28c-1.562, 1.562 -4.095, 1.562 -5.656, 0l-28, -28c-0.781, -0.781 -1.172, -1.805 -1.172, -2.828c0, -1.023 0.391, -2.047 1.172, -2.828Z'/%3E%3C/svg%3E%0A");
+
+ // Navigation
+ --color-navigation-icon: var(--color-gray-5);
+ --color-navigation-link: var(--color-gray-5);
+ --color-navigation-active: var(--color-primary-alt);
+ --color-navigation-active-text: var(--color-primary);
+ --color-navigation-hover: var(--color-gray-1);
+ --color-navigation-hover-text: #3f3f3f;
+
+ // Tags
+ --color-tag: var(--color-primary-alt-2);
+ --color-tag-bg: #f9f6f7;
+ --color-tag-hover: var(--color-button-alt-text);
+ --color-tag-bg-hover: var(--color-button-alt-bg-hover);
+
+ // Menu
+ --color-menu-background: var(--color-header-background);
+ --color-menu-icon: var(--color-navigation-link);
+ --color-menu-icon-active: var(--color-navigation-link);
+ --color-menu-background--selected: var(--color-secondary-alt);
+ --color-menu-background--active: var(--color-primary-alt);
+
+ // Comments
+ --color-comment-menu: #e0e0e0;
+ --color-comment-menu-hovering: #6a6a6a;
+ --color-comment-highlighted: #fff2d9;
+ --color-comment-threadline: var(--color-gray-1);
+ --color-comment-threadline-hover: var(--color-gray-4);
+
+ // Superchat
+ --color-superchat-text: var(--color-black);
+ --color-superchat: #fcd34d;
+ --color-superchat__light: #fcd34d50;
+ --color-superchat-2: #fde68a;
+ --color-superchat-3: #fef3c7;
+ --color-superchat-3__light: #fef3c750;
+ --color-superchat-4: #fffbeb;
+
+ // Color
+ --color-focus: #8dbff0;
+ --color-nag: #fa8700;
+ --color-error: #fcafca;
+ --color-notice: #fef3ca;
+ --color-purchased: var(--color-cost);
+ --color-purchased-alt: #ffebc2;
+ --color-purchased-text: black;
+ --color-thumbnail-background: var(--color-gray-1);
+ --color-spinner-light: #ffffff;
+ --color-spinner-dark: #212529;
+ --color-placeholder-background: #f0f0f0;
+ --color-file-viewer-background: var(--color-card-background);
+ --color-tabs-background: var(--color-card-background);
+ --color-tab-divider: var(--color-primary);
+ --color-modal-background: var(--color-card-background);
+
+ // Icons
+ --color-follow-bg: #ffd4da;
+ --color-follow-icon: #e2495e;
+ --color-view-bg: var(--color-secondary-alt);
+ --color-view-icon: var(--color-secondary);
+
+ // Editor
+ --color-editor-cursor: var(--color-text);
+ --color-editor-quote: #707070;
+ --color-editor-tag: #ea9400;
+ --color-editor-attr: #04b0f4;
+ --color-editor-string: #ff7451;
+ --color-editor-inline-code-fg: var(--color-text);
+ --color-editor-inline-code-fg-preview: #2e3439;
+ --color-editor-inline-code-bg: rgba(157, 161, 165, 0.3);
+ --color-editor-inline-code-bg-preview: #d0e8ff;
+ --color-editor-selected: #add6ff;
+ --color-editor-link: var(--color-link);
+ --color-editor-url: var(--color-editor-string);
+ --color-editor-hr: var(--color-editor-tag);
+ --color-editor-hr-preview: #cccccc;
+
+ // Ads
+ --color-ads-background: #fae5ff;
+ --color-ads-link: var(--color-link);
+
+ // Scrollbar
+ --color-scrollbar-thumb-bg: rgba(0, 0, 0, 0.2);
+ --color-scrollbar-track-bg: transparent;
}
diff --git a/ui/util/query-params.js b/ui/util/query-params.js
index bf4fa6bcc..af13a036e 100644
--- a/ui/util/query-params.js
+++ b/ui/util/query-params.js
@@ -38,9 +38,13 @@ export const getSearchQueryString = (query: string, options: any = {}) => {
const encodedQuery = encodeURIComponent(query);
const queryParams = [
options.exact && !isSurroundedByQuotes(encodedQuery) ? `s="${encodedQuery}"` : `s=${encodedQuery}`,
+ `free_only=true`,
`size=${options.size || DEFAULT_SEARCH_SIZE}`,
`from=${options.from || DEFAULT_SEARCH_RESULT_FROM}`,
+ // `mediaType=${SEARCH_OPTIONS.MEDIA_VIDEO}`,
+ // `claimType=${SEARCH_OPTIONS.INCLUDE_FILES}`,
];
+
const { isBackgroundSearch } = options;
const includeUserOptions = typeof isBackgroundSearch === 'undefined' ? false : !isBackgroundSearch;
diff --git a/web/component/fileViewerEmbeddedEnded/view.jsx b/web/component/fileViewerEmbeddedEnded/view.jsx
index eaf70ee30..420ef9359 100644
--- a/web/component/fileViewerEmbeddedEnded/view.jsx
+++ b/web/component/fileViewerEmbeddedEnded/view.jsx
@@ -4,7 +4,7 @@ import Button from 'component/button';
import { formatLbryUrlForWeb } from 'util/url';
import { withRouter } from 'react-router';
import { URL, SITE_NAME } from 'config';
-import * as ICONS from 'constants/icons';
+import OdyseeLogoWithText from 'component/header/odysee_white.png';
type Props = {
uri: string,
@@ -37,7 +37,9 @@ function FileViewerEmbeddedEnded(props: Props) {
return (
<div className="file-viewer__overlay">
<div className="file-viewer__overlay-secondary">
- <Button className="file-viewer__overlay-logo" label="LBRY" icon={ICONS.LBRY} href={URL} />
+ <Button className="file-viewer__overlay-logo--videoend" href={URL}>
+ <img src={OdyseeLogoWithText} />
+ </Button>
</div>
<div className="file-viewer__overlay-title">{prompt}</div>
<div className="file-viewer__overlay-actions">
diff --git a/web/component/footer.jsx b/web/component/footer.jsx
index ad16140a5..0960899d1 100644
--- a/web/component/footer.jsx
+++ b/web/component/footer.jsx
@@ -1,101 +1,34 @@
-import * as PAGES from 'constants/pages';
import React from 'react';
import Button from 'component/button';
-
-const sections = [
- {
- name: 'Community',
- links: [
- {
- label: 'Twitter',
- link: 'https://twitter.com/lbrycom',
- },
- {
- label: 'Reddit',
- link: 'https://reddit.com/r/lbry',
- },
- {
- label: 'Chat (Discord)',
- link: 'https://chat.lbry.org/',
- },
- {
- label: 'Telegram',
- link: 'https://t.me/lbryofficial',
- },
- {
- label: 'Facebook',
- link: 'https://www.facebook.com/lbryio',
- },
- ],
- },
- {
- name: 'Resources',
- links: [
- {
- label: 'FAQ',
- link: 'https://lbry.com/faq',
- },
- {
- label: 'Support --[used in footer; general help/support]--',
- link: 'https://lbry.com/faq/support',
- },
- {
- label: 'YouTube Partner Program',
- link: 'https://lbry.com/youtube',
- },
- {
- label: 'lbry.com',
- link: 'https://lbry.com',
- },
- {
- label: 'lbry.tech',
- link: 'https://lbry.tech',
- },
- {
- label: 'GitHub',
- link: 'https://github.com/lbryio',
- },
- ],
- },
- {
- name: 'Policies',
- links: [
- {
- label: 'Terms of Service',
- link: 'https://www.lbry.com/termsofservice',
- },
- {
- label: 'Privacy Policy',
- link: 'https://lbry.com/privacypolicy',
- },
- {
- label: '2257',
- navigate: `/$/${PAGES.CODE_2257}`,
- },
- ],
- },
-];
+import I18nMessage from 'component/i18nMessage';
export default function Footer() {
return (
<footer className="footer">
- <ul className="navigation__tertiary footer__links ul--no-style">
- {sections.map(({ name, links }) => {
- return (
- <li key={name} className="footer__section">
- <ul className="ul--no-style">
- <div className="footer__section-title">{__(name)}</div>
- {links.map(({ label, link, navigate }) => {
- return (
- <li key={label}>
- <Button className="footer__link" label={__(label)} href={link} navigate={navigate} />
- </li>
- );
- })}
- </ul>
- </li>
- );
- })}
+ <span className="footer__section-title">
+ <I18nMessage tokens={{ lbry_link: <Button button="link" label={'LBRY'} href="https://lbry.com" /> }}>
+ POWERED BY %lbry_link%
+ </I18nMessage>
+ </span>
+ <ul className="navigation__tertiary footer__links">
+ <li className="footer__link">
+ <Button label={__('About --[link title in Sidebar or Footer]--')} href="https://lbry.com/about" />
+ </li>
+ <li className="footer__link">
+ <Button label={__('Community Guidelines')} href="https://odysee.com/@OdyseeHelp:b/Community-Guidelines:c" />
+ </li>
+ <li className="footer__link">
+ <Button label={__('FAQ')} href="https://odysee.com/@OdyseeHelp:b" />
+ </li>
+ <li className="footer__link">
+ <Button label={__('Support --[used in footer; general help/support]--')} href="https://lbry.com/support" />
+ </li>
+ <li className="footer__link">
+ <Button label={__('Terms')} href="https://lbry.com/termsofservice" />
+ </li>
+ <li className="footer__link">
+ <Button label={__('Privacy Policy')} href="https://lbry.com/privacy" />
+ </li>
</ul>
</footer>
);
diff --git a/web/component/meme.jsx b/web/component/meme.jsx
index 2df8bfe27..ed12e258e 100644
--- a/web/component/meme.jsx
+++ b/web/component/meme.jsx
@@ -5,7 +5,7 @@ export default function Meme() {
return (
<h1 className="home__meme">
<Button button="link" href="https://odysee.com/@Odysee:8?view=discussion">
- {'big gulps, huh?'}
+ {`don't dead open inside`}
</Button>
</h1>
);
diff --git a/web/package.json b/web/package.json
index c75e33d12..924514799 100644
--- a/web/package.json
+++ b/web/package.json
@@ -31,7 +31,7 @@
"koa-logger": "^3.2.1",
"koa-send": "^5.0.0",
"koa-static": "^5.0.0",
- "lbry-redux": "lbryio/lbry-redux#508e8d36fd91106beb7d6b4edb9f726dae0e6264",
+ "lbry-redux": "lbryio/lbry-redux#b075c103445a9355d617116fbb491496ecb473da",
"lbryinc": "lbryio/lbryinc#8f9a58bfc8312a65614fd7327661cdcc502c4e59",
"mysql": "^2.17.1",
"node-fetch": "^2.6.1",
diff --git a/web/yarn.lock b/web/yarn.lock
index 3a43acd81..a9ebe976c 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -3331,9 +3331,9 @@ latest-version@^3.0.0:
dependencies:
package-json "^4.0.0"
-lbry-redux@lbryio/lbry-redux#508e8d36fd91106beb7d6b4edb9f726dae0e6264:
+lbry-redux@lbryio/lbry-redux#b075c103445a9355d617116fbb491496ecb473da:
version "0.0.1"
- resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/508e8d36fd91106beb7d6b4edb9f726dae0e6264"
+ resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/b075c103445a9355d617116fbb491496ecb473da"
dependencies:
proxy-polyfill "0.1.6"
reselect "^3.0.0"