diff --git a/package-lock.json b/package-lock.json index 64cc88b..3055447 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "cict-next", "version": "0.1.0", "dependencies": { + "gsap": "^3.14.2", "next": "^16.1.4", "react": "19.2.3", "react-dom": "19.2.3", @@ -1053,9 +1054,9 @@ } }, "node_modules/@next/env": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/env/-/env-16.1.6.tgz", - "integrity": "sha512-N1ySLuZjnAtN3kFnwhAwPvZah8RJxKasD7x1f8shFqhncnWZn4JMfg37diLNuoHsLAlrDfM3g4mawVdtAG8XLQ==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/env/-/env-16.2.3.tgz", + "integrity": "sha512-ZWXyj4uNu4GCWQw9cjRxWlbD+33mcDszIo9iQxFnBX3Wmgq9ulaSJcl6VhuWx5pCWqqD+9W6Wfz7N0lM5lYPMA==", "license": "MIT" }, "node_modules/@next/eslint-plugin-next": { @@ -1069,9 +1070,9 @@ } }, "node_modules/@next/swc-darwin-arm64": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.1.6.tgz", - "integrity": "sha512-wTzYulosJr/6nFnqGW7FrG3jfUUlEf8UjGA0/pyypJl42ExdVgC6xJgcXQ+V8QFn6niSG2Pb8+MIG1mZr2vczw==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.2.3.tgz", + "integrity": "sha512-u37KDKTKQ+OQLvY+z7SNXixwo4Q2/IAJFDzU1fYe66IbCE51aDSAzkNDkWmLN0yjTUh4BKBd+hb69jYn6qqqSg==", "cpu": [ "arm64" ], @@ -1085,9 +1086,9 @@ } }, "node_modules/@next/swc-darwin-x64": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.1.6.tgz", - "integrity": "sha512-BLFPYPDO+MNJsiDWbeVzqvYd4NyuRrEYVB5k2N3JfWncuHAy2IVwMAOlVQDFjj+krkWzhY2apvmekMkfQR0CUQ==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.2.3.tgz", + "integrity": "sha512-gHjL/qy6Q6CG3176FWbAKyKh9IfntKZTB3RY/YOJdDFpHGsUDXVH38U4mMNpHVGXmeYW4wj22dMp1lTfmu/bTQ==", "cpu": [ "x64" ], @@ -1101,9 +1102,9 @@ } }, "node_modules/@next/swc-linux-arm64-gnu": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.1.6.tgz", - "integrity": "sha512-OJYkCd5pj/QloBvoEcJ2XiMnlJkRv9idWA/j0ugSuA34gMT6f5b7vOiCQHVRpvStoZUknhl6/UxOXL4OwtdaBw==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.2.3.tgz", + "integrity": "sha512-U6vtblPtU/P14Y/b/n9ZY0GOxbbIhTFuaFR7F4/uMBidCi2nSdaOFhA0Go81L61Zd6527+yvuX44T4ksnf8T+Q==", "cpu": [ "arm64" ], @@ -1117,9 +1118,9 @@ } }, "node_modules/@next/swc-linux-arm64-musl": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.1.6.tgz", - "integrity": "sha512-S4J2v+8tT3NIO9u2q+S0G5KdvNDjXfAv06OhfOzNDaBn5rw84DGXWndOEB7d5/x852A20sW1M56vhC/tRVbccQ==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.2.3.tgz", + "integrity": "sha512-/YV0LgjHUmfhQpn9bVoGc4x4nan64pkhWR5wyEV8yCOfwwrH630KpvRg86olQHTwHIn1z59uh6JwKvHq1h4QEw==", "cpu": [ "arm64" ], @@ -1133,9 +1134,9 @@ } }, "node_modules/@next/swc-linux-x64-gnu": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.1.6.tgz", - "integrity": "sha512-2eEBDkFlMMNQnkTyPBhQOAyn2qMxyG2eE7GPH2WIDGEpEILcBPI/jdSv4t6xupSP+ot/jkfrCShLAa7+ZUPcJQ==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.2.3.tgz", + "integrity": "sha512-/HiWEcp+WMZ7VajuiMEFGZ6cg0+aYZPqCJD3YJEfpVWQsKYSjXQG06vJP6F1rdA03COD9Fef4aODs3YxKx+RDQ==", "cpu": [ "x64" ], @@ -1149,9 +1150,9 @@ } }, "node_modules/@next/swc-linux-x64-musl": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.1.6.tgz", - "integrity": "sha512-oicJwRlyOoZXVlxmIMaTq7f8pN9QNbdes0q2FXfRsPhfCi8n8JmOZJm5oo1pwDaFbnnD421rVU409M3evFbIqg==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.2.3.tgz", + "integrity": "sha512-Kt44hGJfZSefebhk/7nIdivoDr3Ugp5+oNz9VvF3GUtfxutucUIHfIO0ZYO8QlOPDQloUVQn4NVC/9JvHRk9hw==", "cpu": [ "x64" ], @@ -1165,9 +1166,9 @@ } }, "node_modules/@next/swc-win32-arm64-msvc": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.1.6.tgz", - "integrity": "sha512-gQmm8izDTPgs+DCWH22kcDmuUp7NyiJgEl18bcr8irXA5N2m2O+JQIr6f3ct42GOs9c0h8QF3L5SzIxcYAAXXw==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.2.3.tgz", + "integrity": "sha512-O2NZ9ie3Tq6xj5Z5CSwBT3+aWAMW2PIZ4egUi9MaWLkwaehgtB7YZjPm+UpcNpKOme0IQuqDcor7BsW6QBiQBw==", "cpu": [ "arm64" ], @@ -1181,9 +1182,9 @@ } }, "node_modules/@next/swc-win32-x64-msvc": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.6.tgz", - "integrity": "sha512-NRfO39AIrzBnixKbjuo2YiYhB6o9d8v/ymU9m/Xk8cyVk+k7XylniXkHwjs4s70wedVffc6bQNbufk5v0xEm0A==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.2.3.tgz", + "integrity": "sha512-Ibm29/GgB/ab5n7XKqlStkm54qqZE8v2FnijUPBgrd67FWrac45o/RsNlaOWjme/B5UqeWt/8KM4aWBwA1D2Kw==", "cpu": [ "x64" ], @@ -1945,9 +1946,9 @@ } }, "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz", - "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==", + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.3.tgz", + "integrity": "sha512-MCV/fYJEbqx68aE58kv2cA/kiky1G8vux3OR6/jbS+jIMe/6fJWa0DTzJU7dqijOWYwHi1t29FlfYI9uytqlpA==", "dev": true, "license": "MIT", "dependencies": { @@ -1955,13 +1956,13 @@ } }, "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": { - "version": "9.0.5", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", - "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", + "version": "9.0.9", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz", + "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==", "dev": true, "license": "ISC", "dependencies": { - "brace-expansion": "^2.0.1" + "brace-expansion": "^2.0.2" }, "engines": { "node": ">=16 || 14 >=14.17" @@ -2325,9 +2326,9 @@ } }, "node_modules/ajv": { - "version": "6.12.6", - "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", - "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "version": "6.14.0", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.14.0.tgz", + "integrity": "sha512-IWrosm/yrn43eiKqkfkHis7QioDleaXQHdDVPKg0FSwwd/DuvyX79TZnFOnYpB7dcsFAMmtFztZuXPDvSePkFw==", "dev": true, "license": "MIT", "dependencies": { @@ -2637,18 +2638,21 @@ "license": "MIT" }, "node_modules/baseline-browser-mapping": { - "version": "2.9.18", - "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.18.tgz", - "integrity": "sha512-e23vBV1ZLfjb9apvfPk4rHVu2ry6RIr2Wfs+O324okSidrX7pTAnEJPCh/O5BtRlr7QtZI7ktOP3vsqr7Z5XoA==", + "version": "2.10.17", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.17.tgz", + "integrity": "sha512-HdrkN8eVG2CXxeifv/VdJ4A4RSra1DTW8dc/hdxzhGHN8QePs6gKaWM9pHPcpCoxYZJuOZ8drHmbdpLHjCYjLA==", "license": "Apache-2.0", "bin": { - "baseline-browser-mapping": "dist/cli.js" + "baseline-browser-mapping": "dist/cli.cjs" + }, + "engines": { + "node": ">=6.0.0" } }, "node_modules/brace-expansion": { - "version": "1.1.12", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", - "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==", + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.13.tgz", + "integrity": "sha512-9ZLprWS6EENmhEOpjCYW2c8VkmOvckIJZfkr7rBW6dObmfgJ/L1GpSYW5Hpo9lDz4D1+n0Ckz8rU7FwHDQiG/w==", "dev": true, "license": "MIT", "dependencies": { @@ -3953,9 +3957,9 @@ } }, "node_modules/flatted": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz", - "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==", + "version": "3.4.2", + "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz", + "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==", "dev": true, "license": "ISC" }, @@ -4194,6 +4198,12 @@ "dev": true, "license": "ISC" }, + "node_modules/gsap": { + "version": "3.14.2", + "resolved": "https://registry.npmjs.org/gsap/-/gsap-3.14.2.tgz", + "integrity": "sha512-P8/mMxVLU7o4+55+1TCnQrPmgjPKnwkzkXOK1asnR9Jg2lna4tEY5qBJjMmAaOBDDZWtlRjBXjLa0w53G/uBLA==", + "license": "Standard 'no charge' license: https://gsap.com/standard-license." + }, "node_modules/has-bigints": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz", @@ -6426,9 +6436,9 @@ } }, "node_modules/minimatch": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", - "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "version": "3.1.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz", + "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==", "dev": true, "license": "ISC", "dependencies": { @@ -6496,14 +6506,14 @@ "license": "MIT" }, "node_modules/next": { - "version": "16.1.6", - "resolved": "https://registry.npmjs.org/next/-/next-16.1.6.tgz", - "integrity": "sha512-hkyRkcu5x/41KoqnROkfTm2pZVbKxvbZRuNvKXLRXxs3VfyO0WhY50TQS40EuKO9SW3rBj/sF3WbVwDACeMZyw==", + "version": "16.2.3", + "resolved": "https://registry.npmjs.org/next/-/next-16.2.3.tgz", + "integrity": "sha512-9V3zV4oZFza3PVev5/poB9g0dEafVcgNyQ8eTRop8GvxZjV2G15FC5ARuG1eFD42QgeYkzJBJzHghNP8Ad9xtA==", "license": "MIT", "dependencies": { - "@next/env": "16.1.6", + "@next/env": "16.2.3", "@swc/helpers": "0.5.15", - "baseline-browser-mapping": "^2.8.3", + "baseline-browser-mapping": "^2.9.19", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" @@ -6515,15 +6525,15 @@ "node": ">=20.9.0" }, "optionalDependencies": { - "@next/swc-darwin-arm64": "16.1.6", - "@next/swc-darwin-x64": "16.1.6", - "@next/swc-linux-arm64-gnu": "16.1.6", - "@next/swc-linux-arm64-musl": "16.1.6", - "@next/swc-linux-x64-gnu": "16.1.6", - "@next/swc-linux-x64-musl": "16.1.6", - "@next/swc-win32-arm64-msvc": "16.1.6", - "@next/swc-win32-x64-msvc": "16.1.6", - "sharp": "^0.34.4" + "@next/swc-darwin-arm64": "16.2.3", + "@next/swc-darwin-x64": "16.2.3", + "@next/swc-linux-arm64-gnu": "16.2.3", + "@next/swc-linux-arm64-musl": "16.2.3", + "@next/swc-linux-x64-gnu": "16.2.3", + "@next/swc-linux-x64-musl": "16.2.3", + "@next/swc-win32-arm64-msvc": "16.2.3", + "@next/swc-win32-x64-msvc": "16.2.3", + "sharp": "^0.34.5" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", @@ -6868,9 +6878,9 @@ "license": "ISC" }, "node_modules/picomatch": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", - "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz", + "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==", "dev": true, "license": "MIT", "engines": { @@ -7982,9 +7992,9 @@ } }, "node_modules/tinyglobby/node_modules/picomatch": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", - "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz", + "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", "dev": true, "license": "MIT", "peer": true, diff --git a/package.json b/package.json index 12218ab..ec1f990 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "lint": "eslint" }, "dependencies": { + "gsap": "^3.14.2", "next": "^16.1.4", "react": "19.2.3", "react-dom": "19.2.3", diff --git a/public/home-page_assets/blis-icon.png b/public/home-page_assets/blis-icon.png new file mode 100644 index 0000000..298144c Binary files /dev/null and b/public/home-page_assets/blis-icon.png differ diff --git a/public/home-page_assets/bscs-icon.png b/public/home-page_assets/bscs-icon.png new file mode 100644 index 0000000..a8af3c8 Binary files /dev/null and b/public/home-page_assets/bscs-icon.png differ diff --git a/public/home-page_assets/bsemc-icon.png b/public/home-page_assets/bsemc-icon.png new file mode 100644 index 0000000..579d58a Binary files /dev/null and b/public/home-page_assets/bsemc-icon.png differ diff --git a/public/home-page_assets/bsis-icon.png b/public/home-page_assets/bsis-icon.png new file mode 100644 index 0000000..97b5a50 Binary files /dev/null and b/public/home-page_assets/bsis-icon.png differ diff --git a/public/home-page_assets/bsit-icon.png b/public/home-page_assets/bsit-icon.png new file mode 100644 index 0000000..a88f89a Binary files /dev/null and b/public/home-page_assets/bsit-icon.png differ diff --git a/public/home-page_assets/cict-emblem-thick.png b/public/home-page_assets/cict-emblem-thick.png new file mode 100644 index 0000000..babbbad Binary files /dev/null and b/public/home-page_assets/cict-emblem-thick.png differ diff --git a/public/home-page_assets/cict-logo.png b/public/home-page_assets/cict-logo.png new file mode 100644 index 0000000..cec3b92 Binary files /dev/null and b/public/home-page_assets/cict-logo.png differ diff --git a/public/home-page_assets/featured-card-image.png b/public/home-page_assets/featured-card-image.png new file mode 100644 index 0000000..8368928 Binary files /dev/null and b/public/home-page_assets/featured-card-image.png differ diff --git a/public/home-page_assets/grey-arrow-icon.png b/public/home-page_assets/grey-arrow-icon.png new file mode 100644 index 0000000..dcd311f Binary files /dev/null and b/public/home-page_assets/grey-arrow-icon.png differ diff --git a/public/home-page_assets/grinch.png b/public/home-page_assets/grinch.png new file mode 100644 index 0000000..b970e4f Binary files /dev/null and b/public/home-page_assets/grinch.png differ diff --git a/public/home-page_assets/mit-icon.png b/public/home-page_assets/mit-icon.png new file mode 100644 index 0000000..15162e9 Binary files /dev/null and b/public/home-page_assets/mit-icon.png differ diff --git a/public/home-page_assets/orange-arrow-icon.png b/public/home-page_assets/orange-arrow-icon.png new file mode 100644 index 0000000..f5d1642 Binary files /dev/null and b/public/home-page_assets/orange-arrow-icon.png differ diff --git a/src/app/page.tsx b/src/app/page.tsx index 99453e4..9dcde76 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,7 +1,270 @@ +import Link from "next/link"; +import TestimonialCards from "../components/TestimonialCards"; + export default function Home() { + + const button_big = "flex justify-center items-center border-1 rounded-2xl w-32 md:w-xs h-6 md:h-10 p-2"; + const card_small = "w-full shadow-[0_0_10px_rgba(0,0,0,0.15)] rounded-xl p-3 shadow-lg rounded-xl"; + const divider = "border border-transparent border-b-[#363636] p-2 md:p-4"; + const course_container = "w-25 h-24 md:w-58 md:h-54 flex flex-col justify-center items-center gap-2 md:gap-6 bg-white pt-3 md:pt-6"; + return (
-

