fix: user full name not wrapping on navbar (#8978)
* fix: user full name not wrapping on navbar * fix: change height of tab title container in settings page * feat: truncate user full name instead of wrapping * feat: truncate every section title on settings sidebar --------- Co-authored-by: alannnc <alannnc@gmail.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com>pull/9108/head
parent
dc5d5f8119
commit
ae471ce86a
|
@ -190,7 +190,7 @@ const SettingsSidebarContainer = ({
|
|||
return tab.name !== "teams" ? (
|
||||
<React.Fragment key={tab.href}>
|
||||
<div className={`${!tab.children?.length ? "!mb-3" : ""}`}>
|
||||
<div className="[&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis text-default group flex h-9 w-64 flex-row items-center rounded-md px-2 text-sm font-medium leading-none">
|
||||
<div className="[&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis text-default group flex h-9 w-full flex-row items-center rounded-md px-2 text-sm font-medium leading-none">
|
||||
{tab && tab.icon && (
|
||||
<tab.icon className="h-[16px] w-[16px] stroke-[2px] ltr:mr-3 rtl:ml-3 md:mt-0" />
|
||||
)}
|
||||
|
@ -201,7 +201,7 @@ const SettingsSidebarContainer = ({
|
|||
alt="User Avatar"
|
||||
/>
|
||||
)}
|
||||
<p className="text-sm font-medium leading-5">{t(tab.name)}</p>
|
||||
<p className="text-sm font-medium leading-5 truncate">{t(tab.name)}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="my-3 space-y-0.5">
|
||||
|
@ -222,11 +222,11 @@ const SettingsSidebarContainer = ({
|
|||
<React.Fragment key={tab.href}>
|
||||
<div className={`${!tab.children?.length ? "mb-3" : ""}`}>
|
||||
<Link href={tab.href}>
|
||||
<div className="hover:bg-subtle [&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis group-hover:text-default text-default group flex h-9 w-64 flex-row items-center rounded-md px-2 py-[10px] text-sm font-medium leading-none">
|
||||
<div className="hover:bg-subtle [&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis group-hover:text-default text-default group flex h-9 w-full flex-row items-center rounded-md px-2 py-[10px] text-sm font-medium leading-none">
|
||||
{tab && tab.icon && (
|
||||
<tab.icon className="h-[16px] w-[16px] stroke-[2px] ltr:mr-3 rtl:ml-3 md:mt-0" />
|
||||
)}
|
||||
<p className="text-sm font-medium leading-5">{t(tab.name)}</p>
|
||||
<p className="text-sm font-medium leading-5 truncate">{t(tab.name)}</p>
|
||||
</div>
|
||||
</Link>
|
||||
{teams &&
|
||||
|
@ -248,7 +248,7 @@ const SettingsSidebarContainer = ({
|
|||
}>
|
||||
<CollapsibleTrigger>
|
||||
<div
|
||||
className="hover:bg-subtle [&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis text-default flex h-9 w-64 flex-row items-center rounded-md px-3 py-[10px] text-left text-sm font-medium leading-none"
|
||||
className="hover:bg-subtle [&[aria-current='page']]:bg-emphasis [&[aria-current='page']]:text-emphasis text-default flex h-9 w-full flex-row items-center rounded-md px-3 py-[10px] text-left text-sm font-medium leading-none"
|
||||
onClick={() =>
|
||||
setTeamMenuState([
|
||||
...teamMenuState,
|
||||
|
|
Loading…
Reference in New Issue