Hugging Face's logo

Spaces:
ND18
/
PTO
Running

App Files Community
ND18 commited on
Commit
1eb42eb
·
verified ·
1 Parent(s): 72757d8

Upload 3 files

Browse files
Files changed (4) hide show
  1. .gitattributes +1 -0
  2. index.html +95 -0
  3. logo.png +3 -0
  4. style.css +183 -0
.gitattributes CHANGED
@@ -33,3 +33,4 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
33
  *.zip filter=lfs diff=lfs merge=lfs -text
34
  *.zst filter=lfs diff=lfs merge=lfs -text
35
  *tfevents* filter=lfs diff=lfs merge=lfs -text
 
 
33
  *.zip filter=lfs diff=lfs merge=lfs -text
34
  *.zst filter=lfs diff=lfs merge=lfs -text
35
  *tfevents* filter=lfs diff=lfs merge=lfs -text
36
+ logo.png filter=lfs diff=lfs merge=lfs -text
index.html ADDED
@@ -0,0 +1,95 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>PlayTheOffer</title>
7
+ <link rel="stylesheet" href="style.css" />
8
+ </head>
9
+
10
+ <body>
11
+ <div class="page">
12
+
13
+ <!-- Hero -->
14
+ <section class="hero">
15
+ <div class="logo">
16
+ <img src="logo.png" alt="PlayTheOffer logo" />
17
+ </div>
18
+ <p class="subtitle">PlayTheOffer</p>
19
+
20
+ <h1>
21
+ Interviews aren’t conversations.<br />
22
+ They’re a game.
23
+ </h1>
24
+
25
+ <p class="description">
26
+ Learn the hidden rules of hiring through realistic interview simulations
27
+ and strategic feedback.
28
+ </p>
29
+
30
+ <div class="buttons">
31
+ <button class="btn primary">Join the Waitlist</button>
32
+ <button class="btn secondary">Learn More</button>
33
+ </div>
34
+ </section>
35
+
36
+ <!-- Problem -->
37
+ <section class="grid-section">
38
+ <div class="grid">
39
+
40
+ <div class="card">
41
+ <h3>Unpredictable</h3>
42
+ <p>Students don’t understand what recruiters actually evaluate.</p>
43
+ </div>
44
+
45
+ <div class="card">
46
+ <h3>Unrealistic</h3>
47
+ <p>Most interview preparation is generic and theoretical.</p>
48
+ </div>
49
+
50
+ <div class="card">
51
+ <h3>Stressful</h3>
52
+ <p>Even strong candidates struggle under interview pressure.</p>
53
+ </div>
54
+
55
+ </div>
56
+ </section>
57
+
58
+ <!-- Solution -->
59
+ <section class="center-section">
60
+ <h2>Train like it’s the real interview.</h2>
61
+
62
+ <div class="grid">
63
+ <div class="card">
64
+ <h3>Mock Interviews</h3>
65
+ <p>Practice with realistic interview scenarios.</p>
66
+ </div>
67
+
68
+ <div class="card">
69
+ <h3>Strategic Feedback</h3>
70
+ <p>Understand recruiter expectations and communication mistakes.</p>
71
+ </div>
72
+
73
+ <div class="card">
74
+ <h3>Performance Scoring</h3>
75
+ <p>Measure confidence, clarity, and structure.</p>
76
+ </div>
77
+ </div>
78
+ </section>
79
+
80
+ <!-- CTA -->
81
+ <section class="cta">
82
+ <div class="cta-box">
83
+ <h2>Get interview-ready.</h2>
84
+ <p>Join the first students testing PlayTheOffer.</p>
85
+
86
+ <div class="cta-form">
87
+ <input type="email" placeholder="Enter your email" />
88
+ <button>Join Waitlist</button>
89
+ </div>
90
+ </div>
91
+ </section>
92
+
93
+ </div>
94
+ </body>
95
+ </html>
logo.png ADDED

Git LFS Details

  • SHA256: 2145cbfd9bb9fff1b68f021f01f8d4b3fe593c6c1db53587ded688fc35490c65
  • Pointer size: 132 Bytes
  • Size of remote file: 1.52 MB
