dashboard my lists style fixes (#1107)

* make tab panel 100% width

* fix padding on the top of my lists component

Author: gumaerc

frontends/mit-open/src/pages/DashboardPage/DashboardPage.tsx

@@ -206,6 +206,7 @@ const LinkText = styled(Typography)(({ theme }) => ({
 
 const TabPanelStyled = styled(TabPanel)({
   padding: "0",
+  width: "100%",
 })
 
 const TitleText = styled(Typography)(({ theme }) => ({

frontends/mit-open/src/pages/UserListListingPage/UserListListingPage.tsx

@@ -28,10 +28,13 @@ import { useNavigate } from "react-router"
 import * as urls from "@/common/urls"
 import { manageListDialogs } from "@/page-components/ManageListDialogs/ManageListDialogs"
 
-const ListHeaderGrid = styled(Grid)`
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-`
+const PageContainer = styled(Container)({
+  marginTop: "1rem",
+})
+
+const ListHeaderGrid = styled(Grid)({
+  marginBottom: "1rem",
+})
 
 type EditUserListMenuProps = {
   userList: UserList
@@ -164,12 +167,12 @@ const UserListListingPage: React.FC = () => {
       <MetaTags>
         <title>User Lists</title>
       </MetaTags>
-      <Container maxWidth="sm">
+      <PageContainer maxWidth="sm">
         <UserListListingComponent
           title="User Lists"
           onActivate={handleActivate}
         />
-      </Container>
+      </PageContainer>
     </BannerPage>
   )
 }