Hugging Face's logo

Spaces:
TDAC
/
README
Running

App Files Community
daahfa commited on
Commit
08776da
·
verified ·
1 Parent(s): a360c1b

Create index.html

Browse files
Files changed (1) hide show
  1. index.html +259 -0
index.html ADDED
@@ -0,0 +1,259 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ <!DOCTYPE html>
3
+ <html lang="en">
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>TDAC — Hugging Face Organization Card</title>
8
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css">
9
+ <style>
10
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
11
+
12
+ body {
13
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
14
+ background: #f3f4f6;
15
+ min-height: 100vh;
16
+ display: flex;
17
+ align-items: center;
18
+ justify-content: center;
19
+ padding: 2rem 1rem;
20
+ }
21
+
22
+ .card {
23
+ width: 100%;
24
+ max-width: 560px;
25
+ background: #ffffff;
26
+ border: 0.5px solid rgba(0,0,0,0.12);
27
+ border-radius: 12px;
28
+ overflow: hidden;
29
+ font-family: inherit;
30
+ }
31
+
32
+ .card-header {
33
+ background: #1a3a5c;
34
+ padding: 1.5rem 1.5rem 1rem;
35
+ }
36
+
37
+ .header-top {
38
+ display: flex;
39
+ align-items: center;
40
+ gap: 14px;
41
+ }
42
+
43
+ .emblem {
44
+ width: 56px;
45
+ height: 56px;
46
+ border-radius: 10px;
47
+ background: #fff;
48
+ display: flex;
49
+ align-items: center;
50
+ justify-content: center;
51
+ flex-shrink: 0;
52
+ border: 2px solid rgba(255,255,255,0.25);
53
+ }
54
+
55
+ .org-name {
56
+ font-size: 18px;
57
+ font-weight: 500;
58
+ color: #fff;
59
+ line-height: 1.2;
60
+ }
61
+
62
+ .org-sub {
63
+ font-size: 13px;
64
+ color: rgba(255,255,255,0.65);
65
+ margin-top: 3px;
66
+ letter-spacing: 0.02em;
67
+ }
68
+
69
+ .tags {
70
+ display: flex;
71
+ gap: 8px;
72
+ margin-top: 14px;
73
+ flex-wrap: wrap;
74
+ }
75
+
76
+ .tag {
77
+ font-size: 11px;
78
+ border-radius: 4px;
79
+ padding: 3px 9px;
80
+ }
81
+
82
+ .tag-gold {
83
+ background: rgba(212,175,55,0.18);
84
+ color: #d4af37;
85
+ border: 0.5px solid rgba(212,175,55,0.4);
86
+ }
87
+
88
+ .tag-light {
89
+ background: rgba(255,255,255,0.1);
90
+ color: rgba(255,255,255,0.75);
91
+ border: 0.5px solid rgba(255,255,255,0.2);
92
+ }
93
+
94
+ .card-body {
95
+ padding: 1.25rem 1.5rem;
96
+ border-bottom: 0.5px solid rgba(0,0,0,0.08);
97
+ }
98
+
99
+ .card-body p {
100
+ font-size: 14px;
101
+ color: #555;
102
+ line-height: 1.6;
103
+ }
104
+
105
+ .card-meta {
106
+ padding: 1rem 1.5rem;
107
+ display: grid;
108
+ grid-template-columns: 1fr 1fr;
109
+ gap: 10px;
110
+ border-bottom: 0.5px solid rgba(0,0,0,0.08);
111
+ }
112
+
113
+ .meta-box {
114
+ background: #f9f9f8;
115
+ border-radius: 8px;
116
+ padding: 0.75rem 1rem;
117
+ }
118
+
119
+ .meta-label {
120
+ font-size: 11px;
121
+ color: #999;
122
+ text-transform: uppercase;
123
+ letter-spacing: 0.06em;
124
+ margin-bottom: 4px;
125
+ }
126
+
127
+ .meta-value {
128
+ font-size: 13px;
129
+ color: #1a1a1a;
130
+ font-weight: 500;
131
+ }
132
+
133
+ .card-competencies {
134
+ padding: 1rem 1.5rem;
135
+ border-bottom: 0.5px solid rgba(0,0,0,0.08);
136
+ }
137
+
138
+ .section-label {
139
+ font-size: 11px;
140
+ color: #999;
141
+ text-transform: uppercase;
142
+ letter-spacing: 0.06em;
143
+ margin-bottom: 10px;
144
+ }
145
+
146
+ .pills {
147
+ display: flex;
148
+ flex-wrap: wrap;
149
+ gap: 6px;
150
+ }
151
+
152
+ .pill {
153
+ font-size: 12px;
154
+ background: #e8f0fb;
155
+ color: #1a5cb8;
156
+ padding: 4px 10px;
157
+ border-radius: 20px;
158
+ display: flex;
159
+ align-items: center;
160
+ gap: 4px;
161
+ }
162
+
163
+ .pill i {
164
+ font-size: 12px;
165
+ }
166
+
167
+ .card-footer {
168
+ padding: 1rem 1.5rem;
169
+ display: flex;
170
+ align-items: center;
171
+ justify-content: space-between;
172
+ flex-wrap: wrap;
173
+ gap: 10px;
174
+ }
175
+
176
+ .footer-item {
177
+ display: flex;
178
+ align-items: center;
179
+ gap: 6px;
180
+ font-size: 13px;
181
+ color: #666;
182
+ }
183
+
184
+ .footer-item i {
185
+ font-size: 14px;
186
+ }
187
+
188
+ .footer-item a {
189
+ color: #1a5cb8;
190
+ text-decoration: none;
191
+ }
192
+
193
+ .footer-item a:hover {
194
+ text-decoration: underline;
195
+ }
196
+ </style>
197
+ </head>
198
+ <body>
199
+ <div class="card">
200
+
201
+ <div class="card-header">
202
+ <div class="header-top">
203
+ <div class="emblem">
204
+ <svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
205
+ <polygon points="18,3 33,12 33,24 18,33 3,24 3,12" fill="#1a3a5c" stroke="#b8860b" stroke-width="2"/>
206
+ <polygon points="18,8 28,14 28,22 18,28 8,22 8,14" fill="none" stroke="#d4af37" stroke-width="1.2"/>
207
+ <text x="18" y="22" text-anchor="middle" font-size="9" font-weight="700" fill="#d4af37" font-family="Georgia,serif">TDAC</text>
208
+ </svg>
209
+ </div>
210
+ <div>
211
+ <div class="org-name">Transformation Decision Analysis Center</div>
212
+ <div class="org-sub">TDAC · U.S. Army</div>
213
+ </div>
214
+ </div>
215
+ <div class="tags">
216
+ <span class="tag tag-gold">Government</span>
217
+ <span class="tag tag-light">Formations Analysis</span>
218
+ <span class="tag tag-light">Systems Analysis</span>
219
+ <span class="tag tag-light">Operations Research</span>
220
+ </div>
221
+ </div>
222
+
223
+ <div class="card-body">
224
+ <p>Lead, conduct, and deliver relevant, credible, objective, and timely analysis in support of Army decision needs. TDAC serves as the premier source for all-domain Army analysis products informing system design, fielding, and operations decisions.</p>
225
+ </div>
226
+
227
+ <div class="card-meta">
228
+ <div class="meta-box">
229
+ <div class="meta-label">Three-star Command</div>
230
+ <div class="meta-value">Future &amp; Concepts Command</div>
231
+ </div>
232
+ <div class="meta-box">
233
+ <div class="meta-label">Four-star Command</div>
234
+ <div class="meta-value">U.S. Army Transformation &amp; Training Command</div>
235
+ </div>
236
+ </div>
237
+
238
+ <div class="card-competencies">
239
+ <div class="section-label">Core competencies</div>
240
+ <div class="pills">
241
+ <span class="pill"><i class="ti ti-chart-line"></i>Formation Effectiveness</span>
242
+ <span class="pill"><i class="ti ti-chart-line"></i>Systems Performance</span>
243
+ <span class="pill"><i class="ti ti-topology-star"></i>Modeling &amp; Simulation</span>
244
+ <span class="pill"><i class="ti ti-map-2"></i>Scenario Development</span>
245
+ <span class="pill"><i class="ti ti-shield-check"></i>Cyber Resilience &amp; Electronic Warfare</span>
246
+ <span class="pill"><i class="ti ti-users"></i>Human Systems Integration</span>
247
+ </div>
248
+ </div>
249
+
250
+ <div class="card-footer">
251
+ <div class="footer-item">
252
+ <i class="ti ti-external-link"></i>
253
+ <a href="https://www.army.mil/TDAC" target="_blank" rel="noopener">army.mil/TDAC</a>
254
+ </div>
255
+ </div>
256
+
257
+ </div>
258
+ </body>
259
+ </html>