From 10e38e93bcd4852e0bef6160d2b2a88a993fa2bb Mon Sep 17 00:00:00 2001
From: BFlat <bombayapirat@gmail.com>
Date: Thu, 9 May 2024 10:24:07 +0700
Subject: [PATCH] expression tab styling fix (#361)

fixes filter buttons bottom being cut off on smaller screens and padding
fixes
---
 .../comps/SidePanelTabs/itemTabs/ExpressionTab.tsx       | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/app/pages/PageEnigma/comps/SidePanelTabs/itemTabs/ExpressionTab.tsx b/app/pages/PageEnigma/comps/SidePanelTabs/itemTabs/ExpressionTab.tsx
index e202ec0071..82c9a141b8 100644
--- a/app/pages/PageEnigma/comps/SidePanelTabs/itemTabs/ExpressionTab.tsx
+++ b/app/pages/PageEnigma/comps/SidePanelTabs/itemTabs/ExpressionTab.tsx
@@ -8,7 +8,6 @@ import { useSignals } from "@preact/signals-react/runtime";
 import { ItemElements } from "~/pages/PageEnigma/comps/SidePanelTabs/itemTabs/ItemElements";
 import { Button, FilterButtons } from "~/components";
 import { faCirclePlus } from "@fortawesome/pro-solid-svg-icons";
-import { twMerge } from "tailwind-merge";
 import UploadModalMovement from "~/components/UploadModalMovement";
 import { useCallback, useContext, useEffect, useState } from "react";
 import { MediaFileEngineCategory } from "~/api/media_files/UploadEngineAsset";
@@ -139,8 +138,9 @@ export const ExpressionTab = () => {
   return (
     <>
       <TabTitle title="Expressions" />
-      <div className="w-full overflow-x-auto overflow-y-hidden">
-        <div className="mb-4 flex justify-start gap-2 px-4">
+
+      <div>
+        <div className="flex gap-2 overflow-x-auto overflow-y-hidden px-4">
           <FilterButtons
             {...{
               value: selectedFilter,
@@ -152,7 +152,8 @@ export const ExpressionTab = () => {
           />
         </div>
       </div>
-      <div className="w-full px-4 pb-4">
+
+      <div className="w-full px-4">
         <Button
           icon={faCirclePlus}
           variant="action"