Hello from homepage!

+ {/*Landing Page*/} +
+ {/*Header*/} +
+

Building the Digital
Leaders of Tomorrow

+

COLLEGE OF INFORMATION AND COMMUNICATIONS TECHNOLOGY

+
+ + {/*Buttons*/} +
+ COURSES OFFERED + WHY CHOOSE US +
+ + {/*Tagline*/} +

We have been shaping careers for
technological trailblazers across industries for
23 years.

+
+ + {/*News and Announcements*/} +
+ {/*Top Section*/} +
+
+
+

NEWS AND ANNOUNCEMENTS

+ + READ MORE + + +
+ +

CHECK OUT THE LATEST
COLLEGE UPDATES

+ +

Stay informed with the latest updates, official announcements, and important notices

+
+ + {/*Featured Card*/} +
+ insert image here +
+
+

2 days ago |

+ ANNOUNCEMENT +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read Now + + +
+
+
+
+
+

December 26, 2025

+ ANNOUNCEMENT +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read More + + +
+
+
+ + {/*Bottom Section*/} +
+
+
+

December 26, 2025

+ NEWS +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read More + + +
+
+
+
+

December 26, 2025

+ NEWS +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read More + + +
+
+
+
+

December 26, 2025

+ NEWS +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read More + + +
+
+
+
+

