ra/auditly
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix some refs to neutrals

Browse Source
This commit is contained in:
Ra
2025-08-25 15:55:43 -07:00
parent 407ce41e44
commit 39b93237fb
15 changed files with 86 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
.github/workflows/deploy-vercel.yml vendored
View File

@@ -1,26 +0,0 @@
name: deploy
on:
push:
branches:
- main
workflow_call: {}
workflow_dispatch:
inputs:
environment:
description: "Environment to run tests against"
type: environment
required: true
run-name: deploy-${{ github.ref_name }}-${{ github.run_number }}
permissions: read-all
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- name: Trigger Vercel Deployment
env:
VERCEL_DEPLOY_TOKEN: ${{ secrets.VERCEL_DEPLOY_TOKEN }}
run: curl -X POST https://api.vercel.com/v1/integrations/deploy/${{ env.VERCEL_DEPLOY_TOKEN }}

52
index.css
View File

@@ -18,16 +18,16 @@
0%, 0%,
33% { 33% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #a5ffc075; 0px 0px 0px 2px #a5ffc075;
} }
33%, 33%,
66% { 66% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301); inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15);
} }
} }
@@ -35,15 +35,15 @@
0%, 0%,
33% { 33% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #f7f3c275; 0px 0px 0px 2px #f7f3c275;
} }
33%, 33%,
66% { 66% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301); inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15);
} }
} }
@@ -51,15 +51,15 @@
0%, 0%,
33% { 33% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #a5d8ff75; 0px 0px 0px 2px #a5d8ff75;
} }
33%, 33%,
66% { 66% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301); inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15);
} }
} }
@@ -67,15 +67,15 @@
0%, 0%,
33% { 33% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #f63d6875; 0px 0px 0px 2px #f63d6875;
} }
33%, 33%,
66% { 66% {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301); inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15);
} }
} }
@@ -91,32 +91,32 @@
.blinkLightBlue { .blinkLightBlue {
animation-name: blinkLightBlue; animation-name: blinkLightBlue;
box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #a5d8ff75; 0px 0px 0px 2px #a5d8ff75;
border: solid 1px #54c2e456; border: solid 1px #54c2e456;
} }
.blinkLightGreen { .blinkLightGreen {
animation-name: blinkLightGreen; animation-name: blinkLightGreen;
box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #a5ffc075; 0px 0px 0px 2px #a5ffc075;
border: solid 1px rgba(187, 248, 185, 0.31); border: solid 1px rgba(187, 248, 185, 0.31);
} }
.blinkLightRed { .blinkLightRed {
animation-name: blinkLightRed; animation-name: blinkLightRed;
box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #f63d6875; 0px 0px 0px 2px #f63d6875;
border: solid 1px #e4547656; border: solid 1px #e4547656;
} }
.blinkLightYellow { .blinkLightYellow {
animation-name: blinkLightYellow; animation-name: blinkLightYellow;
box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow : inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301), inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15),
0px 0px 0px 2px #f7f3c275; 0px 0px 0px 2px #f7f3c275;
border: solid 1px #e4e25456; border: solid 1px #e4e25456;
} }
@@ -126,8 +126,8 @@
} }
.blinkLightEmpty { .blinkLightEmpty {
box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.329), box-shadow: inset 1px 0px 3px 0px rgba(255, 255, 255, 0.20),
inset -1px 0px 3px 0px rgba(78, 78, 78, 0.301); inset -1px 0px 3px 0px rgba(78, 78, 78, 0.15);
animation : none !important; animation : none !important;
border : none !important; border : none !important;
background-color: var(--Neutrals-NeutralSlate400) background-color: var(--Neutrals-NeutralSlate400)

2
src/components/CompanyWiki/CompanyWikiCompletedState.tsx
View File

@@ -57,7 +57,7 @@ export const CompanyWikiCompletedState: React.FC<CompanyWikiCompletedStateProps>
return ( return (
<div className="flex-1 self-stretch inline-flex justify-start items-center"> <div className="flex-1 self-stretch inline-flex justify-start items-center">
{/* Table of Contents */} {/* Table of Contents */}
<div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 dark:border-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 dark:border-[--$1] inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-base font-medium font-['Inter'] leading-normal">Table of contents</div> <div className="flex-1 justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-base font-medium font-['Inter'] leading-normal">Table of contents</div>
</div> </div>

2
src/components/CompanyWiki/CompanyWikiEmptyStateDark.tsx
View File

@@ -27,7 +27,7 @@ export const CompanyWikiEmptyState: React.FC<CompanyWikiEmptyStateProps> = ({
return ( return (
<div className="flex-1 self-stretch inline-flex justify-start items-center"> <div className="flex-1 self-stretch inline-flex justify-start items-center">
{/* Table of Contents */} {/* Table of Contents */}
<div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 dark:border-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 dark:border-[--$1] inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-base font-medium font-['Inter'] leading-normal">Table of contents</div> <div className="flex-1 justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-base font-medium font-['Inter'] leading-normal">Table of contents</div>
</div> </div>

4
src/components/CompanyWiki/InviteEmployeesModal.tsx
View File

@@ -49,7 +49,7 @@ export const InviteEmployeesModal: React.FC<InviteEmployeesModalProps> = ({
<div className="self-stretch justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-sm font-medium font-['Inter'] leading-tight"> <div className="self-stretch justify-start text-[--Neutrals-NeutralSlate950] dark:text-[--Neutrals-NeutralSlate950] text-sm font-medium font-['Inter'] leading-tight">
Email Email
</div> </div>
<div className="self-stretch h-10 px-3 py-2 bg-[--Neutrals-NeutralSlate0] dark:bg-[--Neutrals-NeutralSlate0] rounded-lg border border-Outline-Outline-Gray-300 dark:border-Neutrals-NeutralSlate600 inline-flex justify-start items-center gap-2"> <div className="self-stretch h-10 px-3 py-2 bg-[--Neutrals-NeutralSlate0] dark:bg-[--Neutrals-NeutralSlate0] rounded-lg border border-Outline-Outline-Gray-300 dark:border-[--$1] inline-flex justify-start items-center gap-2">
<input <input
type="email" type="email"
value={email} value={email}
@@ -73,7 +73,7 @@ export const InviteEmployeesModal: React.FC<InviteEmployeesModalProps> = ({
<div className="flex justify-start items-start gap-3"> <div className="flex justify-start items-start gap-3">
<button <button
onClick={onClose} onClick={onClose}
className="px-4 py-2 bg-[--Neutrals-NeutralSlate0] dark:bg-[--Neutrals-NeutralSlate0] rounded-lg border border-Outline-Outline-Gray-300 dark:border-Neutrals-NeutralSlate600 text-[--Neutrals-NeutralSlate700] dark:text-[--Neutrals-NeutralSlate700] text-sm font-medium font-['Inter'] leading-tight hover:bg-[--Neutrals-NeutralSlate50] dark:hover:bg-[--Neutrals-NeutralSlate0]" className="px-4 py-2 bg-[--Neutrals-NeutralSlate0] dark:bg-[--Neutrals-NeutralSlate0] rounded-lg border border-Outline-Outline-Gray-300 dark:border-[--$1] text-[--Neutrals-NeutralSlate700] dark:text-[--Neutrals-NeutralSlate700] text-sm font-medium font-['Inter'] leading-tight hover:bg-[--Neutrals-NeutralSlate50] dark:hover:bg-[--Neutrals-NeutralSlate0]"
> >
Cancel Cancel
</button> </button>

4
src/components/figma/FigmaEmployeeForms.tsx
View File

@@ -264,8 +264,8 @@ export const TextAreaQuestion: React.FC<{
rows={6} rows={6}
/> />
<div className="w-3 h-3 absolute right-5 bottom-5"> <div className="w-3 h-3 absolute right-5 bottom-5">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>

6
src/components/figma/FigmaQuestion.tsx
View File

@@ -28,7 +28,7 @@ export const FigmaQuestion: React.FC<FigmaQuestionProps> = ({
className = '' className = ''
}) => { }) => {
return ( return (
<div className={`w-[600px] px-5 pt-5 pb-6 bg-Other-White rounded-2xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex flex-col justify-end items-end gap-4 ${className}`}> <div className={`w-[600px] px-5 pt-5 pb-6 bg-Other-White rounded-2xl outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex flex-col justify-end items-end gap-4 ${className}`}>
{/* Question Header */} {/* Question Header */}
<div className="self-stretch inline-flex justify-start items-start gap-3"> <div className="self-stretch inline-flex justify-start items-start gap-3">
<div className="justify-start text-zinc-300 text-xl font-medium font-['Inter'] leading-loose"> <div className="justify-start text-zinc-300 text-xl font-medium font-['Inter'] leading-loose">
@@ -206,8 +206,8 @@ export const FigmaTextArea: React.FC<{
rows={6} rows={6}
/> />
<div className="w-3 h-3 absolute right-5 bottom-5"> <div className="w-3 h-3 absolute right-5 bottom-5">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>

6
src/components/onboarding/FigmaOnboardingComponents.tsx
View File

@@ -173,8 +173,8 @@ export const FigmaOnboardingQuestion: React.FC<FigmaOnboardingQuestionProps> = (
rows={rows} rows={rows}
/> />
<div className="w-3 h-3 absolute right-3 bottom-3"> <div className="w-3 h-3 absolute right-3 bottom-3">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute top-2 left-2 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute top-2 left-2 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>
@@ -379,7 +379,7 @@ export const FigmaOnboardingForm: React.FC<FigmaOnboardingFormProps> = ({
<div className="self-stretch inline-flex justify-start items-center gap-0.5"> <div className="self-stretch inline-flex justify-start items-center gap-0.5">
<div className="justify-start text-[--Neutrals-NeutralSlate950] text-sm font-normal font-['Inter'] leading-tight">Company Logo</div> <div className="justify-start text-[--Neutrals-NeutralSlate950] text-sm font-normal font-['Inter'] leading-tight">Company Logo</div>
</div> </div>
<div className="self-stretch p-4 rounded-3xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex justify-start items-center gap-4"> <div className="self-stretch p-4 rounded-3xl outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex justify-start items-center gap-4">
<div className="w-16 h-16 relative bg-gray-200 rounded-[250px]"> <div className="w-16 h-16 relative bg-gray-200 rounded-[250px]">
<div className="w-16 h-16 left-0 top-0 absolute opacity-10 rounded-[250px]" /> <div className="w-16 h-16 left-0 top-0 absolute opacity-10 rounded-[250px]" />
{companyLogo && ( {companyLogo && (

22
src/pages/CompanyWiki.tsx
View File

@@ -210,7 +210,7 @@ const CompanyWiki: React.FC = () => {
<div className="flex-1 flex items-center justify-center"> <div className="flex-1 flex items-center justify-center">
<div className="text-center"> <div className="text-center">
<div className="animate-spin w-8 h-8 border-2 border-Brand-Orange border-t-transparent rounded-full mx-auto mb-4"></div> <div className="animate-spin w-8 h-8 border-2 border-Brand-Orange border-t-transparent rounded-full mx-auto mb-4"></div>
<p className="text-Neutrals-NeutralSlate600">Loading company wiki...</p> <p className="text-[--$1]">Loading company wiki...</p>
</div> </div>
</div> </div>
); );
@@ -245,19 +245,19 @@ const CompanyWiki: React.FC = () => {
{/* Table of Contents Sidebar */} {/* Table of Contents Sidebar */}
<div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-[--Neutrals-NeutralSlate200] inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-[--Neutrals-NeutralSlate200] inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-Neutrals-NeutralSlate950 text-base font-medium font-['Inter'] leading-normal">Table of contents</div> <div className="flex-1 justify-start text-[--$1] text-base font-medium font-['Inter'] leading-normal">Table of contents</div>
</div> </div>
<div className="self-stretch px-3 flex flex-col justify-start items-start gap-1.5"> <div className="self-stretch px-3 flex flex-col justify-start items-start gap-1.5">
{[1, 2, 3, 4, 5, 6, 7].map((section, index) => ( {[1, 2, 3, 4, 5, 6, 7].map((section, index) => (
<div <div
key={section} key={section}
className={`self-stretch p-2 ${activeSection === section ? 'bg-Main-BG-Gray-100 rounded-full shadow-[0px_1px_2px_0px_rgba(10,13,20,0.03)]' : 'rounded-[10px]'} inline-flex justify-start items-center gap-2 overflow-hidden cursor-pointer`} className={`self-stretch p-2 ${activeSection === section ? 'bg-[--Neutrals-NeutralSlate100] rounded-full shadow-[0px_1px_2px_0px_rgba(10,13,20,0.03)]' : 'rounded-[10px]'} inline-flex justify-start items-center gap-2 overflow-hidden cursor-pointer`}
onClick={() => setActiveSection(section)} onClick={() => setActiveSection(section)}
> >
<div className={`h-5 p-0.5 ${activeSection === section ? 'bg-Brand-Orange' : 'bg-Text-Gray-100'} rounded-[999px] inline-flex flex-col justify-center items-center gap-0.5 overflow-hidden`}> <div className={`h-5 p-0.5 ${activeSection === section ? 'bg-[--Brand-Orange]' : 'bg-[--Neutrals-NeutralSlate100]'} rounded-[999px] inline-flex flex-col justify-center items-center gap-0.5 overflow-hidden`}>
<div className={`w-4 text-center justify-start ${activeSection === section ? 'text-Neutrals-NeutralSlate0' : 'text-Text-Dark-950'} text-xs ${activeSection === section ? 'font-medium' : 'font-normal'} font-['Inter'] leading-none`}>{section}</div> <div className={`w-4 text-center justify-start ${activeSection === section ? 'text-[--Neutrals-NeutralSlate0]' : 'text-[--Neutrals-NeutralSlate950]'} text-xs ${activeSection === section ? 'font-medium' : 'font-normal'} font-['Inter'] leading-none`}>{section}</div>
</div> </div>
<div className={`flex-1 justify-start ${activeSection === section ? 'text-Neutrals-NeutralSlate800' : 'text-Text-Gray-500'} text-xs font-medium font-['Inter'] leading-none`}> <div className={`flex-1 justify-start ${activeSection === section ? 'text-[--Neutrals-NeutralSlate800]' : 'text-[--Neutrals-NeutralSlate500]'} text-xs font-medium font-['Inter'] leading-none`}>
{getSectionTitle(section)} {getSectionTitle(section)}
</div> </div>
</div> </div>
@@ -268,7 +268,7 @@ const CompanyWiki: React.FC = () => {
{/* Questions Content */} {/* Questions Content */}
<div className="flex-1 self-stretch inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-Neutrals-NeutralSlate800 text-base font-medium font-['Inter'] leading-normal"> <div className="flex-1 justify-start text-[--Neutrals-NeutralSlate800] text-base font-medium font-['Inter'] leading-normal">
{getSectionTitle(activeSection)} {getSectionTitle(activeSection)}
</div> </div>
</div> </div>
@@ -277,16 +277,16 @@ const CompanyWiki: React.FC = () => {
<div key={qa.field} className="self-stretch p-3 bg-[--Neutrals-NeutralSlate100] rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.02)] flex flex-col justify-center items-start gap-2 overflow-hidden"> <div key={qa.field} className="self-stretch p-3 bg-[--Neutrals-NeutralSlate100] rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.02)] flex flex-col justify-center items-start gap-2 overflow-hidden">
<div className="self-stretch px-3 py-px inline-flex justify-start items-center gap-2.5"> <div className="self-stretch px-3 py-px inline-flex justify-start items-center gap-2.5">
<div className="flex-1 flex justify-center items-center gap-3"> <div className="flex-1 flex justify-center items-center gap-3">
<div className="w-3 self-stretch justify-start text-Neutrals-NeutralSlate300 text-base font-semibold font-['Inter'] leading-normal">Q</div> <div className="w-3 self-stretch justify-start text-[--Neutrals-NeutralSlate300] text-base font-semibold font-['Inter'] leading-normal">Q</div>
<div className="flex-1 justify-start text-Neutrals-NeutralSlate600 text-sm font-medium font-['Inter'] leading-tight"> <div className="flex-1 justify-start text-[--Neutrals-NeutralSlate600] text-sm font-medium font-['Inter'] leading-tight">
{qa.question} {qa.question}
</div> </div>
</div> </div>
</div> </div>
<div className="self-stretch px-3 py-2 bg-[--Neutrals-NeutralSlate0] rounded-[10px] inline-flex justify-between items-center"> <div className="self-stretch px-3 py-2 bg-[--Neutrals-NeutralSlate0] rounded-[10px] inline-flex justify-between items-center">
<div className="flex-1 flex justify-start items-start gap-3"> <div className="flex-1 flex justify-start items-start gap-3">
<div className="w-3.5 h-6 justify-center text-Neutrals-NeutralSlate300 text-base font-semibold font-['Inter'] leading-normal">A</div> <div className="w-3.5 h-6 justify-center text-[--$1] text-base font-semibold font-['Inter'] leading-normal">A</div>
<div className="flex-1 justify-start text-Neutrals-NeutralSlate800 text-base font-normal font-['Inter'] leading-normal whitespace-pre-wrap"> <div className="flex-1 justify-start text-[--$1] text-base font-normal font-['Inter'] leading-normal whitespace-pre-wrap">
{qa.answer} {qa.answer}
</div> </div>
</div> </div>

36
src/pages/CompanyWikiNew.tsx
View File

@@ -119,7 +119,7 @@ const CompanyWiki: React.FC = () => {
<div className="flex-1 flex items-center justify-center"> <div className="flex-1 flex items-center justify-center">
<div className="text-center"> <div className="text-center">
<div className="animate-spin w-8 h-8 border-2 border-Brand-Orange border-t-transparent rounded-full mx-auto mb-4"></div> <div className="animate-spin w-8 h-8 border-2 border-Brand-Orange border-t-transparent rounded-full mx-auto mb-4"></div>
<p className="text-Neutrals-NeutralSlate600">Loading company wiki...</p> <p className="text-[--$1]">Loading company wiki...</p>
</div> </div>
</div> </div>
); );
@@ -149,10 +149,10 @@ const CompanyWiki: React.FC = () => {
<div className="w-[1440px] h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden"> <div className="w-[1440px] h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden">
<div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden"> <div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden">
{/* Left Sidebar - Company Navigation */} {/* Left Sidebar - Company Navigation */}
<div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-Neutrals-NeutralSlate200 inline-flex flex-col justify-between items-center overflow-hidden"> <div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-[--$1] inline-flex flex-col justify-between items-center overflow-hidden">
{/* Company Header */} {/* Company Header */}
<div className="self-stretch flex flex-col justify-start items-start gap-5"> <div className="self-stretch flex flex-col justify-start items-start gap-5">
<div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex justify-between items-center overflow-hidden"> <div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex justify-between items-center overflow-hidden">
<div className="flex-1 flex justify-start items-center gap-2"> <div className="flex-1 flex justify-start items-center gap-2">
<div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5"> <div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5">
<div className="w-8 h-8 relative bg-Brand-Orange rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden"> <div className="w-8 h-8 relative bg-Brand-Orange rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden">
@@ -160,7 +160,7 @@ const CompanyWiki: React.FC = () => {
</div> </div>
</div> </div>
<div className="flex-1 inline-flex flex-col justify-start items-start gap-0.5"> <div className="flex-1 inline-flex flex-col justify-start items-start gap-0.5">
<div className="self-stretch justify-start text-Neutrals-NeutralSlate950 text-base font-medium font-['Inter'] leading-normal"> <div className="self-stretch justify-start text-[--$1] text-base font-medium font-['Inter'] leading-normal">
{onboardingData?.companyName || 'Company Name'} {onboardingData?.companyName || 'Company Name'}
</div> </div>
</div> </div>
@@ -171,19 +171,19 @@ const CompanyWiki: React.FC = () => {
<div className="self-stretch flex flex-col justify-start items-start gap-5"> <div className="self-stretch flex flex-col justify-start items-start gap-5">
<div className="self-stretch flex flex-col justify-start items-start gap-1.5"> <div className="self-stretch flex flex-col justify-start items-start gap-1.5">
<div className="w-60 px-4 py-2.5 bg-[--Neutrals-NeutralSlate100] rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 bg-[--Neutrals-NeutralSlate100] rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="justify-start text-Neutrals-NeutralSlate950 text-sm font-medium font-['Inter'] leading-tight">Company Wiki</div> <div className="justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Company Wiki</div>
</div> </div>
<div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="justify-start text-Neutrals-NeutralSlate500 text-sm font-medium font-['Inter'] leading-tight">Submissions</div> <div className="justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Submissions</div>
</div> </div>
<div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="justify-start text-Neutrals-NeutralSlate500 text-sm font-medium font-['Inter'] leading-tight">Reports</div> <div className="justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Reports</div>
</div> </div>
<div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="justify-start text-Neutrals-NeutralSlate500 text-sm font-medium font-['Inter'] leading-tight">Chat</div> <div className="justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Chat</div>
</div> </div>
<div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="justify-start text-Neutrals-NeutralSlate500 text-sm font-medium font-['Inter'] leading-tight">Help</div> <div className="justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Help</div>
</div> </div>
</div> </div>
</div> </div>
@@ -192,7 +192,7 @@ const CompanyWiki: React.FC = () => {
{/* Bottom Section */} {/* Bottom Section */}
<div className="self-stretch flex flex-col justify-start items-start gap-3"> <div className="self-stretch flex flex-col justify-start items-start gap-3">
<div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2"> <div className="w-60 px-4 py-2.5 rounded-[34px] inline-flex justify-start items-center gap-2">
<div className="flex-1 justify-start text-Neutrals-NeutralSlate500 text-sm font-medium font-['Inter'] leading-tight">Settings</div> <div className="flex-1 justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">Settings</div>
</div> </div>
</div> </div>
</div> </div>
@@ -203,7 +203,7 @@ const CompanyWiki: React.FC = () => {
{/* Table of Contents Sidebar */} {/* Table of Contents Sidebar */}
<div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch max-w-64 min-w-64 border-r border-Outline-Outline-Gray-200 inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-Neutrals-NeutralSlate950 text-base font-medium font-['Inter'] leading-normal">Table of contents</div> <div className="flex-1 justify-start text-[--$1] text-base font-medium font-['Inter'] leading-normal">Table of contents</div>
</div> </div>
<div className="self-stretch px-3 flex flex-col justify-start items-start gap-1.5"> <div className="self-stretch px-3 flex flex-col justify-start items-start gap-1.5">
{[1, 2, 3, 4, 5, 6, 7].map((section, index) => ( {[1, 2, 3, 4, 5, 6, 7].map((section, index) => (
@@ -213,9 +213,9 @@ const CompanyWiki: React.FC = () => {
onClick={() => setActiveSection(section)} onClick={() => setActiveSection(section)}
> >
<div className={`h-5 p-0.5 ${activeSection === section ? 'bg-Brand-Orange' : 'bg-Text-Gray-100'} rounded-[999px] inline-flex flex-col justify-center items-center gap-0.5 overflow-hidden`}> <div className={`h-5 p-0.5 ${activeSection === section ? 'bg-Brand-Orange' : 'bg-Text-Gray-100'} rounded-[999px] inline-flex flex-col justify-center items-center gap-0.5 overflow-hidden`}>
<div className={`w-4 text-center justify-start ${activeSection === section ? 'text-Neutrals-NeutralSlate0' : 'text-Text-Dark-950'} text-xs ${activeSection === section ? 'font-medium' : 'font-normal'} font-['Inter'] leading-none`}>{section}</div> <div className={`w-4 text-center justify-start ${activeSection === section ? 'text-[--$1]' : 'text-Text-Dark-950'} text-xs ${activeSection === section ? 'font-medium' : 'font-normal'} font-['Inter'] leading-none`}>{section}</div>
</div> </div>
<div className={`flex-1 justify-start ${activeSection === section ? 'text-Neutrals-NeutralSlate800' : 'text-Text-Gray-500'} text-xs font-medium font-['Inter'] leading-none`}> <div className={`flex-1 justify-start ${activeSection === section ? 'text-[--$1]' : 'text-Text-Gray-500'} text-xs font-medium font-['Inter'] leading-none`}>
{getSectionTitle(section)} {getSectionTitle(section)}
</div> </div>
</div> </div>
@@ -226,7 +226,7 @@ const CompanyWiki: React.FC = () => {
{/* Questions Content */} {/* Questions Content */}
<div className="flex-1 self-stretch inline-flex flex-col justify-start items-start"> <div className="flex-1 self-stretch inline-flex flex-col justify-start items-start">
<div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5"> <div className="self-stretch p-5 inline-flex justify-start items-center gap-2.5">
<div className="flex-1 justify-start text-Neutrals-NeutralSlate800 text-base font-medium font-['Inter'] leading-normal"> <div className="flex-1 justify-start text-[--$1] text-base font-medium font-['Inter'] leading-normal">
{getSectionTitle(activeSection)} {getSectionTitle(activeSection)}
</div> </div>
</div> </div>
@@ -235,16 +235,16 @@ const CompanyWiki: React.FC = () => {
<div key={qa.field} className="self-stretch p-3 bg-[--Neutrals-NeutralSlate100] rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.02)] flex flex-col justify-center items-start gap-2 overflow-hidden"> <div key={qa.field} className="self-stretch p-3 bg-[--Neutrals-NeutralSlate100] rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.02)] flex flex-col justify-center items-start gap-2 overflow-hidden">
<div className="self-stretch px-3 py-px inline-flex justify-start items-center gap-2.5"> <div className="self-stretch px-3 py-px inline-flex justify-start items-center gap-2.5">
<div className="flex-1 flex justify-center items-center gap-3"> <div className="flex-1 flex justify-center items-center gap-3">
<div className="w-3 self-stretch justify-start text-Neutrals-NeutralSlate300 text-base font-semibold font-['Inter'] leading-normal">Q</div> <div className="w-3 self-stretch justify-start text-[--$1] text-base font-semibold font-['Inter'] leading-normal">Q</div>
<div className="flex-1 justify-start text-Neutrals-NeutralSlate600 text-sm font-medium font-['Inter'] leading-tight"> <div className="flex-1 justify-start text-[--$1] text-sm font-medium font-['Inter'] leading-tight">
{qa.question} {qa.question}
</div> </div>
</div> </div>
</div> </div>
<div className="self-stretch px-3 py-2 bg-[--Neutrals-NeutralSlate0] rounded-[10px] inline-flex justify-between items-center"> <div className="self-stretch px-3 py-2 bg-[--Neutrals-NeutralSlate0] rounded-[10px] inline-flex justify-between items-center">
<div className="flex-1 flex justify-start items-start gap-3"> <div className="flex-1 flex justify-start items-start gap-3">
<div className="w-3.5 h-6 justify-center text-Neutrals-NeutralSlate300 text-base font-semibold font-['Inter'] leading-normal">A</div> <div className="w-3.5 h-6 justify-center text-[--$1] text-base font-semibold font-['Inter'] leading-normal">A</div>
<div className="flex-1 justify-start text-Neutrals-NeutralSlate800 text-base font-normal font-['Inter'] leading-normal whitespace-pre-wrap"> <div className="flex-1 justify-start text-[--$1] text-base font-normal font-['Inter'] leading-normal whitespace-pre-wrap">
{qa.answer} {qa.answer}
</div> </div>
</div> </div>

12
src/pages/EmployeeQuestionnaire.tsx
View File

@@ -1127,8 +1127,8 @@ const EmployeeFormStep35: React.FC<{ onNext: () => void; onBack: () => void }> =
rows={6} rows={6}
/> />
<div className="w-3 h-3 absolute right-5 bottom-5"> <div className="w-3 h-3 absolute right-5 bottom-5">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>
@@ -1219,8 +1219,8 @@ const EmployeeFormStep36: React.FC<{ onNext: () => void; onBack: () => void }> =
rows={6} rows={6}
/> />
<div className="w-3 h-3 absolute right-5 bottom-5"> <div className="w-3 h-3 absolute right-5 bottom-5">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>
@@ -1311,8 +1311,8 @@ const EmployeeFormStep37: React.FC<{ onNext: () => void; onBack: () => void }> =
rows={6} rows={6}
/> />
<div className="w-3 h-3 absolute right-5 bottom-5"> <div className="w-3 h-3 absolute right-5 bottom-5">
<div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-2 h-2 absolute top-0.5 left-0.5 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
<div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate500" /> <div className="w-1 h-1 absolute bottom-0 right-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]" />
</div> </div>
</div> </div>
</div> </div>

2
src/pages/HelpNew.tsx
View File

@@ -96,7 +96,7 @@ const HelpNew: React.FC = () => {
<div className="w-5 h-5 opacity-0 border border-zinc-800" /> <div className="w-5 h-5 opacity-0 border border-zinc-800" />
</div> </div>
{item.isOpen && ( {item.isOpen && (
<div className="self-stretch p-6 bg-[--Neutrals-NeutralSlate0] rounded-2xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 flex flex-col justify-start items-start gap-4"> <div className="self-stretch p-6 bg-[--Neutrals-NeutralSlate0] rounded-2xl outline outline-1 outline-offset-[-1px] outline-[--$1] flex flex-col justify-start items-start gap-4">
<div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-base font-normal font-['Inter'] leading-normal"> <div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-base font-normal font-['Inter'] leading-normal">
{item.answer} {item.answer}
</div> </div>

4
src/pages/Login.tsx
View File

@@ -264,9 +264,9 @@ const ModernLogin: React.FC = () => {
<div className="justify-center text-[--Neutrals-NeutralSlate800] text-sm font-medium font-['Inter'] leading-tight cursor-pointer" onClick={handleGoogleAuth}>Continue with Google</div> <div className="justify-center text-[--Neutrals-NeutralSlate800] text-sm font-medium font-['Inter'] leading-tight cursor-pointer" onClick={handleGoogleAuth}>Continue with Google</div>
</div> </div>
<div className="self-stretch inline-flex justify-center items-center gap-3"> <div className="self-stretch inline-flex justify-center items-center gap-3">
<div className="flex-1 h-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate200"></div> <div className="flex-1 h-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]"></div>
<div className="justify-start text-[--Neutrals-NeutralSlate400] text-sm font-normal font-['Inter'] leading-tight">or</div> <div className="justify-start text-[--Neutrals-NeutralSlate400] text-sm font-normal font-['Inter'] leading-tight">or</div>
<div className="flex-1 h-0 outline outline-1 outline-offset-[-0.50px] outline-Neutrals-NeutralSlate200"></div> <div className="flex-1 h-0 outline outline-1 outline-offset-[-0.50px] outline-[--$1]"></div>
</div> </div>
<div className="self-stretch flex flex-col justify-center items-end gap-2"> <div className="self-stretch flex flex-col justify-center items-end gap-2">
<div className="self-stretch inline-flex justify-end items-end gap-2"> <div className="self-stretch inline-flex justify-end items-end gap-2">

10
src/pages/figma/ChatAIResponse.tsx
View File

@@ -5,10 +5,10 @@ const ChatAIResponse: React.FC = () => {
<div className="w-full h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden"> <div className="w-full h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden">
<div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden"> <div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden">
{/* Sidebar */} {/* Sidebar */}
<div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-Neutrals-NeutralSlate200 inline-flex flex-col justify-between items-center overflow-hidden"> <div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-[--$1] inline-flex flex-col justify-between items-center overflow-hidden">
<div className="self-stretch flex flex-col justify-start items-start gap-5"> <div className="self-stretch flex flex-col justify-start items-start gap-5">
{/* Company Selector */} {/* Company Selector */}
<div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex justify-between items-center overflow-hidden"> <div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex justify-between items-center overflow-hidden">
<div className="flex-1 flex justify-start items-center gap-2"> <div className="flex-1 flex justify-start items-center gap-2">
<div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5"> <div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5">
<div className="w-8 h-8 relative bg-[--Brand-Orange] rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden"> <div className="w-8 h-8 relative bg-[--Brand-Orange] rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden">
@@ -110,11 +110,11 @@ const ChatAIResponse: React.FC = () => {
</div> </div>
{/* Company Report Card */} {/* Company Report Card */}
<div className="self-stretch bg-[--Neutrals-NeutralSlate0] rounded-[20px] shadow-[0px_1px_4px_0px_rgba(14,18,27,0.04)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 flex flex-col justify-start items-start overflow-hidden"> <div className="self-stretch bg-[--Neutrals-NeutralSlate0] rounded-[20px] shadow-[0px_1px_4px_0px_rgba(14,18,27,0.04)] outline outline-1 outline-offset-[-1px] outline-[--$1] flex flex-col justify-start items-start overflow-hidden">
<div className="self-stretch h-24 relative"> <div className="self-stretch h-24 relative">
<div className="w-60 h-32 left-0 top-[-0.50px] absolute bg-gradient-to-b from-black to-black/0" /> <div className="w-60 h-32 left-0 top-[-0.50px] absolute bg-gradient-to-b from-black to-black/0" />
<div className="w-60 p-3 left-[18.12px] top-[42.52px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start gap-3 overflow-hidden" /> <div className="w-60 p-3 left-[18.12px] top-[42.52px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex flex-col justify-start items-start gap-3 overflow-hidden" />
<div className="w-60 p-3 left-[31.44px] top-[22px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start gap-3 overflow-hidden" /> <div className="w-60 p-3 left-[31.44px] top-[22px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex flex-col justify-start items-start gap-3 overflow-hidden" />
</div> </div>
<div className="self-stretch p-3 flex flex-col justify-start items-start gap-1"> <div className="self-stretch p-3 flex flex-col justify-start items-start gap-1">
<div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-sm font-semibold font-['Inter'] leading-tight">Build [Company]'s Report</div> <div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-sm font-semibold font-['Inter'] leading-tight">Build [Company]'s Report</div>

10
src/pages/figma/ChatLight.tsx
View File

@@ -5,10 +5,10 @@ const ChatLight: React.FC = () => {
<div className="w-full h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden"> <div className="w-full h-[810px] p-4 bg-[--Neutrals-NeutralSlate200] inline-flex justify-start items-start overflow-hidden">
<div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden"> <div className="flex-1 self-stretch rounded-3xl shadow-[0px_0px_15px_0px_rgba(0,0,0,0.08)] flex justify-between items-start overflow-hidden">
{/* Sidebar */} {/* Sidebar */}
<div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-Neutrals-NeutralSlate200 inline-flex flex-col justify-between items-center overflow-hidden"> <div className="w-64 self-stretch max-w-64 min-w-64 px-3 pt-4 pb-3 bg-[--Neutrals-NeutralSlate0] border-r border-[--$1] inline-flex flex-col justify-between items-center overflow-hidden">
<div className="self-stretch flex flex-col justify-start items-start gap-5"> <div className="self-stretch flex flex-col justify-start items-start gap-5">
{/* Company Selector */} {/* Company Selector */}
<div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex justify-between items-center overflow-hidden"> <div className="w-60 pl-2 pr-4 py-2 bg-[--Neutrals-NeutralSlate0] rounded-3xl outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex justify-between items-center overflow-hidden">
<div className="flex-1 flex justify-start items-center gap-2"> <div className="flex-1 flex justify-start items-center gap-2">
<div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5"> <div className="w-8 h-8 rounded-full flex justify-start items-center gap-2.5">
<div className="w-8 h-8 relative bg-[--Brand-Orange] rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden"> <div className="w-8 h-8 relative bg-[--Brand-Orange] rounded-full outline outline-[1.60px] outline-offset-[-1.60px] outline-white/10 overflow-hidden">
@@ -105,11 +105,11 @@ const ChatLight: React.FC = () => {
</div> </div>
{/* Company Report Card */} {/* Company Report Card */}
<div className="self-stretch bg-[--Neutrals-NeutralSlate0] rounded-[20px] shadow-[0px_1px_4px_0px_rgba(14,18,27,0.04)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 flex flex-col justify-start items-start overflow-hidden"> <div className="self-stretch bg-[--Neutrals-NeutralSlate0] rounded-[20px] shadow-[0px_1px_4px_0px_rgba(14,18,27,0.04)] outline outline-1 outline-offset-[-1px] outline-[--$1] flex flex-col justify-start items-start overflow-hidden">
<div className="self-stretch h-24 relative"> <div className="self-stretch h-24 relative">
<div className="w-60 h-32 left-0 top-[-0.50px] absolute bg-gradient-to-b from-black to-black/0" /> <div className="w-60 h-32 left-0 top-[-0.50px] absolute bg-gradient-to-b from-black to-black/0" />
<div className="w-60 p-3 left-[18.12px] top-[42.52px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start gap-3 overflow-hidden" /> <div className="w-60 p-3 left-[18.12px] top-[42.52px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex flex-col justify-start items-start gap-3 overflow-hidden" />
<div className="w-60 p-3 left-[31.44px] top-[22px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-Neutrals-NeutralSlate200 inline-flex flex-col justify-start items-start gap-3 overflow-hidden" /> <div className="w-60 p-3 left-[31.44px] top-[22px] absolute origin-top-left rotate-[-28.34deg] bg-[--Neutrals-NeutralSlate0] rounded-xl shadow-[0px_10px_20px_4px_rgba(14,18,27,0.08)] outline outline-1 outline-offset-[-1px] outline-[--$1] inline-flex flex-col justify-start items-start gap-3 overflow-hidden" />
</div> </div>
<div className="self-stretch p-3 flex flex-col justify-start items-start gap-1"> <div className="self-stretch p-3 flex flex-col justify-start items-start gap-1">
<div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-sm font-semibold font-['Inter'] leading-tight">Build [Company]'s Report</div> <div className="self-stretch justify-start text-[--Neutrals-NeutralSlate800] text-sm font-semibold font-['Inter'] leading-tight">Build [Company]'s Report</div>