style: image picker, spreadsheet view title, icons (#2988)

* style: image picker, spreadsheet view title, icons

* fix: build error fix
This commit is contained in:
sabith-tu 2023-12-05 16:05:50 +05:30 committed by sriram veeraghanta
parent 1b51892489
commit de9c1a60e0
7 changed files with 38 additions and 17 deletions

View file

@ -111,12 +111,8 @@ export const IssuePropertyAssignee: React.FC<IIssuePropertyAssignee> = observer(
})}
</AvatarGroup>
) : (
<span
className={`flex items-center justify-between gap-1 h-full w-full text-xs rounded duration-300 focus:outline-none ${
noLabelBorder ? "" : " px-2.5 py-1 border-[0.5px] border-custom-border-300"
}`}
>
<User2 className="h-3 w-3" />
<span className="flex items-end justify-center h-5 w-5 bg-custom-background-80 rounded-full border border-dashed border-custom-text-400">
<User2 className="h-4 w-4 text-custom-text-400" />
</span>
)}
</div>

View file

@ -85,14 +85,17 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
customButton={
<div className="flex items-center justify-between gap-1.5 cursor-pointer text-sm text-custom-text-200 hover:text-custom-text-100 w-full py-2">
<div className="flex items-center gap-1.5">
{<propertyDetails.icon className="h-4 w-4 text-custom-text-400" />}
{propertyDetails.title}
</div>
<div className="flex ml-3">
{activeSortingProperty === property && (
<div className="rounded-full flex items-center justify-center h-3.5 w-3.5">
<ListFilter className="h-3 w-3" />
</div>
)}
{propertyDetails.title}
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</div>
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</div>
}
width="xl"

View file

@ -8,7 +8,7 @@ import {
SpreadsheetIssuesColumn,
SpreadsheetQuickAddIssueForm,
} from "components/issues";
import { Spinner } from "@plane/ui";
import { Spinner, LayersIcon } from "@plane/ui";
// types
import { IIssue, IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueLabel, IState, IUserLite } from "types";
import { EIssueActions } from "../types";
@ -95,9 +95,14 @@ export const SpreadsheetView: React.FC<Props> = observer((props) => {
>
<div className="flex items-center text-sm font-medium z-[2] h-11 w-full sticky top-0 bg-custom-background-90 border border-l-0 border-custom-border-100">
{displayProperties.key && (
<span className="flex items-center px-4 py-2.5 h-full w-24 flex-shrink-0">ID</span>
<span className="flex items-center px-4 py-2.5 h-full w-24 flex-shrink-0">
<span className="mr-1.5 text-custom-text-400">#</span>ID
</span>
)}
<span className="flex items-center justify-center px-4 py-2.5 h-full w-full flex-grow">Issue</span>
<span className="flex items-center justify-center px-4 py-2.5 h-full w-full flex-grow">
<LayersIcon className="h-4 w-4 text-custom-text-400 mr-1.5" />
Issue
</span>
</div>
{issues.map((issue, index) =>