Skip to content

Commit 21550d6

Browse files
committed
Massive OS Expansion: Added Android, iOS, 15+ Linux images, real Windows screenshots, and research-level data
1 parent 94577d2 commit 21550d6

71 files changed

Lines changed: 2134 additions & 142 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

android-architecture.html

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Android Architecture Layers | Computer Parts Map</title>
7+
<meta name="description" content="Detailed research page covering Android Architecture Layers.">
8+
<link rel="preconnect" href="https://fonts.googleapis.com">
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@300;500;700&display=swap" rel="stylesheet">
11+
<link rel="stylesheet" href="css/styles.css">
12+
</head>
13+
<body class="dark-mode">
14+
<div id="navbar-placeholder"></div>
15+
16+
<div class="component-hero">
17+
<div class="badge">🔬 Deep Detail</div>
18+
<h1>Android Architecture Layers</h1>
19+
<p class="hero-subtitle">Advanced documentation and architecture breakdown for Android OS.</p>
20+
</div>
21+
22+
<div class="page-content">
23+
<div class="content-section">
24+
<h2>📖 Overview</h2>
25+
<p>Android is the world's most popular mobile OS. It is open-source (AOSP) and highly customizable, used by manufacturers like Samsung, Google, and Xiaomi.</p>
26+
</div>
27+
28+
<div class="content-section">
29+
<h2>⚙️ Architecture & Working Principle</h2>
30+
<p>Layered architecture: Linux Kernel at the bottom, followed by Hardware Abstraction Layer (HAL), Android Runtime (ART/Dalvik), Native C++ libraries, and the Java/Kotlin Application Framework.</p>
31+
<p>Uses a sandboxed environment for apps. Each app runs in its own process with a unique user ID. Uses Intents for inter-process communication.</p>
32+
</div>
33+
34+
35+
<div class="content-section">
36+
<h2>🖼️ Technical Diagrams</h2>
37+
<div class="products-grid">
38+
39+
<figure class="product-card" style="margin:0;">
40+
<img src="assets/images/android/android-0-2023_Android_Bot.png" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
41+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
42+
Android (operating system) screenshot or diagram<br>
43+
<a href="https://upload.wikimedia.org/wikipedia/commons/f/f7/2023_Android_Bot.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
44+
</figcaption>
45+
</figure>
46+
47+
<figure class="product-card" style="margin:0;">
48+
<img src="assets/images/android/android-1-Front_view_of_Nexus_7_%28cropped%29.png" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
49+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
50+
Android (operating system) screenshot or diagram<br>
51+
<a href="https://upload.wikimedia.org/wikipedia/commons/8/83/Front_view_of_Nexus_7_%28cropped%29.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
52+
</figcaption>
53+
</figure>
54+
55+
<figure class="product-card" style="margin:0;">
56+
<img src="assets/images/android/android-2-HTC_Android_T-Mobile_G1.jpg" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
57+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
58+
Android (operating system) screenshot or diagram<br>
59+
<a href="https://upload.wikimedia.org/wikipedia/commons/1/1f/HTC_Android_T-Mobile_G1.jpg" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
60+
</figcaption>
61+
</figure>
62+
63+
<figure class="product-card" style="margin:0;">
64+
<img src="assets/images/android/android-3-HTC_Desire_-_optic_navigation.jpeg" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
65+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
66+
Android (operating system) screenshot or diagram<br>
67+
<a href="https://upload.wikimedia.org/wikipedia/commons/9/9e/HTC_Desire_-_optic_navigation.jpeg" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
68+
</figcaption>
69+
</figure>
70+
71+
<figure class="product-card" style="margin:0;">
72+
<img src="assets/images/android/android-4-Material_you_light.png" alt="Image from Material You" style="max-width:100%; border-radius:8px;">
73+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
74+
Material You screenshot or diagram<br>
75+
<a href="https://upload.wikimedia.org/wikipedia/commons/d/d4/Material_you_light.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
76+
</figcaption>
77+
</figure>
78+
79+
</div>
80+
</div>
81+
82+
83+
<div class="content-section">
84+
<h2>🔗 Back to Component</h2>
85+
<div class="related-grid">
86+
<a href="android.html" class="related-link">⬅️ Back to Android OS</a>
87+
</div>
88+
</div>
89+
</div>
90+
91+
<div id="footer-placeholder"></div>
92+
<script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
93+
<script src="js/script.js"></script>
94+
</body>
95+
</html>

