Skip to content

Commit 355db6c

Browse files
AdanatoAdanato
committed
Add large gif file using Git LFS
1 parent 84549b7 commit 355db6c

11 files changed

+68
-55
lines changed

‎.gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.gif filter=lfs diff=lfs merge=lfs -text

‎src/assets/content/People/People.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import feiyangKangImage from "./profile/feiyang kang.png";
77
import mahavirDabasImage from "./profile/mahavir dabas.png";
88
import adamNguyenImage from "./profile/adam nguyen.png";
99
import minzhouPanImage from "./profile/minzhou pan.png";
10-
// import tranHuynhImage from "./profile/tran huynh.png";
10+
import tranHuynhImage from "./profile/tran huynh.png";
1111

1212
export const peopleData = [
1313
{
@@ -95,7 +95,7 @@ export const peopleData = [
9595
}
9696
},
9797
{
98-
profileImage: "",
98+
profileImage: tranHuynhImage,
9999
name: "Tran Huynh",
100100
details: "Tran's research focuses on understanding the vulnerabilities of AI models and advancing the robustness of AI systems against adversarial threats.",
101101
links: {

‎src/assets/content/People/profile/tran huynh.png

187 KB
Loading

‎src/assets/content/Research/data_centric.gif

13.3 MB
Loading

‎src/assets/content/Research/privacy.webp

190 KB
Binary file not shown.

‎src/assets/content/Research/safetysecurityalignment.gif

+3
Loading

‎src/pages/DataCentricAI.tsx

+9-10
Original file line numberDiff line numberDiff line change
@@ -3,39 +3,38 @@ import { Link } from 'react-router-dom';
33
import '../styles/Research.css'; // Assuming you have this CSS file
44
import { renderPublications } from './Publications';
55
import { dataAttributionAndInfluence, dataSelection, activeLearning } from '../assets/content/Research/data-centric'
6+
import dataCentric from "../assets/content/Research/data_centric.gif"
7+
import ssaImage from "../assets/content/Research/safetysecurityalignment.gif"
8+
import privacyImage from "../assets/content/Research/privacy.webp"
9+
10+
611
const DataCentricAI: React.FC = () => {
712
return (
813
<div className="research-page">
914
<header className="research-header">
1015
<h1 className="h2">Data-Centric AI</h1>
1116
</header>
1217
<article className="research-content">
13-
<table className="research-bubble">
18+
<table className="research-bubble">
1419
<tr>
1520
<td className="rb-img">
16-
<Link to="/research/data-centric-ai">
17-
<img src="/research/website_images/data-centric-ai.gif" alt="Data-Centric AI" />
18-
</Link>
21+
<img src={dataCentric} alt="Data-Centric AI" />
1922
</td>
2023
<td className="rb-text">
2124
<Link to="/research/data-centric-ai">Better Data, Better Models</Link>
2225
</td>
2326
</tr>
2427
<tr>
2528
<td className="rb-img">
26-
<Link to="/research/safety-security-alignment">
27-
<img src="/research/website_images/safety-security-alignment.gif" alt="Safety, Security, and Alignment" />
28-
</Link>
29+
<img src={ssaImage} alt="Safety, Security, and Alignment" />
2930
</td>
3031
<td className="rb-text">
3132
<Link to="/research/safety-security-alignment">Safety, Security, and Alignment</Link>
3233
</td>
3334
</tr>
3435
<tr>
3536
<td className="rb-img">
36-
<Link to="/research/privacy">
37-
<img src="/research/website_images/privacy.gif" alt="Privacy" />
38-
</Link>
37+
<img src={privacyImage} alt="Privacy" />
3938
</td>
4039
<td className="rb-text">
4140
<Link to="/research/privacy">Privacy Risk Assessment</Link>

‎src/pages/Privacy.tsx

+7-10
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ import { Link } from 'react-router-dom';
33
import '../styles/Research.css'; // Assuming you have this CSS file
44
import { renderPublications } from './Publications.tsx';
55
import { privacyRiskAssessment, privacyPreservingLearning } from '../assets/content/Research/privacy.ts';
6+
import dataCentric from "../assets/content/Research/data_centric.gif"
7+
import ssaImage from "../assets/content/Research/safetysecurityalignment.gif"
8+
import privacyImage from "../assets/content/Research/privacy.webp"
69

710
const Privacy: React.FC = () => {
811
return (
@@ -11,32 +14,26 @@ const Privacy: React.FC = () => {
1114
<h1 className="h2">Privacy</h1>
1215
</header>
1316
<article className="research-content">
14-
<table className="research-bubble">
17+
<table className="research-bubble">
1518
<tr>
1619
<td className="rb-img">
17-
<Link to="/research/data-centric-ai">
18-
<img src="/research/website_images/data-centric-ai.gif" alt="Data-Centric AI" />
19-
</Link>
20+
<img src={dataCentric} alt="Data-Centric AI" />
2021
</td>
2122
<td className="rb-text">
2223
<Link to="/research/data-centric-ai">Better Data, Better Models</Link>
2324
</td>
2425
</tr>
2526
<tr>
2627
<td className="rb-img">
27-
<Link to="/research/safety-security-alignment">
28-
<img src="/research/website_images/safety-security-alignment.gif" alt="Safety, Security, and Alignment" />
29-
</Link>
28+
<img src={ssaImage} alt="Safety, Security, and Alignment" />
3029
</td>
3130
<td className="rb-text">
3231
<Link to="/research/safety-security-alignment">Safety, Security, and Alignment</Link>
3332
</td>
3433
</tr>
3534
<tr>
3635
<td className="rb-img">
37-
<Link to="/research/privacy">
38-
<img src="/research/website_images/privacy.gif" alt="Privacy" />
39-
</Link>
36+
<img src={privacyImage} alt="Privacy" />
4037
</td>
4138
<td className="rb-text">
4239
<Link to="/research/privacy">Privacy Risk Assessment</Link>

‎src/pages/Research.tsx

+6-10
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
import React from 'react';
33
import { Link } from 'react-router-dom';
44
import '../styles/Research.css';
5-
5+
import dataCentric from "../assets/content/Research/data_centric.gif"
6+
import ssaImage from "../assets/content/Research/safetysecurityalignment.gif"
7+
import privacyImage from "../assets/content/Research/privacy.webp"
68
const Research: React.FC = () => {
79
return (
810
<div className="research-page">
@@ -21,29 +23,23 @@ const Research: React.FC = () => {
2123
<table className="research-bubble">
2224
<tr>
2325
<td className="rb-img">
24-
<Link to="/research/data-centric-ai">
25-
<img src="/research/website_images/data-centric-ai.gif" alt="Data-Centric AI" />
26-
</Link>
26+
<img src={dataCentric} alt="Data-Centric AI" />
2727
</td>
2828
<td className="rb-text">
2929
<Link to="/research/data-centric-ai">Better Data, Better Models</Link>
3030
</td>
3131
</tr>
3232
<tr>
3333
<td className="rb-img">
34-
<Link to="/research/safety-security-alignment">
35-
<img src="/research/website_images/safety-security-alignment.gif" alt="Safety, Security, and Alignment" />
36-
</Link>
34+
<img src={ssaImage} alt="Safety, Security, and Alignment" />
3735
</td>
3836
<td className="rb-text">
3937
<Link to="/research/safety-security-alignment">Safety, Security, and Alignment</Link>
4038
</td>
4139
</tr>
4240
<tr>
4341
<td className="rb-img">
44-
<Link to="/research/privacy">
45-
<img src="/research/website_images/privacy.gif" alt="Privacy" />
46-
</Link>
42+
<img src={privacyImage} alt="Privacy" />
4743
</td>
4844
<td className="rb-text">
4945
<Link to="/research/privacy">Privacy Risk Assessment</Link>

‎src/pages/SafetySecurityAlignment.tsx

+7-10
Original file line numberDiff line numberDiff line change
@@ -4,39 +4,36 @@ import '../styles/Research.css'; // Assuming you have this CSS file
44
import { renderPublications } from './Publications';
55
import { vulnerabilityAssessment, robustness, alignment } from '../assets/content/Research/safetysecurityalignment.ts'
66

7+
import dataCentric from "../assets/content/Research/data_centric.gif"
8+
import ssaImage from "../assets/content/Research/safetysecurityalignment.gif"
9+
import privacyImage from "../assets/content/Research/privacy.webp"
710
const SafetySecurityAlignment: React.FC = () => {
811
return (
912
<div className="research-page">
1013
<header className="research-header">
1114
<h1 className="h2">Safety, Security, and Alignment</h1>
1215
</header>
1316
<article className="research-content">
14-
<table className="research-bubble">
17+
<table className="research-bubble">
1518
<tr>
1619
<td className="rb-img">
17-
<Link to="/research/data-centric-ai">
18-
<img src="/research/website_images/data-centric-ai.gif" alt="Data-Centric AI" />
19-
</Link>
20+
<img src={dataCentric} alt="Data-Centric AI" />
2021
</td>
2122
<td className="rb-text">
2223
<Link to="/research/data-centric-ai">Better Data, Better Models</Link>
2324
</td>
2425
</tr>
2526
<tr>
2627
<td className="rb-img">
27-
<Link to="/research/safety-security-alignment">
28-
<img src="/research/website_images/safety-security-alignment.gif" alt="Safety, Security, and Alignment" />
29-
</Link>
28+
<img src={ssaImage} alt="Safety, Security, and Alignment" />
3029
</td>
3130
<td className="rb-text">
3231
<Link to="/research/safety-security-alignment">Safety, Security, and Alignment</Link>
3332
</td>
3433
</tr>
3534
<tr>
3635
<td className="rb-img">
37-
<Link to="/research/privacy">
38-
<img src="/research/website_images/privacy.gif" alt="Privacy" />
39-
</Link>
36+
<img src={privacyImage} alt="Privacy" />
4037
</td>
4138
<td className="rb-text">
4239
<Link to="/research/privacy">Privacy Risk Assessment</Link>

‎src/styles/Research.css

+33-13
Original file line numberDiff line numberDiff line change
@@ -26,33 +26,53 @@
2626
box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.12);
2727
cursor: pointer;
2828
transition: background-color 0.3s;
29+
vertical-align: top;
30+
overflow: hidden;
31+
position: relative;
32+
height: 25vh; /* Adjust this value as needed */
2933
}
3034

3135
.research-bubble tr:hover {
3236
background-color: rgba(112, 173, 71, 0.12);
3337
}
3438

35-
.research-bubble tr td {
39+
.research-bubble tr td.rb-img {
3640
display: block;
41+
width: 100%;
42+
height: 100%;
43+
position: absolute;
44+
top: 0;
45+
left: 0;
3746
}
3847

39-
.research-bubble tr td.rb-img {
48+
.research-bubble tr td.rb-img img {
49+
width: 100%;
50+
height: 100%;
51+
object-fit: cover;
52+
}
53+
54+
.research-bubble tr td.rb-text {
4055
display: flex;
4156
align-items: center;
4257
justify-content: center;
43-
height: 20vh;
58+
position: absolute;
59+
top: 0;
60+
left: 0;
61+
width: 100%;
62+
height: 100%;
63+
background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */
64+
color: white;
65+
text-decoration: none;
66+
transition: opacity 0.3s;
67+
opacity: 0;
4468
}
4569

46-
.research-bubble tr td.rb-img img {
47-
height: 100%;
48-
object-fit: cover;
49-
padding-bottom: 0;
70+
.research-bubble tr:hover td.rb-text {
71+
opacity: 1;
5072
}
5173

52-
.research-bubble tr td.rb-text {
53-
display: block;
54-
height: 5vh;
55-
padding-top: 0;
56-
padding-bottom: 1vh;
57-
line-height: 1;
74+
.research-bubble tr td.rb-text a {
75+
color: white;
76+
text-decoration: none;
77+
font-weight: bold;
5878
}

0 commit comments

Comments
 (0)