open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Clean up some markup in the sidebar (#220)

Browse Source 
* Remove wrapper div around logo

* Small refactor, remove wrapper around sidebar profile summary

* Remove random unused imports

* Replace random styles with Tailwind classes
This commit is contained in:
Marshall Polaris 2022-05-13 18:07:44 -07:00 committed by GitHub
parent 33c0471c29
commit bc5cd5be45
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/components/nav/profile-menu.tsx
View File

@ -1,8 +1,8 @@
import Link from 'next/link'
import { firebaseLogout, User } from 'web/lib/firebase/users'
import { formatMoney } from 'common/util/format'
import { Avatar } from '../avatar'
import { IS_PRIVATE_MANIFOLD } from 'common/envs/constants'
import { Row } from '../layout/row'
export function getNavigationOptions(user?: User | null) {
if (IS_PRIVATE_MANIFOLD) {
@ -27,18 +27,18 @@ export function getNavigationOptions(user?: User | null) {
]
}
export function ProfileSummary(props: { user: User | undefined }) {
export function ProfileSummary(props: { user: User }) {
const { user } = props
return (
<Row className="group items-center gap-4 rounded-md py-3 text-gray-500 group-hover:bg-gray-100 group-hover:text-gray-700">
<Avatar avatarUrl={user?.avatarUrl} username={user?.username} noLink />
<Link href={`/${user.username}`}>
<a className="group flex flex-row items-center gap-4 rounded-md py-3 text-gray-500 hover:bg-gray-100 hover:text-gray-700">
<Avatar avatarUrl={user.avatarUrl} username={user.username} noLink />
<div className="truncate text-left">
<div>{user?.name}</div>
<div className="text-sm">
{user ? formatMoney(Math.floor(user.balance)) : ' '}
<div className="truncate">
<div>{user.name}</div>
<div className="text-sm">{formatMoney(Math.floor(user.balance))}</div>
</div>
</div>
</Row>
</a>
</Link>
)
}

20
web/components/nav/sidebar.tsx
View File

@ -1,9 +1,7 @@
import {
HomeIcon,
UserGroupIcon,
CakeIcon,
SearchIcon,
ChatIcon,
BookOpenIcon,
DotsHorizontalIcon,
CashIcon,
@ -126,26 +124,14 @@ export default function Sidebar(props: { className?: string }) {
return (
<nav aria-label="Sidebar" className={className}>
<div className="space-y-1 pb-6">
<ManifoldLogo twoLine />
</div>
<ManifoldLogo className="pb-6" twoLine />
<div className="mb-2" style={{ minHeight: 80 }}>
{user ? (
<Link href={`/${user.username}`}>
<a className="group">
<ProfileSummary user={user} />
</a>
</Link>
<ProfileSummary user={user} />
) : user === null ? (
<div className="py-6 text-center">
<button
className="btn btn-sm px-6 font-medium normal-case "
style={{
backgroundColor: 'white',
border: '2px solid',
color: '#3D4451',
}}
className="btn btn-sm border-2 bg-white px-6 font-medium normal-case text-gray-700"
onClick={firebaseLogin}
>
Sign in