android-history.html

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>History of Android Versions | Computer Parts Map</title>
7+
<meta name="description" content="Detailed research page covering History of Android Versions.">
8+
<link rel="preconnect" href="https://fonts.googleapis.com">
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@300;500;700&display=swap" rel="stylesheet">
11+
<link rel="stylesheet" href="css/styles.css">
12+
</head>
13+
<body class="dark-mode">
14+
<div id="navbar-placeholder"></div>
15+
16+
<div class="component-hero">
17+
<div class="badge">🔬 Deep Detail</div>
18+
<h1>History of Android Versions</h1>
19+
<p class="hero-subtitle">Advanced documentation and architecture breakdown for Android OS.</p>
20+
</div>
21+
22+
<div class="page-content">
23+
<div class="content-section">
24+
<h2>📖 Overview</h2>
25+
<p>Android is the world's most popular mobile OS. It is open-source (AOSP) and highly customizable, used by manufacturers like Samsung, Google, and Xiaomi.</p>
26+
</div>
27+
28+
<div class="content-section">
29+
<h2>⚙️ Architecture & Working Principle</h2>
30+
<p>Layered architecture: Linux Kernel at the bottom, followed by Hardware Abstraction Layer (HAL), Android Runtime (ART/Dalvik), Native C++ libraries, and the Java/Kotlin Application Framework.</p>
31+
<p>Uses a sandboxed environment for apps. Each app runs in its own process with a unique user ID. Uses Intents for inter-process communication.</p>
32+
</div>
33+
34+
35+
<div class="content-section">
36+
<h2>🖼️ Technical Diagrams</h2>
37+
<div class="products-grid">
38+
39+
<figure class="product-card" style="margin:0;">
40+
<img src="assets/images/android/android-0-2023_Android_Bot.png" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
41+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
42+
Android (operating system) screenshot or diagram<br>
43+
<a href="https://upload.wikimedia.org/wikipedia/commons/f/f7/2023_Android_Bot.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
44+
</figcaption>
45+
</figure>
46+
47+
<figure class="product-card" style="margin:0;">
48+
<img src="assets/images/android/android-1-Front_view_of_Nexus_7_%28cropped%29.png" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
49+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
50+
Android (operating system) screenshot or diagram<br>
51+
<a href="https://upload.wikimedia.org/wikipedia/commons/8/83/Front_view_of_Nexus_7_%28cropped%29.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
52+
</figcaption>
53+
</figure>
54+
55+
<figure class="product-card" style="margin:0;">
56+
<img src="assets/images/android/android-2-HTC_Android_T-Mobile_G1.jpg" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
57+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
58+
Android (operating system) screenshot or diagram<br>
59+
<a href="https://upload.wikimedia.org/wikipedia/commons/1/1f/HTC_Android_T-Mobile_G1.jpg" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
60+
</figcaption>
61+
</figure>
62+
63+
<figure class="product-card" style="margin:0;">
64+
<img src="assets/images/android/android-3-HTC_Desire_-_optic_navigation.jpeg" alt="Image from Android (operating system)" style="max-width:100%; border-radius:8px;">
65+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
66+
Android (operating system) screenshot or diagram<br>
67+
<a href="https://upload.wikimedia.org/wikipedia/commons/9/9e/HTC_Desire_-_optic_navigation.jpeg" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
68+
</figcaption>
69+
</figure>
70+
71+
<figure class="product-card" style="margin:0;">
72+
<img src="assets/images/android/android-4-Material_you_light.png" alt="Image from Material You" style="max-width:100%; border-radius:8px;">
73+
<figcaption style="margin-top:10px; font-size:0.9rem; color:var(--text-muted);">
74+
Material You screenshot or diagram<br>
75+
<a href="https://upload.wikimedia.org/wikipedia/commons/d/d4/Material_you_light.png" target="_blank" style="color:var(--primary);">Source</a> | License: Public Domain / Creative Commons via Wikimedia
76+
</figcaption>
77+
</figure>
78+
79+
</div>
80+
</div>
81+
82+
83+
<div class="content-section">
84+
<h2>🔗 Back to Component</h2>
85+
<div class="related-grid">
86+
<a href="android.html" class="related-link">⬅️ Back to Android OS</a>
87+
</div>
88+
</div>
89+
</div>
90+
91+
<div id="footer-placeholder"></div>
92+
<script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
93+
<script src="js/script.js"></script>
94+
</body>
95+
</html>

