loads script for alternate sidebar

This commit is contained in:
jessop 2020-01-23 11:21:36 -05:00 committed by Sean Yesmunt
parent 0172ec931d
commit 2261a92fe5
5 changed files with 43 additions and 16 deletions

View file

@ -26,6 +26,6 @@ module.name_mapper='^analytics\(.*\)$' -> '<PROJECT_ROOT>/ui/analytics\1'
module.name_mapper='^i18n\(.*\)$' -> '<PROJECT_ROOT>/ui/i18n\1'
module.name_mapper='^effects\(.*\)$' -> '<PROJECT_ROOT>/ui/effects\1'
module.name_mapper='^config\(.*\)$' -> '<PROJECT_ROOT>/config\1'
module.name_mapper='^lbrytv\/component\(.*\)$' -> '<PROJECT_ROOT>/lbrytv/component\1'
[strict]

View file

@ -0,0 +1,33 @@
import React, { useEffect } from 'react';
function Extra(props) {
const url = '//assets.revcontent.com/master/delivery.js';
useEffect(() => {
const script = document.createElement('script');
script.src = url;
script.async = true;
document.body.appendChild(script);
return () => {
document.body.removeChild(script);
// if user navigates too rapidly, <style> tags can build up
if (document.body.getElementsByTagName('style').length) {
document.body.getElementsByTagName('style')[0].remove();
}
};
}, []);
return (
<>
<div><p>Ads</p></div>
<div>
<div id="rc-widget-0a74cf" data-rc-widget data-widget-host="habitat" data-endpoint="//trends.revcontent.com" data-widget-id="117427" />
</div>
</>
);
};
export default Extra;

View file

@ -8,6 +8,7 @@ import Tag from 'component/tag';
import StickyBox from 'react-sticky-box/dist/esnext';
import Spinner from 'component/spinner';
import usePersistedState from 'effects/use-persisted-state';
import Ad from 'lbrytv/component/ad';
const SHOW_CHANNELS = 'SHOW_CHANNELS';
const SHOW_TAGS = 'SHOW_TAGS';
@ -84,11 +85,8 @@ function SideNavigation(props: Props) {
return obscureSideNavigation ? (
<Wrapper>
<div className="card navigation--placeholder">
<div className="wrap">
<h2>LBRY</h2>
<p>{__('The best decentralized content platform on the web.')}</p>
</div>
<div className="navigation--placeholder">
<Ad />
</div>
</Wrapper>
) : (

View file

@ -15,20 +15,15 @@
.navigation--placeholder {
@extend .navigation;
padding: 2rem 1.5rem;
padding: var(--spacing-quarter) 0rem;
border-radius: var(--card-radius);
font-weight: var(--font-weight-bold);
color: #fff;
position: relative;
background-color: black;
h2 {
font-size: 2rem;
font-weight: var(--font-weight-bold);
}
margin: auto;
p {
font-size: 1.2rem;
font-size: var(--font-xsmall);
color: var(--color-text-subtitle);
padding: var(--spacing-quarter);
}
}

View file

@ -11,6 +11,7 @@ $breakpoint-small: 900px;
--mac-titlebar-height: 1.5rem;
--mobile: 600px;
--side-nav-width: 170px;
--spacing-quarter: calc(1rem / 4);
--spacing-miniscule: calc(2rem / 5);
--spacing-xsmall: calc(2rem / 4);
--spacing-small: calc(2rem / 3);