diff --git a/package-lock.json b/package-lock.json index c5098011..7e2b0e72 100644 --- a/package-lock.json +++ b/package-lock.json @@ -119,6 +119,7 @@ "version": "7.24.6", "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.6.tgz", "integrity": "sha512-qAHSfAdVyFmIvl0VHELib8xar7ONuSHrE2hLnsaWkYNTI68dmi1x8GYDhJjMI/e7XWal9QBlZkwbOnkcw7Z8gQ==", + "peer": true, "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.24.6", @@ -675,6 +676,7 @@ "version": "1.2.2", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz", "integrity": "sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==", + "peer": true, "dependencies": { "@emotion/memoize": "^0.8.1" } @@ -688,6 +690,7 @@ "version": "11.11.4", "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.11.4.tgz", "integrity": "sha512-t8AjMlF0gHpvvxk5mAtCqR4vmxiGHCeJBaQO6gncUSdklELOgtwjerNY2yuJNfwnc6vi16U/+uMF+afIawJ9iw==", + "peer": true, "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.11.0", @@ -728,6 +731,7 @@ "version": "11.11.5", "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.11.5.tgz", "integrity": "sha512-/ZjjnaNKvuMPxcIiUkf/9SHoG4Q196DRl1w82hQ3WCsjo1IUR8uaGWrC6a87CrYAW0Kb/pK7hk8BnLgLRi9KoQ==", + "peer": true, "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.11.0", @@ -1270,6 +1274,7 @@ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz", "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==", "hasInstallScript": true, + "peer": true, "dependencies": { "@fortawesome/fontawesome-common-types": "6.5.2" }, @@ -2113,6 +2118,7 @@ "version": "5.15.20", "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.20.tgz", "integrity": "sha512-tVq3l4qoXx/NxUgIx/x3lZiPn/5xDbdTE8VrLczNpfblLYZzlrbxA7kb9mI8NoBF6+w9WE9IrxWnKK5KlPI2bg==", + "peer": true, "dependencies": { "@babel/runtime": "^7.23.9", "@mui/base": "5.0.0-beta.40", @@ -3138,6 +3144,7 @@ "version": "18.3.3", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.3.tgz", "integrity": "sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw==", + "peer": true, "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -3312,6 +3319,7 @@ "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz", "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==", "dev": true, + "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -3914,7 +3922,8 @@ "node_modules/blurhash": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/blurhash/-/blurhash-2.0.5.tgz", - "integrity": "sha512-cRygWd7kGBQO3VEhPiTgq4Wc43ctsM+o46urrmPOiuAe+07fzlSB9OJVdpgDL0jPqXUVQ9ht7aq7kxOeJHRK+w==" + "integrity": "sha512-cRygWd7kGBQO3VEhPiTgq4Wc43ctsM+o46urrmPOiuAe+07fzlSB9OJVdpgDL0jPqXUVQ9ht7aq7kxOeJHRK+w==", + "peer": true }, "node_modules/boxen": { "version": "7.1.1", @@ -4055,6 +4064,7 @@ "url": "https://github.com/sponsors/ai" } ], + "peer": true, "dependencies": { "caniuse-lite": "^1.0.30001587", "electron-to-chromium": "^1.4.668", @@ -4704,7 +4714,8 @@ "node_modules/csstype": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", + "peer": true }, "node_modules/data-view-buffer": { "version": "1.0.1", @@ -5300,6 +5311,7 @@ "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz", "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==", "dev": true, + "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", @@ -10958,6 +10970,7 @@ "version": "18.3.1", "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "peer": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -11059,6 +11072,7 @@ "version": "18.3.1", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "peer": true, "dependencies": { "loose-envify": "^1.1.0", "scheduler": "^0.23.2" @@ -11279,6 +11293,7 @@ "version": "6.23.1", "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.23.1.tgz", "integrity": "sha512-utP+K+aSTtEdbWpC+4gxhdlPFwuEfDKq8ZrPFU65bbRJY+l706qjR7yaidBpo3MSeA/fzwbXWbKBI6ftOnP3OQ==", + "peer": true, "dependencies": { "@remix-run/router": "1.16.1", "react-router": "6.23.1" @@ -11913,6 +11928,7 @@ "version": "1.77.2", "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.2.tgz", "integrity": "sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==", + "peer": true, "dependencies": { "chokidar": ">=3.0.0 <4.0.0", "immutable": "^4.0.0", @@ -13027,6 +13043,7 @@ "integrity": "sha512-qO3aKv3HoQC8QKiNSTuUM1l9o/XX3+c+VTgLHbJWHZGeTPVAg2XwazI9UWzoxjIJCGCV2zU60uqMzjeLZuULqA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "esbuild": "^0.21.3", "postcss": "^8.4.43", diff --git a/src/pages/Team/Team.jsx b/src/pages/Team/Team.jsx index ce4e195c..c8eb0ff7 100644 --- a/src/pages/Team/Team.jsx +++ b/src/pages/Team/Team.jsx @@ -275,6 +275,40 @@ const Team = () => { Creative group, the Technical group, and the Operations group.

+
+ +
+
+ picture of FIC +
+
+

DR. VISHAL PRADHAN

+

FACULTY IN CHARGE

+ + {/*
+

+ Dr. Vishal Pradhan is an exceptional academician and researcher at KIIT, + known for his clarity of thought, deep subject expertise, and commitment + to student success. His ability to connect advanced concepts with real-world + applications makes him a truly inspiring educator. +

+
*/} + +
+

+ "As FIC of FED, my vision is to ignite curiosity, nurture confidence, + and inspire students to rise beyond limits—so they walk into KIIT as + learners and grow into innovators who shape the world." --- Dr. Vishal Pradhan +

+
+ +
+
+
+
{/*
*/} diff --git a/src/pages/Team/styles/Team.module.scss b/src/pages/Team/styles/Team.module.scss index e20c3e79..2989482d 100644 --- a/src/pages/Team/styles/Team.module.scss +++ b/src/pages/Team/styles/Team.module.scss @@ -145,6 +145,139 @@ strong { left: 0; } +//* Outer dark box */ +.FICwrapper { + background: #0d0d0d; /* same as TEAM page background */ + padding: 50px; + border-radius: 20px; + max-width: 1150px; + min-height: 220px; + margin: 30px auto; + box-shadow: 0 0 40px rgba(0, 0, 0, 0.4); + +} + +/* Grid layout */ +.FICsection { + display: grid; + grid-template-columns: 300px 1fr; + gap: 50px; + align-items: center; +} + +/* Left Image */ + .image img { + display: flex; + justify-content: center; /* centers horizontally */ + align-items: center; + width: 180px; + height: 180px; + border-radius: 0%; + object-fit: cover; + box-shadow: 0 10px 40px rgba(255, 138, 0, 0.2); + border: 3px solid rgba(255, 138, 0, 0.4); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.FICsection .image img:hover { + transform: scale(1.05); + box-shadow: 0 15px 60px rgba(255, 138, 0, 0.4); +} + +/* Text Block */ +.textBlock { + text-align: left; /* ensures all text aligns left */ +} + +/* Name */ +.name { + font-size: 32px; + font-weight: 800; + color: #FF8A00; + margin: 0; +} + +/* Role title */ +.role { + font-size: 14px; + font-weight: 600; + letter-spacing: 2px; + color: #FF8A00; + margin-top: 8px; + text-transform: uppercase; +} + +/* Intro & Vision */ +.intro, +.vision { + margin-top: 25px; + font-style: italic +} + +.intro p, +.vision p { + font-size: 16px; + line-height: 1.8; + color: #e0e0e0; + margin: 0; +} + +/* Responsive */ +@media (max-width: 768px) { + .FICsection { + grid-template-columns: 1fr; + text-align: left; + } + + .FICsection .image { + margin-bottom: 20px; + } + + .FICsection .image img { + width: 220px; + height: 220px; + } + + .name { + font-size: 26px; + } +} + +@media (max-width: 480px) { + .FICwrapper { + max-width: 350px; + } + + .FICsection { + grid-template-columns: 1fr; + } + + .FICsection .image { + margin-bottom: 20px; + margin:0 auto; + } + + .FICsection .image img { + width: 150px; + height: 150px; + text-align: center; + } + + .vision { + font-size: 18px; + text-align: center; + } + + .name { + font-size: 22px; + text-align: center; + } + + .role{ + text-align: center; + align-items: center; + } +} /* Responsive styles */