android.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
3+
<html lang="en">
4+
<head>
5+
<meta charset="utf-8"/>
6+
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
7+
<title>Android OS — Mobile Freedom | Computer Parts Map</title>
8+
<meta content="Android OS architecture, versions, Linux kernel base, and mobile ecosystem guide." name="description"/>
9+
<link href="https://fonts.googleapis.com" rel="preconnect"/>
10+
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
11+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&amp;family=Space+Grotesk:wght@300;500;700&amp;display=swap" rel="stylesheet"/>
12+
<link href="css/styles.css" rel="stylesheet"/>
13+
</head>
14+
<body class="dark-mode">
15+
<div id="navbar-placeholder"></div>
16+
<div class="component-hero">
17+
<div class="badge">📱 Mobile OS</div>
18+
<h1>Android OS</h1>
19+
<p class="hero-subtitle">The world's most popular open-source mobile platform, powered by the Linux kernel.</p>
20+
<img alt="Android OS" class="hero-img" src="images/computer.jpg"/>
21+
</div>
22+
<div class="page-content"><div class="content-section" id="media-section"><h2>🎥 Explanatory Media</h2><audio controls="" src="assets/audio/android/android-overview.mp3" style="width:100%; margin-top:10px;"></audio></div>
23+
<div class="content-section" id="image-gallery"><h2>🖼️ Visual Gallery</h2><div class="products-grid"><figure class="product-card" style="margin:0;"><img alt="Image from Android (operating system)" src="assets/images/android/android-0-2023_Android_Bot.png" style="max-width:100%; border-radius:8px;"/><figcaption style="margin-top:10px; font-size:0.85rem; color:var(--text-muted);">Android (operating system) screenshot or diagram</figcaption></figure><figure class="product-card" style="margin:0;"><img alt="Image from Android (operating system)" src="assets/images/android/android-1-Front_view_of_Nexus_7_%28cropped%29.png" style="max-width:100%; border-radius:8px;"/><figcaption style="margin-top:10px; font-size:0.85rem; color:var(--text-muted);">Android (operating system) screenshot or diagram</figcaption></figure><figure class="product-card" style="margin:0;"><img alt="Image from Android (operating system)" src="assets/images/android/android-2-HTC_Android_T-Mobile_G1.jpg" style="max-width:100%; border-radius:8px;"/><figcaption style="margin-top:10px; font-size:0.85rem; color:var(--text-muted);">Android (operating system) screenshot or diagram</figcaption></figure><figure class="product-card" style="margin:0;"><img alt="Image from Android (operating system)" src="assets/images/android/android-3-HTC_Desire_-_optic_navigation.jpeg" style="max-width:100%; border-radius:8px;"/><figcaption style="margin-top:10px; font-size:0.85rem; color:var(--text-muted);">Android (operating system) screenshot or diagram</figcaption></figure><figure class="product-card" style="margin:0;"><img alt="Image from Material You" src="assets/images/android/android-4-Material_you_light.png" style="max-width:100%; border-radius:8px;"/><figcaption style="margin-top:10px; font-size:0.85rem; color:var(--text-muted);">Material You screenshot or diagram</figcaption></figure></div></div><div class="content-section" id="detail-pages-nav"><h2>📚 Detailed Research Pages</h2><div class="related-grid"><a class="related-link" href="android-architecture.html">📄 Android Architecture Layers</a><a class="related-link" href="android-history.html">📄 History of Android Versions</a></div></div><div class="content-section">
24+
<h2>📖 Overview</h2>
25+
<p>Android is the world's most popular mobile OS. It is open-source (AOSP) and highly customizable, used by manufacturers like Samsung, Google, and Xiaomi.</p>
26+
</div>
27+
<div class="content-section"><h2>📜 History</h2><p>Developed by Android Inc. and bought by Google in 2005. The first commercial device was the T-Mobile G1 (2008). It has evolved from simple smartphone use to tablets, TVs, and cars.</p></div><div class="content-section"><h2>🏗️ Architecture</h2><p>Layered architecture: Linux Kernel at the bottom, followed by Hardware Abstraction Layer (HAL), Android Runtime (ART/Dalvik), Native C++ libraries, and the Java/Kotlin Application Framework.</p></div></div>
28+
<div id="footer-placeholder"></div>
29+
<script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
30+
<script src="js/script.js"></script>
31+
</body>
32+
</html>
133 KB
Binary file not shown.

assets/audio/ios/ios-overview.mp3

133 KB
Binary file not shown.
152 KB
Binary file not shown.
58.6 KB
Loading
104 KB
Loading
46.3 KB
Loading
66.5 KB
Loading

0 commit comments

Comments
 (0)