143 lines
10 KiB
PHP
143 lines
10 KiB
PHP
<?php
|
|
require_once('.htac_header.php');
|
|
require_once('.htac_nav.php');
|
|
?>
|
|
|
|
<div>
|
|
<section class="container-fluid bg-gradient-to-t from-white to-[#05b3a420] h-fit shadow">
|
|
<div class="container mx-auto px-4 flex flex-col md:flex-row place-content-between place-items-center">
|
|
<div class="flex flex-col justify-center place-items-start">
|
|
<p class="text-5xl font-bold text-center"><span class="text-[#05b3a4]">D</span>WD <span class="text-[#05b3a4]">C</span>onsultancy <span class="text-[#05b3a4]">S</span>ervices</p>
|
|
<button onclick="d.showModal()" class="bg-[#05b3a4] w-fit px-6 py-2 rounded-tl-full rounded-br-full hover:shadow-xl hover:scale-105 duration-700 text-white font-bold">Get in Touch</button>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<img class="" src="/img/motherboard1.png" alt="" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="container mx-auto px-4 mt-10">
|
|
<h1 class="text-3xl font-bold text-center py-16">PC Configuration for K8_Server</h1>
|
|
<div class="flex flex-col md:flex-row place-content-center gap-6 ">
|
|
<div class="flex flex-col">
|
|
<model-viewer id="computer_model" class="computerwidth computerborder bg-[#05b3a430]" src="/img/computer_light_pc.glb" ar ar-modes="webxr scene-viewer quick-look" camera-controls poster="/img/poster.png" shadow-intensity="1" camera-target="-2.135m 1.38m 0.17m" camera-orbit="88deg 85deg 8.99m" field-of-view="30deg">
|
|
<div class="progress-bar hide" slot="progress-bar">
|
|
<div class="update-bar"></div>
|
|
</div>
|
|
<!-- <div class="inline-flex" id="ar-prompt">
|
|
<img src="https://modelviewer.dev/shared-assets/icons/hand.png" />
|
|
<button class="-mt-2" slot="ar-button" id="ar-button">View in your space</button>
|
|
</div> -->
|
|
</model-viewer>
|
|
<!-- <img class="rounded-lg " src="/img/computer.jpg" alt="" /> -->
|
|
</div>
|
|
<div class="flex flex-col gap-4">
|
|
<p class="text-3xl font-bold ">Price 1,40,000.00/- Only</p>
|
|
<!-- <p><b>Processors:</b> <span>Intel® i5 Processors</span></p> -->
|
|
<p><b>Hard Drive:</b><span> 48TB (16TB * 4)</span></p>
|
|
<p><b>RAM:</b><span> 16GB RAM</span></p>
|
|
<div class="flex"><button class="w-full py-3 text-2xl font-bold text-white hover:text-[#05b3a4] bg-[#05b3a4] hover:bg-gray-900 rounded-xl hover:scale-105 duration-700 hover:shadow-lg">Buy Now</button></div>
|
|
</div>
|
|
</div>
|
|
<div class="mt-10">
|
|
<h1 class="text-2xl font-bold pb-1">What is K8s Server?</h1>
|
|
<p class="text-justify py-1"> Imagine you're running a restaurant, and you have a team of chefs who cook different dishes. Each chef specialises in a specific type of cuisine, and they need to work together to prepare meals for your customers.</p>
|
|
<p class="text-justify py-1">Now, running a restaurant efficiently requires coordination among the chefs, the servers who bring the food to the tables, and the managers who oversee everything. You need a system that ensures every dish is prepared correctly, served on time, and meets the high standards of your restaurant.</p>
|
|
<p class="text-justify py-1">This is where Kubernetes comes in. Think of Kubernetes as the restaurant manager of the technology world. Instead of chefs and servers, you have servers that run different parts of your software applications. These servers need to work together to deliver your app to users, just like dishes are served to customers.</p>
|
|
<p class="text-justify py-1">However, managing these servers manually can be challenging. You'd need to keep track of which server is doing what, make sure they're running smoothly, and handle any issues that arise. This is where Kubernetes servers come into play.</p>
|
|
<p class="text-justify py-1">Kubernetes acts like a super-smart restaurant manager for your servers. It keeps an eye on all the servers that make up your app, ensuring they're healthy and performing well. If a server gets overwhelmed or stops working, Kubernetes automatically replaces it with a new one so that your app keeps running without interruption—just like replacing a chef who's too busy or not feeling well.</p>
|
|
<p class="text-justify py-1">Kubernetes also helps with efficiency. Imagine your restaurant getting a sudden rush of customers during lunchtime. Your manager would adjust the workflow and maybe assign more chefs to handle the load. Similarly, Kubernetes can automatically scale up the number of servers when there's a lot of user traffic and scale down when things quiet down. This way, you're only using the resources you need, which can save money and keep your app running smoothly.</p>
|
|
<p class="text-justify py-1">In a nutshell, Kubernetes is like a digital manager for your servers, making sure they're working well, replacing them if they're not, and adjusting their numbers based on demand. Just as a restaurant manager helps deliver a great dining experience to customers, Kubernetes helps deliver a smooth and reliable experience for users of your software applications.</p>
|
|
</div>
|
|
</section>
|
|
<section class="">
|
|
<div>
|
|
<dialog id="d" class=" rounded-lg">
|
|
<div>
|
|
<div style="display: flex; flex-direction: row; justify-content: space-between; border-bottom: 6px solid #05b3a4; padding-bottom: 0px; align-items: center;">
|
|
<h2 class="text-3xl font-bold text-[#05b3a4]">Get In Touch</h2>
|
|
<form method="dialog"><button class="text-3xl text-[#05b3a4] bg-[#05b3a410] hover:bg-[#05b3a450] duration-700 rounded-full px-1">✘</button></form>
|
|
</div>
|
|
<form id="contactForm" style="display: flex; flex-direction: column; margin-bottom: 6px; margin-top: 6px;">
|
|
<div id="formSection">
|
|
<div style="display: flex; flex-direction: column;">
|
|
<label for="name">Name:</label>
|
|
<input name="name" id="name" type="text" style="border: 2px solid #05b3a480; border-radius: 10px; padding: 10px;" placeholder="Your Name" required/>
|
|
</div>
|
|
<div style="display: flex; flex-direction: column;">
|
|
<label for="email">E-mail:</label>
|
|
<input name="email" id="email" type="email" style="border: 2px solid #05b3a480; border-radius: 10px; padding: 10px;" placeholder="Ex: example@email.com" required/>
|
|
</div>
|
|
<div style="display: flex; flex-direction: column;">
|
|
<label for="mobile">Mobile: <span class="text-xs">(with country code)</span></label>
|
|
<input name="mobile" id="mobile" type="text" style="border: 2px solid #05b3a480; border-radius: 10px; padding: 10px;" placeholder="Ex: +91 0123456789" />
|
|
</div>
|
|
<div style="display: flex; flex-direction: column;">
|
|
<label for="content">Message:</label>
|
|
<textarea name="content" id="content" cols="34" rows="8" style="border: 2px solid #05b3a480; border-radius: 10px; padding: 10px;" placeholder="Write your Message..." required></textarea>
|
|
</div>
|
|
<div class="flex flex-col mt-4">
|
|
<input type="submit" value="Submit" class="bg-[#05b3a4] cursor-pointer rounded-md p-1.5 text-white font-bold" />
|
|
</div>
|
|
</div>
|
|
<div id="thankYouSection" style="display: none;">
|
|
<p class="text-3xl text-center font-bold p-20 sm:p-24 h-full">Thank You!</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<script is:inline>
|
|
const modelViewer = document.getElementById('computer_model');
|
|
modelViewer.addEventListener('click', function() {
|
|
if (modelViewer.paused) {
|
|
modelViewer.play();
|
|
// modelViewer.style.backgroundColor = "#05b3a4"
|
|
} else {
|
|
modelViewer.pause();
|
|
}
|
|
});
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const contactForm = document.getElementById('contactForm');
|
|
const formSection = document.getElementById('formSection');
|
|
const thankYouSection = document.getElementById('thankYouSection');
|
|
const nameInput = document.getElementById('name');
|
|
const emailInput = document.getElementById('email');
|
|
const phoneInput = document.getElementById('mobile');
|
|
const contentInput = document.getElementById('content');
|
|
|
|
contactForm.addEventListener('submit', async function (event) {
|
|
event.preventDefault();
|
|
|
|
const formData = {
|
|
name: nameInput.value,
|
|
email: emailInput.value,
|
|
phone: phoneInput.value,
|
|
content: contentInput.value,
|
|
form_name: "DWD SiliconPin - (K8s - Server Page)",
|
|
};
|
|
// console.log("Form Data", formData)
|
|
const url = 'https://api8.siliconpin.com/items/contact';
|
|
try {
|
|
const response = await fetch(url, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(formData)
|
|
});
|
|
if (response.ok) {
|
|
console.log('Form data submitted successfully');
|
|
formSection.style.display = 'none';
|
|
thankYouSection.style.display = 'block';
|
|
} else {
|
|
console.error('Failed to submit form data');
|
|
}
|
|
} catch (error) {
|
|
console.error('An error occurred:', error);
|
|
}
|
|
});
|
|
});
|
|
</script>
|