diff --git a/ts/components/PreferencesNotificationProfiles.dom.tsx b/ts/components/PreferencesNotificationProfiles.dom.tsx index f1118e5f12..55d064384d 100644 --- a/ts/components/PreferencesNotificationProfiles.dom.tsx +++ b/ts/components/PreferencesNotificationProfiles.dom.tsx @@ -1974,7 +1974,11 @@ function TimePicker({ theme ? themeClassName2(theme) : undefined )} > -
+
{(use24HourTime ? HOURS_24 : HOURS_12).map(hour => { const isSelected = hour === hours; @@ -1983,7 +1987,9 @@ function TimePicker({ key={hour.toString()} ref={isSelected ? selectedHour : null} className={classNames( - tw('w-[46px] rounded-sm py-[7px] type-body-medium'), + tw( + 'w-[46px] rounded-sm border-[2.5px] border-transparent py-[7px] type-body-medium outline-none focus:border-border-focused' + ), isSelected ? tw('bg-fill-secondary') : null )} type="button" @@ -1997,7 +2003,11 @@ function TimePicker({ ); })}
-
+
{MINUTES.map(minute => { const isSelected = minute === minutes; @@ -2006,7 +2016,9 @@ function TimePicker({ key={minute.toString()} ref={isSelected ? selectedMinute : null} className={classNames( - tw('w-[46px] rounded-sm py-[7px] type-body-medium'), + tw( + 'w-[46px] rounded-sm border-[2.5px] border-transparent py-[7px] type-body-medium outline-none focus:border-border-focused' + ), isSelected ? tw('bg-fill-secondary') : null )} type="button" @@ -2021,7 +2033,11 @@ function TimePicker({ })}
{!use24HourTime ? ( -
+
{AM_PM.map(item => { const isSelected = item === period; @@ -2029,7 +2045,9 @@ function TimePicker({