123 lines
4.5 KiB
HTML
123 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>FothiFihaara.com — Textile Materials, Tools & Services</title>
|
|
<meta name="description" content="A directory of textile materials, tools, and services. Connecting suppliers and makers.">
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<header class="site-header">
|
|
<div class="container header-inner">
|
|
<a href="#" class="brand">FothiFihaara.com</a>
|
|
<nav class="main-nav">
|
|
<a href="#about">About</a>
|
|
<a href="#directory">Directory</a>
|
|
<a href="#join">Join</a>
|
|
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle dark mode">☾</button>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="hero">
|
|
<div class="container">
|
|
<p class="label">The textile network</p>
|
|
<h1>A directory of textile<br>materials, tools, and services</h1>
|
|
<p class="subtitle">Connecting suppliers and makers in one curated place.</p>
|
|
<div class="hero-actions">
|
|
<a href="#join" class="btn btn-primary">Join as a Supplier</a>
|
|
<a href="#directory" class="btn btn-secondary">Explore the Directory</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="directory" class="directory-preview">
|
|
<div class="container">
|
|
<h2>Directory Preview</h2>
|
|
<div class="cards">
|
|
<article class="card">
|
|
<img src="images/materials.webp" alt="Textile materials preview">
|
|
<div class="card-body">
|
|
<span class="category">Materials</span>
|
|
<h3>Premium Cotton Blends</h3>
|
|
<p>Supplier: Nordic Textiles</p>
|
|
</div>
|
|
</article>
|
|
<article class="card">
|
|
<img src="images/tools.webp" alt="Textile tools preview">
|
|
<div class="card-body">
|
|
<span class="category">Tools</span>
|
|
<h3>Industrial Looms</h3>
|
|
<p>Service: WeaveTech</p>
|
|
</div>
|
|
</article>
|
|
<article class="card">
|
|
<img src="images/services.webp" alt="Textile services preview">
|
|
<div class="card-body">
|
|
<span class="category">Services</span>
|
|
<h3>Dyeing & Finishing</h3>
|
|
<p>Supplier: ColorWorks</p>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="about" class="benefits">
|
|
<div class="container">
|
|
<h2>Why Join?</h2>
|
|
<div class="benefit-grid">
|
|
<div class="benefit">
|
|
<div class="benefit-icon">✦</div>
|
|
<h3>Reach buyers</h3>
|
|
<p>Get discovered by makers actively looking for suppliers.</p>
|
|
</div>
|
|
<div class="benefit">
|
|
<div class="benefit-icon">✦</div>
|
|
<h3>Premium placement</h3>
|
|
<p>Curated listings, not a crowded marketplace.</p>
|
|
</div>
|
|
<div class="benefit">
|
|
<div class="benefit-icon">✦</div>
|
|
<h3>Direct contact</h3>
|
|
<p>Visitors reach you via your preferred messaging app.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="join" class="join-cta">
|
|
<div class="container">
|
|
<h2>Ready to list your business?</h2>
|
|
<p>Send us a message and we will guide you through the process.</p>
|
|
<a href="#contact" class="btn btn-primary">Contact us</a>
|
|
<div class="social-links">
|
|
<a href="https://x.com/" target="_blank" rel="noopener noreferrer">X</a>
|
|
<a href="https://facebook.com/" target="_blank" rel="noopener noreferrer">Facebook</a>
|
|
<a href="https://vk.com/" target="_blank" rel="noopener noreferrer">VK</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="site-footer">
|
|
<div class="container footer-inner">
|
|
<div class="footer-brand">FothiFihaara.com</div>
|
|
<p class="footer-tagline">A directory of textile materials, tools, and services</p>
|
|
<p class="copyright">
|
|
Copyright © 2023 - <span id="current-year">2026</span> FothiFihaara.com. All rights reserved. All trademarks and brands are the property of their respective owners.
|
|
</p>
|
|
<p class="credit">
|
|
<a href="https://invosset.com/" target="_blank" rel="noopener noreferrer">Online Promotion</a>
|
|
&
|
|
<a href="https://invosset.com/" target="_blank" rel="noopener noreferrer">Managed Advertising</a>
|
|
by Invosset
|
|
</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|