Skip to content

Commit 45d5edb

Browse files
arfinitynexusarfinitynexus
authored
Add files via upload
1 parent 68e6fb9 commit 45d5edb

1 file changed

Lines changed: 121 additions & 0 deletions

File tree

‎request-a-quote/index.html‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
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+
<meta name="robots" content="index,follow">
7+
<title>Request a Quote – Website Development, Shopify, Webflow, WordPress Security PageSpeed and Search Engine Optimization | Muhammad Nadeem Arif</title>
8+
<meta name="description" content="Request a custom quote for Website Development, Shopify Store, Webflow Projects, WordPress Security & Malware Cleanup, SEO, PageSpeed Optimization, Domain & Hosting Management. Fast response by Muhammad Nadeem Arif.">
9+
<meta name="keywords" content="Website Development, Shopify Store, Webflow Project, WordPress Security, Malware Cleanup, WordPress Website Scan, Website Recovery, Malware Protection, WordPress Website Protection, PageSpeed Optimization, SEO Services, Search Engine Optimization, Domain Management, Hosting Management, DevOps, Request Quote, Project Estimate">
10+
<meta property="og:type" content="website" />
11+
<meta property="og:url" content="https://mnadeemarif786.github.io/request-a-quote/" />
12+
<meta property="og:title" content="Request a Project Quote | Website Development, Shopify & Webflow" />
13+
<meta property="og:description" content="Fill out the form to request a quote for Website Development, Shopify Store, Webflow Projects, WordPress Security, SEO, and more." />
14+
<meta property="og:image" content="https://mnadeemarif786.github.io/assets/img/request-a-service.webp" />
15+
<meta property="og:site_name" content="Muhammad Nadeem Arif" />
16+
<meta name="twitter:card" content="summary_large_image" />
17+
<meta name="twitter:url" content="https://mnadeemarif786.github.io/request-a-quote/" />
18+
<meta name="twitter:title" content="Request a Quote – Website Development, Shopify, SEO" />
19+
<meta name="twitter:description" content="Submit your project details to get a custom quote for Website Development, Webflow, Shopify, WordPress Security & SEO." />
20+
<meta name="twitter:image" content="https://mnadeemarif786.github.io/assets/img/request-a-service.webp">
21+
<link rel="dns-prefetch" href="//docs.google.com">
22+
<link rel="preconnect" href="https://docs.google.com" crossorigin>
23+
<meta http="Content-Security-Policy" content="frame-ancestors 'self' https://docs.google.com;">
24+
<link rel="preload" as="image" href="../assets/img/service-request-thumbnail.webp"
25+
imagesrcset="../assets/img/service-request-thumbnail-480.webp 480w,
26+
../assets/img/service-request-thumbnail-768.webp 768w,
27+
../assets/img/service-request-thumbnail-1200.webp 1200w,
28+
../assets/img/service-request-thumbnail.webp 1920w
29+
" imagesizes="100vw" fetchpriority="high" loading="eager"/>
30+
<link rel="icon" type="image/png" href="../favicon/favicon-96x96.png" sizes="96x96" />
31+
<link rel="icon" type="image/svg+xml" href="../favicon/favicon.svg" />
32+
<link rel="shortcut icon" href="../favicon/favicon.ico" />
33+
<link rel="apple-touch-icon" sizes="180x180" href="../favicon/apple-touch-icon.png" />
34+
<meta name="apple-mobile-web-app-title" content="Muhammad Nadeem Arif" />
35+
<link rel="manifest" href="../favicon/site.webmanifest" />
36+
<style>html,body{margin:0px;padding:0px;box-sizing:border-box;width:100%;height:auto;min-height:100vh;background-color:#f3f6d5;text-align:center;font-family:Arial, sans-serif;}
37+
h1{padding:15px;color:#DFEA4A;}
38+
h2{padding-bottom:15px;color:white;}
39+
a{color:#101010;display:inline-block;height:auto;padding:15px; border-radius:13px;background-color:#DFEA4A;transition:all 0.15s ease-in-out;text-decoration:none;max-width:300px;width:100%;margin:auto;font-weight:900}
40+
a:hover{color:#101010;text-decoration:none;background-color:white;}
41+
header{margin:0px;width:100%;height:auto;position:relative;line-height:0;background-color:#101010;}
42+
header img{margin:0px;padding:0px;box-sizing:border-box;width:100%;height:auto;}
43+
main{max-width:100%;margin:0 auto;text-align:center;height:98vh;overflow: hidden;}
44+
main iframe{margin:0px;width:100%;height:100%;border:none;}
45+
.main-title{position:absolute;margin:auto 0;top:0px;bottom:0;text-align:left;display:flex;flex-wrap:wrap;flex-direction:column;justify-content:center;}
46+
.main-title span{display:block;line-height:1;}
47+
.highlight-yellow{color:#DFEA4A;}
48+
.highlight-white{color:#fff;}
49+
#fadein {opacity:0;display: inline-block;transform: translateY(20px);transition:opacity 0.7s ease, transform 0.7s ease;}
50+
#fadein.show{opacity:1;transform:translateY(0);}
51+
</style>
52+
<style media="(min-width:1440px)">.main-title{left:10%;font-size:80px;gap:20px;}.main-title span{height:80px}</style>
53+
<style media="(min-width:1280px) and (max-width:1439.99px)">.main-title{left:10%;font-size:70px;gap:20px;}.main-title span{height:70px}</style>
54+
<style media="(min-width:1025px) and (max-width:1279.99px)">.main-title{left:7.5%;font-size:50px;gap:15px;}.main-title span{height:50px}</style>
55+
<style media="(min-width:800px) and (max-width:1024.99px)">.main-title{left:5%;font-size:40px;gap:15px;}.main-title span{height:40px}</style>
56+
<style media="(min-width:500px) and (max-width:799.99px)">.main-title{left:3%;font-size:30px;gap:12px;padding:0px;}.main-title span{height:30px}</style>
57+
<style media="(max-width:499.99px)">.main-title{left:15px;font-size:24px;gap:8px;padding:0px;}.main-title span{height:24px}</style>
58+
<style media="(max-width:375px)">.main-title{font-size:20px;gap:5px;}.main-title span{height:20px}</style>
59+
</head>
60+
<body>
61+
<header class="header">
62+
<img width="1920" height="480" src="../assets/img/service-request-thumbnail.webp" srcset="../assets/img/service-request-thumbnail-480.webp 480w, ../assets/img/service-request-thumbnail-768.webp 768w, ../assets/img/service-request-thumbnail-1200.webp 1200w, ../assets/img/service-request-thumbnail.webp 1920w" sizes="100vw" fetchpriority="high" loading="eager" decoding="async" alt="Request A Service Banner Image" />
63+
<h1 class="main-title"><span class="highlight-yellow" id="typewriter">Service</span><span class="highlight-white show" id="fadein">Request Form</span></h1>
64+
</header>
65+
<main>
66+
<iframe src="https://docs.google.com/forms/d/e/1FAIpQLSdxBSDiEdW14ci0eTLqTakNxqXIEdQ2Yv59il7IKK0va4gMMw/viewform?embedded=true" title="Request a Quote Form" width="640" height="3875" frameborder="0" marginheight="0" marginwidth="0" loading="lazy">Loading…</iframe>
67+
<p>If you can't see the form or you are not redirected automatically,<br>click here:</p>
68+
<a href="https://forms.gle/P5hWkfGFgFhTYZRh7" rel="nofollow noopener">Click here to open it directly</a>
69+
</main>
70+
<script>
71+
if ('serviceWorker' in navigator) {
72+
navigator.serviceWorker.register('/service-worker.js', { scope: '/' })
73+
.then(reg => console.log('SW Registered', reg))
74+
.catch(err => console.log('SW Error', err));
75+
}
76+
window.addEventListener("load", () => {
77+
setTimeout(() => {
78+
const titles = [
79+
["WordPress", "Web Development"],
80+
["Shopify", "Store Development"],
81+
["Webflow", "Web Development"],
82+
["Custom", "Web Solutions"],
83+
["WordPress", "Web Security"],
84+
["PageSpeed", "Optimization"],
85+
["Search Engine", "Optimization (SEO)"],
86+
["Service", "Request Form"]
87+
];
88+
const typeEl = document.getElementById("typewriter");
89+
const fadeEl = document.getElementById("fadein");
90+
let titleIndex = 0;
91+
let charIndex = 0;
92+
const typingSpeed = 200;
93+
function typeWriter() {
94+
const [first, second] = titles[titleIndex];
95+
if(charIndex === 0) {
96+
typeEl.textContent = "";
97+
fadeEl.textContent = "";
98+
fadeEl.classList.remove("show");
99+
}
100+
if (charIndex < first.length) {
101+
typeEl.textContent += first.charAt(charIndex);
102+
charIndex++;
103+
setTimeout(typeWriter, typingSpeed);
104+
} else {
105+
fadeEl.textContent = second;
106+
fadeEl.classList.add("show");
107+
setTimeout(() => {
108+
charIndex = 0;
109+
typeEl.textContent = "";
110+
fadeEl.classList.remove("show");;
111+
titleIndex = (titleIndex + 1) % titles.length;
112+
setTimeout(typeWriter, 700);
113+
}, 3000);
114+
}
115+
}
116+
typeWriter();
117+
}, 3000);
118+
});
119+
</script>
120+
</body>
121+
</html>

0 commit comments

Comments
 (0)