From 32a4b7f414bce51dbb392a9347b2dffc033ad683 Mon Sep 17 00:00:00 2001 From: ralnahlawi Date: Tue, 21 Jul 2026 11:24:31 +0300 Subject: [PATCH] Initial commit: AI topics static site --- .gitignore | 5 +++ README.md | 25 ++++++++++++++ index.html | 91 +++++++++++++++++++++++++++++++++++++++++++++++++ styles.css | 99 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 220 insertions(+) create mode 100644 .gitignore create mode 100644 README.md create mode 100644 index.html create mode 100644 styles.css diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..bb80c84 --- /dev/null +++ b/.gitignore @@ -0,0 +1,5 @@ +.DS_Store +*.log +node_modules/ +.vscode/ +.idea/ diff --git a/README.md b/README.md new file mode 100644 index 0000000..8c37703 --- /dev/null +++ b/README.md @@ -0,0 +1,25 @@ +# ai-topics + +A simple static HTML site providing a short overview of core Artificial +Intelligence topics: Machine Learning, Deep Learning, Natural Language +Processing, Computer Vision, and AI Ethics. + +## Files + +- `index.html` — the page content +- `styles.css` — the styling + +## View locally + +Just open `index.html` in your browser, or run a tiny static server: + +```bash +python3 -m http.server 8000 +``` + +Then visit http://localhost:8000. + +## Publish + +Push to Gitea and enable the repository's static site / Pages feature, or host +the files on any static hosting provider. diff --git a/index.html b/index.html new file mode 100644 index 0000000..d132187 --- /dev/null +++ b/index.html @@ -0,0 +1,91 @@ + + + + + + AI Topics + + + +
+
+

Artificial Intelligence

+

A simple overview of the core topics shaping modern AI.

+ +
+
+ +
+
+

What is AI?

+

+ Artificial Intelligence (AI) is the field of computer science focused on + building systems that can perform tasks typically requiring human + intelligence — such as reasoning, perception, language + understanding, and decision making. +

+
+ +
+

Machine Learning

+

+ Machine Learning (ML) is a subset of AI where systems learn patterns + from data instead of being explicitly programmed. Common approaches + include supervised, unsupervised, and reinforcement learning. +

+
    +
  • Supervised learning: learns from labeled examples.
    • +
  • Unsupervised learning: finds structure in unlabeled data.
    • +
  • Reinforcement learning: learns by trial, error, and reward.
    • +
+
+ +
+

Deep Learning

+

+ Deep Learning uses multi-layered neural networks to model complex + patterns in large datasets. It powers many state-of-the-art results in + image, speech, and text tasks. +

+
+ +
+

Natural Language Processing

+

+ Natural Language Processing (NLP) enables machines to understand, + interpret, and generate human language. Applications include + translation, summarization, chatbots, and large language models (LLMs). +

+
+ +
+

Computer Vision

+

+ Computer Vision lets computers derive meaning from images and video. + Typical tasks include classification, object detection, and segmentation. +

+
+ +
+

AI Ethics

+

+ Responsible AI considers fairness, transparency, privacy, accountability, + and the societal impact of deployed systems. Designing for safety and + bias mitigation is essential as AI adoption grows. +

+
+
+ + + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..7b9dbc3 --- /dev/null +++ b/styles.css @@ -0,0 +1,99 @@ +:root { + --bg: #0f172a; + --surface: #1e293b; + --text: #e2e8f0; + --muted: #94a3b8; + --accent: #38bdf8; + --border: #334155; +} + +* { + box-sizing: border-box; +} + +body { + margin: 0; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; + background: var(--bg); + color: var(--text); + line-height: 1.6; +} + +.container { + max-width: 820px; + margin: 0 auto; + padding: 0 1.25rem; +} + +.hero { + padding: 4rem 0 2.5rem; + background: radial-gradient(1200px 400px at 50% -10%, #1e3a8a 0%, transparent 60%), var(--surface); + border-bottom: 1px solid var(--border); +} + +.hero h1 { + margin: 0 0 0.5rem; + font-size: 2.5rem; + letter-spacing: -0.02em; +} + +.tagline { + color: var(--muted); + font-size: 1.125rem; + margin: 0 0 1.5rem; +} + +.nav { + display: flex; + flex-wrap: wrap; + gap: 0.75rem; +} + +.nav a { + color: var(--accent); + text-decoration: none; + font-size: 0.95rem; + padding: 0.35rem 0.7rem; + border: 1px solid var(--border); + border-radius: 999px; + transition: background 0.15s ease; +} + +.nav a:hover { + background: rgba(56, 189, 248, 0.12); +} + +.section { + padding: 2.25rem 0; + border-bottom: 1px solid var(--border); +} + +.section h2 { + margin-top: 0; + font-size: 1.6rem; + color: var(--text); +} + +.section p { + color: var(--muted); +} + +.section ul { + color: var(--muted); + padding-left: 1.25rem; +} + +.section ul li { + margin-bottom: 0.4rem; +} + +.section ul strong { + color: var(--text); +} + +.footer { + padding: 1.5rem 0 2.5rem; + color: var(--muted); + font-size: 0.875rem; + text-align: center; +}