Update to new @SuperAuguste style.

.gitignore

@@ -1,2 +1,3 @@
 zig-cache/
 render/
+zig-out/

build.zig

@@ -5,15 +5,15 @@ const pkgs = struct {
         .name = "koino",
         .source = .{ .path = "./deps/koino/src/koino.zig" },
         .dependencies = &[_]std.build.Pkg{
-            std.build.Pkg{ .name = "libpcre", .source = .{ .path = "deps/koino/vendor/libpcre.zig/src/main.zig" } },
+            std.build.Pkg{ .name = "libpcre", .source = .{ .path = "deps/koino/vendor/libpcre/src/main.zig" } },
-            std.build.Pkg{ .name = "htmlentities", .source = .{ .path = "deps/koino/vendor/htmlentities.zig/src/main.zig" } },
+            std.build.Pkg{ .name = "htmlentities", .source = .{ .path = "deps/koino/vendor/htmlentities/src/main.zig" } },
             std.build.Pkg{ .name = "clap", .source = .{ .path = "deps/koino/vendor/zig-clap/clap.zig" } },
             std.build.Pkg{ .name = "zunicode", .source = .{ .path = "deps/koino/vendor/zunicode/src/zunicode.zig" } },
         },
     };
 };
 
-const linkPcre = @import("deps/koino/vendor/libpcre.zig/build.zig").linkPcre;
+const linkPcre = @import("deps/koino/vendor/libpcre/build.zig").linkPcre;
 
 pub fn build(b: *std.build.Builder) !void {
     const target = b.standardTargetOptions(.{});
@@ -24,6 +24,7 @@ pub fn build(b: *std.build.Builder) !void {
     render_website.setBuildMode(mode);
     try linkPcre(render_website);
     render_website.addPackage(pkgs.koino);
+    render_website.install();
 
     const gen_cmd = render_website.run();
 

deps/koino

@@ -1 +1 @@
-Subproject commit a3179c9316926f71582d8278af4e2f6f912cbc71
+Subproject commit 5ea268b50116f2f06bfa9b83f24324ec8c211be1

src/main.zig

@@ -80,7 +80,7 @@ pub fn main() anyerror!void {
 
         // img articles
         {
-            var dir = try root_dir.openDir("img", .{ .iterate = true });
+            var dir = try root_dir.openIterableDir("img", .{});
             defer dir.close();
 
             var iter = dir.iterate();
@@ -103,7 +103,7 @@ pub fn main() anyerror!void {
 
         // gather articles
         {
-            var dir = try root_dir.openDir("articles", .{ .iterate = true });
+            var dir = try root_dir.openIterableDir("articles", .{});
             defer dir.close();
 
             var iter = dir.iterate();
@@ -143,9 +143,24 @@ pub fn main() anyerror!void {
         var root_dir = try std.fs.cwd().makeOpenPath("render", .{});
         defer root_dir.close();
 
-        try root_dir.writeFile("style.css", @embedFile("style.css"));
+        try std.fs.Dir.copyFile(
+            std.fs.cwd(),
+            "src/style.css",
+            root_dir,
+            "style.css",
+            .{},
+        );
+
+        try std.fs.Dir.copyFile(
+            std.fs.cwd(),
+            "website/favicon.ico",
+            root_dir,
+            "favicon.ico",
+            .{},
+        );
 
         try website.renderHtmlFile("website/index.htm", root_dir, "index.htm");
+        try website.renderHtmlFile("website/getting-started.htm", root_dir, "getting-started.htm");
 
         try website.renderArticleIndex(root_dir, "articles.htm");
 

src/style.css

@@ -58,6 +58,7 @@ h1:hover a, h2:hover a, h3:hover a, h4:hover a, h5:hover a, h6:hover a {
 }*/
 
 @import "https://rsms.me/inter/inter.css";
+@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css";
 
 html {
     font-family: "Inter", "Arial", sans-serif
@@ -170,3 +171,16 @@ strong a {
     width: 80%;
     padding: 40px
 }
+
+a[href^="http"]::after,
+a[href^="https://"]::after {
+    content: "";
+    width: 11px;
+    height: 11px;
+    margin-left: 4px;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' stroke='%235c8ebf' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    display: inline-block;
+}

website/getting-started.htm

@@ -0,0 +1,51 @@
+<div id="intro">
+    <nav id="intro-nav">
+        <h1><a href="/">zig embedded group</a> - learn</h1>
+        <img src="img/ember.svg" alt="vectorized Ember, the awesome zeg mascot!">
+    </nav>
+
+    <div id="intro-grid">
+
+        <div>
+            <h2>example projects</h2>
+
+            <ul class="bars">
+                <li><a href="https://github.com/ZigEmbeddedGroup/getting-started-pico-zig">Getting started with Zig on
+                        the Raspberry Pi Pico
+                    </a></li>
+            </ul>
+        </div>
+
+        <div>
+            <h2>microzig examples</h2>
+
+            <ul class="bars">
+                <li><a href="https://github.com/ZigEmbeddedGroup/microzig/blob/main/tests/minimal.zig">Minimal File</a>
+                </li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/microzig/blob/main/tests/blinky.zig">Blinky</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/microzig/blob/main/tests/uart-sync.zig">Synchronous
+                        UART Example</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/microzig/blob/main/tests/interrupt.zig">Interrupts</a>
+                </li>
+            </ul>
+        </div>
+
+        <div>
+            <h2>external tutorials</h2>
+
+            <ul class="bars">
+                <li><a
+                        href="https://www.digikey.be/en/maker/projects/raspberry-pi-pico-and-rp2040-cc-part-2-debugging-with-vs-code/470abc7efb07432b82c95f6f67f184c0">Raspberry
+                        Pi Pico and RP2040: Debugging with VS Code</a></li>
+                <li><a
+                        href="https://paramaggarwal.medium.com/converting-an-stm32f103-board-to-a-black-magic-probe-c013cf2cc38c">Converting
+                        an STM32F103 board to a Black Magic Probe</a></li>
+            </ul>
+        </div>
+
+    </div>
+
+    <footer>
+        <img src="img/ember.svg" alt="vectorized Ember, the awesome zeg mascot!">
+    </footer>
+</div>

website/index.htm

@@ -22,9 +22,8 @@
             <h2>important links</h2>
 
             <ul class="bars">
-                <li><strong><a href="#">documentation / getting started</a></strong></li>
+                <li><strong><a href="getting-started.htm">documentation / getting started</a></strong></li>
-                <li><a href="#">tutorials</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/">code</a></li>
-                <li><a href="#">code</a></li>
             </ul>
         </div>
 
@@ -32,24 +31,25 @@
             <h2>community</h2>
 
             <ul class="bars">
-                <li><a href="#">zig language discord</a></li>
+                <li><a href="https://discord.gg/TyzJXjser6">zig language discord</a></li>
-                <li><a href="#">zig embedded group discord</a></li>
+                <li><a href="https://discord.gg/zqa3fgv6Ma">zig embedded group discord</a></li>
             </ul>
         </div>
 
         <div>
-            <h2>articles</h2>
+            <h2>projects</h2>
 
             <ul class="bars">
-                <li><a href="#">article 1</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/microzig/">microzig - Cross-Device Embedded
-                <li><a href="#">article 2</a></li>
+                        Framework</a></li>
-                <li><a href="#">article 3</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/regz/">regz - SVD and ATDF Code Generator</a></li>
-                <li><a href="#">read more...</a></li>
+                <li><a href="https://github.com/ZigEmbeddedGroup/uf2">uf2 - Generate UF2 files in your build</a></li>
+                <li><a href="https://github.com/orgs/ZigEmbeddedGroup/repositories">read more…</a></li>
             </ul>
         </div>
 
         <div>
-            <h2>members</h2>
+            <h2>core members</h2>
 
             <ul class="bars">
                 <li><a href="https://github.com/MasterQ32/">Felix &quot;xq&quot; Queißner</a></li>