December 26, 2025

+ NEWS +
+
+

WVSU-CICT Presents Tech Solutions at ICC 2025 in Taiwan

+ + Read More + + +
+
+
+
+ + {/* About Section */} +
+ +
+

ABOUT.

+

Founded in 2002 under BOR Resolution No. 34, the College of Information and Communications Technology (CICT) began as the Institute of Information and Communications Technology (IICT) and launched the BS in Information Technology (BSIT) and BS in Information Management (BSIM) programs in AY 2002-2003, producing its first graduates soon after.

+
+ +
+

MISSION.

+

The WVSU-CICT aims to develop professionals who shall be able to meet the growing manpower demand by expanding the ICT industries in the country. Being the lead institution of higher learning in Western Visayas.

+
+ +
+

VISION.

+

To be the leading provider of ICT education in Western Visayas, aligned with the broader mandate of WVSU as the lead institution of higher learning in the region.

+
+
+ + {/* Why Choose Us Section */} +
+

Why Choose Us?

+
+ +

ACCREDITATIONS

+
+
+ +

NATIONAL RANKINGS

+
+
+ +

INTERNATIONAL RELATIONS

+
+
+ +

COMPETITION RECOGNITIONS

+
+
+ +

INTERNATIONAL ENGAGEMENTS

+
+
+ + {/* Offered Programs Section */} +
+

