Hugging Face's logo

Spaces:
faridlab
/
README
Running

App Files Community
matybohacek commited on
Commit
eb8e5e4
·
verified ·
1 Parent(s): 8f93449

Update README.md

Browse files
Files changed (1) hide show
  1. README.md +149 -1
README.md CHANGED
@@ -7,4 +7,152 @@ sdk: static
7
  pinned: false
8
  ---
9
 
10
- Edit this `README.md` markdown file to author your organization card.
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7
  pinned: false
8
  ---
9
 
10
+ <!--
11
+ Example Landing Page / README
12
+
13
+ Replace the 'href' values with the links to your actual dataset pages
14
+ and update the 'src' values to point to your images or placeholders.
15
+ -->
16
+
17
+ <!DOCTYPE html>
18
+ <html lang="en">
19
+ <head>
20
+ <meta charset="UTF-8">
21
+ <title>Lab Datasets</title>
22
+ <style>
23
+ body {
24
+ font-family: sans-serif;
25
+ margin: 20px;
26
+ padding: 0;
27
+ }
28
+
29
+ h1 {
30
+ text-align: center;
31
+ margin-bottom: 2rem;
32
+ }
33
+
34
+ /* Container that holds all categories */
35
+ .container {
36
+ max-width: 1200px;
37
+ margin: 0 auto;
38
+ padding: 0 1rem;
39
+ }
40
+
41
+ /* Each category section */
42
+ .category {
43
+ margin-bottom: 2rem;
44
+ }
45
+
46
+ .category h2 {
47
+ margin-bottom: 1rem;
48
+ }
49
+
50
+ /* The responsive grid */
51
+ .grid {
52
+ display: grid;
53
+ /* Adjust minmax as desired for your tile width */
54
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
55
+ gap: 1rem;
56
+ }
57
+
58
+ /* Each card (dataset tile) */
59
+ .card {
60
+ position: relative;
61
+ text-decoration: none;
62
+ color: #333;
63
+ border: 1px solid #ccc;
64
+ border-radius: 8px;
65
+ overflow: hidden;
66
+ }
67
+
68
+ /* Force images to be square and fill container */
69
+ .card img {
70
+ width: 100%;
71
+ display: block;
72
+ aspect-ratio: 1 / 1; /* Modern browsers only; ensures a square */
73
+ object-fit: cover;
74
+ }
75
+
76
+ /* Title overlay at bottom of image */
77
+ .card-title {
78
+ position: absolute;
79
+ bottom: 0;
80
+ width: 100%;
81
+ padding: 0.5rem;
82
+ background: rgba(255, 255, 255, 0.8);
83
+ text-align: center;
84
+ font-weight: bold;
85
+ }
86
+
87
+ /* Hover effect (optional) */
88
+ .card:hover .card-title {
89
+ background: rgba(255, 255, 255, 1);
90
+ }
91
+
92
+ /* Optional small screen adjustments */
93
+ @media (max-width: 600px) {
94
+ h1 {
95
+ font-size: 1.5rem;
96
+ }
97
+ .category h2 {
98
+ font-size: 1.2rem;
99
+ }
100
+ }
101
+ </style>
102
+ </head>
103
+ <body>
104
+
105
+ <h1>Lab Datasets</h1>
106
+ <div class="container">
107
+
108
+ <!-- Deepfakes Section -->
109
+ <div class="category">
110
+ <h2>Deepfakes</h2>
111
+ <div class="grid">
112
+ <!-- DeepSpeak v1.0 -->
113
+ <a class="card" href="https://huggingface.co/your-org/DeepSpeak-v1.0">
114
+ <img src="https://via.placeholder.com/400?text=DeepSpeak+v1.0" alt="DeepSpeak v1.0" />
115
+ <div class="card-title">DeepSpeak v1.0</div>
116
+ </a>
117
+
118
+ <!-- DeepSpeak v1.1 -->
119
+ <a class="card" href="https://huggingface.co/your-org/DeepSpeak-v1.1">
120
+ <img src="https://via.placeholder.com/400?text=DeepSpeak+v1.1" alt="DeepSpeak v1.1" />
121
+ <div class="card-title">DeepSpeak v1.1</div>
122
+ </a>
123
+
124
+ <!-- DeepSpeak v2.0 -->
125
+ <a class="card" href="https://huggingface.co/your-org/DeepSpeak-v2.0">
126
+ <img src="https://via.placeholder.com/400?text=DeepSpeak+v2.0" alt="DeepSpeak v2.0" />
127
+ <div class="card-title">DeepSpeak v2.0</div>
128
+ </a>
129
+ </div>
130
+ </div>
131
+
132
+ <!-- Text to Video Section -->
133
+ <div class="category">
134
+ <h2>Text to Video</h2>
135
+ <div class="grid">
136
+ <!-- DeepAction -->
137
+ <a class="card" href="https://huggingface.co/your-org/DeepAction">
138
+ <img src="https://via.placeholder.com/400?text=DeepAction" alt="DeepAction" />
139
+ <div class="card-title">DeepAction</div>
140
+ </a>
141
+ </div>
142
+ </div>
143
+
144
+ <!-- Membership Inference Section -->
145
+ <div class="category">
146
+ <h2>Membership Inference</h2>
147
+ <div class="grid">
148
+ <!-- STROLL -->
149
+ <a class="card" href="https://huggingface.co/your-org/STROLL">
150
+ <img src="https://via.placeholder.com/400?text=STROLL" alt="STROLL" />
151
+ <div class="card-title">STROLL</div>
152
+ </a>
153
+ </div>
154
+ </div>
155
+
156
+ </div>
157
+ </body>
158
+ </html>