info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-08-19 15:43:49 +02:00
Code Issues Releases Wiki Activity

Highlight user personal progress

Browse Source
This commit is contained in:
Kamran Ahmed
2023-07-26 15:41:39 +01:00
parent 076b866430
commit 14f9ad9530
3 changed files with 4 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/TeamProgress/GroupRoadmapItem.tsx
View File

@@ -59,7 +59,7 @@ export function GroupRoadmapItem(props: GroupRoadmapItemProps) {
return (
<button
className={`group relative w-full overflow-hidden rounded-md border p-2 hover:border-gray-300 hover:text-black focus:outline-none`}
className={`group relative w-full overflow-hidden rounded-md border p-2 hover:border-gray-300 hover:text-black focus:outline-none ${isMyProgress ? 'border-green-500 hover:border-green-600' : ''}`}
key={member?.member._id}
onClick={() => {
setDetailResourceId(member?.progress?.resourceId!);
@@ -81,11 +81,6 @@ export function GroupRoadmapItem(props: GroupRoadmapItemProps) {
/>
<span className="inline-grid grid-cols-[auto,32px] items-center">
<span className="truncate mr-[5px]">{member?.member?.name}</span>
{isMyProgress && (
<span className="rounded-md bg-red-500 py-0.25 text-center text-[11px] text-white mr-[5px]">
You
</span>
)}
</span>
</span>
<span className="shrink-0 text-xs text-gray-400">
@@ -93,7 +88,7 @@ export function GroupRoadmapItem(props: GroupRoadmapItemProps) {
</span>
</span>
<span
className="absolute inset-0 bg-gray-100 group-hover:bg-gray-200"
className={`absolute inset-0 ${isMyProgress ? 'bg-green-100 group-hover:bg-green-200' : 'bg-gray-100 group-hover:bg-gray-200'}`}
style={{
width: `${
(member?.progress?.done / member?.progress?.total) * 100

2
src/components/TeamProgress/MemberProgressItem.tsx
View File

@@ -52,7 +52,7 @@ export function MemberProgressItem(props: MemberProgressItemProps) {
{isMyProgress && (
<div className="inline-grid grid-cols-[auto,32px] items-center gap-1.5">
<h3 className="truncate font-medium">{member.name}</h3>
<span className="rounded-md bg-red-500 text-center py-0.5 text-xs text-white">
<span className="rounded-md bg-red-500 py-0.5 px-1 text-xs text-white">
You
</span>
</div>

4
src/components/TeamProgress/TeamProgressPage.tsx
View File

@@ -7,9 +7,7 @@ import { useToast } from '../../hooks/use-toast';
import { useStore } from '@nanostores/preact';
import { $currentTeam } from '../../stores/team';
import { GroupRoadmapItem } from './GroupRoadmapItem';
import { setUrlParams } from '../../lib/browser';
import { getUrlParams } from '../../lib/browser';
import { $toastMessage } from '../../stores/toast';
import { getUrlParams, setUrlParams } from '../../lib/browser';
import { useAuth } from '../../hooks/use-auth';
export type UserProgress = {