General fixes from routing/lbry.tv changes #2437
21 changed files with 102 additions and 93 deletions
|
@ -15,7 +15,7 @@ class CardMedia extends React.PureComponent<Props> {
|
||||||
style={
|
style={
|
||||||
thumbnail
|
thumbnail
|
||||||
? { backgroundImage: `url('${thumbnail}')` }
|
? { backgroundImage: `url('${thumbnail}')` }
|
||||||
: { backgroundImage: `url(/${Placeholder})` }
|
: { backgroundImage: `url(${Placeholder})` }
|
||||||
}
|
}
|
||||||
className="media__thumb"
|
className="media__thumb"
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -104,6 +104,7 @@ class FileDetails extends PureComponent<Props> {
|
||||||
{__('Downloaded to')}
|
{__('Downloaded to')}
|
||||||
{': '}
|
{': '}
|
||||||
<Button
|
<Button
|
||||||
|
constrict
|
||||||
button="link"
|
button="link"
|
||||||
onClick={() => openFolder(downloadPath)}
|
onClick={() => openFolder(downloadPath)}
|
||||||
label={downloadNote || downloadPath}
|
label={downloadNote || downloadPath}
|
||||||
|
|
|
@ -1,9 +1,11 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { selectUnreadAmount } from 'redux/selectors/subscriptions';
|
import { selectUnreadAmount } from 'redux/selectors/subscriptions';
|
||||||
|
import { selectShouldShowInviteGuide } from 'redux/selectors/app';
|
||||||
import SideBar from './view';
|
import SideBar from './view';
|
||||||
|
|
||||||
const select = state => ({
|
const select = state => ({
|
||||||
unreadSubscriptionTotal: selectUnreadAmount(state),
|
unreadSubscriptionTotal: selectUnreadAmount(state),
|
||||||
|
shouldShowInviteGuide: selectShouldShowInviteGuide(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
const perform = () => ({});
|
const perform = () => ({});
|
||||||
|
|
|
@ -6,37 +6,46 @@ import Button from 'component/button';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import Tooltip from 'component/common/tooltip';
|
import Tooltip from 'component/common/tooltip';
|
||||||
|
|
||||||
type SideBarLink = {
|
|
||||||
label: string,
|
|
||||||
path: string,
|
|
||||||
active: boolean,
|
|
||||||
icon: ?string,
|
|
||||||
subLinks: Array<SideBarLink>,
|
|
||||||
guide: ?string,
|
|
||||||
};
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
unreadSubscriptionTotal: number,
|
unreadSubscriptionTotal: number,
|
||||||
|
shouldShowInviteGuide: string,
|
||||||
};
|
};
|
||||||
|
|
||||||
class SideBar extends React.PureComponent<Props> {
|
class SideBar extends React.PureComponent<Props> {
|
||||||
render() {
|
render() {
|
||||||
const { unreadSubscriptionTotal } = this.props;
|
const { unreadSubscriptionTotal, shouldShowInviteGuide } = this.props;
|
||||||
const buildLink = (path, label, icon) => ({
|
const buildLink = (path, label, icon, guide) => ({
|
||||||
navigate: path ? `$/${path}` : '/',
|
navigate: path ? `$/${path}` : '/',
|
||||||
label,
|
label,
|
||||||
icon,
|
icon,
|
||||||
|
guide,
|
||||||
});
|
});
|
||||||
|
|
||||||
const renderLink = (linkProps, index) => (
|
const renderLink = (linkProps, index) => {
|
||||||
<li key={index}>
|
const { guide } = linkProps;
|
||||||
|
|
||||||
|
const inner = (
|
||||||
<Button
|
<Button
|
||||||
{...linkProps}
|
{...linkProps}
|
||||||
className="navigation__link"
|
className={classnames('navigation__link', {
|
||||||
|
'navigation__link--guide': guide,
|
||||||
|
})}
|
||||||
activeClass="navigation__link--active"
|
activeClass="navigation__link--active"
|
||||||
/>
|
/>
|
||||||
</li>
|
);
|
||||||
);
|
|
||||||
|
return (
|
||||||
|
<li key={index}>
|
||||||
|
{guide ? (
|
||||||
|
<Tooltip key={guide} alwaysVisible direction="right" body={guide}>
|
||||||
|
{inner}
|
||||||
|
</Tooltip>
|
||||||
|
) : (
|
||||||
|
inner
|
||||||
|
)}
|
||||||
|
</li>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<nav className="navigation">
|
<nav className="navigation">
|
||||||
|
@ -70,7 +79,12 @@ class SideBar extends React.PureComponent<Props> {
|
||||||
...buildLink(PAGES.ACCOUNT, 'Overview', ICONS.ACCOUNT),
|
...buildLink(PAGES.ACCOUNT, 'Overview', ICONS.ACCOUNT),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
...buildLink(PAGES.INVITE, 'Invite', ICONS.INVITE),
|
...buildLink(
|
||||||
|
PAGES.INVITE,
|
||||||
|
'Invite',
|
||||||
|
ICONS.INVITE,
|
||||||
|
shouldShowInviteGuide && __('Check this out!')
|
||||||
|
),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
...buildLink(PAGES.REWARDS, 'Rewards', ICONS.FEATURED),
|
...buildLink(PAGES.REWARDS, 'Rewards', ICONS.FEATURED),
|
||||||
|
|
|
@ -22,7 +22,7 @@ const select = state => ({
|
||||||
|
|
||||||
const perform = (dispatch, ownProps) => ({
|
const perform = (dispatch, ownProps) => ({
|
||||||
onSearch: query => {
|
onSearch: query => {
|
||||||
ownProps.history.push({ pathname: `/$/search`, search: `?q=${query}` });
|
ownProps.history.push({ pathname: `/$/search`, search: `?q=${encodeURIComponent(query)}` });
|
||||||
analytics.apiLogSearch();
|
analytics.apiLogSearch();
|
||||||
},
|
},
|
||||||
onSubmit: uri => {
|
onSubmit: uri => {
|
||||||
|
|
|
@ -26,11 +26,14 @@ import pjson from 'package.json';
|
||||||
import app from './app';
|
import app from './app';
|
||||||
import analytics from './analytics';
|
import analytics from './analytics';
|
||||||
import doLogWarningConsoleMessage from './logWarningConsoleMessage';
|
import doLogWarningConsoleMessage from './logWarningConsoleMessage';
|
||||||
import { ConnectedRouter } from 'connected-react-router';
|
import { ConnectedRouter, push } from 'connected-react-router';
|
||||||
import cookie from 'cookie';
|
import cookie from 'cookie';
|
||||||
import(/* webpackChunkName: "styles" */
|
import { formatLbryUriForWeb } from 'util/uri';
|
||||||
/* webpackPrefetch: true */
|
|
||||||
'scss/all.scss');
|
// Import our app styles
|
||||||
|
// If a style is not necessary for the initial page load, it should be removed from `all.scss`
|
||||||
|
// and loaded dynamically in the component that consumes it
|
||||||
|
import 'scss/all.scss';
|
||||||
|
|
||||||
const APPPAGEURL = 'lbry://?';
|
const APPPAGEURL = 'lbry://?';
|
||||||
|
|
||||||
|
@ -47,16 +50,6 @@ if (process.env.SEARCH_API_URL) {
|
||||||
setSearchApi(process.env.SEARCH_API_URL);
|
setSearchApi(process.env.SEARCH_API_URL);
|
||||||
}
|
}
|
||||||
|
|
||||||
// @if TARGET='app'
|
|
||||||
ipcRenderer.on('navigate-backward', () => {
|
|
||||||
// app.store.dispatch(doHistoryBack());
|
|
||||||
});
|
|
||||||
|
|
||||||
ipcRenderer.on('navigate-forward', () => {
|
|
||||||
// app.store.dispatch(doHistoryForward());
|
|
||||||
});
|
|
||||||
// @endif
|
|
||||||
|
|
||||||
// @if TARGET='web'
|
// @if TARGET='web'
|
||||||
const SDK_API_URL = process.env.SDK_API_URL || 'https://api.piratebay.com/api/proxy';
|
const SDK_API_URL = process.env.SDK_API_URL || 'https://api.piratebay.com/api/proxy';
|
||||||
Lbry.setDaemonConnectionString(SDK_API_URL);
|
Lbry.setDaemonConnectionString(SDK_API_URL);
|
||||||
|
@ -66,7 +59,6 @@ Lbry.setDaemonConnectionString(SDK_API_URL);
|
||||||
// We interect with ipcRenderer to get the auth key from a users keyring
|
// We interect with ipcRenderer to get the auth key from a users keyring
|
||||||
// We keep a local variable for authToken beacuse `ipcRenderer.send` does not
|
// We keep a local variable for authToken beacuse `ipcRenderer.send` does not
|
||||||
// contain a response, so there is no way to know when it's been set
|
// contain a response, so there is no way to know when it's been set
|
||||||
|
|
||||||
let authToken;
|
let authToken;
|
||||||
Lbryio.setOverride(
|
Lbryio.setOverride(
|
||||||
'setAuthToken',
|
'setAuthToken',
|
||||||
|
@ -141,9 +133,10 @@ ipcRenderer.on('open-uri-requested', (event, uri, newSession) => {
|
||||||
app.store.dispatch(doConditionalAuthNavigate(newSession));
|
app.store.dispatch(doConditionalAuthNavigate(newSession));
|
||||||
} else if (uri.startsWith(APPPAGEURL)) {
|
} else if (uri.startsWith(APPPAGEURL)) {
|
||||||
const navpage = uri.replace(APPPAGEURL, '').toLowerCase();
|
const navpage = uri.replace(APPPAGEURL, '').toLowerCase();
|
||||||
// app.store.dispatch(doNavigate(`/${navpage}`));
|
app.store.dispatch(push(`/$/${navpage}`));
|
||||||
} else if (isURIValid(uri)) {
|
} else if (isURIValid(uri)) {
|
||||||
// app.store.dispatch(doNavigate('/show', { uri }));
|
const formattedUri = formatLbryUriForWeb(uri);
|
||||||
|
app.store.dispatch(push(formattedUri));
|
||||||
} else {
|
} else {
|
||||||
app.store.dispatch(
|
app.store.dispatch(
|
||||||
doToast({
|
doToast({
|
||||||
|
@ -156,7 +149,7 @@ ipcRenderer.on('open-uri-requested', (event, uri, newSession) => {
|
||||||
|
|
||||||
ipcRenderer.on('open-menu', (event, uri) => {
|
ipcRenderer.on('open-menu', (event, uri) => {
|
||||||
if (uri && uri.startsWith('/help')) {
|
if (uri && uri.startsWith('/help')) {
|
||||||
// app.store.dispatch(doNavigate('/help'));
|
app.store.dispatch(push('/$/help'));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { doDeleteFileAndGoBack } from 'redux/actions/file';
|
import { doDeleteFileAndMaybeGoBack } from 'redux/actions/file';
|
||||||
import { makeSelectTitleForUri, makeSelectClaimIsMine, makeSelectFileInfoForUri } from 'lbry-redux';
|
import { makeSelectTitleForUri, makeSelectClaimIsMine, makeSelectFileInfoForUri } from 'lbry-redux';
|
||||||
import { doHideModal } from 'redux/actions/app';
|
import { doHideModal } from 'redux/actions/app';
|
||||||
import ModalRemoveFile from './view';
|
import ModalRemoveFile from './view';
|
||||||
|
@ -13,7 +13,7 @@ const select = (state, props) => ({
|
||||||
const perform = dispatch => ({
|
const perform = dispatch => ({
|
||||||
closeModal: () => dispatch(doHideModal()),
|
closeModal: () => dispatch(doHideModal()),
|
||||||
deleteFile: (fileInfo, deleteFromComputer, abandonClaim) => {
|
deleteFile: (fileInfo, deleteFromComputer, abandonClaim) => {
|
||||||
dispatch(doDeleteFileAndGoBack(fileInfo, deleteFromComputer, abandonClaim));
|
dispatch(doDeleteFileAndMaybeGoBack(fileInfo, deleteFromComputer, abandonClaim));
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -151,7 +151,7 @@ class FilePage extends React.Component<Props> {
|
||||||
mediaType,
|
mediaType,
|
||||||
contentType,
|
contentType,
|
||||||
fileName,
|
fileName,
|
||||||
})
|
});
|
||||||
const showFile =
|
const showFile =
|
||||||
PLAYABLE_MEDIA_TYPES.includes(mediaType) || PREVIEW_MEDIA_TYPES.includes(mediaType);
|
PLAYABLE_MEDIA_TYPES.includes(mediaType) || PREVIEW_MEDIA_TYPES.includes(mediaType);
|
||||||
|
|
||||||
|
@ -176,14 +176,12 @@ class FilePage extends React.Component<Props> {
|
||||||
editUri = buildURI(uriObject);
|
editUri = buildURI(uriObject);
|
||||||
}
|
}
|
||||||
|
|
||||||
const insufficientCredits = costInfo && costInfo.cost > balance;
|
const insufficientCredits = !claimIsMine && costInfo && costInfo.cost > balance;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Page notContained className="main--file-page">
|
<Page notContained className="main--file-page">
|
||||||
<div className="grid-area--content">
|
<div className="grid-area--content">
|
||||||
<h1 className="media__uri">
|
<h1 className="media__uri">{uri}</h1>
|
||||||
<Button navigate={uri} label={uri} />
|
|
||||||
</h1>
|
|
||||||
{insufficientCredits && (
|
{insufficientCredits && (
|
||||||
<div className="media__insufficient-credits help--warning">
|
<div className="media__insufficient-credits help--warning">
|
||||||
{__(
|
{__(
|
||||||
|
|
|
@ -56,26 +56,28 @@ class RewardsPage extends PureComponent<Props> {
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<section className="card card--section">
|
<section className="card card--section">
|
||||||
<p>
|
<div className="card__content">
|
||||||
{__(
|
<p>
|
||||||
'This account must undergo review before you can participate in the rewards program.'
|
{__(
|
||||||
)}{' '}
|
'This account must undergo review before you can participate in the rewards program.'
|
||||||
{__('This can take anywhere from several minutes to several days.')}
|
)}{' '}
|
||||||
</p>
|
{__('This can take anywhere from several minutes to several days.')}
|
||||||
|
</p>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
{__(
|
{__(
|
||||||
'We apologize for this inconvenience, but have added this additional step to prevent fraud.'
|
'We apologize for this inconvenience, but have added this additional step to prevent fraud.'
|
||||||
)}
|
)}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
{`${__('If you continue to see this message, send us an email to help@lbry.com.')} ${__(
|
{`${__(
|
||||||
'Please enjoy free content in the meantime!'
|
'If you continue to see this message, send us an email to help@lbry.com.'
|
||||||
)}`}
|
)} ${__('Please enjoy free content in the meantime!')}`}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
</div>
|
||||||
|
<div className="card__actions">
|
||||||
<Button navigate="/" button="primary" label="Return Home" />
|
<Button navigate="/" button="primary" label="Return Home" />
|
||||||
</p>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -138,8 +140,8 @@ class RewardsPage extends PureComponent<Props> {
|
||||||
<p className="card__content">
|
<p className="card__content">
|
||||||
{claimed && claimed.length
|
{claimed && claimed.length
|
||||||
? __(
|
? __(
|
||||||
"You have claimed all available rewards! We're regularly adding more so be sure to check back later."
|
"You have claimed all available rewards! We're regularly adding more so be sure to check back later."
|
||||||
)
|
)
|
||||||
: __('There are no rewards available at this time, please check back later.')}
|
: __('There are no rewards available at this time, please check back later.')}
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -10,6 +10,7 @@ import Page from 'component/page';
|
||||||
import ToolTip from 'component/common/tooltip';
|
import ToolTip from 'component/common/tooltip';
|
||||||
import Icon from 'component/common/icon';
|
import Icon from 'component/common/icon';
|
||||||
import SearchOptions from 'component/searchOptions';
|
import SearchOptions from 'component/searchOptions';
|
||||||
|
import Button from 'component/button';
|
||||||
|
|
||||||
type Props = { doSearch: string => void, location: UrlLocation };
|
type Props = { doSearch: string => void, location: UrlLocation };
|
||||||
|
|
||||||
|
@ -43,7 +44,9 @@ export default function SearchPage(props: Props) {
|
||||||
<Fragment>
|
<Fragment>
|
||||||
{isValid && (
|
{isValid && (
|
||||||
<header className="search__header">
|
<header className="search__header">
|
||||||
<h1 className="media__uri">{uri}</h1>
|
<Button navigate={uri} className="media__uri">
|
||||||
|
{uri}
|
||||||
|
</Button>
|
||||||
{isChannel ? (
|
{isChannel ? (
|
||||||
<ChannelTile size="large" isSearchResult uri={uri} />
|
<ChannelTile size="large" isSearchResult uri={uri} />
|
||||||
) : (
|
) : (
|
||||||
|
|
|
@ -10,6 +10,7 @@ import {
|
||||||
selectFileInfosByOutpoint,
|
selectFileInfosByOutpoint,
|
||||||
} from 'lbry-redux';
|
} from 'lbry-redux';
|
||||||
import { doHideModal } from 'redux/actions/app';
|
import { doHideModal } from 'redux/actions/app';
|
||||||
|
import { goBack } from 'connected-react-router';
|
||||||
|
|
||||||
export function doOpenFileInFolder(path) {
|
export function doOpenFileInFolder(path) {
|
||||||
return () => {
|
return () => {
|
||||||
|
@ -58,11 +59,14 @@ export function doDeleteFile(outpoint, deleteFromComputer, abandonClaim) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export function doDeleteFileAndGoBack(fileInfo, deleteFromComputer, abandonClaim) {
|
export function doDeleteFileAndMaybeGoBack(fileInfo, deleteFromComputer, abandonClaim) {
|
||||||
return dispatch => {
|
return dispatch => {
|
||||||
const actions = [];
|
const actions = [];
|
||||||
actions.push(doHideModal());
|
actions.push(doHideModal());
|
||||||
actions.push(doDeleteFile(fileInfo, deleteFromComputer, abandonClaim));
|
actions.push(doDeleteFile(fileInfo, deleteFromComputer, abandonClaim));
|
||||||
dispatch(batchActions(...actions));
|
dispatch(batchActions(...actions));
|
||||||
|
if (abandonClaim) {
|
||||||
|
dispatch(goBack());
|
||||||
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -138,3 +138,11 @@ export const selectSearchOptionsExpanded = createSelector(
|
||||||
selectState,
|
selectState,
|
||||||
state => state.searchOptionsExpanded
|
state => state.searchOptionsExpanded
|
||||||
);
|
);
|
||||||
|
|
||||||
|
export const selectShouldShowInviteGuide = createSelector(
|
||||||
|
makeSelectClientSetting(SETTINGS.FIRST_RUN_COMPLETED),
|
||||||
|
makeSelectClientSetting(SETTINGS.INVITE_ACKNOWLEDGED),
|
||||||
|
(firstRunCompleted, inviteAcknowledged) => {
|
||||||
|
return firstRunCompleted ? !inviteAcknowledged : false;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
|
@ -28,7 +28,6 @@
|
||||||
@import 'component/markdown-editor';
|
@import 'component/markdown-editor';
|
||||||
@import 'component/markdown-preview';
|
@import 'component/markdown-preview';
|
||||||
@import 'component/media';
|
@import 'component/media';
|
||||||
@import 'component/menu';
|
|
||||||
@import 'component/modal';
|
@import 'component/modal';
|
||||||
@import 'component/navigation';
|
@import 'component/navigation';
|
||||||
@import 'component/notice';
|
@import 'component/notice';
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
|
|
||||||
.banner--first-run {
|
.banner--first-run {
|
||||||
height: 310px;
|
height: 310px;
|
||||||
|
padding-right: var(--spacing-vertical-medium);
|
||||||
|
|
||||||
// Adjust this class inside other `.banner--xxx` styles for control over animation
|
// Adjust this class inside other `.banner--xxx` styles for control over animation
|
||||||
.banner__item--static-for-animation {
|
.banner__item--static-for-animation {
|
||||||
|
|
|
@ -6,7 +6,6 @@
|
||||||
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 1;
|
|
||||||
|
|
||||||
html[data-mode='dark'] & {
|
html[data-mode='dark'] & {
|
||||||
border: 1px solid rgba($lbry-gray-1, 0.3);
|
border: 1px solid rgba($lbry-gray-1, 0.3);
|
||||||
|
|
|
@ -35,13 +35,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__thumb {
|
.media__thumb {
|
||||||
|
flex-shrink: 0;
|
||||||
width: 20rem;
|
width: 20rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__info {
|
.media__info {
|
||||||
margin-left: var(--spacing-vertical-medium);
|
margin-left: var(--spacing-vertical-medium);
|
||||||
width: calc(80% - 20rem);
|
|
||||||
min-width: 40rem;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -49,12 +48,11 @@
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
|
|
||||||
.media__thumb {
|
.media__thumb {
|
||||||
width: 30rem;
|
width: 25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__info {
|
.media__info {
|
||||||
margin-left: var(--spacing-vertical-large);
|
margin-left: var(--spacing-vertical-large);
|
||||||
flex: 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__subtext {
|
.media__subtext {
|
||||||
|
@ -73,12 +71,6 @@
|
||||||
width: 11em;
|
width: 11em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__info {
|
|
||||||
width: calc(100% - 10em);
|
|
||||||
min-width: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.media__title {
|
.media__title {
|
||||||
margin-bottom: var(--spacing-vertical-small);
|
margin-bottom: var(--spacing-vertical-small);
|
||||||
}
|
}
|
||||||
|
@ -153,6 +145,7 @@
|
||||||
font-size: 1.1rem;
|
font-size: 1.1rem;
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
|
user-select: all;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media__insufficient-credits {
|
.media__insufficient-credits {
|
||||||
|
|
|
@ -1,10 +0,0 @@
|
||||||
.menu-container {
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
.menu {
|
|
||||||
padding-top: var(--spacing-vertical-medium);
|
|
||||||
position: absolute;
|
|
||||||
white-space: nowrap;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -4,12 +4,13 @@
|
||||||
height: calc(100vh - var(--header-height));
|
height: calc(100vh - var(--header-height));
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow-y: overlay;
|
overflow: visible;
|
||||||
background-color: $lbry-white;
|
background-color: $lbry-white;
|
||||||
border-right: 1px solid rgba($lbry-gray-1, 0.9);
|
border-right: 1px solid rgba($lbry-gray-1, 0.9);
|
||||||
padding-top: var(--spacing-vertical-large);
|
padding-top: var(--spacing-vertical-large);
|
||||||
padding-right: var(--spacing-vertical-small);
|
padding-right: var(--spacing-vertical-small);
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
|
z-index: 2;
|
||||||
|
|
||||||
html[data-mode='dark'] & {
|
html[data-mode='dark'] & {
|
||||||
background-color: $lbry-black;
|
background-color: $lbry-black;
|
||||||
|
@ -41,7 +42,6 @@
|
||||||
);
|
);
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 0;
|
|
||||||
|
|
||||||
html[data-mode='dark'] & {
|
html[data-mode='dark'] & {
|
||||||
background-image: linear-gradient(
|
background-image: linear-gradient(
|
||||||
|
|
|
@ -20,4 +20,8 @@
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
||||||
|
html[data-mode='dark'] & {
|
||||||
|
background-color: $lbry-black;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
.search__header {
|
.search__header {
|
||||||
background-color: $lbry-black;
|
background-color: $lbry-black;
|
||||||
color: $lbry-white;
|
color: $lbry-white;
|
||||||
min-height: 300px;
|
|
||||||
padding: var(--spacing-vertical-large);
|
padding: var(--spacing-vertical-large);
|
||||||
|
|
||||||
.placeholder {
|
.placeholder {
|
||||||
|
@ -14,6 +13,7 @@
|
||||||
|
|
||||||
.media__subtitle {
|
.media__subtitle {
|
||||||
color: rgba($lbry-white, 0.9);
|
color: rgba($lbry-white, 0.9);
|
||||||
|
font-size: 0.7em;
|
||||||
}
|
}
|
||||||
|
|
||||||
html[data-mode='dark'] & {
|
html[data-mode='dark'] & {
|
||||||
|
|
|
@ -3,8 +3,6 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
.tooltip__body {
|
.tooltip__body {
|
||||||
z-index: 2;
|
|
||||||
|
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue