github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: merge conflicts

Browse Source
This commit is contained in:
Dakshesh Jain 2023-07-17 15:58:52 +05:30
commit 5b22b66064
193 changed files with 2501 additions and 1211 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apiserver/plane/api/serializers/issue.py
View File

@ -462,9 +462,9 @@ class IssueAttachmentSerializer(BaseSerializer):
# Issue Serializer with state details # Issue Serializer with state details
class IssueStateSerializer(BaseSerializer): class IssueStateSerializer(BaseSerializer):
label_details = LabelLiteSerializer(read_only=True, source="labels", many=True)
state_detail = StateLiteSerializer(read_only=True, source="state") state_detail = StateLiteSerializer(read_only=True, source="state")
project_detail = ProjectLiteSerializer(read_only=True, source="project") project_detail = ProjectLiteSerializer(read_only=True, source="project")
label_details = LabelSerializer(read_only=True, source="labels", many=True)
assignee_details = UserLiteSerializer(read_only=True, source="assignees", many=True) assignee_details = UserLiteSerializer(read_only=True, source="assignees", many=True)
sub_issues_count = serializers.IntegerField(read_only=True) sub_issues_count = serializers.IntegerField(read_only=True)
bridge_id = serializers.UUIDField(read_only=True) bridge_id = serializers.UUIDField(read_only=True)

3
apiserver/plane/api/serializers/notification.py
View File

@ -1,9 +1,12 @@
# Module imports # Module imports
from .base import BaseSerializer from .base import BaseSerializer
from .user import UserLiteSerializer
from plane.db.models import Notification from plane.db.models import Notification
class NotificationSerializer(BaseSerializer): class NotificationSerializer(BaseSerializer):
triggered_by_details = UserLiteSerializer(read_only=True, source="triggered_by")
class Meta: class Meta:
model = Notification model = Notification
fields = "__all__" fields = "__all__"

6
apiserver/plane/api/urls.py
View File

@ -153,6 +153,7 @@ from plane.api.views import (
## End Analytics ## End Analytics
# Notification # Notification
NotificationViewSet, NotificationViewSet,
UnreadNotificationEndpoint,
## End Notification ## End Notification
) )
@ -1382,5 +1383,10 @@ urlpatterns = [
), ),
name="notifications", name="notifications",
), ),
path(
"workspaces/<str:slug>/users/notifications/unread/",
UnreadNotificationEndpoint.as_view(),
name="unread-notifications",
),
## End Notification ## End Notification
] ]

2
apiserver/plane/api/views/__init__.py
View File

@ -145,4 +145,4 @@ from .analytic import (
DefaultAnalyticsEndpoint, DefaultAnalyticsEndpoint,
) )
from .notification import NotificationViewSet from .notification import NotificationViewSet, UnreadNotificationEndpoint

8
apiserver/plane/api/views/issue.py
View File

@ -169,8 +169,8 @@ class IssueViewSet(BaseViewSet):
issue_queryset = ( issue_queryset = (
self.get_queryset() self.get_queryset()
.filter(**filters) .filter(**filters)
.annotate(cycle_id=F("issue_cycle__id")) .annotate(cycle_id=F("issue_cycle__cycle_id"))
.annotate(module_id=F("issue_module__id")) .annotate(module_id=F("issue_module__module_id"))
.annotate( .annotate(
link_count=IssueLink.objects.filter(issue=OuterRef("id")) link_count=IssueLink.objects.filter(issue=OuterRef("id"))
.order_by() .order_by()
@ -955,8 +955,8 @@ class IssueArchiveViewSet(BaseViewSet):
issue_queryset = ( issue_queryset = (
self.get_queryset() self.get_queryset()
.filter(**filters) .filter(**filters)
.annotate(cycle_id=F("issue_cycle__id")) .annotate(cycle_id=F("issue_cycle__cycle_id"))
.annotate(module_id=F("issue_module__id")) .annotate(module_id=F("issue_module__module_id"))
.annotate( .annotate(
link_count=IssueLink.objects.filter(issue=OuterRef("id")) link_count=IssueLink.objects.filter(issue=OuterRef("id"))
.order_by() .order_by()

50
apiserver/plane/api/views/notification.py
View File

@ -8,7 +8,7 @@ from rest_framework.response import Response
from sentry_sdk import capture_exception from sentry_sdk import capture_exception
# Module imports # Module imports
from .base import BaseViewSet from .base import BaseViewSet, BaseAPIView
from plane.db.models import Notification, IssueAssignee, IssueSubscriber, Issue from plane.db.models import Notification, IssueAssignee, IssueSubscriber, Issue
from plane.api.serializers import NotificationSerializer from plane.api.serializers import NotificationSerializer
@ -25,7 +25,7 @@ class NotificationViewSet(BaseViewSet):
workspace__slug=self.kwargs.get("slug"), workspace__slug=self.kwargs.get("slug"),
receiver_id=self.request.user.id, receiver_id=self.request.user.id,
) )
.select_related("workspace") .select_related("workspace", "project," "triggered_by", "receiver")
) )
def list(self, request, slug): def list(self, request, slug):
@ -166,7 +166,6 @@ class NotificationViewSet(BaseViewSet):
status=status.HTTP_400_BAD_REQUEST, status=status.HTTP_400_BAD_REQUEST,
) )
def archive(self, request, slug, pk): def archive(self, request, slug, pk):
try: try:
notification = Notification.objects.get( notification = Notification.objects.get(
@ -209,3 +208,48 @@ class NotificationViewSet(BaseViewSet):
status=status.HTTP_400_BAD_REQUEST, status=status.HTTP_400_BAD_REQUEST,
) )
class UnreadNotificationEndpoint(BaseAPIView):
def get(self, request, slug):
try:
# Watching Issues Count
watching_notification_count = Notification.objects.filter(
workspace__slug=slug,
receiver_id=request.user.id,
entity_identifier__in=IssueSubscriber.objects.filter(
workspace__slug=slug, subscriber_id=request.user.id
).values_list("issue_id", flat=True),
).count()
# My Issues Count
my_issues_count = Notification.objects.filter(
workspace__slug=slug,
receiver_id=request.user.id,
entity_identifier__in=IssueAssignee.objects.filter(
workspace__slug=slug, assignee_id=request.user.id
).values_list("issue_id", flat=True),
).count()
# Created Issues Count
created_issues_count = Notification.objects.filter(
workspace__slug=slug,
receiver_id=request.user.id,
entity_identifier__in=Issue.objects.filter(
workspace__slug=slug, created_by=request.user
).values_list("pk", flat=True),
).count()
return Response(
{
"watching_notifications": watching_notification_count,
"my_issues": my_issues_count,
"created_issues": created_issues_count,
},
status=status.HTTP_200_OK,
)
except Exception as e:
capture_exception(e)
return Response(
{"error": "Something went wrong please try again later"},
status=status.HTTP_400_BAD_REQUEST,
)

1
apiserver/plane/api/views/workspace.py
View File

@ -101,6 +101,7 @@ class WorkSpaceViewSet(BaseViewSet):
.filter(workspace_member__member=self.request.user) .filter(workspace_member__member=self.request.user)
.annotate(total_members=member_count) .annotate(total_members=member_count)
.annotate(total_issues=issue_count) .annotate(total_issues=issue_count)
.select_related("owner")
) )
def create(self, request): def create(self, request):

1162
apiserver/plane/bgtasks/issue_activites_task.py Normal file
View File

File diff suppressed because it is too large Load Diff

51
apps/app/components/account/email-code-form.tsx
View File

@ -32,6 +32,7 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
setError, setError,
setValue, setValue,
getValues, getValues,
watch,
formState: { errors, isSubmitting, isValid, isDirty }, formState: { errors, isSubmitting, isValid, isDirty },
} = useForm<EmailCodeFormValues>({ } = useForm<EmailCodeFormValues>({
defaultValues: { defaultValues: {
@ -112,43 +113,34 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
return ( return (
<> <>
<form className="space-y-5 py-5 px-5">
{(codeSent || codeResent) && ( {(codeSent || codeResent) && (
<div className="rounded-md bg-green-500/20 p-4"> <p className="text-center mt-4">
<div className="flex"> We have sent the sign in code.
<div className="flex-shrink-0"> <br />
<CheckCircleIcon className="h-5 w-5 text-green-500" aria-hidden="true" /> Please check your inbox at <span className="font-medium">{watch("email")}</span>
</div>
<div className="ml-3">
<p className="text-sm font-medium text-green-500">
{codeResent
? "Please check your mail for new code."
: "Please check your mail for code."}
</p> </p>
</div>
</div>
</div>
)} )}
<div> <form className="space-y-4 mt-10 w-full sm:w-[360px] mx-auto">
<div className="space-y-1">
<Input <Input
id="email" id="email"
type="email" type="email"
name="email" name="email"
register={register} register={register}
validations={{ validations={{
required: "Email ID is required", required: "Email address is required",
validate: (value) => validate: (value) =>
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
value value
) || "Email ID is not valid", ) || "Email address is not valid",
}} }}
error={errors.email} error={errors.email}
placeholder="Enter your Email ID" placeholder="Enter your email address..."
/> />
</div> </div>
{codeSent && ( {codeSent && (
<div> <>
<Input <Input
id="token" id="token"
type="token" type="token"
@ -158,14 +150,14 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
required: "Code is required", required: "Code is required",
}} }}
error={errors.token} error={errors.token}
placeholder="Enter code" placeholder="Enter code..."
/> />
<button <button
type="button" type="button"
className={`mt-5 flex w-full justify-end text-xs outline-none ${ className={`flex w-full justify-end text-xs outline-none ${
isResendDisabled isResendDisabled
? "cursor-default text-custom-text-200" ? "cursor-default text-custom-text-200"
: "cursor-pointer text-custom-primary" : "cursor-pointer text-custom-primary-100"
} `} } `}
onClick={() => { onClick={() => {
setIsCodeResending(true); setIsCodeResending(true);
@ -178,20 +170,17 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
disabled={isResendDisabled} disabled={isResendDisabled}
> >
{resendCodeTimer > 0 ? ( {resendCodeTimer > 0 ? (
<p className="text-right"> <span className="text-right">Request new code in {resendCodeTimer} seconds</span>
Didn{"'"}t receive code? Get new code in {resendCodeTimer} seconds.
</p>
) : isCodeResending ? ( ) : isCodeResending ? (
"Sending code..." "Sending new code..."
) : errorResendingCode ? ( ) : errorResendingCode ? (
"Please try again later" "Please try again later"
) : ( ) : (
"Resend code" "Resend code"
)} )}
</button> </button>
</div> </>
)} )}
<div>
{codeSent ? ( {codeSent ? (
<PrimaryButton <PrimaryButton
type="submit" type="submit"
@ -212,12 +201,12 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
setResendCodeTimer(30); setResendCodeTimer(30);
}); });
}} }}
loading={isSubmitting || (!isValid && isDirty)} disabled={!isValid && isDirty}
loading={isSubmitting}
> >
{isSubmitting ? "Sending code..." : "Send code"} {isSubmitting ? "Sending code..." : "Send sign in code"}
</PrimaryButton> </PrimaryButton>
)} )}
</div>
</form> </form>
</> </>
); );

46
apps/app/components/account/email-password-form.tsx
View File

@ -8,7 +8,7 @@ import { useForm } from "react-hook-form";
// components // components
import { EmailResetPasswordForm } from "components/account"; import { EmailResetPasswordForm } from "components/account";
// ui // ui
import { Input, SecondaryButton } from "components/ui"; import { Input, PrimaryButton } from "components/ui";
// types // types
type EmailPasswordFormValues = { type EmailPasswordFormValues = {
email: string; email: string;
@ -42,28 +42,38 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
return ( return (
<> <>
<h1 className="text-center text-2xl sm:text-2.5xl font-semibold text-custom-text-100">
{isResettingPassword
? "Reset your password"
: isSignUpPage
? "Sign up on Plane"
: "Sign in to Plane"}
</h1>
{isResettingPassword ? ( {isResettingPassword ? (
<EmailResetPasswordForm setIsResettingPassword={setIsResettingPassword} /> <EmailResetPasswordForm setIsResettingPassword={setIsResettingPassword} />
) : ( ) : (
<form className="mt-5 py-5 px-5" onSubmit={handleSubmit(onSubmit)}> <form
<div> className="space-y-4 mt-10 w-full sm:w-[360px] mx-auto"
onSubmit={handleSubmit(onSubmit)}
>
<div className="space-y-1">
<Input <Input
id="email" id="email"
type="email" type="email"
name="email" name="email"
register={register} register={register}
validations={{ validations={{
required: "Email ID is required", required: "Email address is required",
validate: (value) => validate: (value) =>
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
value value
) || "Email ID is not valid", ) || "Email address is not valid",
}} }}
error={errors.email} error={errors.email}
placeholder="Enter your email ID" placeholder="Enter your email address..."
/> />
</div> </div>
<div className="mt-5"> <div className="space-y-1">
<Input <Input
id="password" id="password"
type="password" type="password"
@ -73,14 +83,13 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
required: "Password is required", required: "Password is required",
}} }}
error={errors.password} error={errors.password}
placeholder="Enter your password" placeholder="Enter your password..."
/> />
</div> </div>
<div className="mt-2 flex items-center justify-between"> <div className="text-right text-xs">
<div className="ml-auto text-sm">
{isSignUpPage ? ( {isSignUpPage ? (
<Link href="/"> <Link href="/">
<a className="font-medium text-custom-primary hover:text-custom-primary"> <a className="text-custom-text-200 hover:text-custom-primary-100">
Already have an account? Sign in. Already have an account? Sign in.
</a> </a>
</Link> </Link>
@ -88,15 +97,14 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
<button <button
type="button" type="button"
onClick={() => setIsResettingPassword(true)} onClick={() => setIsResettingPassword(true)}
className="font-medium text-custom-primary hover:text-custom-primary" className="text-custom-text-200 hover:text-custom-primary-100"
> >
Forgot your password? Forgot your password?
</button> </button>
)} )}
</div> </div>
</div> <div>
<div className="mt-5"> <PrimaryButton
<SecondaryButton
type="submit" type="submit"
className="w-full text-center" className="w-full text-center"
disabled={!isValid && isDirty} disabled={!isValid && isDirty}
@ -105,14 +113,14 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
{isSignUpPage {isSignUpPage
? isSubmitting ? isSubmitting
? "Signing up..." ? "Signing up..."
: "Sign Up" : "Sign up"
: isSubmitting : isSubmitting
? "Signing in..." ? "Signing in..."
: "Sign In"} : "Sign in"}
</SecondaryButton> </PrimaryButton>
{!isSignUpPage && ( {!isSignUpPage && (
<Link href="/sign-up"> <Link href="/sign-up">
<a className="block font-medium text-custom-primary hover:text-custom-primary text-sm mt-1"> <a className="block text-custom-text-200 hover:text-custom-primary-100 text-xs mt-4">
Don{"'"}t have an account? Sign up. Don{"'"}t have an account? Sign up.
</a> </a>
</Link> </Link>

15
apps/app/components/account/email-reset-password-form.tsx
View File

@ -59,25 +59,28 @@ export const EmailResetPasswordForm: React.FC<Props> = ({ setIsResettingPassword
}; };
return ( return (
<form className="mt-5 py-5 px-5" onSubmit={handleSubmit(forgotPassword)}> <form
<div> className="space-y-4 mt-10 w-full sm:w-[360px] mx-auto"
onSubmit={handleSubmit(forgotPassword)}
>
<div className="space-y-1">
<Input <Input
id="email" id="email"
type="email" type="email"
name="email" name="email"
register={register} register={register}
validations={{ validations={{
required: "Email ID is required", required: "Email address is required",
validate: (value) => validate: (value) =>
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
value value
) || "Email ID is not valid", ) || "Email address is not valid",
}} }}
error={errors.email} error={errors.email}
placeholder="Enter registered Email ID" placeholder="Enter registered email address.."
/> />
</div> </div>
<div className="mt-5 flex items-center gap-2"> <div className="mt-5 flex flex-col-reverse sm:flex-row items-center gap-2">
<SecondaryButton <SecondaryButton
className="w-full text-center" className="w-full text-center"
onClick={() => setIsResettingPassword(false)} onClick={() => setIsResettingPassword(false)}

32
apps/app/components/account/github-login-button.tsx
View File

@ -1,9 +1,14 @@
import { useEffect, useState, FC } from "react"; import { useEffect, useState, FC } from "react";
import Link from "next/link"; import Link from "next/link";
import Image from "next/image"; import Image from "next/image";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
// next-themes
import { useTheme } from "next-themes";
// images // images
import githubImage from "/public/logos/github-black.png"; import githubBlackImage from "/public/logos/github-black.png";
import githubWhiteImage from "/public/logos/github-white.png";
const { NEXT_PUBLIC_GITHUB_ID } = process.env; const { NEXT_PUBLIC_GITHUB_ID } = process.env;
@ -11,15 +16,15 @@ export interface GithubLoginButtonProps {
handleSignIn: React.Dispatch<string>; handleSignIn: React.Dispatch<string>;
} }
export const GithubLoginButton: FC<GithubLoginButtonProps> = (props) => { export const GithubLoginButton: FC<GithubLoginButtonProps> = ({ handleSignIn }) => {
const { handleSignIn } = props; const [loginCallBackURL, setLoginCallBackURL] = useState(undefined);
// router const [gitCode, setGitCode] = useState<null | string>(null);
const { const {
query: { code }, query: { code },
} = useRouter(); } = useRouter();
// states
const [loginCallBackURL, setLoginCallBackURL] = useState(undefined); const { theme } = useTheme();
const [gitCode, setGitCode] = useState<null | string>(null);
useEffect(() => { useEffect(() => {
if (code && !gitCode) { if (code && !gitCode) {
@ -35,13 +40,18 @@ export const GithubLoginButton: FC<GithubLoginButtonProps> = (props) => {
}, []); }, []);
return ( return (
<div className="w-full flex justify-center items-center px-[3px]"> <div className="w-full flex justify-center items-center">
<Link <Link
href={`https://github.com/login/oauth/authorize?client_id=${NEXT_PUBLIC_GITHUB_ID}&redirect_uri=${loginCallBackURL}&scope=read:user,user:email`} href={`https://github.com/login/oauth/authorize?client_id=${NEXT_PUBLIC_GITHUB_ID}&redirect_uri=${loginCallBackURL}&scope=read:user,user:email`}
> >
<button className="flex w-full items-center justify-center gap-3 rounded border border-custom-border-100 p-2 text-sm font-medium text-custom-text-200 duration-300 hover:bg-custom-background-80"> <button className="flex w-full items-center justify-center gap-2 rounded border border-custom-border-300 p-2 text-sm font-medium text-custom-text-100 duration-300 hover:bg-custom-background-80">
<Image src={githubImage} height={20} width={20} color="#000" alt="GitHub Logo" /> <Image
<span>Sign In with Github</span> src={theme === "light" ? githubBlackImage : githubWhiteImage}
height={20}
width={20}
alt="GitHub Logo"
/>
<span>Sign in with GitHub</span>
</button> </button>
</Link> </Link>
</div> </div>

4
apps/app/components/account/google-login.tsx
View File

@ -27,7 +27,7 @@ export const GoogleLoginButton: FC<IGoogleLoginButton> = (props) => {
theme: "outline", theme: "outline",
size: "large", size: "large",
logo_alignment: "center", logo_alignment: "center",
width: "410", width: "360",
text: "continue_with", text: "continue_with",
} as GsiButtonConfiguration // customization attributes } as GsiButtonConfiguration // customization attributes
); );
@ -48,7 +48,7 @@ export const GoogleLoginButton: FC<IGoogleLoginButton> = (props) => {
<> <>
<Script src="https://accounts.google.com/gsi/client" async defer onLoad={loadScript} /> <Script src="https://accounts.google.com/gsi/client" async defer onLoad={loadScript} />
<div <div
className="overflow-hidden rounded w-full flex justify-center items-center" className="overflow-hidden rounded w-full flex justify-center items-center !text-sm !font-medium !text-custom-text-100"
id="googleSignInButton" id="googleSignInButton"
ref={googleSignInButton} ref={googleSignInButton}
/> />

2
apps/app/components/analytics/custom-analytics/create-update-analytics-modal.tsx
View File

@ -111,7 +111,7 @@ export const CreateUpdateAnalyticsModal: React.FC<Props> = ({ isOpen, handleClos
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-100 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
<div> <div>
<Dialog.Title <Dialog.Title

2
apps/app/components/analytics/custom-analytics/graph/custom-tooltip.tsx
View File

@ -31,7 +31,7 @@ export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) =>
} }
return ( return (
<div className="flex items-center gap-2 rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs"> <div className="flex items-center gap-2 rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<span <span
className="h-3 w-3 rounded" className="h-3 w-3 rounded"
style={{ style={{

2
apps/app/components/analytics/custom-analytics/sidebar.tsx
View File

@ -185,7 +185,7 @@ export const AnalyticsSidebar: React.FC<Props> = ({
<div <div
className={`px-5 py-2.5 flex items-center justify-between space-y-2 ${ className={`px-5 py-2.5 flex items-center justify-between space-y-2 ${
fullScreen fullScreen
? "border-l border-custom-border-100 md:h-full md:border-l md:border-custom-border-100 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5" ? "border-l border-custom-border-300 md:h-full md:border-l md:border-custom-border-300 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5"
: "" : ""
}`} }`}
> >

8
apps/app/components/analytics/custom-analytics/table.tsx
View File

@ -37,9 +37,9 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
<div className="flow-root"> <div className="flow-root">
<div className="overflow-x-auto"> <div className="overflow-x-auto">
<div className="inline-block min-w-full align-middle"> <div className="inline-block min-w-full align-middle">
<table className="min-w-full divide-y divide-custom-border-100 whitespace-nowrap border-y border-custom-border-100"> <table className="min-w-full divide-y divide-custom-border-300 whitespace-nowrap border-y border-custom-border-300">
<thead className="bg-custom-background-80"> <thead className="bg-custom-background-80">
<tr className="divide-x divide-custom-border-100 text-sm text-custom-text-100"> <tr className="divide-x divide-custom-border-300 text-sm text-custom-text-100">
<th scope="col" className="py-3 px-2.5 text-left font-medium"> <th scope="col" className="py-3 px-2.5 text-left font-medium">
{ANALYTICS_X_AXIS_VALUES.find((v) => v.value === params.x_axis)?.label} {ANALYTICS_X_AXIS_VALUES.find((v) => v.value === params.x_axis)?.label}
</th> </th>
@ -80,11 +80,11 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
)} )}
</tr> </tr>
</thead> </thead>
<tbody className="divide-y divide-custom-border-100"> <tbody className="divide-y divide-custom-border-300">
{barGraphData.data.map((item, index) => ( {barGraphData.data.map((item, index) => (
<tr <tr
key={`table-row-${index}`} key={`table-row-${index}`}
className="divide-x divide-custom-border-100 text-xs text-custom-text-200" className="divide-x divide-custom-border-300 text-xs text-custom-text-200"
> >
<td <td
className={`flex items-center gap-2 whitespace-nowrap py-2 px-2.5 font-medium ${ className={`flex items-center gap-2 whitespace-nowrap py-2 px-2.5 font-medium ${

6
apps/app/components/analytics/project-modal.tsx
View File

@ -155,7 +155,7 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
} ${isOpen ? "right-0" : "-right-full"} duration-300 transition-all`} } ${isOpen ? "right-0" : "-right-full"} duration-300 transition-all`}
> >
<div <div
className={`flex h-full flex-col overflow-hidden border-custom-border-100 bg-custom-background-100 text-left ${ className={`flex h-full flex-col overflow-hidden border-custom-border-300 bg-custom-background-100 text-left ${
fullScreen ? "rounded-lg border" : "border-l" fullScreen ? "rounded-lg border" : "border-l"
}`} }`}
> >
@ -186,12 +186,12 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
</div> </div>
</div> </div>
<Tab.Group as={Fragment}> <Tab.Group as={Fragment}>
<Tab.List as="div" className="space-x-2 border-b border-custom-border-100 p-5 pt-0"> <Tab.List as="div" className="space-x-2 border-b border-custom-border-300 p-5 pt-0">
{tabsList.map((tab) => ( {tabsList.map((tab) => (
<Tab <Tab
key={tab} key={tab}
className={({ selected }) => className={({ selected }) =>
`rounded-3xl border border-custom-border-100 px-4 py-2 text-xs hover:bg-custom-background-80 ${ `rounded-3xl border border-custom-border-300 px-4 py-2 text-xs hover:bg-custom-background-80 ${
selected ? "bg-custom-background-80" : "" selected ? "bg-custom-background-80" : ""
}` }`
} }

4
apps/app/components/analytics/scope-and-demand/demand.tsx
View File

@ -10,7 +10,7 @@ type Props = {
}; };
export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => ( export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="space-y-3 rounded-[10px] border border-custom-border-100 p-3"> <div className="space-y-3 rounded-[10px] border border-custom-border-300 p-3">
<h5 className="text-xs text-red-500">DEMAND</h5> <h5 className="text-xs text-red-500">DEMAND</h5>
<div> <div>
<h4 className="text-custom-text-100 text-base font-medium">Total open tasks</h4> <h4 className="text-custom-text-100 text-base font-medium">Total open tasks</h4>
@ -50,7 +50,7 @@ export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
); );
})} })}
</div> </div>
<div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs"> <div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<p className="flex items-center gap-1 text-custom-text-200"> <p className="flex items-center gap-1 text-custom-text-200">
<PlayIcon className="h-4 w-4 -rotate-90" aria-hidden="true" /> <PlayIcon className="h-4 w-4 -rotate-90" aria-hidden="true" />
<span>Estimate Demand:</span> <span>Estimate Demand:</span>

2
apps/app/components/analytics/scope-and-demand/leaderboard.tsx
View File

@ -10,7 +10,7 @@ type Props = {
}; };
export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => ( export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => (
<div className="p-3 border border-custom-border-100 rounded-[10px]"> <div className="p-3 border border-custom-border-300 rounded-[10px]">
<h6 className="text-base font-medium">{title}</h6> <h6 className="text-base font-medium">{title}</h6>
{users.length > 0 ? ( {users.length > 0 ? (
<div className="mt-3 space-y-3"> <div className="mt-3 space-y-3">

6
apps/app/components/analytics/scope-and-demand/scope.tsx
View File

@ -8,9 +8,9 @@ type Props = {
}; };
export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => ( export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="rounded-[10px] border border-custom-border-100"> <div className="rounded-[10px] border border-custom-border-300">
<h5 className="p-3 text-xs text-green-500">SCOPE</h5> <h5 className="p-3 text-xs text-green-500">SCOPE</h5>
<div className="divide-y divide-custom-border-100"> <div className="divide-y divide-custom-border-300">
<div> <div>
<h6 className="px-3 text-base font-medium">Pending issues</h6> <h6 className="px-3 text-base font-medium">Pending issues</h6>
{defaultAnalytics.pending_issue_user.length > 0 ? ( {defaultAnalytics.pending_issue_user.length > 0 ? (
@ -27,7 +27,7 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
); );
return ( return (
<div className="rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<span className="font-medium text-custom-text-200"> <span className="font-medium text-custom-text-200">
{assignee {assignee
? assignee.assignees__first_name + " " + assignee.assignees__last_name ? assignee.assignees__first_name + " " + assignee.assignees__last_name

4
apps/app/components/analytics/scope-and-demand/year-wise-issues.tsx
View File

@ -15,7 +15,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
const quarterMonthsList = [startMonth, startMonth + 1, startMonth + 2]; const quarterMonthsList = [startMonth, startMonth + 1, startMonth + 2];
return ( return (
<div className="py-3 border border-custom-border-100 rounded-[10px]"> <div className="py-3 border border-custom-border-300 rounded-[10px]">
<h1 className="px-3 text-base font-medium">Issues closed in a year</h1> <h1 className="px-3 text-base font-medium">Issues closed in a year</h1>
{defaultAnalytics.issue_completed_month_wise.length > 0 ? ( {defaultAnalytics.issue_completed_month_wise.length > 0 ? (
<LineGraph <LineGraph
@ -43,7 +43,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
margin={{ top: 20 }} margin={{ top: 20 }}
enableSlices="x" enableSlices="x"
sliceTooltip={(datum) => ( sliceTooltip={(datum) => (
<div className="rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
{datum.slice.points[0].data.yFormatted} {datum.slice.points[0].data.yFormatted}
<span className="text-custom-text-200"> issues closed in </span> <span className="text-custom-text-200"> issues closed in </span>
{datum.slice.points[0].data.xFormatted} {datum.slice.points[0].data.xFormatted}

4
apps/app/components/command-palette/command-pallette.tsx
View File

@ -421,7 +421,7 @@ export const CommandPalette: React.FC = () => {
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform divide-y divide-custom-border-100 divide-opacity-10 rounded-xl border border-custom-border-100 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform divide-y divide-custom-border-300 divide-opacity-10 rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all">
<Command <Command
filter={(value, search) => { filter={(value, search) => {
if (value.toLowerCase().includes(search.toLowerCase())) return 1; if (value.toLowerCase().includes(search.toLowerCase())) return 1;
@ -456,7 +456,7 @@ export const CommandPalette: React.FC = () => {
aria-hidden="true" aria-hidden="true"
/> />
<Command.Input <Command.Input
className="w-full border-0 border-b border-custom-border-100 bg-transparent p-4 pl-11 text-custom-text-100 outline-none focus:ring-0 sm:text-sm" className="w-full border-0 border-b border-custom-border-300 bg-transparent p-4 pl-11 text-custom-text-100 outline-none focus:ring-0 sm:text-sm"
placeholder={placeholder} placeholder={placeholder}
value={searchTerm} value={searchTerm}
onValueChange={(e) => { onValueChange={(e) => {

14
apps/app/components/command-palette/shortcuts-modal.tsx
View File

@ -104,7 +104,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
</span> </span>
</Dialog.Title> </Dialog.Title>
<div> <div>
<div className="flex w-full items-center justify-start gap-1 rounded border-[0.6px] border-custom-border-100 bg-custom-background-90 px-3 py-2"> <div className="flex w-full items-center justify-start gap-1 rounded border-[0.6px] border-custom-border-300 bg-custom-background-90 px-3 py-2">
<MagnifyingGlassIcon className="h-3.5 w-3.5 text-custom-text-200" /> <MagnifyingGlassIcon className="h-3.5 w-3.5 text-custom-text-200" />
<Input <Input
className="w-full border-none bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none" className="w-full border-none bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none"
@ -130,15 +130,15 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{shortcut.keys.split(",").map((key, index) => ( {shortcut.keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
<span className="flex h-full items-center rounded-sm border border-custom-border-100 bg-custom-background-90 p-1.5"> <span className="flex h-full items-center rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</span> </span>
) : key === "Ctrl" ? ( ) : key === "Ctrl" ? (
<kbd className="rounded-sm border border-custom-border-100 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</kbd> </kbd>
) : ( ) : (
<kbd className="rounded-sm border border-custom-border-100 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200">
{key} {key}
</kbd> </kbd>
)} )}
@ -173,15 +173,15 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{keys.split(",").map((key, index) => ( {keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
<span className="flex h-full items-center rounded-sm border border-custom-border-100 bg-custom-background-90 p-1.5 text-custom-text-200"> <span className="flex h-full items-center rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</span> </span>
) : key === "Ctrl" ? ( ) : key === "Ctrl" ? (
<kbd className="rounded-sm border border-custom-border-100 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</kbd> </kbd>
) : ( ) : (
<kbd className="rounded-sm border border-custom-border-100 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200">
{key} {key}
</kbd> </kbd>
)} )}

2
apps/app/components/core/board-view/all-boards.tsx
View File

@ -74,7 +74,7 @@ export const AllBoards: React.FC<Props> = ({
); );
})} })}
{!showEmptyGroups && ( {!showEmptyGroups && (
<div className="h-full w-96 flex-shrink-0 space-y-3 p-1"> <div className="h-full w-96 flex-shrink-0 space-y-2 p-1">
<h2 className="text-lg font-semibold">Hidden groups</h2> <h2 className="text-lg font-semibold">Hidden groups</h2>
<div className="space-y-3"> <div className="space-y-3">
{Object.keys(groupedByIssues).map((singleGroup, index) => { {Object.keys(groupedByIssues).map((singleGroup, index) => {

6
apps/app/components/core/board-view/single-issue.tsx
View File

@ -392,7 +392,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -402,7 +402,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -412,7 +412,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

8
apps/app/components/core/calendar-view/calendar-header.tsx
View File

@ -92,7 +92,7 @@ export const CalendarHeader: React.FC<Props> = ({
</button> </button>
))} ))}
</div> </div>
<div className="grid grid-cols-4 border-t border-custom-border-100 px-2"> <div className="grid grid-cols-4 border-t border-custom-border-300 px-2">
{MONTHS_LIST.map((month) => ( {MONTHS_LIST.map((month) => (
<button <button
onClick={() => onClick={() =>
@ -152,7 +152,7 @@ export const CalendarHeader: React.FC<Props> = ({
<div className="flex w-full items-center justify-end gap-2"> <div className="flex w-full items-center justify-end gap-2">
<button <button
className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-100 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none" className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-300 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none"
onClick={() => { onClick={() => {
if (isMonthlyView) { if (isMonthlyView) {
updateDate(new Date()); updateDate(new Date());
@ -170,7 +170,7 @@ export const CalendarHeader: React.FC<Props> = ({
<CustomMenu <CustomMenu
customButton={ customButton={
<div className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-100 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none "> <div className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-300 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none ">
{isMonthlyView ? "Monthly" : "Weekly"} {isMonthlyView ? "Monthly" : "Weekly"}
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" /> <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</div> </div>
@ -207,7 +207,7 @@ export const CalendarHeader: React.FC<Props> = ({
/> />
</div> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="mt-1 flex w-52 items-center justify-between border-t border-custom-border-100 py-2 px-1 text-sm text-custom-text-200"> <div className="mt-1 flex w-52 items-center justify-between border-t border-custom-border-300 py-2 px-1 text-sm text-custom-text-200">
<h4>Show weekends</h4> <h4>Show weekends</h4>
<ToggleSwitch value={showWeekEnds} onChange={() => setShowWeekEnds(!showWeekEnds)} /> <ToggleSwitch value={showWeekEnds} onChange={() => setShowWeekEnds(!showWeekEnds)} />
</div> </div>

2
apps/app/components/core/calendar-view/calendar.tsx
View File

@ -191,7 +191,7 @@ export const CalendarView: React.FC<Props> = ({
{weeks.map((date, index) => ( {weeks.map((date, index) => (
<div <div
key={index} key={index}
className={`flex items-center justify-start gap-2 border-custom-border-100 bg-custom-background-90 p-1.5 text-base font-medium text-custom-text-200 ${ className={`flex items-center justify-start gap-2 border-custom-border-300 bg-custom-background-90 p-1.5 text-base font-medium text-custom-text-200 ${
!isMonthlyView !isMonthlyView
? showWeekEnds ? showWeekEnds
? (index + 1) % 7 === 0 ? (index + 1) % 7 === 0

4
apps/app/components/core/calendar-view/single-date.tsx
View File

@ -49,7 +49,7 @@ export const SingleCalendarDate: React.FC<Props> = ({
key={index} key={index}
ref={provided.innerRef} ref={provided.innerRef}
{...provided.droppableProps} {...provided.droppableProps}
className={`group relative flex min-h-[150px] flex-col gap-1.5 border-t border-custom-border-100 p-2.5 text-left text-sm font-medium hover:bg-custom-background-90 ${ className={`group relative flex min-h-[150px] flex-col gap-1.5 border-t border-custom-border-300 p-2.5 text-left text-sm font-medium hover:bg-custom-background-90 ${
isMonthlyView ? "" : "pt-9" isMonthlyView ? "" : "pt-9"
} ${ } ${
showWeekEnds showWeekEnds
@ -83,7 +83,7 @@ export const SingleCalendarDate: React.FC<Props> = ({
{totalIssues > 4 && ( {totalIssues > 4 && (
<button <button
type="button" type="button"
className="w-min whitespace-nowrap rounded-md border border-custom-border-100 bg-custom-background-80 px-1.5 py-1 text-xs" className="w-min whitespace-nowrap rounded-md border border-custom-border-300 bg-custom-background-80 px-1.5 py-1 text-xs"
onClick={() => setShowAllIssues((prevData) => !prevData)} onClick={() => setShowAllIssues((prevData) => !prevData)}
> >
{showAllIssues ? "Hide" : totalIssues - 4 + " more"} {showAllIssues ? "Hide" : totalIssues - 4 + " more"}

8
apps/app/components/core/calendar-view/single-issue.tsx
View File

@ -163,7 +163,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
ref={provided.innerRef} ref={provided.innerRef}
{...provided.draggableProps} {...provided.draggableProps}
{...provided.dragHandleProps} {...provided.dragHandleProps}
className={`w-full relative cursor-pointer rounded border border-custom-border-100 px-1.5 py-1.5 text-xs duration-300 hover:cursor-move hover:bg-custom-background-80 ${ className={`w-full relative cursor-pointer rounded border border-custom-border-300 px-1.5 py-1.5 text-xs duration-300 hover:cursor-move hover:bg-custom-background-80 ${
snapshot.isDragging ? "bg-custom-background-80 shadow-lg" : "" snapshot.isDragging ? "bg-custom-background-80 shadow-lg" : ""
}`} }`}
> >
@ -267,7 +267,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -277,7 +277,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -287,7 +287,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

2
apps/app/components/core/feeds.tsx
View File

@ -263,7 +263,7 @@ export const Feeds: React.FC<any> = ({ activities }) => (
} }
editable={false} editable={false}
noBorder noBorder
customClassName="text-xs border border-custom-border-100 bg-custom-background-100" customClassName="text-xs border border-custom-border-300 bg-custom-background-100"
/> />
</div> </div>
</div> </div>

2
apps/app/components/core/filters/due-date-filter-modal.tsx
View File

@ -109,7 +109,7 @@ export const DueDateFilterModal: React.FC<Props> = ({ isOpen, handleClose }) =>
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative flex transform rounded-lg border border-custom-border-100 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative flex transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form className="space-y-4" onSubmit={handleSubmit(handleFormSubmit)}> <form className="space-y-4" onSubmit={handleSubmit(handleFormSubmit)}>
<div className="flex w-full justify-between"> <div className="flex w-full justify-between">
<Controller <Controller

6
apps/app/components/core/filters/filters-list.tsx
View File

@ -58,7 +58,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
return ( return (
<div <div
key={key} key={key}
className="flex items-center gap-x-2 rounded-full border border-custom-border-100 bg-custom-background-80 px-2 py-1" className="flex items-center gap-x-2 rounded-full border border-custom-border-300 bg-custom-background-80 px-2 py-1"
> >
<span className="capitalize text-custom-text-200"> <span className="capitalize text-custom-text-200">
{key === "target_date" ? "Due Date" : replaceUnderscoreIfSnakeCase(key)}: {key === "target_date" ? "Due Date" : replaceUnderscoreIfSnakeCase(key)}:
@ -310,7 +310,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
return ( return (
<div <div
key={date} key={date}
className="inline-flex items-center gap-x-1 rounded-full border border-custom-border-100 bg-custom-background-100 px-1 py-0.5" className="inline-flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-100 px-1 py-0.5"
> >
<div className="h-1.5 w-1.5 rounded-full" /> <div className="h-1.5 w-1.5 rounded-full" />
<span className="capitalize"> <span className="capitalize">
@ -381,7 +381,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
target_date: null, target_date: null,
}) })
} }
className="flex items-center gap-x-1 rounded-full border border-custom-border-100 bg-custom-background-80 px-3 py-1.5 text-xs" className="flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-80 px-3 py-1.5 text-xs"
> >
<span>Clear all filters</span> <span>Clear all filters</span>
<XMarkIcon className="h-3 w-3" /> <XMarkIcon className="h-3 w-3" />

6
apps/app/components/core/filters/issues-view-filter.tsx
View File

@ -165,8 +165,8 @@ export const IssuesFilterView: React.FC = () => {
leaveFrom="opacity-100 translate-y-0" leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-1" leaveTo="opacity-0 translate-y-1"
> >
<Popover.Panel className="absolute right-0 z-30 mt-1 w-screen max-w-xs transform rounded-lg border border-custom-border-100 bg-custom-background-90 p-3 shadow-lg"> <Popover.Panel className="absolute right-0 z-30 mt-1 w-screen max-w-xs transform rounded-lg border border-custom-border-300 bg-custom-background-90 p-3 shadow-lg">
<div className="relative divide-y-2 divide-custom-border-100"> <div className="relative divide-y-2 divide-custom-border-300">
<div className="space-y-4 pb-3 text-xs"> <div className="space-y-4 pb-3 text-xs">
{issueView !== "calendar" && issueView !== "spreadsheet" && ( {issueView !== "calendar" && issueView !== "spreadsheet" && (
<> <>
@ -292,7 +292,7 @@ export const IssuesFilterView: React.FC = () => {
className={`rounded border px-2 py-1 text-xs capitalize ${ className={`rounded border px-2 py-1 text-xs capitalize ${
properties[key as keyof Properties] properties[key as keyof Properties]
? "border-custom-primary bg-custom-primary text-white" ? "border-custom-primary bg-custom-primary text-white"
: "border-custom-border-100" : "border-custom-border-300"
}`} }`}
onClick={() => setProperties(key as keyof Properties)} onClick={() => setProperties(key as keyof Properties)}
> >

6
apps/app/components/core/image-picker-popover.tsx
View File

@ -62,7 +62,7 @@ export const ImagePickerPopover: React.FC<Props> = ({ label, value, onChange })
return ( return (
<Popover className="relative z-[2]" ref={ref}> <Popover className="relative z-[2]" ref={ref}>
<Popover.Button <Popover.Button
className="rounded-md border border-custom-border-100 bg-custom-background-80 px-2 py-1 text-xs text-custom-text-200" className="rounded-md border border-custom-border-300 bg-custom-background-80 px-2 py-1 text-xs text-custom-text-200"
onClick={() => setIsOpen((prev) => !prev)} onClick={() => setIsOpen((prev) => !prev)}
> >
{label} {label}
@ -76,8 +76,8 @@ export const ImagePickerPopover: React.FC<Props> = ({ label, value, onChange })
leaveFrom="transform opacity-100 scale-100" leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Popover.Panel className="absolute right-0 z-10 mt-2 rounded-md border border-custom-border-100 bg-custom-background-80 shadow-lg"> <Popover.Panel className="absolute right-0 z-10 mt-2 rounded-md border border-custom-border-300 bg-custom-background-80 shadow-lg">
<div className="h-96 w-80 overflow-auto rounded border border-custom-border-100 bg-custom-background-80 p-5 shadow-2xl sm:max-w-2xl md:w-96 lg:w-[40rem]"> <div className="h-96 w-80 overflow-auto rounded border border-custom-border-300 bg-custom-background-80 p-5 shadow-2xl sm:max-w-2xl md:w-96 lg:w-[40rem]">
<Tab.Group> <Tab.Group>
<Tab.List as="span" className="inline-block rounded bg-custom-background-80 p-1"> <Tab.List as="span" className="inline-block rounded bg-custom-background-80 p-1">
{tabOptions.map((tab) => ( {tabOptions.map((tab) => (

2
apps/app/components/core/issues-view.tsx
View File

@ -488,7 +488,7 @@ export const IssuesView: React.FC<Props> = ({
{viewId ? "Update" : "Save"} view {viewId ? "Update" : "Save"} view
</PrimaryButton> </PrimaryButton>
</div> </div>
{<div className="mt-3 border-t border-custom-border-100" />} {<div className="mt-3 border-t border-custom-border-300" />}
</> </>
)} )}

8
apps/app/components/core/list-view/single-issue.tsx
View File

@ -219,7 +219,7 @@ export const SingleListIssue: React.FC<Props> = ({
</a> </a>
</ContextMenu> </ContextMenu>
<div <div
className="flex flex-wrap items-center justify-between px-4 py-2.5 gap-2 border-b border-custom-border-100 bg-custom-background-100 last:border-b-0" className="flex flex-wrap items-center justify-between px-4 py-2.5 gap-2 border-b border-custom-border-300 bg-custom-background-100 last:border-b-0"
onContextMenu={(e) => { onContextMenu={(e) => {
e.preventDefault(); e.preventDefault();
setContextMenu(true); setContextMenu(true);
@ -307,7 +307,7 @@ export const SingleListIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -317,7 +317,7 @@ export const SingleListIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -327,7 +327,7 @@ export const SingleListIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

4
apps/app/components/core/modals/bulk-delete-issues-modal.tsx
View File

@ -173,7 +173,7 @@ export const BulkDeleteIssuesModal: React.FC<Props> = ({ isOpen, setIsOpen, user
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-100 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all">
<form> <form>
<Combobox <Combobox
onChange={(val: string) => { onChange={(val: string) => {
@ -201,7 +201,7 @@ export const BulkDeleteIssuesModal: React.FC<Props> = ({ isOpen, setIsOpen, user
<Combobox.Options <Combobox.Options
static static
className="max-h-80 scroll-py-2 divide-y divide-custom-border-100 overflow-y-auto" className="max-h-80 scroll-py-2 divide-y divide-custom-border-300 overflow-y-auto"
> >
{filteredIssues.length > 0 ? ( {filteredIssues.length > 0 ? (
<li className="p-2"> <li className="p-2">

6
apps/app/components/core/modals/existing-issues-list-modal.tsx
View File

@ -154,7 +154,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-100 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all">
<Combobox <Combobox
as="div" as="div"
onChange={(val: ISearchIssueResponse) => { onChange={(val: ISearchIssueResponse) => {
@ -182,7 +182,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
{selectedIssues.map((issue) => ( {selectedIssues.map((issue) => (
<div <div
key={issue.id} key={issue.id}
className="flex items-center gap-1 text-xs border border-custom-border-100 bg-custom-background-80 pl-2 py-1 rounded-md text-custom-text-100 whitespace-nowrap" className="flex items-center gap-1 text-xs border border-custom-border-300 bg-custom-background-80 pl-2 py-1 rounded-md text-custom-text-100 whitespace-nowrap"
> >
{issue.project__identifier}-{issue.sequence_id} {issue.project__identifier}-{issue.sequence_id}
<button <button
@ -200,7 +200,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
))} ))}
</div> </div>
) : ( ) : (
<div className="w-min text-xs border border-custom-border-100 bg-custom-background-80 p-2 rounded-md whitespace-nowrap"> <div className="w-min text-xs border border-custom-border-300 bg-custom-background-80 p-2 rounded-md whitespace-nowrap">
No issues selected No issues selected
</div> </div>
)} )}

2
apps/app/components/core/modals/gpt-assistant-modal.tsx
View File

@ -143,7 +143,7 @@ export const GptAssistantModal: React.FC<Props> = ({
return ( return (
<div <div
className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-4 shadow ${ className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4 shadow ${
isOpen ? "block" : "hidden" isOpen ? "block" : "hidden"
}`} }`}
> >

4
apps/app/components/core/modals/image-upload-modal.tsx
View File

@ -118,7 +118,7 @@ export const ImageUploadModal: React.FC<Props> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:w-full sm:max-w-xl sm:p-6"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:w-full sm:max-w-xl sm:p-6">
<div className="space-y-5"> <div className="space-y-5">
<Dialog.Title <Dialog.Title
as="h3" as="h3"
@ -132,7 +132,7 @@ export const ImageUploadModal: React.FC<Props> = ({
{...getRootProps()} {...getRootProps()}
className={`relative grid h-80 w-full cursor-pointer place-items-center rounded-lg p-12 text-center focus:outline-none focus:ring-2 focus:ring-custom-primary focus:ring-offset-2 ${ className={`relative grid h-80 w-full cursor-pointer place-items-center rounded-lg p-12 text-center focus:outline-none focus:ring-2 focus:ring-custom-primary focus:ring-offset-2 ${
(image === null && isDragActive) || !value (image === null && isDragActive) || !value
? "border-2 border-dashed border-custom-border-100 hover:bg-custom-background-90" ? "border-2 border-dashed border-custom-border-300 hover:bg-custom-background-90"
: "" : ""
}`} }`}
> >

4
apps/app/components/core/modals/link-modal.tsx
View File

@ -56,7 +56,7 @@ export const LinkModal: React.FC<Props> = ({ isOpen, handleClose, onFormSubmit }
leaveFrom="opacity-100" leaveFrom="opacity-100"
leaveTo="opacity-0" leaveTo="opacity-0"
> >
<div className="fixed inset-0 bg-[#131313] bg-opacity-50 transition-opacity" /> <div className="fixed inset-0 bg-custom-backdrop bg-opacity-50 transition-opacity" />
</Transition.Child> </Transition.Child>
<div className="fixed inset-0 z-10 overflow-y-auto"> <div className="fixed inset-0 z-10 overflow-y-auto">
@ -70,7 +70,7 @@ export const LinkModal: React.FC<Props> = ({ isOpen, handleClose, onFormSubmit }
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg bg-custom-background-80 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg bg-custom-background-100 border border-custom-border-200 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
<div> <div>
<div className="space-y-5"> <div className="space-y-5">

2
apps/app/components/core/sidebar/links-list.tsx
View File

@ -49,7 +49,7 @@ export const LinksList: React.FC<Props> = ({ links, handleDeleteLink, userAuth }
)} )}
<Link href={link.url}> <Link href={link.url}>
<a <a
className="relative flex gap-2 rounded-md bg-custom-background-100 p-2" className="relative flex gap-2 rounded-md bg-custom-background-90 p-2"
target="_blank" target="_blank"
> >
<div className="mt-0.5"> <div className="mt-0.5">

2
apps/app/components/core/sidebar/progress-chart.tsx
View File

@ -119,7 +119,7 @@ const ProgressChart: React.FC<Props> = ({ distribution, startDate, endDate, tota
gridXValues={chartData.map((item, index) => (index % 2 === 0 ? item.currentDate : ""))} gridXValues={chartData.map((item, index) => (index % 2 === 0 ? item.currentDate : ""))}
enableSlices="x" enableSlices="x"
sliceTooltip={(datum) => ( sliceTooltip={(datum) => (
<div className="rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
{datum.slice.points[0].data.yFormatted} {datum.slice.points[0].data.yFormatted}
<span className="text-custom-text-200"> issues pending on </span> <span className="text-custom-text-200"> issues pending on </span>
{datum.slice.points[0].data.xFormatted} {datum.slice.points[0].data.xFormatted}

8
apps/app/components/core/sidebar/sidebar-progress-stats.tsx
View File

@ -87,7 +87,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-100" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -98,7 +98,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-100" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -109,7 +109,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-100" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -159,7 +159,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
key={`unassigned-${index}`} key={`unassigned-${index}`}
title={ title={
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-5 w-5 rounded-full border-2 border-custom-border-100 bg-custom-background-80"> <div className="h-5 w-5 rounded-full border-2 border-custom-border-300 bg-custom-background-80">
<img <img
src="/user.png" src="/user.png"
height="100%" height="100%"

22
apps/app/components/core/spreadsheet-view/single-issue.tsx
View File

@ -179,10 +179,10 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
return ( return (
<div <div
className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-100 w-full min-w-max" className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-300 w-full min-w-max"
style={{ gridTemplateColumns }} style={{ gridTemplateColumns }}
> >
<div className="flex gap-1.5 items-center px-4 sticky z-[1] left-0 text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-100 w-full"> <div className="flex gap-1.5 items-center px-4 sticky z-[1] left-0 text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full">
<div className="flex gap-1.5 items-center" style={issue.parent ? { paddingLeft } : {}}> <div className="flex gap-1.5 items-center" style={issue.parent ? { paddingLeft } : {}}>
<div className="relative flex items-center cursor-pointer text-xs text-center hover:text-custom-text-100 w-14"> <div className="relative flex items-center cursor-pointer text-xs text-center hover:text-custom-text-100 w-14">
{properties.key && ( {properties.key && (
@ -198,7 +198,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
onInteraction={(nextOpenState) => setIsOpen(nextOpenState)} onInteraction={(nextOpenState) => setIsOpen(nextOpenState)}
content={ content={
<div <div
className={`flex flex-col gap-1.5 overflow-y-scroll whitespace-nowrap rounded-md border p-1 text-xs shadow-lg focus:outline-none max-h-44 min-w-full border-custom-border-100 bg-custom-background-90`} className={`flex flex-col gap-1.5 overflow-y-scroll whitespace-nowrap rounded-md border p-1 text-xs shadow-lg focus:outline-none max-h-44 min-w-full border-custom-border-300 bg-custom-background-90`}
> >
<button <button
type="button" type="button"
@ -270,7 +270,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</Link> </Link>
</div> </div>
{properties.state && ( {properties.state && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewStateSelect <ViewStateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -284,7 +284,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.priority && ( {properties.priority && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewPrioritySelect <ViewPrioritySelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -297,7 +297,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.assignee && ( {properties.assignee && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewAssigneeSelect <ViewAssigneeSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -310,7 +310,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.labels && ( {properties.labels && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewLabelSelect <ViewLabelSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -324,7 +324,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
)} )}
{properties.due_date && ( {properties.due_date && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewDueDateSelect <ViewDueDateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -336,7 +336,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.estimate && ( {properties.estimate && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
<ViewEstimateSelect <ViewEstimateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -348,12 +348,12 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.created_on && ( {properties.created_on && (
<div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
{renderLongDetailDateFormat(issue.created_at)} {renderLongDetailDateFormat(issue.created_at)}
</div> </div>
)} )}
{properties.updated_on && ( {properties.updated_on && (
<div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-100"> <div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300">
{renderLongDetailDateFormat(issue.updated_at)} {renderLongDetailDateFormat(issue.updated_at)}
</div> </div>
)} )}

8
apps/app/components/core/spreadsheet-view/spreadsheet-view.tsx
View File

@ -62,7 +62,7 @@ export const SpreadsheetView: React.FC<Props> = ({
return ( return (
<div className="h-full rounded-lg text-custom-text-200 overflow-x-auto whitespace-nowrap bg-custom-background-100"> <div className="h-full rounded-lg text-custom-text-200 overflow-x-auto whitespace-nowrap bg-custom-background-100">
<div className="sticky z-[2] top-0 border-b border-custom-border-100 bg-custom-background-90 w-full min-w-max"> <div className="sticky z-[2] top-0 border-b border-custom-border-300 bg-custom-background-90 w-full min-w-max">
<SpreadsheetColumns columnData={columnData} gridTemplateColumns={gridTemplateColumns} /> <SpreadsheetColumns columnData={columnData} gridTemplateColumns={gridTemplateColumns} />
</div> </div>
{spreadsheetIssues ? ( {spreadsheetIssues ? (
@ -84,12 +84,12 @@ export const SpreadsheetView: React.FC<Props> = ({
/> />
))} ))}
<div <div
className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-100 w-full min-w-max" className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-300 w-full min-w-max"
style={{ gridTemplateColumns }} style={{ gridTemplateColumns }}
> >
{type === "issue" ? ( {type === "issue" ? (
<button <button
className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-100 w-full" className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "c" }); const e = new KeyboardEvent("keydown", { key: "c" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -104,7 +104,7 @@ export const SpreadsheetView: React.FC<Props> = ({
className="sticky left-0 z-[1]" className="sticky left-0 z-[1]"
customButton={ customButton={
<button <button
className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-100 w-full" className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full"
type="button" type="button"
> >
<PlusIcon className="h-4 w-4" /> <PlusIcon className="h-4 w-4" />

2
apps/app/components/core/theme/color-picker-input.tsx
View File

@ -81,7 +81,7 @@ export const ColorPickerInput: React.FC<Props> = ({ name, watch, setValue, error
> >
{watch(name) && watch(name) !== "" ? ( {watch(name) && watch(name) !== "" ? (
<span <span
className="h-4 w-4 rounded border border-custom-border-100" className="h-4 w-4 rounded border border-custom-border-300"
style={{ style={{
backgroundColor: `${watch(name)}`, backgroundColor: `${watch(name)}`,
}} }}

18
apps/app/components/cycles/active-cycle-details.tsx
View File

@ -209,8 +209,8 @@ export const ActiveCycleDetails: React.FC = () => {
})); }));
return ( return (
<div className="grid-row-2 grid rounded-[10px] shadow divide-y bg-custom-background-100 border border-custom-border-100"> <div className="grid-row-2 grid rounded-[10px] shadow divide-y bg-custom-background-100 border border-custom-border-300">
<div className="grid grid-cols-1 divide-y border-custom-border-100 lg:divide-y-0 lg:divide-x lg:grid-cols-3"> <div className="grid grid-cols-1 divide-y border-custom-border-300 lg:divide-y-0 lg:divide-x lg:grid-cols-3">
<div className="flex flex-col text-xs"> <div className="flex flex-col text-xs">
<div className="h-full w-full"> <div className="h-full w-full">
<div className="flex h-60 flex-col gap-5 justify-between rounded-b-[10px] p-4"> <div className="flex h-60 flex-col gap-5 justify-between rounded-b-[10px] p-4">
@ -362,8 +362,8 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className="grid col-span-2 grid-cols-1 divide-y border-custom-border-100 md:divide-y-0 md:divide-x md:grid-cols-2"> <div className="grid col-span-2 grid-cols-1 divide-y border-custom-border-300 md:divide-y-0 md:divide-x md:grid-cols-2">
<div className="flex h-60 flex-col border-custom-border-100"> <div className="flex h-60 flex-col border-custom-border-300">
<div className="flex h-full w-full flex-col text-custom-text-200 p-4"> <div className="flex h-full w-full flex-col text-custom-text-200 p-4">
<div className="flex w-full items-center gap-2 py-1"> <div className="flex w-full items-center gap-2 py-1">
<span>Progress</span> <span>Progress</span>
@ -391,12 +391,12 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className="border-custom-border-100 h-60 overflow-y-scroll"> <div className="border-custom-border-300 h-60 overflow-y-scroll">
<ActiveCycleProgressStats cycle={cycle} /> <ActiveCycleProgressStats cycle={cycle} />
</div> </div>
</div> </div>
</div> </div>
<div className="grid grid-cols-1 divide-y border-custom-border-100 lg:divide-y-0 lg:divide-x lg:grid-cols-2"> <div className="grid grid-cols-1 divide-y border-custom-border-300 lg:divide-y-0 lg:divide-x lg:grid-cols-2">
<div className="flex flex-col justify-between p-4"> <div className="flex flex-col justify-between p-4">
<div> <div>
<div className="text-custom-primary">High Priority Issues</div> <div className="text-custom-primary">High Priority Issues</div>
@ -406,7 +406,7 @@ export const ActiveCycleDetails: React.FC = () => {
issues.map((issue) => ( issues.map((issue) => (
<div <div
key={issue.id} key={issue.id}
className="flex flex-wrap rounded-md items-center justify-between gap-2 border border-custom-border-100 bg-custom-background-90 px-3 py-1.5" className="flex flex-wrap rounded-md items-center justify-between gap-2 border border-custom-border-300 bg-custom-background-90 px-3 py-1.5"
> >
<div className="flex flex-col gap-1"> <div className="flex flex-col gap-1">
<div> <div>
@ -444,7 +444,7 @@ export const ActiveCycleDetails: React.FC = () => {
{issue.label_details.map((label) => ( {issue.label_details.map((label) => (
<span <span
key={label.id} key={label.id}
className="group flex items-center gap-1 rounded-2xl border border-custom-border-100 px-2 py-0.5 text-xs text-custom-text-200" className="group flex items-center gap-1 rounded-2xl border border-custom-border-300 px-2 py-0.5 text-xs text-custom-text-200"
> >
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"
@ -517,7 +517,7 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
)} )}
</div> </div>
<div className="flex flex-col justify-between border-custom-border-100 p-4"> <div className="flex flex-col justify-between border-custom-border-300 p-4">
<div className="flex items-start justify-between gap-4 py-1.5 text-xs"> <div className="flex items-start justify-between gap-4 py-1.5 text-xs">
<div className="flex items-center gap-3 text-custom-text-100"> <div className="flex items-center gap-3 text-custom-text-100">
<div className="flex items-center justify-center gap-1"> <div className="flex items-center justify-center gap-1">

6
apps/app/components/cycles/active-cycle-stats.tsx
View File

@ -52,7 +52,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
> >
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-100 ${ `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-300 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
} }
@ -61,7 +61,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
</Tab> </Tab>
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-100 ${ `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-300 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
} }
@ -103,7 +103,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
key={`unassigned-${index}`} key={`unassigned-${index}`}
title={ title={
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-5 w-5 rounded-full border-2 border-custom-border-100 bg-custom-background-80"> <div className="h-5 w-5 rounded-full border-2 border-custom-border-300 bg-custom-background-80">
<img <img
src="/user.png" src="/user.png"
height="100%" height="100%"

4
apps/app/components/cycles/cycles-view.tsx
View File

@ -173,10 +173,10 @@ export const CyclesView: React.FC<Props> = ({ cycles, viewType }) => {
{cycles ? ( {cycles ? (
cycles.length > 0 ? ( cycles.length > 0 ? (
viewType === "list" ? ( viewType === "list" ? (
<div className="divide-y divide-custom-border-100"> <div className="divide-y divide-custom-border-300">
{cycles.map((cycle) => ( {cycles.map((cycle) => (
<div className="hover:bg-custom-background-80"> <div className="hover:bg-custom-background-80">
<div className="flex flex-col border-custom-border-100"> <div className="flex flex-col border-custom-border-300">
<SingleCycleList <SingleCycleList
key={cycle.id} key={cycle.id}
cycle={cycle} cycle={cycle}

2
apps/app/components/cycles/delete-cycle-modal.tsx
View File

@ -124,7 +124,7 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-[40rem]"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-[40rem]">
<div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4"> <div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
<div className="sm:flex sm:items-start"> <div className="sm:flex sm:items-start">
<div className="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-red-500/20 sm:mx-0 sm:h-10 sm:w-10"> <div className="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-red-500/20 sm:mx-0 sm:h-10 sm:w-10">

2
apps/app/components/cycles/form.tsx
View File

@ -107,7 +107,7 @@ export const CycleForm: React.FC<Props> = ({ handleFormSubmit, handleClose, stat
</div> </div>
</div> </div>
</div> </div>
<div className="-mx-5 mt-5 flex justify-end gap-2 border-t border-custom-border-100 px-5 pt-5"> <div className="-mx-5 mt-5 flex justify-end gap-2 border-t border-custom-border-300 px-5 pt-5">
<SecondaryButton onClick={handleClose}>Cancel</SecondaryButton> <SecondaryButton onClick={handleClose}>Cancel</SecondaryButton>
<PrimaryButton type="submit" loading={isSubmitting}> <PrimaryButton type="submit" loading={isSubmitting}>
{status {status

2
apps/app/components/cycles/modal.tsx
View File

@ -247,7 +247,7 @@ export const CreateUpdateCycleModal: React.FC<CycleModalProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-100 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<CycleForm <CycleForm
handleFormSubmit={handleFormSubmit} handleFormSubmit={handleFormSubmit}
handleClose={handleClose} handleClose={handleClose}

2
apps/app/components/cycles/select.tsx
View File

@ -66,7 +66,7 @@ export const CycleSelect: React.FC<IssueCycleSelectProps> = ({
{({ open }) => ( {({ open }) => (
<> <>
<Listbox.Button <Listbox.Button
className={`flex cursor-pointer items-center gap-1 rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm duration-300 hover:bg-custom-background-90 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500`} className={`flex cursor-pointer items-center gap-1 rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm duration-300 hover:bg-custom-background-90 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500`}
> >
<CyclesIcon className="h-3 w-3 text-custom-text-200" /> <CyclesIcon className="h-3 w-3 text-custom-text-200" />
<div className="flex items-center gap-2 truncate"> <div className="flex items-center gap-2 truncate">

12
apps/app/components/cycles/sidebar.tsx
View File

@ -292,14 +292,14 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<div <div
className={`fixed top-[66px] ${ className={`fixed top-[66px] ${
isOpen ? "right-0" : "-right-[24rem]" isOpen ? "right-0" : "-right-[24rem]"
} h-full w-[24rem] overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`} } h-full w-[24rem] overflow-y-auto border-l border-custom-border-300 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`}
> >
{cycle ? ( {cycle ? (
<> <>
<div className="flex flex-col items-start justify-center"> <div className="flex flex-col items-start justify-center">
<div className="flex gap-2.5 px-5 text-sm"> <div className="flex gap-2.5 px-5 text-sm">
<div className="flex items-center"> <div className="flex items-center">
<span className="flex items-center rounded border-[0.5px] border-custom-border-100 bg-custom-background-90 px-2 py-1 text-center text-xs capitalize"> <span className="flex items-center rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-center text-xs capitalize">
{capitalizeFirstLetter(cycleStatus)} {capitalizeFirstLetter(cycleStatus)}
</span> </span>
</div> </div>
@ -309,7 +309,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<> <>
<Popover.Button <Popover.Button
disabled={isCompleted ?? false} disabled={isCompleted ?? false}
className={`group flex h-full items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-100 bg-custom-background-90 px-2 py-1 text-xs ${ className={`group flex h-full items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-xs ${
cycle.start_date ? "" : "text-custom-text-200" cycle.start_date ? "" : "text-custom-text-200"
}`} }`}
> >
@ -359,7 +359,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<> <>
<Popover.Button <Popover.Button
disabled={isCompleted ?? false} disabled={isCompleted ?? false}
className={`group flex items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-100 bg-custom-background-90 px-2 py-1 text-xs ${ className={`group flex items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-xs ${
cycle.end_date ? "" : "text-custom-text-200" cycle.end_date ? "" : "text-custom-text-200"
}`} }`}
> >
@ -477,7 +477,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
</div> </div>
</div> </div>
</div> </div>
<div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-100 p-6"> <div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-300 p-6">
<Disclosure defaultOpen> <Disclosure defaultOpen>
{({ open }) => ( {({ open }) => (
<div <div
@ -561,7 +561,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
)} )}
</Disclosure> </Disclosure>
</div> </div>
<div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-100 p-6"> <div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-300 p-6">
<Disclosure defaultOpen> <Disclosure defaultOpen>
{({ open }) => ( {({ open }) => (
<div <div

4
apps/app/components/cycles/single-cycle-card.tsx
View File

@ -128,7 +128,7 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
return ( return (
<div> <div>
<div className="flex flex-col rounded-[10px] bg-custom-background-100 border border-custom-border-100 text-xs shadow"> <div className="flex flex-col rounded-[10px] bg-custom-background-100 border border-custom-border-300 text-xs shadow">
<Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`}> <Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`}>
<a className="w-full"> <a className="w-full">
<div className="flex h-full flex-col gap-4 rounded-b-[10px] p-4"> <div className="flex h-full flex-col gap-4 rounded-b-[10px] p-4">
@ -321,7 +321,7 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
<Disclosure> <Disclosure>
{({ open }) => ( {({ open }) => (
<div <div
className={`flex h-full w-full flex-col rounded-b-[10px] border-t border-custom-border-100 bg-custom-background-80 text-custom-text-200 ${ className={`flex h-full w-full flex-col rounded-b-[10px] border-t border-custom-border-300 bg-custom-background-80 text-custom-text-200 ${
open ? "" : "flex-row" open ? "" : "flex-row"
}`} }`}
> >

2
apps/app/components/cycles/transfer-issues-modal.tsx
View File

@ -119,7 +119,7 @@ export const TransferIssuesModal: React.FC<Props> = ({ isOpen, handleClose }) =>
<XMarkIcon className="h-4 w-4" /> <XMarkIcon className="h-4 w-4" />
</button> </button>
</div> </div>
<div className="flex items-center gap-2 border-b border-custom-border-100 px-5 pb-3"> <div className="flex items-center gap-2 border-b border-custom-border-300 px-5 pb-3">
<MagnifyingGlassIcon className="h-4 w-4 text-custom-text-200" /> <MagnifyingGlassIcon className="h-4 w-4 text-custom-text-200" />
<input <input
className="bg-custom-background-90 outline-none" className="bg-custom-background-90 outline-none"

8
apps/app/components/emoji-icon-picker/index.tsx
View File

@ -63,8 +63,8 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
leaveFrom="transform opacity-100 scale-100" leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Popover.Panel className="absolute z-10 mt-2 w-[250px] rounded-[4px] border border-custom-border-100 bg-custom-background-80 shadow-lg"> <Popover.Panel className="absolute z-10 mt-2 w-[250px] rounded-[4px] border border-custom-border-300 bg-custom-background-80 shadow-lg">
<div className="h-[230px] w-[250px] overflow-auto rounded-[4px] border border-custom-border-100 bg-custom-background-80 p-2 shadow-xl"> <div className="h-[230px] w-[250px] overflow-auto rounded-[4px] border border-custom-border-300 bg-custom-background-80 p-2 shadow-xl">
<Tab.Group as="div" className="flex h-full w-full flex-col"> <Tab.Group as="div" className="flex h-full w-full flex-col">
<Tab.List className="flex-0 -mx-2 flex justify-around gap-1 p-1"> <Tab.List className="flex-0 -mx-2 flex justify-around gap-1 p-1">
{tabOptions.map((tab) => ( {tabOptions.map((tab) => (
@ -107,7 +107,7 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
</div> </div>
</div> </div>
)} )}
<hr className="mb-2 h-[1px] w-full border-custom-border-100" /> <hr className="mb-2 h-[1px] w-full border-custom-border-300" />
<div> <div>
<div className="grid grid-cols-8 gap-x-2 gap-y-3"> <div className="grid grid-cols-8 gap-x-2 gap-y-3">
{emojis.map((emoji) => ( {emojis.map((emoji) => (
@ -173,7 +173,7 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
/> />
</div> </div>
</div> </div>
<hr className="mb-1 h-[1px] w-full border-custom-border-100" /> <hr className="mb-1 h-[1px] w-full border-custom-border-300" />
<div className="mt-1 ml-1 grid grid-cols-8 gap-x-2 gap-y-3"> <div className="mt-1 ml-1 grid grid-cols-8 gap-x-2 gap-y-3">
{icons.material_rounded.map((icon, index) => ( {icons.material_rounded.map((icon, index) => (
<button <button

2
apps/app/components/estimates/create-update-estimate-modal.tsx
View File

@ -254,7 +254,7 @@ export const CreateUpdateEstimateModal: React.FC<Props> = ({ handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-100 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
<div className="space-y-3"> <div className="space-y-3">
<div className="text-lg font-medium leading-6"> <div className="text-lg font-medium leading-6">

2
apps/app/components/estimates/delete-estimate-modal.tsx
View File

@ -60,7 +60,7 @@ export const DeleteEstimateModal: React.FC<Props> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

4
apps/app/components/gantt-chart/blocks/index.tsx
View File

@ -44,7 +44,7 @@ export const GanttChartBlocks: FC<{
</div> </div>
<div <div
className="rounded shadow-sm bg-custom-background-100 overflow-hidden relative flex items-center h-[34px] border border-custom-border-100" className="rounded shadow-sm bg-custom-background-100 overflow-hidden relative flex items-center h-[34px] border border-custom-border-300"
style={{ style={{
width: `${block?.position?.width}px`, width: `${block?.position?.width}px`,
}} }}
@ -68,7 +68,7 @@ export const GanttChartBlocks: FC<{
</div> </div>
{/* sidebar */} {/* sidebar */}
{/* <div className="fixed top-0 bottom-0 w-[300px] flex-shrink-0 divide-y divide-custom-border-100 border-r border-custom-border-100 overflow-y-auto"> {/* <div className="fixed top-0 bottom-0 w-[300px] flex-shrink-0 divide-y divide-custom-border-300 border-r border-custom-border-300 overflow-y-auto">
{blocks && {blocks &&
blocks.length > 0 && blocks.length > 0 &&
blocks.map((block: any, _idx: number) => ( blocks.map((block: any, _idx: number) => (

8
apps/app/components/gantt-chart/chart/bi-week.tsx
View File

@ -7,18 +7,18 @@ export const BiWeekChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const BiWeekChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/day.tsx
View File

@ -7,18 +7,18 @@ export const DayChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const DayChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/hours.tsx
View File

@ -7,18 +7,18 @@ export const HourChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const HourChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

14
apps/app/components/gantt-chart/chart/index.tsx
View File

@ -219,11 +219,11 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
? `fixed top-0 bottom-0 left-0 right-0 z-[999999] bg-custom-background-100` ? `fixed top-0 bottom-0 left-0 right-0 z-[999999] bg-custom-background-100`
: `relative` : `relative`
} ${ } ${
border ? `border border-custom-border-100` : `` border ? `border border-custom-border-300` : ``
} flex h-full flex-col rounded-sm select-none bg-custom-background-100 shadow`} } flex h-full flex-col rounded-sm select-none bg-custom-background-100 shadow`}
> >
{/* chart title */} {/* chart title */}
{/* <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2 border-b border-custom-border-100"> {/* <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2 border-b border-custom-border-300">
{title && ( {title && (
<div className="text-lg font-medium flex gap-2 items-center"> <div className="text-lg font-medium flex gap-2 items-center">
<div>{title}</div> <div>{title}</div>
@ -244,7 +244,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
{/* chart header */} {/* chart header */}
<div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2"> <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2">
{/* <div {/* <div
className="transition-all border border-custom-border-100 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80" className="transition-all border border-custom-border-300 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80"
onClick={() => setBlocksSidebarView(() => !blocksSidebarView)} onClick={() => setBlocksSidebarView(() => !blocksSidebarView)}
> >
{blocksSidebarView ? ( {blocksSidebarView ? (
@ -279,7 +279,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
allViews.map((_chatView: any, _idx: any) => ( allViews.map((_chatView: any, _idx: any) => (
<div <div
key={_chatView?.key} key={_chatView?.key}
className={`cursor-pointer rounded-sm border border-custom-border-100 p-1 px-2 text-xs ${ className={`cursor-pointer rounded-sm border border-custom-border-300 p-1 px-2 text-xs ${
currentView === _chatView?.key currentView === _chatView?.key
? `bg-custom-background-80` ? `bg-custom-background-80`
: `hover:bg-custom-background-90` : `hover:bg-custom-background-90`
@ -293,7 +293,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
<div className="flex items-center gap-1"> <div className="flex items-center gap-1">
<div <div
className={`cursor-pointer rounded-sm border border-custom-border-100 p-1 px-2 text-xs hover:bg-custom-background-80`} className={`cursor-pointer rounded-sm border border-custom-border-300 p-1 px-2 text-xs hover:bg-custom-background-80`}
onClick={handleToday} onClick={handleToday}
> >
Today Today
@ -301,7 +301,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
</div> </div>
<div <div
className="transition-all border border-custom-border-100 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80" className="transition-all border border-custom-border-300 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80"
onClick={() => setFullScreenMode(() => !fullScreenMode)} onClick={() => setFullScreenMode(() => !fullScreenMode)}
> >
{fullScreenMode ? ( {fullScreenMode ? (
@ -313,7 +313,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
</div> </div>
{/* content */} {/* content */}
<div className="relative flex h-full w-full flex-1 overflow-hidden border-t border-custom-border-100"> <div className="relative flex h-full w-full flex-1 overflow-hidden border-t border-custom-border-300">
<div <div
className="relative flex h-full w-full flex-1 flex-col overflow-hidden overflow-x-auto" className="relative flex h-full w-full flex-1 flex-col overflow-hidden overflow-x-auto"
id="scroll-container" id="scroll-container"

8
apps/app/components/gantt-chart/chart/month.tsx
View File

@ -7,18 +7,18 @@ export const MonthChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const MonthChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/quarter.tsx
View File

@ -7,18 +7,18 @@ export const QuarterChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const QuarterChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/week.tsx
View File

@ -7,18 +7,18 @@ export const WeekChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const WeekChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/year.tsx
View File

@ -7,18 +7,18 @@ export const YearChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-100"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-300">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-100"> <div className="relative border-b border-custom-border-300">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-100"> <div className="flex h-full w-full divide-x divide-custom-border-300">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const YearChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-100` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-300`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

2
apps/app/components/inbox/accept-issue-modal.tsx
View File

@ -56,7 +56,7 @@ export const AcceptIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, o
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-green-500/20 p-4"> <span className="place-items-center rounded-full bg-green-500/20 p-4">

2
apps/app/components/inbox/decline-issue-modal.tsx
View File

@ -56,7 +56,7 @@ export const DeclineIssueModal: React.FC<Props> = ({ isOpen, handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/inbox/delete-issue-modal.tsx
View File

@ -111,7 +111,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data })
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/inbox/filters-dropdown.tsx
View File

@ -72,7 +72,7 @@ export const FiltersDropdown: React.FC = () => {
]} ]}
/> />
{filtersLength > 0 && ( {filtersLength > 0 && (
<div className="absolute -top-2 -right-2 h-4 w-4 text-[0.65rem] grid place-items-center rounded-full text-custom-text-100 bg-custom-background-80 border border-custom-border-100 z-10"> <div className="absolute -top-2 -right-2 h-4 w-4 text-[0.65rem] grid place-items-center rounded-full text-custom-text-100 bg-custom-background-80 border border-custom-border-300 z-10">
<span>{filtersLength}</span> <span>{filtersLength}</span>
</div> </div>
)} )}

4
apps/app/components/inbox/filters-list.tsx
View File

@ -22,7 +22,7 @@ export const InboxFiltersList = () => {
return ( return (
<div <div
key={key} key={key}
className="flex items-center gap-x-2 rounded-full border border-custom-border-100 bg-custom-background-80 px-2 py-1" className="flex items-center gap-x-2 rounded-full border border-custom-border-300 bg-custom-background-80 px-2 py-1"
> >
<span className="capitalize text-custom-text-200"> <span className="capitalize text-custom-text-200">
{replaceUnderscoreIfSnakeCase(key)}: {replaceUnderscoreIfSnakeCase(key)}:
@ -116,7 +116,7 @@ export const InboxFiltersList = () => {
<button <button
type="button" type="button"
onClick={clearAllFilters} onClick={clearAllFilters}
className="flex items-center gap-x-1 rounded-full border border-custom-border-100 bg-custom-background-80 px-3 py-1.5 text-custom-text-200 hover:text-custom-text-100" className="flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-80 px-3 py-1.5 text-custom-text-200 hover:text-custom-text-100"
> >
<span>Clear all</span> <span>Clear all</span>
<XMarkIcon className="h-3 w-3" /> <XMarkIcon className="h-3 w-3" />

8
apps/app/components/inbox/inbox-action-headers.tsx
View File

@ -162,7 +162,7 @@ export const InboxActionHeader = () => {
handleClose={() => setDeleteIssueModal(false)} handleClose={() => setDeleteIssueModal(false)}
data={inboxIssues?.find((i) => i.bridge_id === inboxIssueId)} data={inboxIssues?.find((i) => i.bridge_id === inboxIssueId)}
/> />
<div className="grid grid-cols-4 border-b border-custom-border-100 divide-x divide-custom-border-100"> <div className="grid grid-cols-4 border-b border-custom-border-300 divide-x divide-custom-border-300">
<div className="col-span-1 flex justify-between p-4"> <div className="col-span-1 flex justify-between p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<InboxIcon className="h-4 w-4 text-custom-text-200" /> <InboxIcon className="h-4 w-4 text-custom-text-200" />
@ -175,7 +175,7 @@ export const InboxActionHeader = () => {
<div className="flex items-center gap-x-2"> <div className="flex items-center gap-x-2">
<button <button
type="button" type="button"
className="rounded border border-custom-border-100 bg-custom-background-90 p-1.5 hover:bg-custom-background-80" className="rounded border border-custom-border-300 bg-custom-background-90 p-1.5 hover:bg-custom-background-80"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "ArrowUp" }); const e = new KeyboardEvent("keydown", { key: "ArrowUp" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -185,7 +185,7 @@ export const InboxActionHeader = () => {
</button> </button>
<button <button
type="button" type="button"
className="rounded border border-custom-border-100 bg-custom-background-90 p-1.5 hover:bg-custom-background-80" className="rounded border border-custom-border-300 bg-custom-background-90 p-1.5 hover:bg-custom-background-80"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "ArrowDown" }); const e = new KeyboardEvent("keydown", { key: "ArrowDown" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -207,7 +207,7 @@ export const InboxActionHeader = () => {
<span>Snooze</span> <span>Snooze</span>
</SecondaryButton> </SecondaryButton>
</Popover.Button> </Popover.Button>
<Popover.Panel className="w-80 p-2 absolute right-0 z-10 mt-2 rounded-md border border-custom-border-100 bg-custom-background-80 shadow-lg"> <Popover.Panel className="w-80 p-2 absolute right-0 z-10 mt-2 rounded-md border border-custom-border-300 bg-custom-background-80 shadow-lg">
{({ close }) => ( {({ close }) => (
<div className="w-full h-full flex flex-col gap-y-1"> <div className="w-full h-full flex flex-col gap-y-1">
<DatePicker <DatePicker

6
apps/app/components/inbox/inbox-issue-card.tsx
View File

@ -40,7 +40,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
<a> <a>
<div <div
id={issue.id} id={issue.id}
className={`relative min-h-[5rem] cursor-pointer select-none space-y-3 py-2 px-4 border-b border-custom-border-100 hover:bg-custom-primary/5 ${ className={`relative min-h-[5rem] cursor-pointer select-none space-y-3 py-2 px-4 border-b border-custom-border-300 hover:bg-custom-primary/5 ${
active ? "bg-custom-primary/5" : " " active ? "bg-custom-primary/5" : " "
} ${issue.issue_inbox[0].status !== -2 ? "opacity-60" : ""}`} } ${issue.issue_inbox[0].status !== -2 ? "opacity-60" : ""}`}
> >
@ -62,7 +62,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
? "border-yellow-500/20 bg-yellow-500/20 text-yellow-500" ? "border-yellow-500/20 bg-yellow-500/20 text-yellow-500"
: issue.priority === "low" : issue.priority === "low"
? "border-green-500/20 bg-green-500/20 text-green-500" ? "border-green-500/20 bg-green-500/20 text-green-500"
: "border-custom-border-100" : "border-custom-border-300"
}`} }`}
> >
{getPriorityIcon( {getPriorityIcon(
@ -75,7 +75,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
tooltipHeading="Created on" tooltipHeading="Created on"
tooltipContent={`${renderShortDateWithYearFormat(issue.created_at ?? "")}`} tooltipContent={`${renderShortDateWithYearFormat(issue.created_at ?? "")}`}
> >
<div className="flex items-center gap-1 rounded border border-custom-border-100 shadow-sm text-xs px-2 py-[0.19rem] text-custom-text-200"> <div className="flex items-center gap-1 rounded border border-custom-border-300 shadow-sm text-xs px-2 py-[0.19rem] text-custom-text-200">
<CalendarDaysIcon className="h-3.5 w-3.5" /> <CalendarDaysIcon className="h-3.5 w-3.5" />
<span>{renderShortDateWithYearFormat(issue.created_at ?? "")}</span> <span>{renderShortDateWithYearFormat(issue.created_at ?? "")}</span>
</div> </div>

2
apps/app/components/inbox/inbox-main-content.tsx
View File

@ -310,7 +310,7 @@ export const InboxMainContent: React.FC = () => {
</div> </div>
</div> </div>
<div className="basis-1/3 space-y-5 border-custom-border-100 p-5"> <div className="basis-1/3 space-y-5 border-custom-border-300 p-5">
<IssueDetailsSidebar <IssueDetailsSidebar
control={control} control={control}
issueDetail={issueDetails} issueDetail={issueDetails}

2
apps/app/components/inbox/issues-list-sidebar.tsx
View File

@ -18,7 +18,7 @@ export const IssuesListSidebar = () => {
<InboxFiltersList /> <InboxFiltersList />
{inboxIssues ? ( {inboxIssues ? (
inboxIssues.length > 0 ? ( inboxIssues.length > 0 ? (
<div className="divide-y divide-custom-border-100 overflow-auto h-full"> <div className="divide-y divide-custom-border-300 overflow-auto h-full">
{inboxIssues.map((issue) => ( {inboxIssues.map((issue) => (
<InboxIssueCard <InboxIssueCard
key={issue.id} key={issue.id}

4
apps/app/components/inbox/select-duplicate.tsx
View File

@ -101,7 +101,7 @@ export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-100 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all">
<Combobox <Combobox
value={selectedItem} value={selectedItem}
onChange={(value) => { onChange={(value) => {
@ -123,7 +123,7 @@ export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
<Combobox.Options <Combobox.Options
static static
className="max-h-80 scroll-py-2 divide-y divide-custom-border-100 overflow-y-auto" className="max-h-80 scroll-py-2 divide-y divide-custom-border-300 overflow-y-auto"
> >
{filteredIssues.length > 0 ? ( {filteredIssues.length > 0 ? (
<li className="p-2"> <li className="p-2">

2
apps/app/components/integration/delete-import-modal.tsx
View File

@ -88,7 +88,7 @@ export const DeleteImportModal: React.FC<Props> = ({ isOpen, handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

6
apps/app/components/integration/github/root.tsx
View File

@ -185,7 +185,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
</div> </div>
</Link> </Link>
<div className="space-y-4 rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-4"> <div className="space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-10 w-10 flex-shrink-0"> <div className="h-10 w-10 flex-shrink-0">
<Image src={GithubLogo} alt="GithubLogo" /> <Image src={GithubLogo} alt="GithubLogo" />
@ -201,7 +201,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
? "border-opacity-100 bg-opacity-100" ? "border-opacity-100 bg-opacity-100"
: "border-opacity-80 bg-opacity-80" : "border-opacity-80 bg-opacity-80"
}` }`
: "border-custom-border-100" : "border-custom-border-300"
}`} }`}
> >
<integration.icon <integration.icon
@ -216,7 +216,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
className={`border-b px-7 ${ className={`border-b px-7 ${
index <= activeIntegrationState() - 1 index <= activeIntegrationState() - 1
? `border-custom-primary` ? `border-custom-primary`
: `border-custom-border-100` : `border-custom-border-300`
}`} }`}
> >
{" "} {" "}

6
apps/app/components/integration/guide.tsx
View File

@ -83,7 +83,7 @@ const IntegrationGuide = () => {
{IMPORTERS_EXPORTERS_LIST.map((service) => ( {IMPORTERS_EXPORTERS_LIST.map((service) => (
<div <div
key={service.provider} key={service.provider}
className="rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-4" className="rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4"
> >
<div className="flex items-center gap-4 whitespace-nowrap"> <div className="flex items-center gap-4 whitespace-nowrap">
<div className="relative h-10 w-10 flex-shrink-0"> <div className="relative h-10 w-10 flex-shrink-0">
@ -113,7 +113,7 @@ const IntegrationGuide = () => {
</div> </div>
))} ))}
</div> </div>
<div className="rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-4"> <div className="rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4">
<h3 className="mb-2 flex gap-2 text-lg font-medium"> <h3 className="mb-2 flex gap-2 text-lg font-medium">
Previous Imports Previous Imports
<button <button
@ -133,7 +133,7 @@ const IntegrationGuide = () => {
{importerServices ? ( {importerServices ? (
importerServices.length > 0 ? ( importerServices.length > 0 ? (
<div className="space-y-2"> <div className="space-y-2">
<div className="divide-y divide-custom-border-100"> <div className="divide-y divide-custom-border-300">
{importerServices.map((service) => ( {importerServices.map((service) => (
<SingleImport <SingleImport
key={service.id} key={service.id}

2
apps/app/components/integration/jira/import-users.tsx
View File

@ -51,7 +51,7 @@ export const JiraImportUsers: FC = () => {
})); }));
return ( return (
<div className="h-full w-full space-y-10 divide-y-2 divide-custom-border-100 overflow-y-auto"> <div className="h-full w-full space-y-10 divide-y-2 divide-custom-border-300 overflow-y-auto">
<div className="grid grid-cols-1 gap-10 md:grid-cols-2"> <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
<div className="col-span-1"> <div className="col-span-1">
<h3 className="font-semibold">Users</h3> <h3 className="font-semibold">Users</h3>

10
apps/app/components/integration/jira/root.tsx
View File

@ -118,7 +118,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
</div> </div>
</Link> </Link>
<div className="flex h-full flex-col space-y-4 rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-4"> <div className="flex h-full flex-col space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-10 w-10 flex-shrink-0"> <div className="h-10 w-10 flex-shrink-0">
<Image src={JiraLogo} alt="jira logo" /> <Image src={JiraLogo} alt="jira logo" />
@ -135,14 +135,14 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
index > activeIntegrationState() + 1 || index > activeIntegrationState() + 1 ||
Boolean(index === activeIntegrationState() + 1 && disableTopBarAfter) Boolean(index === activeIntegrationState() + 1 && disableTopBarAfter)
} }
className={`flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full border border-custom-border-100 ${ className={`flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full border border-custom-border-300 ${
index <= activeIntegrationState() index <= activeIntegrationState()
? `border-custom-primary bg-custom-primary ${ ? `border-custom-primary bg-custom-primary ${
index === activeIntegrationState() index === activeIntegrationState()
? "border-opacity-100 bg-opacity-100" ? "border-opacity-100 bg-opacity-100"
: "border-opacity-80 bg-opacity-80" : "border-opacity-80 bg-opacity-80"
}` }`
: "border-custom-border-100" : "border-custom-border-300"
}`} }`}
> >
<integration.icon <integration.icon
@ -157,7 +157,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
className={`border-b px-7 ${ className={`border-b px-7 ${
index <= activeIntegrationState() - 1 index <= activeIntegrationState() - 1
? `border-custom-primary` ? `border-custom-primary`
: `border-custom-border-100` : `border-custom-border-300`
}`} }`}
> >
{" "} {" "}
@ -183,7 +183,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
{currentStep?.state === "import-confirmation" && <JiraConfirmImport />} {currentStep?.state === "import-confirmation" && <JiraConfirmImport />}
</div> </div>
<div className="-mx-4 mt-4 flex justify-end gap-4 border-t border-custom-border-100 p-4 pb-0"> <div className="-mx-4 mt-4 flex justify-end gap-4 border-t border-custom-border-300 p-4 pb-0">
{currentStep?.state !== "import-configure" && ( {currentStep?.state !== "import-configure" && (
<SecondaryButton <SecondaryButton
onClick={() => { onClick={() => {

2
apps/app/components/integration/single-integration-card.tsx
View File

@ -99,7 +99,7 @@ export const SingleIntegrationCard: React.FC<Props> = ({ integration }) => {
); );
return ( return (
<div className="flex items-center justify-between gap-2 rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-5"> <div className="flex items-center justify-between gap-2 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-5">
<div className="flex items-start gap-4"> <div className="flex items-start gap-4">
<div className="h-12 w-12 flex-shrink-0"> <div className="h-12 w-12 flex-shrink-0">
<Image <Image

2
apps/app/components/issues/activity.tsx
View File

@ -288,7 +288,7 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
} }
value = ( value = (
<span className="relative inline-flex items-center rounded-full border border-custom-border-100 px-2 py-0.5 text-xs"> <span className="relative inline-flex items-center rounded-full border border-custom-border-300 px-2 py-0.5 text-xs">
<span className="absolute flex flex-shrink-0 items-center justify-center"> <span className="absolute flex flex-shrink-0 items-center justify-center">
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"

2
apps/app/components/issues/attachment-upload.tsx
View File

@ -90,7 +90,7 @@ export const IssueAttachmentUpload: React.FC<Props> = ({ disabled = false }) =>
<div <div
{...getRootProps()} {...getRootProps()}
className={`flex items-center justify-center h-[60px] border-2 border-dashed text-custom-primary bg-custom-primary/5 text-xs rounded-md px-4 ${ className={`flex items-center justify-center h-[60px] border-2 border-dashed text-custom-primary bg-custom-primary/5 text-xs rounded-md px-4 ${
isDragActive ? "bg-custom-primary/10 border-custom-primary" : "border-custom-border-100" isDragActive ? "bg-custom-primary/10 border-custom-primary" : "border-custom-border-300"
} ${isDragReject ? "bg-red-100" : ""} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`} } ${isDragReject ? "bg-red-100" : ""} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`}
> >
<input {...getInputProps()} /> <input {...getInputProps()} />

2
apps/app/components/issues/attachments.tsx
View File

@ -61,7 +61,7 @@ export const IssueAttachments = () => {
attachments.map((file) => ( attachments.map((file) => (
<div <div
key={file.id} key={file.id}
className="flex h-[60px] items-center justify-between gap-1 rounded-md border-[2px] border-custom-border-100 bg-custom-background-100 px-4 py-2 text-sm" className="flex h-[60px] items-center justify-between gap-1 rounded-md border-[2px] border-custom-border-300 bg-custom-background-100 px-4 py-2 text-sm"
> >
<Link href={file.asset}> <Link href={file.asset}>
<a target="_blank"> <a target="_blank">

4
apps/app/components/issues/comment/comment-card.tsx
View File

@ -72,7 +72,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
alt={comment.actor_detail.first_name} alt={comment.actor_detail.first_name}
height={30} height={30}
width={30} width={30}
className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-100" className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-300"
/> />
) : ( ) : (
<div <div
@ -135,7 +135,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
value={comment.comment_html} value={comment.comment_html}
editable={false} editable={false}
noBorder noBorder
customClassName="text-xs border border-custom-border-100 bg-custom-background-100" customClassName="text-xs border border-custom-border-300 bg-custom-background-100"
ref={showEditorRef} ref={showEditorRef}
/> />
</div> </div>

2
apps/app/components/issues/delete-issue-modal.tsx
View File

@ -180,7 +180,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-100 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/issues/form.tsx
View File

@ -529,7 +529,7 @@ export const IssueForm: FC<IssueFormProps> = ({
</div> </div>
</div> </div>
</div> </div>
<div className="-mx-5 mt-5 flex items-center justify-between gap-2 border-t border-custom-border-100 px-5 pt-5"> <div className="-mx-5 mt-5 flex items-center justify-between gap-2 border-t border-custom-border-300 px-5 pt-5">
<div <div
className="flex cursor-pointer items-center gap-1" className="flex cursor-pointer items-center gap-1"
onClick={() => setCreateMore((prevData) => !prevData)} onClick={() => setCreateMore((prevData) => !prevData)}

2
apps/app/components/issues/modal.tsx
View File

@ -343,7 +343,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-100 bg-custom-background-100 p-5 text-left shadow-xl transition-all sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 p-5 text-left shadow-xl transition-all sm:w-full sm:max-w-2xl">
<IssueForm <IssueForm
issues={issues ?? []} issues={issues ?? []}
handleFormSubmit={handleFormSubmit} handleFormSubmit={handleFormSubmit}

12
apps/app/components/issues/my-issues-list-item.tsx
View File

@ -87,7 +87,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
const isNotAllowed = false; const isNotAllowed = false;
return ( return (
<div className="border-b border-custom-border-100 bg-custom-background-100 px-4 py-2.5 last:border-b-0"> <div className="border-b border-custom-border-300 bg-custom-background-100 px-4 py-2.5 last:border-b-0">
<div key={issue.id} className="flex items-center justify-between gap-2"> <div key={issue.id} className="flex items-center justify-between gap-2">
<Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}> <Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}>
<a className="group relative flex items-center gap-2"> <a className="group relative flex items-center gap-2">
@ -139,7 +139,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
{issue.label_details.map((label) => ( {issue.label_details.map((label) => (
<span <span
key={label.id} key={label.id}
className="group flex items-center gap-1 rounded-2xl border border-custom-border-100 px-2 py-0.5 text-xs text-custom-text-200" className="group flex items-center gap-1 rounded-2xl border border-custom-border-300 px-2 py-0.5 text-xs text-custom-text-200"
> >
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"
@ -155,7 +155,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
"" ""
)} )}
{properties.assignee && ( {properties.assignee && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm">
<Tooltip <Tooltip
position="top-right" position="top-right"
tooltipHeading="Assignees" tooltipHeading="Assignees"
@ -176,7 +176,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -186,7 +186,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5 text-custom-text-200" /> <LinkIcon className="h-3.5 w-3.5 text-custom-text-200" />
@ -196,7 +196,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45 text-custom-text-200" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45 text-custom-text-200" />

2
apps/app/components/issues/parent-issues-list-modal.tsx
View File

@ -108,7 +108,7 @@ export const ParentIssuesListModal: React.FC<Props> = ({
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-100 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all">
<Combobox value={value} onChange={onChange}> <Combobox value={value} onChange={onChange}>
<div className="relative m-1"> <div className="relative m-1">
<MagnifyingGlassIcon <MagnifyingGlassIcon

2
apps/app/components/issues/select/date.tsx
View File

@ -16,7 +16,7 @@ export const IssueDateSelect: React.FC<Props> = ({ value, onChange }) => (
<Popover className="relative flex items-center justify-center rounded-lg"> <Popover className="relative flex items-center justify-center rounded-lg">
{({ open }) => ( {({ open }) => (
<> <>
<Popover.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-100 text-xs shadow-sm duration-200"> <Popover.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-300 text-xs shadow-sm duration-200">
<span className="flex items-center justify-center gap-2 px-2 py-1 text-xs text-custom-text-200"> <span className="flex items-center justify-center gap-2 px-2 py-1 text-xs text-custom-text-200">
{value ? ( {value ? (
<> <>

6
apps/app/components/issues/select/label.tsx
View File

@ -59,7 +59,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
> >
{({ open }: any) => ( {({ open }: any) => (
<> <>
<Combobox.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-100 text-xs shadow-sm duration-200 hover:bg-custom-background-80"> <Combobox.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-300 text-xs shadow-sm duration-200 hover:bg-custom-background-80">
{value && value.length > 0 ? ( {value && value.length > 0 ? (
<span className="flex items-center justify-center gap-2 px-3 py-1 text-xs"> <span className="flex items-center justify-center gap-2 px-3 py-1 text-xs">
<IssueLabelsList <IssueLabelsList
@ -90,7 +90,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
className={`absolute z-10 mt-1 max-h-52 min-w-[8rem] overflow-auto rounded-md border-none className={`absolute z-10 mt-1 max-h-52 min-w-[8rem] overflow-auto rounded-md border-none
bg-custom-background-90 px-2 py-2 text-xs shadow-md focus:outline-none`} bg-custom-background-90 px-2 py-2 text-xs shadow-md focus:outline-none`}
> >
<div className="flex w-full items-center justify-start rounded-sm border-[0.6px] border-custom-border-100 bg-custom-background-90 px-2"> <div className="flex w-full items-center justify-start rounded-sm border-[0.6px] border-custom-border-300 bg-custom-background-90 px-2">
<MagnifyingGlassIcon className="h-3 w-3 text-custom-text-200" /> <MagnifyingGlassIcon className="h-3 w-3 text-custom-text-200" />
<Combobox.Input <Combobox.Input
className="w-full bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none" className="w-full bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none"
@ -141,7 +141,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
); );
} else } else
return ( return (
<div className="border-y border-custom-border-100"> <div className="border-y border-custom-border-300">
<div className="flex select-none items-center gap-2 truncate p-2 text-custom-text-100"> <div className="flex select-none items-center gap-2 truncate p-2 text-custom-text-100">
<RectangleGroupIcon className="h-3 w-3" /> {label.name} <RectangleGroupIcon className="h-3 w-3" /> {label.name}
</div> </div>

4
apps/app/components/issues/sidebar-select/blocked.tsx
View File

@ -92,7 +92,7 @@ export const SidebarBlockedSelect: React.FC<Props> = ({
? watch("blocked_issues").map((issue) => ( ? watch("blocked_issues").map((issue) => (
<div <div
key={issue.blocked_issue_detail?.id} key={issue.blocked_issue_detail?.id}
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-1.5 py-0.5 text-xs text-red-500 duration-300 hover:border-red-500/20 hover:bg-red-500/20" className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-300 px-1.5 py-0.5 text-xs text-red-500 duration-300 hover:border-red-500/20 hover:bg-red-500/20"
> >
<Link <Link
href={`/${workspaceSlug}/projects/${projectId}/issues/${issue.blocked_issue_detail?.id}`} href={`/${workspaceSlug}/projects/${projectId}/issues/${issue.blocked_issue_detail?.id}`}
@ -126,7 +126,7 @@ export const SidebarBlockedSelect: React.FC<Props> = ({
type="button" type="button"
className={`flex w-full text-custom-text-200 ${ className={`flex w-full text-custom-text-200 ${
isNotAllowed ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80" isNotAllowed ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80"
} items-center justify-between gap-1 rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm duration-300 focus:outline-none`} } items-center justify-between gap-1 rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm duration-300 focus:outline-none`}
onClick={() => setIsBlockedModalOpen(true)} onClick={() => setIsBlockedModalOpen(true)}
disabled={isNotAllowed} disabled={isNotAllowed}
> >

4
apps/app/components/issues/sidebar-select/blocker.tsx
View File

@ -92,7 +92,7 @@ export const SidebarBlockerSelect: React.FC<Props> = ({
? watch("blocker_issues").map((issue) => ( ? watch("blocker_issues").map((issue) => (
<div <div
key={issue.blocker_issue_detail?.id} key={issue.blocker_issue_detail?.id}
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-1.5 py-0.5 text-xs text-yellow-500 duration-300 hover:border-yellow-500/20 hover:bg-yellow-500/20" className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-300 px-1.5 py-0.5 text-xs text-yellow-500 duration-300 hover:border-yellow-500/20 hover:bg-yellow-500/20"
> >
<Link <Link
href={`/${workspaceSlug}/projects/${projectId}/issues/${issue.blocker_issue_detail?.id}`} href={`/${workspaceSlug}/projects/${projectId}/issues/${issue.blocker_issue_detail?.id}`}
@ -128,7 +128,7 @@ export const SidebarBlockerSelect: React.FC<Props> = ({
type="button" type="button"
className={`flex w-full text-custom-text-200 ${ className={`flex w-full text-custom-text-200 ${
isNotAllowed ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80" isNotAllowed ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80"
} items-center justify-between gap-1 rounded-md border border-custom-border-100 px-2 py-1 text-xs shadow-sm duration-300 focus:outline-none`} } items-center justify-between gap-1 rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm duration-300 focus:outline-none`}
onClick={() => setIsBlockerModalOpen(true)} onClick={() => setIsBlockerModalOpen(true)}
disabled={isNotAllowed} disabled={isNotAllowed}
> >

3
apps/app/components/issues/sidebar-select/index.ts
View File

@ -2,8 +2,9 @@ export * from "./assignee";
export * from "./blocked"; export * from "./blocked";
export * from "./blocker"; export * from "./blocker";
export * from "./cycle"; export * from "./cycle";
export * from "./estimate";
export * from "./label";
export * from "./module"; export * from "./module";
export * from "./parent"; export * from "./parent";
export * from "./priority"; export * from "./priority";
export * from "./state"; export * from "./state";
export * from "./estimate";

Some files were not shown because too many files have changed in this diff Show More