Use some style values so it looks like this page is making progress

web/components/action-buttons/ExternalActionButtonRow.tsx

@@ -1,5 +1,6 @@
 import { ExternalAction } from '../interfaces/external-action.interface';
 import ExternalActionButton from './ExternalActionButton';
+import s from './ExternalActionButtons.module.scss';
 
 interface Props {
   actions: ExternalAction[];
@@ -9,7 +10,7 @@ export default function ExternalActionButtonRow(props: Props) {
   const { actions } = props;
 
   return (
-    <div>
+    <div className={`${s.row}`}>
       {actions.map(action => (
         <ExternalActionButton key={action.id} action={action} />
       ))}

web/components/ui/Content/Content.module.scss

@@ -23,6 +23,14 @@
     grid-template-rows: 1fr var(--header-h);
 }
 
+.pageContentSection {
+  background-color: var(--theme-background-secondary);
+  border-radius: var(--theme-rounded-corners);
+  margin: 1vw;
+  padding: 1vw;
+  width: 100%;
+}
+
 @media (min-width: 768px) {
     .mobileChat {
         display: none;

web/components/ui/Content/Content.tsx

@@ -54,13 +54,14 @@ export default function FooterComponent() {
         />
         <div className={`${s.lowerRow}`}>
           <Tabs defaultActiveKey="1" type="card">
-            <TabPane tab="About" key="1">
+            <TabPane tab="About" key="1" className={`${s.pageContentSection}`}>
               <CustomPageContent content={extraPageContent} />
             </TabPane>
-            <TabPane tab="Followers" key="2">
+            <TabPane tab="Followers" key="2" className={`${s.pageContentSection}`}>
               <FollowerCollection total={total} followers={followers} />
             </TabPane>
           </Tabs>
+
           {chatOpen && (
             <div className={`${s.mobileChat}`}>
               <ChatContainer messages={messages} state={chatState} />

web/components/ui/Sidebar/Sidebar.module.scss

@@ -1,5 +1,5 @@
 .root {
-  background-color: var(--gray-700);
+  background-color: var(--theme-background-secondary);
   display: none;
 }
 

web/components/video/Player.module.scss

@@ -0,0 +1,5 @@
+.player {
+  height: 90vh;
+  width: 100%;
+  background-color: green;
+}

web/components/video/player.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import videojs from 'video.js';
+import s from './Player.module.scss';
 
 require('video.js/dist/video-js.css');
 
@@ -47,11 +48,7 @@ export function VideoJS(props) {
 
   return (
     <div data-vjs-player>
-      <video
-        ref={videoRef}
-        className="video-js vjs-big-play-centered"
-        style={{ width: '100%', height: '100%' }}
-      />
+      <video ref={videoRef} className={`video-js vjs-big-play-centered ${s.player}`} />
     </div>
   );
 }