Skip to content

Commit 605534c

Browse files
fatimaalizaidifatimaalizaidi
authored
Add files via upload
1 parent 638f0e5 commit 605534c

23 files changed

+1426
-101
lines changed

‎app/templates/about.html‎

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
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>Texpose - About Us</title>
7+
<link rel="stylesheet" href="/styles.css" />
8+
<link href="/responsive.css" />
9+
<link rel="stylesheet" href="/responsive.css" />
10+
<link
11+
rel="stylesheet"
12+
href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css"
13+
/>
14+
<style>
15+
.header {
16+
background: none;
17+
}
18+
* {
19+
margin: 0;
20+
padding: 0;
21+
box-sizing: border-box;
22+
}
23+
24+
body {
25+
overflow: hidden;
26+
}
27+
28+
.scroll-container {
29+
display: flex;
30+
overflow-x: hidden;
31+
scroll-snap-type: x mandatory;
32+
scroll-behavior: smooth;
33+
width: 100vw;
34+
height: 100vh;
35+
font-family: "Futura Cyrillic Light";
36+
}
37+
38+
.section {
39+
flex: 0 0 50vw;
40+
height: 100vh;
41+
display: flex;
42+
align-items: center;
43+
justify-content: center;
44+
scroll-snap-align: start;
45+
font-weight: bold;
46+
color: white;
47+
}
48+
49+
.one {
50+
background-color: black;
51+
}
52+
.two {
53+
background: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ_ICDzdvfaL8e4OtlV86xrO7iVLrDbHU_mMphDvXJpif6S2PbbzTw92GTEPzUQY4mIWpQ&usqp=CAU");
54+
} /* Blue */
55+
.three {
56+
background-color: black;
57+
}
58+
.four {
59+
background: url("https://png.pngtree.com/thumb_back/fh260/background/20220127/pngtree-gold-silver-soundwave-with-black-background-gradient-backdrop-technology-photo-image_21201810.jpg");
60+
background-repeat: none;
61+
background-size: cover;
62+
background-position: center;
63+
} /* Yellow */
64+
</style>
65+
</head>
66+
<body>
67+
<header class="header">
68+
<ul class="header-items">
69+
<li>
70+
<a
71+
href="/index.html"
72+
style="
73+
cursor: pointer;
74+
text-decoration: none;
75+
color: white;
76+
background: none;
77+
-webkit-tap-highlight-color: transparent;
78+
font-family: 'Goudy Old Style';
79+
"
80+
>
81+
<div class="subtitle">TEXPOSE</div></a
82+
>
83+
</li>
84+
<li><a style="
85+
cursor: pointer;
86+
text-decoration: none;
87+
color: white;
88+
background: none;
89+
-webkit-tap-highlight-color: transparent;
90+
" href="/story.html">Our Story</a></li>
91+
<li>
92+
<a
93+
style="
94+
cursor: pointer;
95+
text-decoration: none;
96+
color: white;
97+
background: none;
98+
-webkit-tap-highlight-color: transparent;
99+
100+
"
101+
href="/about.html"
102+
>
103+
About Us</a
104+
>
105+
</li>
106+
<li><a style="
107+
cursor: pointer;
108+
text-decoration: none;
109+
color: white;
110+
background: none;
111+
-webkit-tap-highlight-color: transparent;
112+
113+
" href="/contact.html">Contact Us</a></li>
114+
</ul>
115+
</header>
116+
<div class="scroll-container" id="scrollContainer">
117+
<div class="section one " >
118+
TEXPOSE is here to bridge the gap between human creativity and machine
119+
intelligence.
120+
</div>
121+
<div class="section two"></div>
122+
<div class="section three">
123+
Our mission is to promote authenticity, prevent misinformation, and
124+
support fair content evaluation.
125+
</div>
126+
<div class="section four"></div>
127+
<div class="section one">
128+
Whether you're a researcher, educator, or content creator, our tool
129+
helps ensure authenticity in scholarly communication.
130+
</div>
131+
</div>
132+
133+
<script>
134+
const scrollContainer = document.getElementById("scrollContainer");
135+
let scrollAmount = window.innerWidth / 2; // Half of the viewport width
136+
137+
document.addEventListener("keydown", (event) => {
138+
if (event.key === "ArrowRight") {
139+
scrollContainer.scrollBy({ left: scrollAmount, behavior: "smooth" });
140+
} else if (event.key === "ArrowLeft") {
141+
scrollContainer.scrollBy({ left: -scrollAmount, behavior: "smooth" });
142+
}
143+
});
144+
145+
</script>
146+
</body>
147+
</html>

‎app/templates/contact.html‎

