ProTecGames.github.io/index.html at main · ProTecGames/ProTecGames.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Meta tags for character set and viewport -->
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  <!-- SEO Meta Tags -->
  <meta name="description" content="ProTec Games offers apps, games, and AI tools that help everyday users. Founded by Prakhar Doneria, we focus on performance, accessibility, and innovation. Explore our featured apps like Karbon AI and HTML Editor Pro.">
  <meta name="keywords" content="ProTec Games, Android apps, AI tools, games, web editor, educational apps, Karbon AI, HTML editor, Prakhar Doneria">
  <meta name="author" content="Prakhar Doneria">

  <!-- Open Graph Meta Tags for social media sharing -->
  <meta property="og:title" content="ProTec Games">
  <meta property="og:description" content="ProTec Games offers innovative apps, games, and AI tools for everyday users. Discover Karbon AI, HTML Editor Pro, and more!">
  <meta property="og:image" content="/assets/images/og-image.jpg">
  <meta property="og:url" content="https://protecgames.github.io">
  <meta property="og:type" content="website">

  <!-- Twitter Card Meta Tags -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="ProTec Games - AI Tools, Apps, and Games">
  <meta name="twitter:description" content="Explore ProTec Games, featuring AI-powered tools, apps, and games that improve productivity and creativity.">
  <meta name="twitter:image" content="/assets/images/og-image.jpg">

  <!-- Page Title -->
  <title>ProTec Games</title>

  <!-- External CSS links -->
  <link rel="stylesheet" href="/css/styles.css" />
  <link rel="stylesheet" href="/css/components.css" />
  <link rel="icon" type="image/x-icon" href="assets/images/favicon.ico">

  <!-- Google Fonts link for Roboto -->
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;600;800&display=swap" rel="stylesheet">
</head>
<body>

  <!-- Header Section -->
  <header class="header">
    <div class="container nav-container">
      <!-- Logo -->
      <h1 class="logo">ProTec Games</h1>

      <!-- Navigation Bar -->
      <nav class="main-nav">
        <div class="nav-links" id="navLinks">
          <a href="/">Home</a>
          <a href="/news/">News</a>
          <a href="/apps/">Apps</a>
          <a href="/reviews/">Reviews</a>
          <a href="/about/">About</a>

          <!-- Dark Mode Toggle Button -->
          <button id="darkModeToggle">🌙</button>
        </div>

        <!-- Mobile Menu Toggle -->
        <button class="menu-toggle" id="menuToggle">☰</button>
      </nav>
    </div>
  </header>

  <!-- Hero Section -->
  <section class="hero">
    <div class="container hero-content">
      <h2 class="hero-title">Welcome to ProTec Games</h2>
      <p class="hero-subtitle">Apps, games, and AI tools for everyday users. Free, smart, and always improving.</p>
      <a href="/apps/" class="btn-primary">Explore Apps</a>
    </div>
  </section>

  <!-- About Us Section -->
  <section class="about-brief">
    <div class="container">
      <h3>About Us</h3>
      <p>ProTec Games is a self-published indie Android developer, delivering AI-enhanced tools and educational apps since 2021. Founded by Prakhar Doneria, we're passionate about performance, accessibility, and creativity.</p>
      <a href="/about/" class="btn-link">Learn more →</a>
    </div>
  </section>

  <!-- Featured Apps Section -->
  <section class="featured-apps container">
    <h3>Featured Apps</h3>

    <!-- App Grid (two apps in the first row) -->
    <div class="app-grid">
      <div class="app-card">
        <img src="/assets/images/karbon-ai.png" alt="Karbon AI Icon" />
        <h4>Karbon AI</h4>
        <p>Make websites by prompting.</p>
        <a href="https://play.google.com/store/apps/details?id=com.protecgames.karbon" target="_blank">View App →</a>
      </div>
      <div class="app-card">
        <img src="/assets/images/html-editor-pro.png" alt="HTML Editor Pro Icon" />
        <h4>HTML Editor Pro</h4>
        <p>Modern web editor with built-in smart tools and AI.</p>
        <a href="https://play.google.com/store/apps/details?id=com.protecgames.htmleditorpro" target="_blank">Play Store →</a>
      </div>
    </div>

    <!-- Additional App Cards -->
    <br>
    <div class="app-card">
      <img src="/assets/images/html-editor-pro.png" alt="HTML Editor Pro Icon" />
      <h4>HTML Editor Pro - Desktop</h4>
      <p>Modern web editor with built-in smart tools and AI.</p>
      <a href="https://html-editor-pro.web.app/" target="_blank">Web →</a>
    </div>

    <!-- App Grid (second row) -->
    <div class="app-grid">
      <div class="app-card">
        <img src="/assets/images/visionary-llm.png" alt="VerboVisions Icon" />
        <h4>VerboVisions - Text to Image</h4>
        <p>Create cool images with AI.</p>
        <a href="https://play.google.com/store/apps/details?id=com.protecgames.verbovisions" target="_blank">Play Store →</a>
      </div>
      <div class="app-card">
        <img src="https://raw.githubusercontent.com/PrakharDoneria/ChiX/main/generated-icon.png" alt="ChiX Icon" />
        <h4>ChiX - C Code Editor</h4>
        <p>Modern C Code Editor for students.</p>
        <a href="https://github.com/PrakharDoneria/ChiX/releases/download/build-90f3b33/ChiX.exe" target="_blank">Download for Windows →</a>
      </div>
    </div>
  </section>

  <!-- Footer Section -->
  <footer class="footer">
    <div class="container">
      <p>© 2025 ProTec Games.</p>
    </div>
  </footer>

  <!-- External JS script -->
  <script src="/js/main.js"></script>
</body>
</html>