Skip to content

Challenge tabs #90

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ssynowiec wants to merge 20 commits into
base: main
Choose a base branch
from
Open

Challenge tabs #90

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
1e841a5
new: tabs component
ssynowiec Mar 9, 2023
14b30be
new: tabs component
ssynowiec Mar 9, 2023
1be63b8
new: comments section
ssynowiec Mar 10, 2023
f86e7dd
Update apps/web/components/molecules/opinions/opinions.tsx
ssynowiec Mar 10, 2023
aada9cc
changes from review
ssynowiec Mar 10, 2023
f9f77f4
sort comments and new date format/type
ssynowiec Mar 14, 2023
5cb02e5
submit handler
ssynowiec Mar 14, 2023
1c9dd6a
polish plurals
ssynowiec Mar 14, 2023
63afbfc
time difference function
ssynowiec Mar 14, 2023
275a3a6
export TextArea
ssynowiec Mar 14, 2023
423999f
comments/review from @goodideagiver
ssynowiec Mar 14, 2023
a277544
Merge branch 'main' into challenge_tabs
ssynowiec Mar 14, 2023
8140d41
comments/review from @goodideagiver & @Survikrowa
ssynowiec Mar 14, 2023
a9b9d3a
renamed date to timestamp and renamed file names
ssynowiec Mar 15, 2023
ec678c3
add: liked icon
ssynowiec Mar 15, 2023
ebb4cc9
add: userAvatar component
ssynowiec Mar 15, 2023
ae61fe4
@Eghizio review
ssynowiec Mar 15, 2023
2d476a0
type: new type of comments and opinions
ssynowiec Mar 16, 2023
0f1a795
fix: avatar size in opinion
ssynowiec Mar 18, 2023
acbb1a6
fix: avatar size
ssynowiec Mar 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/web/components/molecules/commentItem/commentItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export const CommentItem = ({
<div className="flex-col w-full py-2 mx-auto bg-white sm:px-4 md:px-4 md:w-2/3">
<Card tag="div">
<div className="flex flex-row md-10">
<UserAvatar avatar={author.avatar_URL} size={12} />
<UserAvatar avatar={author.avatar_URL} size="12" />
<div className="flex-col mt-1">
<div className="flex items-center flex-1 px-4 font-bold leading-tight">
{author.name}
Expand Down
13 changes: 9 additions & 4 deletions apps/web/components/molecules/userAvatar/userAvatar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,16 @@ import clsx from 'clsx';

type CommentUserAvatarProps = {
avatar: string;
size?: number;
size?: '12' | '10' | '24';
};

export const UserAvatar = ({ avatar, size = 24 }: CommentUserAvatarProps) => {
const sizeClass = `w-${size} h-${size}`;
export const UserAvatar = ({ avatar, size = '24' }: CommentUserAvatarProps) => {
const sizes = {
24: 'w-24 h-24',
12: 'w-12 h-12',
10: 'w-10 h-10',
};
Comment on lines +10 to +14
Copy link

@goodideagiver goodideagiver Mar 22, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This can be placed outside of the component (above component declaration) as a const

SIZES or AVATAR_SIZES


return (
<Image
alt=""
Expand All @@ -16,7 +21,7 @@ export const UserAvatar = ({ avatar, size = 24 }: CommentUserAvatarProps) => {
height={1000}
className={clsx(
'object-cover border-2 border-gray-300 rounded-full',
sizeClass,
sizes[size],
)}
/>
);
Expand Down
4 changes: 2 additions & 2 deletions apps/web/components/organisms/header/headerUserLoggedInContent/headerUserLoggedInContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,9 @@ export const HeaderUserLoggedInContent = ({
<div className="flex flex-col lg:flex-row items-center">
<div className="mr-2">
{user.avatarSrc ? (
<UserAvatar avatar={user.avatarSrc} size={10} />
<UserAvatar avatar={user.avatarSrc} size="10" />
) : (
<UserAvatar avatar={profileDefaultSvg} size={10} />
<UserAvatar avatar={profileDefaultSvg} size="10" />
)}
</div>
<p className="p-0 m-0">Witaj, {user.nickname}!</p>
Expand Down