From c8e2bcf42b0369ab7612c5b6acb6a1ecf5686249 Mon Sep 17 00:00:00 2001 From: Eugene Onuoha Date: Fri, 22 Mar 2024 16:09:59 +0100 Subject: [PATCH] fix: padding around 'Select a tab' label in mobile view (#10150) (#10191) * added padding to the select a tab label * added padding to the select a tab label * added padding to the select a tab label * style: reorder utility classes for improved readability * rearranged class names according to tailwind's recommended order applied prettier tailwind CSS plugin for class sorting --- components/event/EventTabs.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/event/EventTabs.js b/components/event/EventTabs.js index 6a6e7df09b3..052ca1bf046 100644 --- a/components/event/EventTabs.js +++ b/components/event/EventTabs.js @@ -18,7 +18,7 @@ export function EventTabs({ tabs, eventType, onEventTypeChange }) { label="Select a tab" value={tabs.find((tab) => tab.key === eventType)?.title} onChange={(e) => changeTab(e)} - className="block w-full rounded-md border-primary-medium-low dark:bg-primary-medium dark:focus:border-secondary-low dark:focus:ring-secondary-low focus:border-secondary-low focus:ring-secondary-low" + className="mb-2 block w-full rounded-md border-primary-medium-low px-3 py-1 focus:border-secondary-low focus:ring-secondary-low dark:bg-primary-medium dark:focus:border-secondary-low dark:focus:ring-secondary-low" options={tabs.map((tab) => ({ label: tab.title, value: tab.title }))} />