INTERESTED IN THE COLLEGE? SEE WHAT
WE OFFER IN THE TABLE

+
+
+

Offered Programs

+ + Explore All + + +
+
+
+
+ +

BSEMC

+
+
+ +

BSCS

+
+
+ +

BLIS

+
+
+ +

BSIS

+
+
+ +

BSIT

+
+
+ +

MIT

+
+
+
+
+
+ + {/* Testimonial Cards Section */} +
+ +
+ + {/* Contact Us Section */} +
+

Finding quality education is hard.
We make it easy.

+ + CONTACT US + + +
); } diff --git a/src/components/TestimonialCards.tsx b/src/components/TestimonialCards.tsx new file mode 100644 index 0000000..19e4444 --- /dev/null +++ b/src/components/TestimonialCards.tsx @@ -0,0 +1,357 @@ +"use client"; +import { useEffect, useRef, useState, useCallback } from "react"; +import gsap from "gsap"; + +interface Testimony { + testimony: string; + name: string; + position: string; + batch: string; + company: string; +} + +const testimonies: Testimony[] = [ + { + testimony: + "CICT became my springboard to relevance—pushing me to compete with my own potential. Beyond honing my skillset, it shaped how I see the world, grounding me in real societal and industry needs; and challenging the status quo as I build exciting projects in innovating business processes and contributing meaningfully to our digital transformation.", + name: "HSIEN-NA T. KUO", + position: "Product Manager", + batch: "Batch Oracle - Class of 2025", + company: "Hoversight AI", + }, + { + testimony: + "Thank you CICT for an unforgettable college journey. Beyond the knowledge and skills I gained, It gave me the chance to meet incredible classmates. Together, we sharpened our skills through teamwork, late nights, and shared goals. I'm truly grateful for the environment that helped shape both my career and the friendships I'll carry forward.", + name: "Jasper Nillos", + position: "Firmware Engineer", + batch: "Batch Oracle - Class of 2025", + company: "Lexmark | Xerox", + }, + { + testimony: + "WVSU-CICT merged my academic workload with the hands-on challenges of extracurricular activities. This balance taught me how to solve technical and theoretical problems while effectively managing team dynamics as I would in the workforce. Navigating both worlds shaped me into the versatile and disciplined person I am today.", + name: "Von Ashley Chichirita", + position: "Data Analyst", + batch: "Batch Oracle - Class of 2025", + company: "XtendOps", + }, +]; + +// Stack offsets for cards at each depth position (0 = top) +function getStackOffset(depth: number) { + if (depth === 0) return { rot: 0, x: 0, y: 0 }; + if (depth === 1) return { rot: -4, x: -6, y: 4 }; + if (depth === 2) return { rot: 6, x: 8, y: 8 }; + // Hidden — parked far below + return { rot: 0, x: 0, y: 80 }; +} + +function CardFace({ exp }: { exp: Testimony }) { + return ( +
+