style.css ADDED
@@ -0,0 +1,183 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ margin: 0;
3
+ font-family: Arial, sans-serif;
4
+ background: black;
5
+ color: white;
6
+ }
7
+
8
+ .page {
9
+ min-height: 100vh;
10
+ }
11
+
12
+ /* HERO */
13
+ .hero {
14
+ text-align: center;
15
+ padding: 120px 20px;
16
+ }
17
+
18
+ .subtitle {
19
+ text-transform: uppercase;
20
+ letter-spacing: 0.3em;
21
+ font-size: 12px;
22
+ color: gray;
23
+ margin-bottom: 20px;
24
+ }
25
+
26
+ .hero h1 {
27
+ font-size: 48px;
28
+ font-weight: bold;
29
+ max-width: 900px;
30
+ margin: auto;
31
+ line-height: 1.2;
32
+ }
33
+
34
+ .description {
35
+ color: gray;
36
+ font-size: 18px;
37
+ max-width: 700px;
38
+ margin: 30px auto;
39
+ }
40
+
41
+ /* BUTTONS */
42
+ .buttons {
43
+ display: flex;
44
+ gap: 15px;
45
+ justify-content: center;
46
+ flex-wrap: wrap;
47
+ }
48
+
49
+ .btn {
50
+ padding: 15px 30px;
51
+ border-radius: 18px;
52
+ font-weight: bold;
53
+ cursor: pointer;
54
+ transition: 0.2s;
55
+ border: none;
56
+ }
57
+
58
+ .primary {
59
+ background: white;
60
+ color: black;
61
+ }
62
+
63
+ .secondary {
64
+ background: transparent;
65
+ color: white;
66
+ border: 1px solid gray;
67
+ }
68
+
69
+ .btn:hover {
70
+ transform: scale(1.05);
71
+ }
72
+
73
+ /* GRID SECTIONS */
74
+ .grid-section,
75
+ .center-section {
76
+ padding: 80px 20px;
77
+ max-width: 1100px;
78
+ margin: auto;
79
+ }
80
+
81
+ .center-section {
82
+ text-align: center;
83
+ }
84
+
85
+ .center-section h2 {
86
+ font-size: 36px;
87
+ margin-bottom: 40px;
88
+ }
89
+
90
+ /* GRID */
91
+ .grid {
92
+ display: grid;
93
+ grid-template-columns: repeat(3, 1fr);
94
+ gap: 20px;
95
+ }
96
+
97
+ /* CARDS */
98
+ .card {
99
+ background: #181818;
100
+ padding: 30px;
101
+ border-radius: 24px;
102
+ }
103
+
104
+ .card h3 {
105
+ margin-bottom: 10px;
106
+ font-size: 20px;
107
+ }
108
+
109
+ .card p {
110
+ color: gray;
111
+ }
112
+
113
+ /* CTA */
114
+ .cta {
115
+ padding: 100px 20px;
116
+ text-align: center;
117
+ }
118
+
119
+ .cta-box {
120
+ background: white;
121
+ color: black;
122
+ padding: 60px;
123
+ border-radius: 32px;
124
+ max-width: 800px;
125
+ margin: auto;
126
+ }
127
+
128
+ .cta-box h2 {
129
+ font-size: 36px;
130
+ }
131
+
132
+ .cta-box p {
133
+ color: #444;
134
+ margin-bottom: 30px;
135
+ }
136
+
137
+ .cta-form {
138
+ display: flex;
139
+ gap: 10px;
140
+ justify-content: center;
141
+ flex-wrap: wrap;
142
+ }
143
+
144
+ .cta-form input {
145
+ padding: 15px;
146
+ border-radius: 18px;
147
+ border: 1px solid #ccc;
148
+ width: 250px;
149
+ }
150
+
151
+ .cta-form button {
152
+ padding: 15px 25px;
153
+ border-radius: 18px;
154
+ background: black;
155
+ color: white;
156
+ border: none;
157
+ cursor: pointer;
158
+ }
159
+
160
+ .cta-form button:hover {
161
+ transform: scale(1.05);
162
+ }
163
+
164
+ /* RESPONSIVE */
165
+ @media (max-width: 768px) {
166
+ .hero h1 {
167
+ font-size: 32px;
168
+ }
169
+
170
+ .grid {
171
+ grid-template-columns: 1fr;
172
+ }
173
+ }
174
+
175
+ .logo {
176
+ margin-bottom: 20px;
177
+ }
178
+
179
+ .logo img {
180
+ width: 120px;
181
+ height: auto;
182
+ object-fit: contain;
183
+ }