Lines changed: 196 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,196 @@
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>Texpose - Contact Us</title>
7+
<link rel="stylesheet" href="styles.css">
8+
<link href="responsive.css">
9+
<style>
10+
body {
11+
background:url("/images/background.jpg");
12+
13+
background-position: center;
14+
background-size: cover;
15+
background-repeat: no-repeat;
16+
color: white;
17+
margin: 0;
18+
font-family: "Futura Cyrillic Light", sans-serif;
19+
20+
}
21+
22+
23+
24+
.page {
25+
height: 100dvh;
26+
display: flex;
27+
align-items: center;
28+
justify-content: center;
29+
flex-direction: column;
30+
width: 100%;
31+
min-height: 100vh;
32+
position: relative;
33+
}
34+
35+
.credits {
36+
position: absolute;
37+
top: 50%;
38+
left: 50%;
39+
transform: translate(-50%, -50%);
40+
max-width: 80%;
41+
}
42+
43+
@keyframes fadeUp {
44+
from {
45+
opacity: 0;
46+
transform: translateY(30px);
47+
}
48+
to {
49+
opacity: 1;
50+
transform: translateY(0);
51+
}
52+
}
53+
54+
.aos-animate, .active {
55+
opacity: 1;
56+
animation: fadeUp 1.2s ease-out forwards;
57+
}
58+
59+
input[type="text"],
60+
input[type="email"],
61+
input[type="tel"],
62+
input[type="url"] {
63+
width: 100%;
64+
border: none;
65+
border-bottom: 1px solid #fafafa;
66+
box-sizing: border-box;
67+
font-size: 1.3rem;
68+
background-color: transparent;
69+
outline: none;
70+
font-family: "Futura Cyrillic Light";
71+
font-weight: normal;
72+
text-align: center;
73+
margin: 5px 0;
74+
padding: 10px 0;
75+
color: white;
76+
}
77+
78+
input::placeholder {
79+
color: white;
80+
opacity: 1;
81+
}
82+
83+
.submit {
84+
border: none;
85+
background-color: transparent;
86+
font-size: 1.3rem;
87+
margin-top: 30px;
88+
cursor: pointer;
89+
color: white;
90+
}
91+
92+
form {
93+
position: absolute;
94+
top: 20%;
95+
max-width: 80%;
96+
color: white;
97+
text-align: center;
98+
}
99+
100+
#formContent {
101+
display: flex;
102+
justify-content: center;
103+
}
104+
105+
form h1 {
106+
font-size: 2.6rem;
107+
font-family: "Goudy Old Style";
108+
font-weight: normal;
109+
margin-bottom: 5%;
110+
}
111+
112+
.form-field {
113+
opacity: 0;
114+
transform: translateY(30px);
115+
transition: opacity 1.2s ease-out, transform 1.2s ease-out;
116+
}
117+
118+
.form-field.active {
119+
opacity: 1;
120+
transform: translateY(0);
121+
}
122+
</style>
123+
</head>
124+
<body>
125+
<header class="header">
126+
<ul class="header-items">
127+
<li>
128+
<a
129+
href="/index.html"
130+
style="
131+
cursor: pointer;
132+
text-decoration: none;
133+
color: white;
134+
background: none;
135+
-webkit-tap-highlight-color: transparent;
136+
font-family: 'Goudy Old Style';
137+
"
138+
>
139+
<div class="subtitle">TEXPOSE</div></a
140+
>
141+
</li>
142+
<li><a style="
143+
cursor: pointer;
144+
text-decoration: none;
145+
color: white;
146+
background: none;
147+
-webkit-tap-highlight-color: transparent;
148+
149+
" href="/story.html">Our Story</a></li>
150+
<li>
151+
<a
152+
style="
153+
cursor: pointer;
154+
text-decoration: none;
155+
color: white;
156+
background: none;
157+
-webkit-tap-highlight-color: transparent;
158+
159+
"
160+
href="/about.html"
161+
>
162+
About Us</a
163+
>
164+
</li>
165+
<li><a style="
166+
cursor: pointer;
167+
text-decoration: none;
168+
color: white;
169+
background: none;
170+
-webkit-tap-highlight-color: transparent;
171+
172+
" href="/contact.html">Contact Us</a></li>
173+
</ul>
174+
</header>
175+
<section class="contact-form page">
176+
<form action="https://formspree.io/f/xkgjoggn" method="post">
177+
<h1>You</h1>
178+
<input class="form-field" placeholder="Name" type="text" id="name" name="name" required />
179+
<input class="form-field" placeholder="Email" type="email" id="email" name="email" required />
180+
<input class="form-field" placeholder="Phone" type="tel" id="phone" name="phone" />
181+
<input class="form-field" placeholder="LinkedIn" type="url" id="linkedin" name="linkedin" />
182+
<button class="submit" type="submit">Submit</button>
183+
</form>
184+
</section>
185+
186+
<script>
187+
document.addEventListener("DOMContentLoaded", () => {
188+
document.querySelectorAll(".form-field").forEach((input, i) => {
189+
setTimeout(() => {
190+
input.classList.add("active");
191+
}, i * 200);
192+
});
193+
});
194+
</script>
195+
</body>
196+
</html>

‎app/templates/fonts/FuturaCyrillicBold.woff‎

28.8 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicBook.woff‎

28.1 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicBook.woff2‎

21.1 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicDemi.woff‎

29.2 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicExtraBold.woff‎

30.2 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicHeavy.woff‎

28.2 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicLight.woff‎

28.8 KB
Binary file not shown.

‎app/templates/fonts/FuturaCyrillicMedium.woff‎

28.5 KB
Binary file not shown.

0 commit comments

Comments
 (0)