pull/2/head
parent
1ac8e4197c
commit
0f47c70bfe
|
|
@ -1,301 +1,377 @@
|
|||
---
|
||||
import '../styles/global.css';
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
description?: string;
|
||||
image?: string;
|
||||
canonicalURL?: string;
|
||||
type?: 'website' | 'article';
|
||||
}
|
||||
|
||||
const {
|
||||
title,
|
||||
description = "SiliconPin offers high-performance hosting solutions for PHP, Node.js, Python, K8s, and K3s applications with 24/7 support.",
|
||||
image = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=80&w=2000&auto=format&fit=crop",
|
||||
canonicalURL = new URL(Astro.url.pathname, Astro.site).href,
|
||||
type = "website",
|
||||
} = Astro.props;
|
||||
|
||||
// Organization schema
|
||||
const organizationSchema = {
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Organization",
|
||||
"name": "SiliconPin",
|
||||
"url": "https://siliconpin.com",
|
||||
"logo": "https://siliconpin.com/assets/logo.svg",
|
||||
"contactPoint": {
|
||||
"@type": "ContactPoint",
|
||||
"telephone": "+91-700-160-1485",
|
||||
"contactType": "customer service",
|
||||
"availableLanguage": ["English"]
|
||||
},
|
||||
"address": {
|
||||
"@type": "PostalAddress",
|
||||
"streetAddress": "121 Lalbari, GourBongo Road",
|
||||
"addressLocality": "Habra",
|
||||
"addressRegion": "W.B.",
|
||||
"postalCode": "743271",
|
||||
"addressCountry": "India"
|
||||
},
|
||||
"sameAs": [
|
||||
"https://www.linkedin.com/company/siliconpin",
|
||||
"https://x.com/dwd_consultancy",
|
||||
"https://www.facebook.com/profile.php?id=100088549643337",
|
||||
"https://instagram.com/siliconpin.com_"
|
||||
]
|
||||
};
|
||||
// Page-specific SEO metadata
|
||||
const pageTitle = "SiliconPin - High-Performance Hosting Solutions";
|
||||
const pageDescription = "SiliconPin offers reliable, high-performance hosting solutions for PHP, Node.js, Python, Kubernetes (K8s), and K3s with 24/7 technical support.";
|
||||
const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=80&w=2000&auto=format&fit=crop";
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Basic Meta Tags -->
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<Layout
|
||||
title={pageTitle}
|
||||
description={pageDescription}
|
||||
image={pageImage}
|
||||
>
|
||||
<!-- Canvas background animation -->
|
||||
<div class="fixed inset-0 z-0 opacity-20 pointer-events-none">
|
||||
<canvas id="matrix-animation" class="w-full h-full"></canvas>
|
||||
</div>
|
||||
|
||||
<!-- SEO Meta Tags -->
|
||||
<title>{title}</title>
|
||||
<meta name="description" content={description} />
|
||||
<meta name="keywords" content="hosting, PHP hosting, Node.js hosting, Python hosting, Kubernetes, K8s, K3s, cloud services, web hosting, application hosting, server hosting, India hosting" />
|
||||
<meta name="author" content="SiliconPin" />
|
||||
<link rel="canonical" href={canonicalURL} />
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content={type} />
|
||||
<meta property="og:url" content={canonicalURL} />
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:image" content={image} />
|
||||
<meta property="og:site_name" content="SiliconPin" />
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image" />
|
||||
<meta property="twitter:url" content={canonicalURL} />
|
||||
<meta property="twitter:title" content={title} />
|
||||
<meta property="twitter:description" content={description} />
|
||||
<meta property="twitter:image" content={image} />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="https://siliconpin.com/assets/logo.svg" />
|
||||
<link rel="apple-touch-icon" href="https://siliconpin.com/assets/logo.svg" />
|
||||
|
||||
<!-- Structured Data -->
|
||||
<script type="application/ld+json" set:html={JSON.stringify(organizationSchema)}></script>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<!-- Top header - visible on all devices -->
|
||||
<header class="py-3 sm:py-4 px-4 sm:px-6 border-b border-neutral-700" style="background-color: #262626;">
|
||||
<div class="container mx-auto flex justify-between items-center">
|
||||
<a href="/" class="flex items-center gap-2" aria-label="SiliconPin Home">
|
||||
<img src="https://siliconpin.com/assets/logo.svg" alt="SiliconPin Logo" class="w-6 h-6 sm:w-8 sm:h-8" />
|
||||
<span class="text-lg sm:text-xl font-bold text-[#6d9e37]">SiliconPin</span>
|
||||
<section class="py-16 sm:py-20 px-6 relative z-10" aria-labelledby="hero-heading">
|
||||
<div class="container mx-auto text-center">
|
||||
<h1 id="hero-heading" class="text-4xl sm:text-5xl font-bold mb-4 sm:mb-6 text-[#6d9e37] glow-text">SiliconPin</h1>
|
||||
<p class="text-xl sm:text-2xl mb-8 sm:mb-10 max-w-3xl mx-auto text-neutral-300">
|
||||
High-performance hosting solutions for modern applications
|
||||
</p>
|
||||
<div class="flex gap-4 justify-center flex-wrap">
|
||||
<a
|
||||
href="/get-started"
|
||||
class="inline-flex items-center justify-center rounded-md bg-[#6d9e37] px-6 py-3 text-base font-medium text-white hover:bg-[#598035] transition-colors hover:shadow-glow"
|
||||
rel="prefetch"
|
||||
>
|
||||
Get Started
|
||||
</a>
|
||||
<!-- Desktop navigation -->
|
||||
<nav class="hidden md:flex items-center gap-6" aria-label="Main Navigation">
|
||||
<a href="/" class="hover:text-[#6d9e37] transition-colors">Home</a>
|
||||
<a href="/services" class="hover:text-[#6d9e37] transition-colors">Services</a>
|
||||
<a href="/contact" class="hover:text-[#6d9e37] transition-colors">Contact</a>
|
||||
<a
|
||||
href="/get-started"
|
||||
class="inline-flex items-center justify-center rounded-md bg-[#6d9e37] px-4 py-2 text-sm font-medium text-white hover:bg-[#598035] transition-colors"
|
||||
>
|
||||
Get Started
|
||||
</a>
|
||||
</nav>
|
||||
<!-- Mobile menu button -->
|
||||
<div class="md:hidden relative">
|
||||
<button id="mobileMenuBtn" class="text-[#c7ccd5] p-1 hover:text-white" aria-label="Toggle Menu">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" y1="12" x2="20" y2="12"></line><line x1="4" y1="6" x2="20" y2="6"></line><line x1="4" y1="18" x2="20" y2="18"></line></svg>
|
||||
</button>
|
||||
<a
|
||||
href="/services"
|
||||
class="inline-flex items-center justify-center rounded-md border border-[#6d9e37] px-6 py-3 text-base font-medium text-[#6d9e37] hover:bg-[#6d9e37] hover:text-white transition-colors hover:shadow-glow"
|
||||
rel="prefetch"
|
||||
>
|
||||
Explore Our Services
|
||||
</a>
|
||||
<a
|
||||
href="/contact"
|
||||
class="inline-flex items-center justify-center rounded-md border border-neutral-600 px-6 py-3 text-base font-medium text-neutral-300 hover:bg-neutral-700 hover:border-neutral-500 transition-colors"
|
||||
rel="prefetch"
|
||||
>
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Mobile dropdown menu -->
|
||||
<div id="mobileMenu" class="absolute right-0 mt-2 w-48 bg-neutral-800 rounded-md shadow-lg py-1 z-50 hidden border border-neutral-700">
|
||||
<a href="/" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Home</a>
|
||||
<a href="/services" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Services</a>
|
||||
<a href="/contact" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Contact</a>
|
||||
<a href="/about-us" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">About Us</a>
|
||||
<a href="/get-started" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700 font-medium text-[#6d9e37]">Get Started</a>
|
||||
<a href="/suggestion-or-report" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Suggestion or Report</a>
|
||||
<section class="bg-neutral-800/70 backdrop-blur-sm py-16 sm:py-20 px-6 relative z-10" aria-labelledby="features-heading">
|
||||
<div class="container mx-auto">
|
||||
<div class="text-center mb-10 sm:mb-12">
|
||||
<h2 id="features-heading" class="text-2xl sm:text-3xl font-bold mb-3 sm:mb-4 text-white glow-text">Why Choose SiliconPin?</h2>
|
||||
<p class="text-lg sm:text-xl max-w-3xl mx-auto text-neutral-300">
|
||||
We provide reliable and scalable hosting solutions for businesses of all sizes
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 sm:gap-8">
|
||||
<article class="bg-neutral-700/30 p-6 rounded-lg border border-neutral-700 backdrop-blur-sm hover:border-[#6d9e37] transition-all hover:transform hover:scale-105">
|
||||
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-[#6d9e37] text-white mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline></svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-medium mb-2 text-white">Reliable Performance</h3>
|
||||
<p class="text-neutral-300">Our infrastructure is designed for high availability and optimal performance with 99.9% uptime guarantee.</p>
|
||||
</article>
|
||||
|
||||
<article class="bg-neutral-700/30 p-6 rounded-lg border border-neutral-700 backdrop-blur-sm hover:border-[#6d9e37] transition-all hover:transform hover:scale-105">
|
||||
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-[#6d9e37] text-white mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-medium mb-2 text-white">Advanced Security</h3>
|
||||
<p class="text-neutral-300">Enterprise-grade security measures with automated backups, SSL certificates, and DDoS protection.</p>
|
||||
</article>
|
||||
|
||||
<article class="bg-neutral-700/30 p-6 rounded-lg border border-neutral-700 backdrop-blur-sm hover:border-[#6d9e37] transition-all hover:transform hover:scale-105">
|
||||
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-[#6d9e37] text-white mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12.01" y2="16"></line></svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-medium mb-2 text-white">24/7 Support</h3>
|
||||
<p class="text-neutral-300">Our expert team is always ready to help with any technical questions with average response time under 30 minutes.</p>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="mt-10 sm:mt-12 text-center">
|
||||
<a href="/services"
|
||||
class="inline-flex items-center justify-center gap-2 rounded-md bg-neutral-800 border border-neutral-700 px-6 py-3 text-base font-medium text-neutral-300 hover:bg-neutral-700 hover:border-neutral-600 transition-colors hover:text-white group relative overflow-hidden"
|
||||
rel="prefetch">
|
||||
<span class="absolute inset-0 w-3 bg-gradient-to-r from-[#6d9e37] to-[#92e736] transition-all duration-700 ease-in-out group-hover:w-full opacity-30"></span>
|
||||
<span class="relative">More All Services </span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="relative">
|
||||
<path d="M5 12h14"></path>
|
||||
<path d="m12 5 7 7-7 7"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- When NOT to Choose SiliconPin Section -->
|
||||
<section class="py-16 sm:py-20 px-6 relative z-10" aria-labelledby="not-for-you-heading">
|
||||
<div class="container mx-auto">
|
||||
<div class="text-center mb-10 sm:mb-12">
|
||||
<h2 id="not-for-you-heading" class="text-2xl sm:text-3xl font-bold mb-3 sm:mb-4 text-white glow-text">When Not to Choose SiliconPin</h2>
|
||||
<p class="text-lg sm:text-xl max-w-3xl mx-auto text-neutral-300">
|
||||
We believe in transparency. Here are situations where we might not be the best fit for your needs
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 sm:gap-8">
|
||||
<!-- Card 1 -->
|
||||
<article class="bg-neutral-800/70 p-6 rounded-lg border-l-4 border-l-red-500 border-t border-r border-b border-neutral-700 backdrop-blur-sm hover:shadow-lg transition-all">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-full bg-red-500/20 text-red-400 mr-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-medium mb-3 text-white">Closed Source Dependency</h3>
|
||||
<ul class="space-y-2 text-neutral-300">
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-red-500/20 text-red-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Proprietary software dependencies</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-red-500/20 text-red-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Closed-source tool requirements</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-red-500/20 text-red-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Non-transparent service integrations</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Card 2 -->
|
||||
<article class="bg-neutral-800/70 p-6 rounded-lg border-l-4 border-l-amber-500 border-t border-r border-b border-neutral-700 backdrop-blur-sm hover:shadow-lg transition-all">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-full bg-amber-500/20 text-amber-400 mr-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-medium mb-3 text-white">Specific Technology Stack</h3>
|
||||
<ul class="space-y-2 text-neutral-300">
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-amber-500/20 text-amber-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>CUDA-dependent applications</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-amber-500/20 text-amber-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>MATLAB-based workloads</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-amber-500/20 text-amber-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>C# and .NET Framework projects</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Card 3 -->
|
||||
<article class="bg-neutral-800/70 p-6 rounded-lg border-l-4 border-l-blue-500 border-t border-r border-b border-neutral-700 backdrop-blur-sm hover:shadow-lg transition-all">
|
||||
<div class="flex items-start">
|
||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-full bg-blue-500/20 text-blue-400 mr-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M16 16v1a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h2"></path><path d="M10.5 5.5L18 5.5L18 13"></path><path d="M10.5 13L18 5.5"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-medium mb-3 text-white">Java-Centric Applications</h3>
|
||||
<ul class="space-y-2 text-neutral-300">
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-blue-500/20 text-blue-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Traditional Java EE applications</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-blue-500/20 text-blue-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Legacy Java frameworks</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<span class="inline-flex items-center justify-center h-5 w-5 rounded-full bg-blue-500/20 text-blue-400 mr-2 flex-shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
|
||||
</span>
|
||||
<span>Non-Kotlin JVM applications</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<!-- More Use Cases Button -->
|
||||
<div class="mt-10 sm:mt-12 text-center">
|
||||
<a
|
||||
href="/use-cases"
|
||||
class="inline-flex items-center justify-center gap-2 rounded-md bg-neutral-800 border border-neutral-700 px-6 py-3 text-base font-medium text-neutral-300 hover:bg-neutral-700 hover:border-neutral-600 transition-colors hover:text-white group relative overflow-hidden"
|
||||
rel="prefetch"
|
||||
>
|
||||
<span class="absolute inset-0 w-3 bg-gradient-to-r from-purple-500 to-blue-500 transition-all duration-700 ease-in-out group-hover:w-full opacity-30"></span>
|
||||
<span class="relative">More Use Cases</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="relative">
|
||||
<path d="M5 12h14"></path>
|
||||
<path d="m12 5 7 7-7 7"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact CTA Section with improved mobile responsiveness -->
|
||||
<section class="py-16 sm:py-20 px-6 relative z-10" aria-labelledby="cta-heading">
|
||||
<div class="container mx-auto">
|
||||
<div class="bg-neutral-800/80 backdrop-blur-sm rounded-lg p-6 sm:p-8 lg:p-10 border border-neutral-700 relative overflow-hidden hover:border-[#6d9e37] transition-all">
|
||||
<!-- Decorative background element -->
|
||||
<div class="absolute inset-0 opacity-10" aria-hidden="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 100 100" preserveAspectRatio="none">
|
||||
<path d="M0,0 L100,0 L100,100 L0,100 Z" fill="url(#grad)" />
|
||||
</svg>
|
||||
<defs>
|
||||
<linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stop-color="#6d9e37" />
|
||||
<stop offset="100%" stop-color="#2b323b" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</div>
|
||||
|
||||
<!-- Two-column layout that stacks on mobile -->
|
||||
<div class="relative z-10 flex flex-col lg:flex-row lg:justify-between lg:items-center">
|
||||
<!-- Text content - full width on mobile, partial on desktop -->
|
||||
<div class="mb-8 lg:mb-0 lg:max-w-xl">
|
||||
<h2 id="cta-heading" class="text-2xl sm:text-3xl font-bold text-white mb-3 sm:mb-4 glow-text">Ready to Get Started?</h2>
|
||||
<p class="text-base sm:text-lg text-neutral-300">
|
||||
Contact our team today to discuss your hosting needs and find the perfect solution for your business.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Buttons - stacked on mobile, side-by-side on tablet -->
|
||||
<div class="flex flex-col sm:flex-row gap-4 w-full lg:w-auto">
|
||||
<a
|
||||
href="/get-started"
|
||||
class="inline-flex items-center justify-center rounded-md bg-[#6d9e37] px-6 py-3 text-base font-medium text-white hover:bg-[#598035] transition-colors hover:shadow-glow w-full sm:w-auto"
|
||||
rel="prefetch"
|
||||
>
|
||||
Get Started
|
||||
</a>
|
||||
<a
|
||||
href="/contact"
|
||||
class="inline-flex items-center justify-center rounded-md border border-[#6d9e37] px-6 py-3 text-base font-medium text-[#6d9e37] hover:bg-[#6d9e37] hover:text-white transition-colors hover:shadow-glow w-full sm:w-auto"
|
||||
rel="prefetch"
|
||||
>
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<main class="flex-grow pb-16 md:pb-0">
|
||||
<slot />
|
||||
</main>
|
||||
|
||||
<footer class="border-t border-neutral-700 mt-8 sm:mt-12 md:mb-0 mb-16">
|
||||
<!-- Copyright and social links section with #262626 background -->
|
||||
<div class="py-6 sm:py-8 px-4 sm:px-6" style="background-color: #262626;">
|
||||
<div class="container mx-auto">
|
||||
<div class="flex flex-col sm:flex-row justify-between items-center gap-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<img src="https://siliconpin.com/assets/logo.svg" alt="SiliconPin Logo" class="w-7 h-7 sm:w-8 sm:h-8" />
|
||||
<span class="text-sm sm:text-base">© {new Date().getFullYear()} SiliconPin. All rights reserved.</span>
|
||||
</div>
|
||||
|
||||
<div class="hidden sm:block">
|
||||
<a href="/suggestion-or-report" class="text-[#6d9e37] hover:text-white transition-colors">
|
||||
Suggestion or Report
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-5 mt-4 sm:mt-0">
|
||||
<a href="https://www.linkedin.com/company/siliconpin" aria-label="LinkedIn" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect x="2" y="9" width="4" height="12"></rect><circle cx="4" cy="4" r="2"></circle></svg>
|
||||
</a>
|
||||
<a href="https://x.com/dwd_consultancy?t=MBvjcclvVgCPdIHspV9HWQ&s=09" aria-label="X (Twitter)" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M4 4l11.733 16h4.267l-11.733 -16z"></path>
|
||||
<path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://www.facebook.com/profile.php?id=100088549643337&mibextid=ZbWKwL" aria-label="Facebook" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg>
|
||||
</a>
|
||||
<a href="https://instagram.com/siliconpin.com_?igshid=OGQ5ZDc2ODk2ZA==" aria-label="Instagram" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer links section with main background -->
|
||||
<div class="py-10 px-4 sm:px-6">
|
||||
<div class="container mx-auto">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
<!-- Services column - Card Style -->
|
||||
<div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg">
|
||||
<h3 class="font-medium text-lg text-white mb-4 pb-2 border-b border-neutral-700">Services</h3>
|
||||
<ul class="space-y-2 text-neutral-400">
|
||||
<li><a href="/services" class="hover:text-[#6d9e37] transition-colors">All Services</a></li>
|
||||
<li><a href="/get-started" class="hover:text-[#6d9e37] transition-colors">Get Started</a></li>
|
||||
<li><a href="/services/hire-developer" class="hover:text-[#6d9e37] transition-colors">Hire a Human Developer</a></li>
|
||||
<li><a href="/services/hire-ai-agent" class="hover:text-[#6d9e37] transition-colors">Hire an AI Agent</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Company column - Card Style -->
|
||||
<div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg">
|
||||
<h3 class="font-medium text-lg text-white mb-4 pb-2 border-b border-neutral-700">Company</h3>
|
||||
<ul class="space-y-2 text-neutral-400">
|
||||
<li><a href="/about-us" class="hover:text-[#6d9e37] transition-colors">About Us</a></li>
|
||||
<li><a href="/contact" class="hover:text-[#6d9e37] transition-colors">Contact</a></li>
|
||||
<li><a href="/careers" class="hover:text-[#6d9e37] transition-colors">Careers</a></li>
|
||||
<li><a href="/partners" class="hover:text-[#6d9e37] transition-colors">Partners</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Legal column - Card Style -->
|
||||
<div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg">
|
||||
<h3 class="font-medium text-lg text-white mb-4 pb-2 border-b border-neutral-700">Legal</h3>
|
||||
<ul class="space-y-2 text-neutral-400">
|
||||
<li><a href="/privacy-policy" class="hover:text-[#6d9e37] transition-colors">Privacy Policy</a></li>
|
||||
<li><a href="/terms-and-conditions" class="hover:text-[#6d9e37] transition-colors">Terms & Conditions</a></li>
|
||||
<li><a href="/refund-policy" class="hover:text-[#6d9e37] transition-colors">Refund Policy</a></li>
|
||||
<li><a href="/legal-agreement" class="hover:text-[#6d9e37] transition-colors">Legal Agreement</a></li>
|
||||
<li><a href="/suggestion-or-report" class="hover:text-[#6d9e37] transition-colors">Suggestion or Report</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Contact column - Card Style -->
|
||||
<div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg">
|
||||
<h3 class="font-medium text-lg text-white mb-4 pb-2 border-b border-neutral-700">Contact Us</h3>
|
||||
<address class="not-italic space-y-2 text-neutral-400">
|
||||
<p>121 Lalbari, GourBongo Road</p>
|
||||
<p>Habra, W.B. 743271, India</p>
|
||||
<p>Phone: <a href="tel:+917001601485" class="text-[#6d9e37] hover:underline">+91-700-160-1485</a></p>
|
||||
<p>Email: <a href="mailto:contact@siliconpin.com" class="text-[#6d9e37] hover:underline">contact@siliconpin.com</a></p>
|
||||
</address>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Mobile bottom navigation - positioned last in the DOM -->
|
||||
<nav class="fixed bottom-0 left-0 right-0 md:hidden bg-[#262626] border-t border-neutral-700 shadow-lg z-50">
|
||||
<div class="flex justify-around items-center h-16">
|
||||
<a href="/" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
|
||||
<span class="text-xs mt-1">Home</span>
|
||||
</a>
|
||||
<a href="/services" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>
|
||||
<span class="text-xs mt-1">Services</span>
|
||||
</a>
|
||||
<a href="/get-started" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
|
||||
<div class="w-10 h-10 rounded-full bg-[#6d9e37] flex items-center justify-center -mt-5 shadow-lg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>
|
||||
</div>
|
||||
<span class="text-xs mt-1">Start</span>
|
||||
</a>
|
||||
<a href="/about-us" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="10" r="3"></circle><path d="M7 20.662V19c0-1.18.822-2.2 2-2.5a5.5 5.5 0 0 1 6 0c1.178.3 2 1.323 2 2.5v1.662"></path></svg>
|
||||
<span class="text-xs mt-1">About</span>
|
||||
</a>
|
||||
<a href="/contact" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
|
||||
<span class="text-xs mt-1">Contact</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script>
|
||||
// Mobile menu toggle functionality
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const menuBtn = document.getElementById('mobileMenuBtn');
|
||||
const mobileMenu = document.getElementById('mobileMenu');
|
||||
|
||||
if (menuBtn && mobileMenu) {
|
||||
menuBtn.addEventListener('click', function() {
|
||||
mobileMenu.classList.toggle('hidden');
|
||||
});
|
||||
|
||||
// Close menu when clicking outside
|
||||
document.addEventListener('click', function(event) {
|
||||
if (!menuBtn.contains(event.target) && !mobileMenu.contains(event.target)) {
|
||||
mobileMenu.classList.add('hidden');
|
||||
<!-- Script for the matrix animation -->
|
||||
<script>
|
||||
// Set up the canvas when the DOM loads
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const canvas = document.getElementById('matrix-animation');
|
||||
if (!canvas) {
|
||||
console.error('Canvas element not found');
|
||||
return;
|
||||
}
|
||||
const ctx = (canvas as HTMLCanvasElement).getContext('2d');
|
||||
|
||||
// Set canvas dimensions to match the viewport
|
||||
function resizeCanvas() {
|
||||
if (canvas) {
|
||||
(canvas as HTMLCanvasElement).width = window.innerWidth;
|
||||
(canvas as HTMLCanvasElement).height = window.innerHeight;
|
||||
}
|
||||
}
|
||||
|
||||
resizeCanvas();
|
||||
window.addEventListener('resize', resizeCanvas);
|
||||
|
||||
// Characters to display
|
||||
const chars = "SILICONPIN HOSTINNG";
|
||||
const charSize = 14;
|
||||
const columns = (canvas as HTMLCanvasElement).width / charSize;
|
||||
|
||||
// Array to track the y position of each column
|
||||
const drops: number[] = [];
|
||||
for (let i = 0; i < columns; i++) {
|
||||
drops[i] = Math.random() * -100;
|
||||
}
|
||||
|
||||
// Draw function
|
||||
function draw() {
|
||||
// Semi-transparent black to create trail effect
|
||||
if (!ctx) {
|
||||
console.error('Canvas rendering context is null');
|
||||
return;
|
||||
}
|
||||
ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
|
||||
if (canvas) {
|
||||
ctx.fillRect(0, 0, (canvas as HTMLCanvasElement).width, (canvas as HTMLCanvasElement).height);
|
||||
}
|
||||
|
||||
// Set text color
|
||||
ctx.fillStyle = "#6d9e37";
|
||||
ctx.font = `${charSize}px monospace`;
|
||||
|
||||
// Draw characters
|
||||
for (let i = 0; i < drops.length; i++) {
|
||||
// Random character
|
||||
const text = chars.charAt(Math.floor(Math.random() * chars.length));
|
||||
|
||||
// x coordinate of the character
|
||||
const x = i * charSize;
|
||||
|
||||
// y coordinate of the character
|
||||
const y = drops[i] * charSize;
|
||||
|
||||
// Draw the character
|
||||
ctx.fillText(text, x, y);
|
||||
|
||||
// Move the drop down after drawing
|
||||
drops[i]++;
|
||||
|
||||
// Randomly reset a column when it's past the screen
|
||||
if (canvas && drops[i] * charSize > (canvas as HTMLCanvasElement).height && Math.random() > 0.975) {
|
||||
drops[i] = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Run the animation
|
||||
setInterval(draw, 35);
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style is:global>
|
||||
/* Custom scroll bar */
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #2b323b;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #6d9e37;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #598035;
|
||||
}
|
||||
|
||||
/* Fix mobile viewport height issues */
|
||||
html, body {
|
||||
height: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
body {
|
||||
font-size: 15px;
|
||||
<!-- CSS for glow effects -->
|
||||
<style>
|
||||
.glow-text {
|
||||
text-shadow: 0 0 10px rgba(109, 158, 55, 0.5), 0 0 20px rgba(109, 158, 55, 0.3);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
.hover\:shadow-glow:hover {
|
||||
box-shadow: 0 0 15px rgba(109, 158, 55, 0.5);
|
||||
}
|
||||
|
||||
/* Add subtle animations */
|
||||
@keyframes pulse {
|
||||
0% { transform: scale(1); }
|
||||
50% { transform: scale(1.02); }
|
||||
100% { transform: scale(1); }
|
||||
}
|
||||
|
||||
/* Apply subtle animations to headings */
|
||||
h1, h2 {
|
||||
animation: pulse 5s infinite ease-in-out;
|
||||
}
|
||||
</style>
|
||||
</Layout>
|
||||
|
|
@ -89,7 +89,7 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
|
|||
class="inline-flex items-center justify-center gap-2 rounded-md bg-neutral-800 border border-neutral-700 px-6 py-3 text-base font-medium text-neutral-300 hover:bg-neutral-700 hover:border-neutral-600 transition-colors hover:text-white group relative overflow-hidden"
|
||||
rel="prefetch">
|
||||
<span class="absolute inset-0 w-3 bg-gradient-to-r from-[#6d9e37] to-[#92e736] transition-all duration-700 ease-in-out group-hover:w-full opacity-30"></span>
|
||||
<span class="relative">More All Services </span>
|
||||
<span class="relative">More Services </span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="relative">
|
||||
<path d="M5 12h14"></path>
|
||||
<path d="m12 5 7 7-7 7"></path>
|
||||
|
|
@ -297,7 +297,7 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
|
|||
window.addEventListener('resize', resizeCanvas);
|
||||
|
||||
// Characters to display
|
||||
const chars = "SILICONPIN HOSTINNG";
|
||||
const chars = "S I L I C O N P I N ";
|
||||
const charSize = 14;
|
||||
const columns = (canvas as HTMLCanvasElement).width / charSize;
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue