pages

components/Content.jsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 
 const Content = ({ className, visible, children }) => (
-  <div className={classNames(`h-full overflow-auto py-2 absolute top-0 ${className || ''}`, {
+  <div className={classNames(`h-full overflow-auto py-2 absolute top-0`, className, {
     visible,
     invisible: !visible
   })}>

components/pages/Profile.jsx

@@ -3,7 +3,7 @@ import Content from "../Content";
 
 const Profile = ({ selected }) => {
   return (
-    <Content visible={selected}>
+    <Content visible={selected} className="p-4">
       <h2>Profile</h2>
     </Content>
   )

components/pages/Settings.jsx

@@ -2,7 +2,7 @@ import Content from "../Content";
 
 const Settings = ({ selected }) => {
   return (
-    <Content visible={selected}>
+    <Content visible={selected} className="p-4">
       <h2>Settings</h2>
     </Content>
   )