jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change(ui) - note tag, user menu and settings menu fixes

Browse source
This commit is contained in:
Shekar Siri 2022-10-28 10:32:18 +02:00
parent 462cbe6120
commit b74bb72fc9
4 changed files with 18 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/app/components/Header/SettingsMenu/SettingsMenu.tsx
View file

@ -56,7 +56,7 @@ export default withRouter(SettingsMenu);
function MenuItem({ onClick, label, icon }: any) {
return (
<div
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border"
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border hover-teal"
onClick={onClick}
>
<Icon name={icon} size="16" />

8
frontend/app/components/Header/UserMenu/UserMenu.tsx
View file

@ -27,11 +27,11 @@ function UserMenu(props: RouteComponentProps<Props>) {
className={cn(className, 'absolute right-0 top-0 bg-white border mt-14')}
>
<div className="flex items-start p-3 border-b border-dashed">
<div className="w-10 h-10 bg-tealx rounded-full flex items-center justify-center mr-2 color-white shrink-0">
<div className="w-10 h-10 bg-tealx rounded-full flex items-center justify-center mr-2 color-white shrink-0 uppercase">
{getInitials(account.name)}
</div>
<div className="overflow-hidden leading-8">
<div className="color-teal font-medium leading-none">{account.name}</div>
<div className="color-teal font-medium leading-none capitalize">{account.name}</div>
<div className="overflow-hidden whitespace-nowrap color-gray-medium text-ellipsis">
{account.email}
</div>
@ -42,14 +42,14 @@ function UserMenu(props: RouteComponentProps<Props>) {
</div>
<div className="p-2">
<div
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border"
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border hover-teal"
onClick={onAccountClick}
>
<Icon name="user-circle" size="16" />
<button className="ml-2">{'Account'}</button>
</div>
<div
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border"
className="rounded border border-transparent p-2 cursor-pointer flex items-center hover:bg-active-blue hover:!border-active-blue-border hover-teal"
onClick={onLogoutClick}
>
<Icon name="door-closed" size="16" />

9
frontend/app/components/shared/SessionListContainer/components/Notes/NoteItem.tsx
View file

@ -63,11 +63,12 @@ function NoteItem(props: Props) {
style={{
// @ts-ignore
background: tagProps[props.note.tag],
userSelect: 'none',
width: 50,
fontSize: 11,
// userSelect: 'none',
// width: 'fit-content',
// fontSize: 11,
padding: '1px 6px',
}}
className="rounded-full px-2 py-1 text-white flex items-center justify-center"
className="rounded-full text-white text-xs select-none w-fit"
>
{props.note.tag}
</div>

8
frontend/app/styles/main.css
View file

@ -125,6 +125,14 @@
}
}
.hover-teal:hover {
background-color: $active-blue;
color: $teal;
& svg {
fill: $teal;
}
}
.note-hover {
border: solid thin transparent;
&:hover {