+ {exp.batch} +

+ +
+

+ "{exp.testimony}" +

+
+
+ + +
+

+ {exp.name} +

+ +

+ {exp.position} +

+
+
+
+ ); +} + +const DRAG_THRESHOLD = 6; +const SWIPE_THRESHOLD = 80; +const TILT_FACTOR = 0.05; +const FLY_DURATION = 0.75; +const SETTLE_DURATION = 0.55; // duration for cards to rotate into new stack positions + +function SwipeStack() { + const total = testimonies.length; + + // cardRefs[i] points to the DOM node for testimony[i] + const cardRefs = useRef<(HTMLDivElement | null)[]>(Array(total).fill(null)); + + // order[i] = depth position of card i (0 = top, 1 = second, etc.) + // Initially card 0 is on top, card 1 is second, card 2 is third + const order = useRef(testimonies.map((_, i) => i)); + + const [topCard, setTopCard] = useState(0); // index of the card currently on top + const [finished, setFinished] = useState(false); + const dismissing = useRef(false); // prevent double-dismiss + + const drag = useRef({ + active: false, + didDrag: false, + startX: 0, + startY: 0, + currentX: 0, + currentY: 0, + }); + + // Apply stack positions to all cards via GSAP + const applyStackPositions = useCallback((skipIndex?: number, duration = SETTLE_DURATION) => { + const remaining = total - dismissCount.current; + order.current.forEach((depth, i) => { + if (i === skipIndex) return; + const el = cardRefs.current[i]; + if (!el) return; + const { rot, x, y } = getStackOffset(depth); + const isVisible = depth < remaining; // only show as many cards as are left + gsap.to(el, { + x, y, + rotation: rot, + zIndex: total - depth, + opacity: isVisible ? 1 : 0, + duration, + ease: "power2.out", + }); + }); + }, [total]); + + // Set initial positions on mount + useEffect(() => { + applyStackPositions(undefined, 0); // instant, no animation + }, []); + + // Find which card index is currently at depth 0 (on top) + const getTopCardIndex = useCallback(() => { + return order.current.indexOf(0); + }, []); + + // Advance stack — rotate order positions + const advanceStack = useCallback(() => { + // Move the old top card to the bottom (depth = total - 1), shift everything else up + order.current = order.current.map((depth) => + depth === 0 ? total - 1 : depth - 1 + ); + const newTop = getTopCardIndex(); + setTopCard(newTop); + return newTop; + }, [total, getTopCardIndex]); + + const dismiss = useCallback((dirX: number, dirY: number) => { + if (dismissing.current) return; + dismissing.current = true; + + const topIdx = getTopCardIndex(); + const el = cardRefs.current[topIdx]; + if (!el) return; + + const flyX = dirX * (window.innerWidth * 1.3); + const flyY = dirY * 150 + (Math.random() - 0.5) * 100; + const rot = dirX * (15 + Math.random() * 10); + + // Fly the top card off + gsap.to(el, { + x: flyX, y: flyY, rotation: rot, opacity: 0, + duration: FLY_DURATION, + ease: "power2.inOut", + onComplete: () => { + // Advance stack order + advanceStack(); + + // Smoothly rotate the flown card back to straight and park it at the bottom + const { x, y, rot: stackRot } = getStackOffset(total - 1); + gsap.to(el, { + x, y, rotation: stackRot, opacity: 0, // keep hidden at bottom + duration: SETTLE_DURATION, + ease: "power2.out", + onComplete: () => { + dismissing.current = false; + + // Check if all cards have been seen + // "seen" means the current top card has looped around once + // We track this by checking if we've dismissed all cards + }, + }); + + // Shift the other cards into their new positions + applyStackPositions(topIdx); + }, + }); + }, [getTopCardIndex, advanceStack, applyStackPositions, total]); + + // Track how many cards have been dismissed + const dismissCount = useRef(0); + + const handleDismiss = useCallback((dirX: number, dirY: number) => { + dismissCount.current += 1; + if (dismissCount.current >= total) { + // All cards seen — after fly-off, show finished state + const topIdx = getTopCardIndex(); + const el = cardRefs.current[topIdx]; + if (!el) return; + + const flyX = dirX * (window.innerWidth * 1.3); + const flyY = dirY * 150 + (Math.random() - 0.5) * 100; + const rot = dirX * (15 + Math.random() * 10); + + gsap.to(el, { + x: flyX, y: flyY, rotation: rot, opacity: 0, + duration: FLY_DURATION, + ease: "power2.inOut", + onComplete: () => setFinished(true), + }); + return; + } + dismiss(dirX, dirY); + }, [dismiss, getTopCardIndex, total]); + + const resetCard = useCallback(() => { + const topIdx = getTopCardIndex(); + const el = cardRefs.current[topIdx]; + if (!el) return; + gsap.to(el, { + x: 0, y: 0, rotation: 0, + duration: 0.5, ease: "elastic.out(1, 0.6)", + }); + }, [getTopCardIndex]); + + const handleReset = useCallback(() => { + dismissCount.current = 0; + dismissing.current = false; + order.current = testimonies.map((_, i) => i); + setTopCard(0); + setFinished(false); + // Re-apply initial positions instantly + setTimeout(() => applyStackPositions(undefined, 0.3), 50); + }, [applyStackPositions]); + + // --- Pointer handlers (only active for the top card) --- + const onPointerDown = (e: React.PointerEvent) => { + if (dismissing.current) return; + e.currentTarget.setPointerCapture(e.pointerId); + drag.current = { + active: true, didDrag: false, + startX: e.clientX, startY: e.clientY, + currentX: e.clientX, currentY: e.clientY, + }; + }; + + const onPointerMove = (e: React.PointerEvent) => { + if (!drag.current.active) return; + const topIdx = getTopCardIndex(); + const el = cardRefs.current[topIdx]; + if (!el) return; + const dx = e.clientX - drag.current.startX; + const dy = e.clientY - drag.current.startY; + if (Math.hypot(dx, dy) > DRAG_THRESHOLD) drag.current.didDrag = true; + drag.current.currentX = e.clientX; + drag.current.currentY = e.clientY; + gsap.to(el, { + x: dx, y: dy, rotation: dx * TILT_FACTOR, + duration: 0.08, ease: "none", overwrite: true, + }); + }; + + const onPointerUp = () => { + if (!drag.current.active) return; + drag.current.active = false; + const dx = drag.current.currentX - drag.current.startX; + const dy = drag.current.currentY - drag.current.startY; + const dist = Math.hypot(dx, dy); + if (!drag.current.didDrag) { + handleDismiss(1, -0.2); + } else if (dist >= SWIPE_THRESHOLD) { + handleDismiss(dx / dist, dy / dist); + } else { + resetCard(); + } + }; + + if (finished) { + return ( +
+ +
+ ); + } + + return ( +
+ {testimonies.map((exp, i) => ( +
{ cardRefs.current[i] = el; }} + className="absolute inset-0 w-full h-full rounded-4xl" + style={{ + overflow: "hidden", + boxShadow: "0px 8px 24px rgba(0,0,0,0.5)", + // Only the top card gets pointer events + cursor: i === topCard ? "grab" : "default", + touchAction: "none", + willChange: "transform", + pointerEvents: i === topCard ? "auto" : "none", + }} + onPointerDown={i === topCard ? onPointerDown : undefined} + onPointerMove={i === topCard ? onPointerMove : undefined} + onPointerUp={i === topCard ? onPointerUp : undefined} + > + +
+ ))} +
+ ); +} + +export default function TestimonialCards() { + return ( +
+ {/* Section heading */} +

+ STUDENT LIFE AND{" "} + COMMUNITY. +

+ + {/* Card stack — centered */} +
+ +
+
+ ); +} \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json index 7663d6c..c1a1454 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -13,7 +13,7 @@ "incremental": true, "module": "esnext", "esModuleInterop": true, - "moduleResolution": "node", + "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, "jsx": "react-jsx",