WHEREAS, Tech4Biz provides high-fidelity silicon designs, custom
compilation systems, and software engineering consulting; and
the Client wishes to engage Tech4Biz to access such tools and
@@ -265,7 +265,7 @@ export const DocumentPreview: React.FC = ({
-
+
5. Confidentiality
@@ -336,22 +336,22 @@ export const DocumentPreview: React.FC = ({
)}
{/* Signatures Section */}
-
-
+
+
IN WITNESS WHEREOF, the Parties have executed this Agreement as of
the dates indicated below.
-
+
For: Tech4Biz Solutions Inc.
-
-
+
+
Yasha Khandelwal{" "}
-
+
Name: Yasha Khandelwal
@@ -365,23 +365,23 @@ export const DocumentPreview: React.FC
= ({
-
+
For: {companyName.toUpperCase()}
-
+
{signatureDataUrl ? (

) : (
-
+
[Awaiting Signature]
)}
-
+
Name: Authorized Representative
@@ -400,3 +400,4 @@ export const DocumentPreview: React.FC
= ({
);
};
+export default DocumentPreview;
diff --git a/Channel-Frontend/src/features/agreements/components/SignatureCapture.tsx b/Channel-Frontend/src/features/agreements/components/SignatureCapture.tsx
index bc6cb24..53bf5bd 100644
--- a/Channel-Frontend/src/features/agreements/components/SignatureCapture.tsx
+++ b/Channel-Frontend/src/features/agreements/components/SignatureCapture.tsx
@@ -24,24 +24,33 @@ export const SignatureCapture: React.FC
= ({
const ctx = canvas.getContext('2d');
if (!ctx) return;
- // Set styling for the signature line
- ctx.strokeStyle = '#050505'; // slate-900 or dark ink
+ // Detect theme for stroke color
+ const isDark = document.documentElement.classList.contains('dark');
+ ctx.strokeStyle = isDark ? '#fafafa' : '#09090b';
ctx.lineWidth = 3;
ctx.lineCap = 'round';
ctx.lineJoin = 'round';
// Handle high DPI displays for crisp rendering
const dpr = window.devicePixelRatio || 1;
- // Set actual size in memory (scaled to account for extra pixel density)
canvas.width = width * dpr;
canvas.height = height * dpr;
- // Set display size
canvas.style.width = `${width}px`;
canvas.style.height = `${height}px`;
- // Normalize coordinate system to use css pixels
ctx.scale(dpr, dpr);
}, [width, height]);
+ // Adjust stroke color if theme toggles during active view
+ useEffect(() => {
+ const canvas = canvasRef.current;
+ if (!canvas) return;
+ const ctx = canvas.getContext('2d');
+ if (!ctx) return;
+
+ const isDark = document.documentElement.classList.contains('dark');
+ ctx.strokeStyle = isDark ? '#fafafa' : '#09090b';
+ });
+
const startDrawing = (e: React.MouseEvent | React.TouchEvent) => {
e.preventDefault();
const canvas = canvasRef.current;
@@ -111,19 +120,18 @@ export const SignatureCapture: React.FC = ({
const canvas = canvasRef.current;
if (!canvas || !hasSignature) return;
- // We can return a base64 encoded PNG
const dataUrl = canvas.toDataURL('image/png');
onSignatureComplete(dataUrl);
};
return (
-
+
{/* Helper Text */}
{!hasSignature && (
-
+
Draw your signature here
@@ -148,7 +156,7 @@ export const SignatureCapture: React.FC
= ({
type="button"
onClick={clearSignature}
disabled={!hasSignature}
- className="flex items-center gap-2 px-4 py-2 text-sm font-semibold text-slate-500 dark:text-white/50 hover:text-red-500 hover:bg-red-50 dark:hover:bg-red-500/10 rounded-xl transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+ className="flex items-center gap-2 px-4 py-2 text-sm font-semibold text-ink-500 hover:text-red-600 hover:bg-red-500/10 rounded-xl transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
Clear
@@ -158,7 +166,7 @@ export const SignatureCapture: React.FC = ({
type="button"
onClick={handleSave}
disabled={!hasSignature}
- className="flex items-center gap-2 px-6 py-2.5 text-sm font-bold text-white dark:text-slate-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-700 dark:hover:bg-blue-300 rounded-xl transition-all shadow-md hover:shadow-lg disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:shadow-md hover:-translate-y-0.5"
+ className="flex items-center gap-2 px-6 py-2.5 text-sm font-bold text-ink-0 bg-ink-900 hover:bg-ink-800 rounded-xl transition-all shadow-md hover:shadow-lg disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:shadow-md hover:-translate-y-0.5"
>
Accept & Sign
diff --git a/Channel-Frontend/src/features/assets/components/AssetExplorer.tsx b/Channel-Frontend/src/features/assets/components/AssetExplorer.tsx
index b13f227..40ac52a 100644
--- a/Channel-Frontend/src/features/assets/components/AssetExplorer.tsx
+++ b/Channel-Frontend/src/features/assets/components/AssetExplorer.tsx
@@ -78,11 +78,9 @@ export const AssetExplorer: React.FC = () => {
const handleDownload = async (asset: Asset) => {
triggerToast(`Starting download: ${asset.title}`);
try {
- // Simulate incrementing downloads count
const updatedAsset = { ...asset, downloadsCount: asset.downloadsCount + 1 };
await apiClient.put(`/assets/${asset.id}`, updatedAsset);
- // Update local state
setAssets(prev => prev.map(a => a.id === asset.id ? updatedAsset : a));
if (selectedAsset?.id === asset.id) {
setSelectedAsset(updatedAsset);
@@ -92,7 +90,6 @@ export const AssetExplorer: React.FC = () => {
}
};
- // Helper icons mapping
const getCategoryIcon = (catId: string) => {
switch (catId) {
case 'silicon': return ;
@@ -106,33 +103,33 @@ export const AssetExplorer: React.FC = () => {
const currentCategory = categories.find(c => c.id === selectedCategory);
return (
-
+
{/* Toast Notification */}
{toastMessage && (
-
-
+
+
{toastMessage}
)}
{/* Hero section */}
-
+
-
Tech4Biz Asset Explorer
+
Tech4Biz Asset Explorer
Browse, preview, and download proprietary hardware IP, framework assemblies, and cloud-native building blocks licensed under your master agreements.
-
-
{assets.length}
+
+
{assets.length}
Available
{/* Toolbar - Search & Category tabs */}
-
+
{/* Search & Subcategory select */}
@@ -142,7 +139,7 @@ export const AssetExplorer: React.FC = () => {
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
placeholder="Search by IP block name, language, metadata tag..."
- className="w-full rounded-lg border border-ink-200 pl-10 pr-4 py-2 text-sm focus:border-primary-500 focus:outline-none transition-colors"
+ className="w-full rounded-lg border border-ink-200 pl-10 pr-4 py-2 text-sm focus:border-ink-900/50 focus:outline-none transition-colors bg-ink-50 text-ink-900 placeholder-ink-400"
/>
{currentCategory && currentCategory.subcategories.length > 0 && (
@@ -150,7 +147,7 @@ export const AssetExplorer: React.FC = () => {