style: module ui revamp (#2548)
* chore: module constant and helper function added * style: module card ui revamp * chore: custom media query added * chore: circular progress indicator added * chore: module card item ui improvement * chore: module list view added * chore: module sidebar added in list and card view * chore: module list and card ui improvement * chore: module sidebar select, avatar and link list component improvement * chore: sidebar improvement and refactor * style: module sidebar revamp * style: module sidebar ui improvement * chore: module sidebar lead and member select improvement * style: module sidebar progress section empty state added * chore: module card issue count validation added * style: module card and list item ui improvement
This commit is contained in:
parent
080b5a29ae
commit
fc82d6fc23
21 changed files with 1159 additions and 623 deletions
|
|
@ -1,25 +1,28 @@
|
|||
import { useRouter } from "next/router";
|
||||
import Link from "next/link";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { Plus } from "lucide-react";
|
||||
import { GanttChart, LayoutGrid, List, Plus } from "lucide-react";
|
||||
// mobx store
|
||||
import { useMobxStore } from "lib/mobx/store-provider";
|
||||
// hooks
|
||||
import useLocalStorage from "hooks/use-local-storage";
|
||||
// ui
|
||||
import { Breadcrumbs, BreadcrumbItem, Button, Tooltip } from "@plane/ui";
|
||||
import { Icon } from "components/ui";
|
||||
// helper
|
||||
import { replaceUnderscoreIfSnakeCase, truncateText } from "helpers/string.helper";
|
||||
|
||||
const moduleViewOptions: { type: "grid" | "gantt_chart"; icon: any }[] = [
|
||||
const moduleViewOptions: { type: "list" | "grid" | "gantt_chart"; icon: any }[] = [
|
||||
{
|
||||
type: "gantt_chart",
|
||||
icon: "view_timeline",
|
||||
type: "list",
|
||||
icon: List,
|
||||
},
|
||||
{
|
||||
type: "grid",
|
||||
icon: "table_rows",
|
||||
icon: LayoutGrid,
|
||||
},
|
||||
{
|
||||
type: "gantt_chart",
|
||||
icon: GanttChart,
|
||||
},
|
||||
];
|
||||
|
||||
|
|
@ -67,7 +70,7 @@ export const ModulesListHeader: React.FC = observer(() => {
|
|||
}`}
|
||||
onClick={() => setModulesView(option.type)}
|
||||
>
|
||||
<Icon iconName={option.icon} className={`!text-base ${option.type === "grid" ? "rotate-90" : ""}`} />
|
||||
<option.icon className="h-3.5 w-3.5" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
))}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue