review changes

.lintstagedrc.json

@@ -1,6 +1,7 @@
 {
   "linters": {
     "ui/**/*.{js,jsx,scss,json}": ["prettier --write", "git add"],
+    "lbrytv/component/*.{js,jsx,scss,json}": ["prettier --write", "git add"],
     "ui/**/*.{js,jsx}": ["eslint", "flow focus-check --color always", "git add"]
   }
 }

lbrytv/component/ads.jsx

@@ -22,12 +22,16 @@ function Extra(props) {
 
   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>
+      <p>Ads</p>
+      <div
+        id="rc-widget-0a74cf"
+        data-rc-widget
+        data-widget-host="habitat"
+        data-endpoint="//trends.revcontent.com"
+        data-widget-id="117427"
+      />
     </>
   );
-};
+}
 
 export default Extra;

ui/component/sideNavigation/view.jsx

@@ -8,7 +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';
+import Ad from 'lbrytv/component/ads';
 
 const SHOW_CHANNELS = 'SHOW_CHANNELS';
 const SHOW_TAGS = 'SHOW_TAGS';

ui/scss/component/_navigation.scss

@@ -15,7 +15,6 @@
 
 .navigation--placeholder {
   @extend .navigation;
-  padding: var(--spacing-quarter) 0rem;
   border-radius: var(--card-radius);
   position: relative;
   margin: auto;
@@ -23,7 +22,6 @@
   p {
     font-size: var(--font-xsmall);
     color: var(--color-text-subtitle);
-    padding: var(--spacing-quarter);
   }
 }
 

ui/scss/init/_vars.scss

@@ -11,7 +11,6 @@ $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);