chore: update classnames according to the new theming structure (#1494)

* chore: store various shades of accent color

* refactor: custom theme selector

* refactor: custom theme selector

* chore: update custom theme input labels

* fix: color generator function logic

* fix: accent color preloaded data

* chore: new theming structure

* chore: update shades calculation logic

* refactor: variable names

* chore: update color scheming

* chore: new color scheming

* refactor: themes folder structure

* chore: update classnames to the new ones

* chore: update static colors

* chore: sidebar link colors

* chore: placeholder color

* chore: update border classnames
This commit is contained in:
Aaryan Khandelwal 2023-07-10 12:47:00 +05:30 committed by GitHub
parent a14f8c281b
commit 4c2cb2368a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
329 changed files with 2130 additions and 1995 deletions

View file

@ -313,8 +313,8 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
</div>
) : (
<div
className={`group relative w-full rounded bg-brand-surface-2 text-brand-secondary ${
snapshot.isDragging ? "bg-brand-base p-4 shadow" : ""
className={`group relative w-full rounded bg-custom-background-80 text-custom-text-200 ${
snapshot.isDragging ? "bg-custom-background-100 p-4 shadow" : ""
}`}
ref={provided.innerRef}
{...provided.draggableProps}
@ -329,7 +329,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
</button>
<div
ref={actionSectionRef}
className={`absolute top-4 right-2 hidden items-center gap-2 bg-brand-surface-2 pl-4 group-hover:!flex ${
className={`absolute top-4 right-2 hidden items-center gap-2 bg-custom-background-80 pl-4 group-hover:!flex ${
isMenuActive ? "!flex" : ""
}`}
>
@ -345,7 +345,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
)}
<button
type="button"
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-brand-surface-1 ${
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-90 ${
iAmFeelingLucky ? "cursor-wait" : ""
}`}
onClick={handleAutoGenerateDescription}
@ -361,7 +361,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
</button>
<button
type="button"
className="-mr-2 flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-brand-surface-1"
className="-mr-2 flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-90"
onClick={() => setGptAssistantModal((prevData) => !prevData)}
>
<SparklesIcon className="h-4 w-4" />
@ -369,7 +369,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
</button>
<button
type="button"
className="-mr-2 flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-brand-surface-1"
className="-mr-2 flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-90"
onClick={() => setCreateBlockForm(true)}
>
<PencilIcon className="h-3.5 w-3.5" />
@ -377,7 +377,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
<CustomMenu
customButton={
<button
className="flex w-full cursor-pointer items-center justify-between gap-1 rounded px-2.5 py-1 text-left text-xs duration-300 hover:bg-brand-surface-1"
className="flex w-full cursor-pointer items-center justify-between gap-1 rounded px-2.5 py-1 text-left text-xs duration-300 hover:bg-custom-background-90"
onClick={() => setIsMenuActive(!isMenuActive)}
>
<BoltIcon className="h-4.5 w-3.5" />
@ -426,7 +426,7 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
<Link
href={`/${workspaceSlug}/projects/${projectId}/issues/${block.issue}`}
>
<a className="flex h-6 flex-shrink-0 items-center gap-1 rounded bg-brand-surface-2 px-1.5 py-1 text-xs">
<a className="flex h-6 flex-shrink-0 items-center gap-1 rounded bg-custom-background-80 px-1.5 py-1 text-xs">
<LayerDiagonalIcon height="16" width="16" />
{projectDetails?.identifier}-{block.issue_detail?.sequence_id}
</a>
@ -436,12 +436,12 @@ export const SinglePageBlock: React.FC<Props> = ({ block, projectDetails, index,
<TextArea
name="blockName"
value={block.name}
className="min-h-[20px] block w-full resize-none overflow-hidden border-none bg-transparent text-sm text-brand-base"
className="min-h-[20px] block w-full resize-none overflow-hidden border-none bg-transparent text-sm text-custom-text-100"
noPadding
/>
</div>
{block?.description_stripped.length > 0 && (
<p className="mt-3 h-5 truncate text-sm font-normal text-brand-secondary">
<p className="mt-3 h-5 truncate text-sm font-normal text-custom-text-200">
{block.description_stripped}
</p>
)}