💄 Fix spacing around the filter panel

bluesky-social · Feb 2, 2024 · 116e6f9 · 116e6f9
1 parent 0a21335
commit 116e6f9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 17 deletions.
diff --git a/app/actions/ModActionPanel/QuickAction.tsx b/app/actions/ModActionPanel/QuickAction.tsx
@@ -427,7 +427,7 @@ function Form(
           }
         }
       `}</style>
-      <div className="flex overflow-y-auto scrollable-container">
+      <div className="flex overflow-y-auto scrollable-container pt-1">
         <form
           id={FORM_ID}
           onSubmit={onFormSubmit}

diff --git a/components/common/FullScreenActionPanel.tsx b/components/common/FullScreenActionPanel.tsx
@@ -37,7 +37,7 @@ export function FullScreenActionPanel(props: {
             leaveFrom="opacity-100 scale-100"
             leaveTo="opacity-0 scale-95"
           >
-            <Dialog.Panel className="max-w-screen-lg w-full sm:w-5/6 h-full md:max-h-3/4 md:my-12 align-bottom bg-white rounded-lg text-left sm:overflow-hidden shadow-xl transform transition-all sm:align-middle flex">
+            <Dialog.Panel className="max-w-screen-xl w-full sm:w-5/6 h-full md:max-h-3/4 md:my-12 align-bottom bg-white rounded-lg text-left sm:overflow-hidden shadow-xl transform transition-all sm:align-middle flex">
               <div className="absolute top-0 right-0 pt-4 pr-4">
                 <button
                   type="button"

diff --git a/components/mod-event/EventList.tsx b/components/mod-event/EventList.tsx
@@ -79,7 +79,7 @@ export const ModEventList = (
     createdAfter,
     createdBefore,
     changeListFilter,
-    resetListFilters
+    resetListFilters,
   } = useModEventList(props)
 
   const [showFiltersPanel, setShowFiltersPanel] = useState(false)
@@ -88,7 +88,7 @@ export const ModEventList = (
   const noEvents = modEvents.length === 0 && !isInitialLoadingModEvents
   const isShowingEventsByCreator = !!props.createdBy
   return (
-    <div>
+    <div className='mr-1'>
       <div className="flex flex-row justify-between items-center">
         {!isEntireHistoryView ? (
           <Header
@@ -106,21 +106,21 @@ export const ModEventList = (
         ) : (
           <h4 className="font-medium text-gray-700">Moderation event stream</h4>
         )}
-        <ActionButton
-          size="xs"
-          appearance="outlined"
-          onClick={() => setShowFiltersPanel((current) => !current)}
-        >
-          {hasFilter ? (
-            <FunnelFilledIcon className="h-3 w-3 mr-1" />
-          ) : (
-            <FunnelEmptyIcon className="h-3 w-3 mr-1" />
-          )}
-          <span className="text-xs">Configure</span>
-        </ActionButton>
+          <ActionButton
+            size="xs"
+            appearance="outlined"
+            onClick={() => setShowFiltersPanel((current) => !current)}
+          >
+            {hasFilter ? (
+              <FunnelFilledIcon className="h-3 w-3 mr-1" />
+            ) : (
+              <FunnelEmptyIcon className="h-3 w-3 mr-1" />
+            )}
+            <span className="text-xs">Configure</span>
+          </ActionButton>
       </div>
       {showFiltersPanel && (
-        <div className="shadow rounded py-3 px-5 bg-white mt-2 mx-1">
+        <div className="shadow rounded py-3 px-5 bg-white mt-2">
           <div className="flex flex-row">
             <div className="mr-4">
               <TypeFilterCheckbox