diff --git a/src/components/RequestList/RequestItem/index.tsx b/src/components/RequestList/RequestItem/index.tsx
index 73c60e988..16a98dd3b 100644
--- a/src/components/RequestList/RequestItem/index.tsx
+++ b/src/components/RequestList/RequestItem/index.tsx
@@ -1,12 +1,7 @@
 import React, { useContext, useState } from 'react';
 import { useInView } from 'react-intersection-observer';
 import type { MediaRequest } from '../../../../server/entity/MediaRequest';
-import {
-  useIntl,
-  FormattedDate,
-  FormattedRelativeTime,
-  defineMessages,
-} from 'react-intl';
+import { useIntl, FormattedRelativeTime, defineMessages } from 'react-intl';
 import { useUser, Permission } from '../../../hooks/useUser';
 import { LanguageContext } from '../../../context/LanguageContext';
 import type { MovieDetails } from '../../../../server/models/Movie';
@@ -14,7 +9,6 @@ import type { TvDetails } from '../../../../server/models/Tv';
 import useSWR from 'swr';
 import Badge from '../../Common/Badge';
 import StatusBadge from '../../StatusBadge';
-import Table from '../../Common/Table';
 import {
   MediaRequestStatus,
   MediaStatus,
@@ -25,11 +19,16 @@ import globalMessages from '../../../i18n/globalMessages';
 import Link from 'next/link';
 import { useToasts } from 'react-toast-notifications';
 import RequestModal from '../../RequestModal';
+import ConfirmButton from '../../Common/ConfirmButton';
 
 const messages = defineMessages({
   seasons: 'Seasons',
   notavailable: 'N/A',
   failedretry: 'Something went wrong while retrying the request.',
+  areyousure: 'Are you sure?',
+  status: 'Status',
+  requested: 'Requested',
+  modifiedby: 'Modified By',
 });
 
 const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => {
@@ -101,22 +100,24 @@ const RequestItem: React.FC<RequestItemProps> = ({
 
   if (!title && !error) {
     return (
-      <tr className="w-full h-24 animate-pulse" ref={ref}>
-        <td colSpan={6}></td>
-      </tr>
+      <div
+        className="w-full h-64 bg-gray-800 rounded-md lg:h-32 animate-pulse"
+        ref={ref}
+      />
     );
   }
 
   if (!title || !requestData) {
     return (
-      <tr className="w-full h-24 animate-pulse">
-        <td colSpan={6}></td>
-      </tr>
+      <div
+        className="w-full h-64 bg-gray-800 rounded-md lg:h-32 animate-pulse"
+        ref={ref}
+      />
     );
   }
 
   return (
-    <tr className="relative w-full h-24 p-2">
+    <>
       <RequestModal
         show={showEditModal}
         tmdbId={request.media.tmdbId}
@@ -129,28 +130,24 @@ const RequestItem: React.FC<RequestItemProps> = ({
           setShowEditModal(false);
         }}
       />
-      <Table.TD>
-        <div className="flex items-center">
-          <Link
-            href={
-              request.type === 'movie'
-                ? `/movie/${request.media.tmdbId}`
-                : `/tv/${request.media.tmdbId}`
+      <div className="relative flex flex-col justify-between w-full p-4 overflow-hidden text-white bg-gray-800 rounded-md shadow-md lg:h-32 lg:flex-row">
+        <div
+          className="absolute inset-0 z-0 w-full bg-center bg-cover lg:w-2/3"
+          style={{
+            backgroundImage: `linear-gradient(90deg, rgba(31, 41, 55, 0.47) 0%, rgba(31, 41, 55, 1) 100%), url(//image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath})`,
+          }}
+        />
+        <div className="relative z-10 flex w-full lg:w-60 xl:w-80 2xl:w-96">
+          <img
+            src={
+              title.posterPath
+                ? `//image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
+                : '/images/overseerr_poster_not_found.png'
             }
-          >
-            <a className="flex-shrink-0 hidden mr-4 sm:block">
-              <img
-                src={
-                  title.posterPath
-                    ? `//image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
-                    : '/images/overseerr_poster_not_found.png'
-                }
-                alt=""
-                className="w-12 transition duration-300 scale-100 rounded-md shadow-sm cursor-pointer transform-gpu hover:scale-105 hover:shadow-md"
-              />
-            </a>
-          </Link>
-          <div className="flex-shrink overflow-hidden">
+            alt=""
+            className="h-full transition duration-300 scale-100 rounded-md shadow-sm cursor-pointer w-14 lg:w-auto lg:h-full transform-gpu hover:scale-105 hover:shadow-md"
+          />
+          <div className="flex flex-col justify-start ml-2 overflow-hidden lg:justify-center lg:ml-4">
             <Link
               href={
                 requestData.type === 'movie'
@@ -158,12 +155,12 @@ const RequestItem: React.FC<RequestItemProps> = ({
                   : `/tv/${requestData.media.tmdbId}`
               }
             >
-              <a className="min-w-0 mr-2 text-xl text-white truncate hover:underline">
+              <a className="min-w-0 mr-2 text-lg text-white truncate lg:text-xl hover:underline">
                 {isMovie(title) ? title.title : title.name}
               </a>
             </Link>
             <Link href={`/users/${requestData.requestedBy.id}`}>
-              <a className="flex items-center mt-1">
+              <a className="flex items-center mt-2">
                 <img
                   src={requestData.requestedBy.avatar}
                   alt=""
@@ -175,7 +172,7 @@ const RequestItem: React.FC<RequestItemProps> = ({
               </a>
             </Link>
             {requestData.seasons.length > 0 && (
-              <div className="items-center hidden mt-2 text-sm sm:flex">
+              <div className="flex items-center mt-2 text-sm">
                 <span className="mr-2">
                   {intl.formatMessage(messages.seasons)}
                 </span>
@@ -188,191 +185,204 @@ const RequestItem: React.FC<RequestItemProps> = ({
             )}
           </div>
         </div>
-      </Table.TD>
-      <Table.TD>
-        {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-          MediaStatus.UNKNOWN ||
-        requestData.status === MediaRequestStatus.DECLINED ? (
-          <Badge badgeType="danger">
-            {requestData.status === MediaRequestStatus.DECLINED
-              ? intl.formatMessage(globalMessages.declined)
-              : intl.formatMessage(globalMessages.failed)}
-          </Badge>
-        ) : (
-          <StatusBadge
-            status={requestData.media[requestData.is4k ? 'status4k' : 'status']}
-            inProgress={
-              (
-                requestData.media[
-                  requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
-                ] ?? []
-              ).length > 0
-            }
-            is4k={requestData.is4k}
-            plexUrl={requestData.media.plexUrl}
-            plexUrl4k={requestData.media.plexUrl4k}
-          />
-        )}
-      </Table.TD>
-      <Table.TD>
-        <div className="flex flex-col">
-          <span className="text-sm text-gray-300">
-            <FormattedDate value={requestData.createdAt} />
-          </span>
-        </div>
-      </Table.TD>
-      <Table.TD>
-        <div className="flex flex-col">
-          {requestData.modifiedBy ? (
-            <span className="text-sm text-gray-300">
-              <div className="flex items-center">
-                <img
-                  src={requestData.modifiedBy.avatar}
-                  alt=""
-                  className="w-5 mr-2 rounded-full"
-                />
-                <span className="text-sm">
-                  {requestData.modifiedBy.displayName} (
-                  <FormattedRelativeTime
-                    value={Math.floor(
-                      (new Date(requestData.updatedAt).getTime() - Date.now()) /
-                        1000
-                    )}
-                    updateIntervalInSeconds={1}
-                  />
-                  )
+        <div className="z-10 flex flex-col justify-between w-full mt-4 text-sm lg:mt-0 lg:flex-1 lg:ml-4">
+          <div className="flex items-center my-1">
+            <span className="mr-2">{intl.formatMessage(messages.status)}</span>
+            {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
+              MediaStatus.UNKNOWN ||
+            requestData.status === MediaRequestStatus.DECLINED ? (
+              <Badge badgeType="danger">
+                {requestData.status === MediaRequestStatus.DECLINED
+                  ? intl.formatMessage(globalMessages.declined)
+                  : intl.formatMessage(globalMessages.failed)}
+              </Badge>
+            ) : (
+              <StatusBadge
+                status={
+                  requestData.media[requestData.is4k ? 'status4k' : 'status']
+                }
+                inProgress={
+                  (
+                    requestData.media[
+                      requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
+                    ] ?? []
+                  ).length > 0
+                }
+                is4k={requestData.is4k}
+                plexUrl={requestData.media.plexUrl}
+                plexUrl4k={requestData.media.plexUrl4k}
+              />
+            )}
+          </div>
+          <div className="flex items-center my-1">
+            <span className="mr-2">
+              {intl.formatMessage(messages.requested)}
+            </span>
+            <span className="text-gray-300">
+              {intl.formatDate(requestData.createdAt)}
+            </span>
+          </div>
+          <div className="flex items-center my-1">
+            <span className="mr-2">
+              {intl.formatMessage(messages.modifiedby)}
+            </span>
+            <span>
+              {requestData.modifiedBy ? (
+                <span className="text-sm text-gray-300">
+                  <Link href={`/users/${requestData.modifiedBy.id}`}>
+                    <a className="flex items-center">
+                      <img
+                        src={requestData.modifiedBy.avatar}
+                        alt=""
+                        className="w-5 mr-2 rounded-full"
+                      />
+                      <span className="text-sm">
+                        {requestData.modifiedBy.displayName} (
+                        <FormattedRelativeTime
+                          value={Math.floor(
+                            (new Date(requestData.updatedAt).getTime() -
+                              Date.now()) /
+                              1000
+                          )}
+                          updateIntervalInSeconds={1}
+                        />
+                        )
+                      </span>
+                    </a>
+                  </Link>
                 </span>
-              </div>
+              ) : (
+                <span className="text-sm text-gray-300">N/A</span>
+              )}
             </span>
-          ) : (
-            <span className="text-sm text-gray-300">N/A</span>
-          )}
+          </div>
         </div>
-      </Table.TD>
-      <Table.TD alignText="right">
-        {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-          MediaStatus.UNKNOWN &&
-          requestData.status !== MediaRequestStatus.DECLINED &&
-          hasPermission(Permission.MANAGE_REQUESTS) && (
-            <Button
-              className="mr-2"
-              buttonType="primary"
-              buttonSize="sm"
-              disabled={isRetrying}
-              onClick={() => retryRequest()}
-            >
-              <svg
-                className="w-4 h-4 mr-0 sm:mr-1"
-                fill="currentColor"
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 24 24"
-                width="18px"
-                height="18px"
+        <div className="z-10 flex flex-row justify-between w-full mt-4 flex-nowrap lg:flex-col lg:mt-0 lg:items-end lg:justify-around lg:w-64">
+          {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
+            MediaStatus.UNKNOWN &&
+            requestData.status !== MediaRequestStatus.DECLINED &&
+            hasPermission(Permission.MANAGE_REQUESTS) && (
+              <Button
+                className="w-full mr-2 lg:mr-0"
+                buttonType="primary"
+                disabled={isRetrying}
+                onClick={() => retryRequest()}
               >
-                <path d="M0 0h24v24H0z" fill="none" />
-                <path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z" />
-              </svg>
-              <span className="hidden sm:block">
-                {intl.formatMessage(globalMessages.retry)}
-              </span>
-            </Button>
-          )}
-        {requestData.status !== MediaRequestStatus.PENDING &&
-          hasPermission(Permission.MANAGE_REQUESTS) && (
-            <Button
-              buttonType="danger"
-              buttonSize="sm"
-              onClick={() => deleteRequest()}
-            >
-              <svg
-                className="w-4 h-4 mr-0 sm:mr-1"
-                fill="currentColor"
-                viewBox="0 0 20 20"
-                xmlns="http://www.w3.org/2000/svg"
+                <svg
+                  className="w-5 h-5 mr-1"
+                  fill="currentColor"
+                  xmlns="http://www.w3.org/2000/svg"
+                  viewBox="0 0 24 24"
+                  width="18px"
+                  height="18px"
+                >
+                  <path d="M0 0h24v24H0z" fill="none" />
+                  <path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z" />
+                </svg>
+                <span className="block">
+                  {intl.formatMessage(globalMessages.retry)}
+                </span>
+              </Button>
+            )}
+          {requestData.status !== MediaRequestStatus.PENDING &&
+            hasPermission(Permission.MANAGE_REQUESTS) && (
+              <ConfirmButton
+                onClick={() => deleteRequest()}
+                confirmText={intl.formatMessage(messages.areyousure)}
+                className="w-full"
               >
-                <path
-                  fillRule="evenodd"
-                  d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
-                  clipRule="evenodd"
-                />
-              </svg>
-              <span className="hidden sm:block">
-                {intl.formatMessage(globalMessages.delete)}
-              </span>
-            </Button>
-          )}
-        {requestData.status === MediaRequestStatus.PENDING &&
-          hasPermission(Permission.MANAGE_REQUESTS) && (
-            <>
-              <span className="mr-2">
-                <Button
-                  buttonType="success"
-                  buttonSize="sm"
-                  onClick={() => modifyRequest('approve')}
+                <svg
+                  className="w-5 h-5 mr-1"
+                  fill="currentColor"
+                  viewBox="0 0 20 20"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  <svg
-                    className="w-4 h-4 mr-0 sm:mr-1"
-                    fill="currentColor"
-                    viewBox="0 0 20 20"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      fillRule="evenodd"
-                      d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
-                      clipRule="evenodd"
-                    />
-                  </svg>
-                  <span className="hidden sm:block">
-                    {intl.formatMessage(globalMessages.approve)}
+                  <path
+                    fillRule="evenodd"
+                    d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
+                    clipRule="evenodd"
+                  />
+                </svg>
+                <span className="block">
+                  {intl.formatMessage(globalMessages.delete)}
+                </span>
+              </ConfirmButton>
+            )}
+          {requestData.status === MediaRequestStatus.PENDING &&
+            hasPermission(Permission.MANAGE_REQUESTS) && (
+              <>
+                <div className="flex flex-row w-full">
+                  <span className="w-full mr-2">
+                    <Button
+                      className="w-full"
+                      buttonType="success"
+                      onClick={() => modifyRequest('approve')}
+                    >
+                      <svg
+                        className="w-5 h-5 mr-1"
+                        fill="currentColor"
+                        viewBox="0 0 20 20"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          fillRule="evenodd"
+                          d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
+                          clipRule="evenodd"
+                        />
+                      </svg>
+                      <span className="block">
+                        {intl.formatMessage(globalMessages.approve)}
+                      </span>
+                    </Button>
                   </span>
-                </Button>
-              </span>
-              <span className="mr-2">
-                <Button
-                  buttonType="danger"
-                  buttonSize="sm"
-                  onClick={() => modifyRequest('decline')}
-                >
-                  <svg
-                    className="w-4 h-4 mr-0 sm:mr-1"
-                    fill="currentColor"
-                    viewBox="0 0 20 20"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      fillRule="evenodd"
-                      d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
-                      clipRule="evenodd"
-                    />
-                  </svg>
-                  <span className="hidden sm:block">
-                    {intl.formatMessage(globalMessages.decline)}
+                  <span className="w-full mr-2 lg:mr-0">
+                    <Button
+                      className="w-full"
+                      buttonType="danger"
+                      onClick={() => modifyRequest('decline')}
+                    >
+                      <svg
+                        className="w-5 h-5 mr-1"
+                        fill="currentColor"
+                        viewBox="0 0 20 20"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          fillRule="evenodd"
+                          d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
+                          clipRule="evenodd"
+                        />
+                      </svg>
+                      <span className="block">
+                        {intl.formatMessage(globalMessages.decline)}
+                      </span>
+                    </Button>
                   </span>
-                </Button>
-              </span>
-              <span>
-                <Button
-                  buttonType="primary"
-                  buttonSize="sm"
-                  onClick={() => setShowEditModal(true)}
-                >
-                  <svg
-                    className="w-4 h-4 mr-0 sm:mr-1"
-                    fill="currentColor"
-                    viewBox="0 0 20 20"
-                    xmlns="http://www.w3.org/2000/svg"
+                </div>
+                <span className="w-full">
+                  <Button
+                    className="w-full"
+                    buttonType="primary"
+                    onClick={() => setShowEditModal(true)}
                   >
-                    <path d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z" />
-                  </svg>
-                  <span className="hidden sm:block">
-                    {intl.formatMessage(globalMessages.edit)}
-                  </span>
-                </Button>
-              </span>
-            </>
-          )}
-      </Table.TD>
-    </tr>
+                    <svg
+                      className="w-5 h-5 mr-1"
+                      fill="currentColor"
+                      viewBox="0 0 20 20"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z" />
+                    </svg>
+                    <span className="block">
+                      {intl.formatMessage(globalMessages.edit)}
+                    </span>
+                  </Button>
+                </span>
+              </>
+            )}
+        </div>
+      </div>
+    </>
   );
 };
 
diff --git a/src/components/RequestList/index.tsx b/src/components/RequestList/index.tsx
index 0be3bb008..27db650ca 100644
--- a/src/components/RequestList/index.tsx
+++ b/src/components/RequestList/index.tsx
@@ -1,20 +1,15 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import useSWR from 'swr';
 import type { RequestResultsResponse } from '../../../server/interfaces/api/requestInterfaces';
 import LoadingSpinner from '../Common/LoadingSpinner';
 import RequestItem from './RequestItem';
 import Header from '../Common/Header';
-import Table from '../Common/Table';
 import Button from '../Common/Button';
 import { defineMessages, useIntl } from 'react-intl';
 import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   requests: 'Requests',
-  mediaInfo: 'Media Info',
-  status: 'Status',
-  requestedAt: 'Requested At',
-  modifiedBy: 'Last Modified By',
   showingresults:
     'Showing <strong>{from}</strong> to <strong>{to}</strong> of <strong>{total}</strong> results',
   resultsperpage: 'Display {pageSize} results per page',
@@ -46,6 +41,32 @@ const RequestList: React.FC = () => {
       pageIndex * currentPageSize
     }&filter=${currentFilter}&sort=${currentSort}`
   );
+
+  // Restore last set filter values on component mount
+  useEffect(() => {
+    const filterString = window.localStorage.getItem('rl-filter-settings');
+
+    if (filterString) {
+      const filterSettings = JSON.parse(filterString);
+
+      setCurrentFilter(filterSettings.currentFilter);
+      setCurrentSort(filterSettings.currentSort);
+      setCurrentPageSize(filterSettings.currentPageSize);
+    }
+  }, []);
+
+  // Set fitler values to local storage any time they are changed
+  useEffect(() => {
+    window.localStorage.setItem(
+      'rl-filter-settings',
+      JSON.stringify({
+        currentFilter,
+        currentSort,
+        currentPageSize,
+      })
+    );
+  }, [currentFilter, currentSort, currentPageSize]);
+
   if (!data && !error) {
     return <LoadingSpinner />;
   }
@@ -60,7 +81,7 @@ const RequestList: React.FC = () => {
   return (
     <>
       <PageTitle title={intl.formatMessage(messages.requests)} />
-      <div className="flex flex-col justify-between lg:items-end lg:flex-row">
+      <div className="flex flex-col justify-between mb-4 lg:items-end lg:flex-row">
         <Header>{intl.formatMessage(messages.requests)}</Header>
         <div className="flex flex-col flex-grow mt-2 sm:flex-row lg:flex-grow-0">
           <div className="flex flex-grow mb-2 sm:mb-0 sm:mr-2 lg:flex-grow-0">
@@ -140,114 +161,96 @@ const RequestList: React.FC = () => {
           </div>
         </div>
       </div>
-      <Table>
-        <thead>
-          <tr>
-            <Table.TH>{intl.formatMessage(messages.mediaInfo)}</Table.TH>
-            <Table.TH>{intl.formatMessage(messages.status)}</Table.TH>
-            <Table.TH>{intl.formatMessage(messages.requestedAt)}</Table.TH>
-            <Table.TH>{intl.formatMessage(messages.modifiedBy)}</Table.TH>
-            <Table.TH></Table.TH>
-          </tr>
-        </thead>
-        <Table.TBody>
-          {data.results.map((request) => {
-            return (
-              <RequestItem
-                request={request}
-                key={`request-list-${request.id}`}
-                revalidateList={() => revalidate()}
-              />
-            );
-          })}
+      {data.results.map((request) => {
+        return (
+          <div className="py-2" key={`request-list-${request.id}`}>
+            <RequestItem
+              request={request}
+              revalidateList={() => revalidate()}
+            />
+          </div>
+        );
+      })}
 
-          {data.results.length === 0 && (
-            <tr className="relative h-24 p-2 text-white">
-              <Table.TD colSpan={6} noPadding>
-                <div className="flex flex-col items-center justify-center w-screen p-6 lg:w-full">
-                  <span className="text-base">
-                    {intl.formatMessage(messages.noresults)}
-                  </span>
-                  {currentFilter !== 'all' && (
-                    <div className="mt-4">
-                      <Button
-                        buttonSize="sm"
-                        buttonType="primary"
-                        onClick={() => setCurrentFilter('all')}
-                      >
-                        {intl.formatMessage(messages.showallrequests)}
-                      </Button>
-                    </div>
-                  )}
-                </div>
-              </Table.TD>
-            </tr>
-          )}
-          <tr className="bg-gray-700">
-            <Table.TD colSpan={6} noPadding>
-              <nav
-                className="flex flex-col items-center w-screen px-6 py-3 space-x-4 space-y-3 sm:space-y-0 sm:flex-row lg:w-full"
-                aria-label="Pagination"
+      {data.results.length === 0 && (
+        <div className="flex flex-col items-center justify-center w-screen p-6 text-white lg:w-full">
+          <span className="text-base">
+            {intl.formatMessage(messages.noresults)}
+          </span>
+          {currentFilter !== 'all' && (
+            <div className="mt-4">
+              <Button
+                buttonSize="sm"
+                buttonType="primary"
+                onClick={() => setCurrentFilter('all')}
               >
-                <div className="hidden lg:flex lg:flex-1">
-                  <p className="text-sm">
-                    {data.results.length > 0 &&
-                      intl.formatMessage(messages.showingresults, {
-                        from: pageIndex * currentPageSize + 1,
-                        to:
-                          data.results.length < currentPageSize
-                            ? pageIndex * currentPageSize + data.results.length
-                            : (pageIndex + 1) * currentPageSize,
-                        total: data.pageInfo.results,
-                        strong: function strong(msg) {
-                          return <span className="font-medium">{msg}</span>;
-                        },
-                      })}
-                  </p>
-                </div>
-                <div className="flex justify-center sm:flex-1 sm:justify-start lg:justify-center">
-                  <span className="items-center -mt-3 text-sm sm:-ml-4 lg:ml-0 sm:mt-0">
-                    {intl.formatMessage(messages.resultsperpage, {
-                      pageSize: (
-                        <select
-                          id="pageSize"
-                          name="pageSize"
-                          onChange={(e) => {
-                            setPageIndex(0);
-                            setCurrentPageSize(Number(e.target.value));
-                          }}
-                          value={currentPageSize}
-                          className="inline short"
-                        >
-                          <option value="5">5</option>
-                          <option value="10">10</option>
-                          <option value="25">25</option>
-                          <option value="50">50</option>
-                          <option value="100">100</option>
-                        </select>
-                      ),
-                    })}
-                  </span>
-                </div>
-                <div className="flex justify-center flex-auto space-x-2 sm:justify-end sm:flex-1">
-                  <Button
-                    disabled={!hasPrevPage}
-                    onClick={() => setPageIndex((current) => current - 1)}
-                  >
-                    {intl.formatMessage(messages.previous)}
-                  </Button>
-                  <Button
-                    disabled={!hasNextPage}
-                    onClick={() => setPageIndex((current) => current + 1)}
+                {intl.formatMessage(messages.showallrequests)}
+              </Button>
+            </div>
+          )}
+        </div>
+      )}
+      <div className="mt-6 text-white">
+        <nav
+          className="flex flex-col items-center py-3 space-x-4 space-y-3 sm:space-y-0 sm:flex-row lg:w-full"
+          aria-label="Pagination"
+        >
+          <div className="hidden lg:flex lg:flex-1">
+            <p className="text-sm">
+              {data.results.length > 0 &&
+                intl.formatMessage(messages.showingresults, {
+                  from: pageIndex * currentPageSize + 1,
+                  to:
+                    data.results.length < currentPageSize
+                      ? pageIndex * currentPageSize + data.results.length
+                      : (pageIndex + 1) * currentPageSize,
+                  total: data.pageInfo.results,
+                  strong: function strong(msg) {
+                    return <span className="font-medium">{msg}</span>;
+                  },
+                })}
+            </p>
+          </div>
+          <div className="flex justify-center sm:flex-1 sm:justify-start lg:justify-center">
+            <span className="items-center -mt-3 text-sm sm:-ml-4 lg:ml-0 sm:mt-0">
+              {intl.formatMessage(messages.resultsperpage, {
+                pageSize: (
+                  <select
+                    id="pageSize"
+                    name="pageSize"
+                    onChange={(e) => {
+                      setPageIndex(0);
+                      setCurrentPageSize(Number(e.target.value));
+                    }}
+                    value={currentPageSize}
+                    className="inline short"
                   >
-                    {intl.formatMessage(messages.next)}
-                  </Button>
-                </div>
-              </nav>
-            </Table.TD>
-          </tr>
-        </Table.TBody>
-      </Table>
+                    <option value="5">5</option>
+                    <option value="10">10</option>
+                    <option value="25">25</option>
+                    <option value="50">50</option>
+                    <option value="100">100</option>
+                  </select>
+                ),
+              })}
+            </span>
+          </div>
+          <div className="flex justify-center flex-auto space-x-2 sm:justify-end sm:flex-1">
+            <Button
+              disabled={!hasPrevPage}
+              onClick={() => setPageIndex((current) => current - 1)}
+            >
+              {intl.formatMessage(messages.previous)}
+            </Button>
+            <Button
+              disabled={!hasNextPage}
+              onClick={() => setPageIndex((current) => current + 1)}
+            >
+              {intl.formatMessage(messages.next)}
+            </Button>
+          </div>
+        </nav>
+      </div>
     </>
   );
 };
diff --git a/src/i18n/locale/en.json b/src/i18n/locale/en.json
index c3821d337..eafcb6924 100644
--- a/src/i18n/locale/en.json
+++ b/src/i18n/locale/en.json
@@ -165,27 +165,27 @@
   "components.RequestButton.viewrequest4k": "View 4K Request",
   "components.RequestCard.all": "All",
   "components.RequestCard.seasons": "Seasons",
+  "components.RequestList.RequestItem.areyousure": "Are you sure?",
   "components.RequestList.RequestItem.failedretry": "Something went wrong while retrying the request.",
+  "components.RequestList.RequestItem.modifiedby": "Modified By",
   "components.RequestList.RequestItem.notavailable": "N/A",
+  "components.RequestList.RequestItem.requested": "Requested",
   "components.RequestList.RequestItem.seasons": "Seasons",
+  "components.RequestList.RequestItem.status": "Status",
   "components.RequestList.filterAll": "All",
   "components.RequestList.filterApproved": "Approved",
   "components.RequestList.filterAvailable": "Available",
   "components.RequestList.filterPending": "Pending",
   "components.RequestList.filterProcessing": "Processing",
-  "components.RequestList.mediaInfo": "Media Info",
-  "components.RequestList.modifiedBy": "Last Modified By",
   "components.RequestList.next": "Next",
   "components.RequestList.noresults": "No results.",
   "components.RequestList.previous": "Previous",
-  "components.RequestList.requestedAt": "Requested At",
   "components.RequestList.requests": "Requests",
   "components.RequestList.resultsperpage": "Display {pageSize} results per page",
   "components.RequestList.showallrequests": "Show All Requests",
   "components.RequestList.showingresults": "Showing <strong>{from}</strong> to <strong>{to}</strong> of <strong>{total}</strong> results",
   "components.RequestList.sortAdded": "Request Date",
   "components.RequestList.sortModified": "Last Modified",
-  "components.RequestList.status": "Status",
   "components.RequestModal.AdvancedRequester.advancedoptions": "Advanced Options",
   "components.RequestModal.AdvancedRequester.animenote": "* This series is an anime.",
   "components.RequestModal.AdvancedRequester.default": "(Default)",