]> git.za3k.com Git - za3k.git/commitdiff
projects / za3k.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: b44c5a2)
Hackaday
authorZachary Vance <za3k@za3k.com>
Sat, 19 Nov 2022 03:25:10 +0000 (22:25 -0500)
committerZachary Vance <za3k@za3k.com>
Sat, 19 Nov 2022 03:25:10 +0000 (22:25 -0500)
20 files changed:
hackaday.css [new file with mode: 0644] patch | blob
hackaday.html [new file with mode: 0644] patch | blob
img/hackaday01.png [new file with mode: 0644] patch | blob
img/hackaday02.png [new file with mode: 0644] patch | blob
img/hackaday03.png [new file with mode: 0644] patch | blob
img/hackaday04.png [new file with mode: 0644] patch | blob
img/hackaday05.png [new file with mode: 0644] patch | blob
img/hackaday06.png [new file with mode: 0644] patch | blob
img/hackaday07.png [new file with mode: 0644] patch | blob
img/hackaday08.png [new file with mode: 0644] patch | blob
img/hackaday09.png [new file with mode: 0644] patch | blob
img/hackaday10.png [new file with mode: 0644] patch | blob
img/hackaday11.png [new file with mode: 0644] patch | blob
img/hackaday13.png [new file with mode: 0644] patch | blob
img/hackaday14.png [new file with mode: 0644] patch | blob
img/hackaday15.png [new file with mode: 0644] patch | blob
img/hackaday16.png [new file with mode: 0644] patch | blob
img/hackaday17.png [new file with mode: 0644] patch | blob
img/hackaday18.png [new file with mode: 0644] patch | blob
img/star.svg [new file with mode: 0644] patch | blob

diff --git a/hackaday.css b/hackaday.css
new file mode 100644 (file)
index 0000000..9fc0f96
--- /dev/null
+++ b/hackaday.css
@@ -0,0 +1,86 @@
+.hacks {
+    margin: 0 auto;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    max-width: 1000px;
+    max-width:60%;
+    flex: 1 1 auto;
+}
+.hack {
+    display: inline-block;
+    width: 202px;
+    margin: 20px;
+    text-align: center;
+    margin: 15px 30px 15px 30px;
+}
+.hack > * {
+    display: block;
+}
+.hack.cool {
+    order: -1;
+}
+.hack:last-child {
+    order: -2;
+}
+.hack.cool > *:first-child::before, .hack:last-child > *:first-child::before {
+    content: '';
+    position: absolute;
+    background:url("img/star.svg");
+    background-size: contain;
+    width: 50px;
+    height: 50px;
+    margin-left: -20px;
+    margin-top: -20px;
+    z-index: 1;
+    display: block;
+    filter: hue-rotate(90deg);
+    border: 1px solid rgba(1, 1, 1, 0.1);
+    background-color: rgba(255, 255, 255, 0.9);
+    border-radius: 100%;
+}
+.hack:last-child > *:first-child::before {
+    transform: scale(0.5) translate(-5px, -5px);
+    filter: hue-rotate(180deg);
+}
+
+.thumb > img {
+    border: 1px solid lightgrey;
+    border-radius: 15px;
+    width: 200px;
+    height: 200px;
+}
+.hack .name {
+    font-size: x-large;
+}
+
+.hack .date {
+    /*display: none;*/
+    font-size: x-small;
+    text-align: center;
+    color: grey;
+}
+.hack .date::before {
+    content: "Nov ";
+}
+.hack .date::after {
+    content: ", 2022";
+}
+
+.hack .description {
+    margin-top: 10px;
+    font-style: italic;
+    display: inline-block;
+    /*
+    border: 1px solid rgba(0,0,1,0.5);
+    border-radius: 15px;
+    background: rgba(100, 100, 255, 0.2);
+    box-shadow: 2px 2px 10px rgba(1, 1, 1, 0.3);
+    padding: 5px 10px 5px 10px;
+    max-width: 60%;
+    */
+}
+
+a.blog, a.demo, a.source { /* Display source links only if demos break */
+    display: none;
+}
diff --git a/hackaday.html b/hackaday.html
new file mode 100644 (file)
index 0000000..f4ea136
--- /dev/null
+++ b/hackaday.html
@@ -0,0 +1,200 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>za3k.com - hackaday</title>
+    <link rel="stylesheet" type="text/css" href="hackaday.css">
+    <meta content="width=device-width, initial-scale=1" name="viewport" />
+</head>
+<body>
+    <div class="nav"><a href="/">za3k</a> &gt; <a href="/software">software</a> &gt; hack-a-day</div>
+    <section class="hacks">
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/blog" class="thumb"><img src="img/hackaday03.png"></a>
+            <span class="name">Hack-A-Blog</span>
+            <span class="date">03</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/blog">demo</a>
+                <a class="source" href="https://github.com/za3k/day03_blog">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-blog/">blog</a>
+            </span>
+            <span class="description">a blog for anyone</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/chat/" class="thumb"><img src="img/hackaday04.png"></a>
+            <span class="name">Hack-A-Chat</span>
+            <span class="date">04</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/chat">demo</a>
+                <a class="source" href="https://github.com/za3k/day04_chat">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-chat/">blog</a>
+            </span>
+            <span class="description">an online chatroom</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/paste" class="thumb"><img src="img/hackaday05.png"></a>
+            <span class="name">Hack-A-Paste</span>
+            <span class="date">05</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/paste">demo</a>
+                <a class="source" href="https://github.com/za3k/day05_paste">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-paste/">blog</a>
+            </span>
+            <span class="description">a pastebin</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/link" class="thumb"><img src="img/hackaday02.png"></a>
+            <span class="name">Hack-A-Link</span>
+            <span class="date">05</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/link">demo</a>
+                <a class="source" href="https://github.com/za3k/day02_link">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-link/">blog</a>
+            </span>
+            <span class="description">a link shortener</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/homepage" class="thumb"><img src="img/hackaday01.png"></a>
+            <span class="name">Hack-A-Homepage</span>
+            <span class="date">05</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/homepage">demo</a>
+                <a class="source" href="https://github.com/za3k/day01_homepage">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-homepage/">blog</a>
+            </span>
+            <span class="description">make your own homepage</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/icecube" class="thumb"><img src="img/hackaday06.png"></a>
+            <span class="name">Hack-An-Icecube</span>
+            <span class="date">06</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/icecube">demo</a>
+                <a class="source" href="https://github.com/za3k/day06_icecube">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-an-icecube/">blog</a>
+            </span>
+            <span class="description">icecubes fall</span>
+        </div>
+        <div class="hack cool">
+            <a href="https://tilde.za3k.com/hackaday/asteroid" class="thumb"><img src="img/hackaday07.png"></a>
+            <span class="name">Hack-An-Asteroid</span>
+            <span class="date">07</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/asteroid">demo</a>
+                <a class="source" href="https://github.com/za3k/day07_asteroid">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-an-asteroid/">blog</a>
+            </span>
+            <span class="description">asteroids clone</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/dictionary" class="thumb"><img src="img/hackaday08.png"></a>
+            <span class="name">Hack-A-Dictionary</span>
+            <span class="date">08</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/dictionary">demo</a>
+                <a class="source" href="https://github.com/za3k/day08_dictionary">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-dictionary/">blog</a>
+            </span>
+            <span class="description">look up words</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/mandelbrot" class="thumb"><img src="img/hackaday09.png"></a>
+            <span class="name">Hack-A-Mandelbrot</span>
+            <span class="date">09</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/mandelbrot">demo</a>
+                <a class="source" href="https://github.com/za3k/day09_mandelbrot">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-mandelbrot/">blog</a>
+            </span>
+            <span class="description">explore fractals</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/machine" class="thumb"><img src="img/hackaday10.png"></a>
+            <span class="name">Hack-A-Machine</span>
+            <span class="date">10</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/machine">demo</a>
+                <a class="source" href="https://github.com/za3k/day10_machine">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-machine/">blog</a>
+            </span>
+            <span class="description">goofy machine with assembly</span>
+        </div>
+        <div class="hack cool">
+            <a href="https://tilde.za3k.com/hackaday/tile" class="thumb"><img src="img/hackaday11.png"></a>
+            <span class="name">Hack-A-Tile</span>
+            <span class="date">11</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/tile">demo</a>
+                <a class="source" href="https://github.com/za3k/day11_tile">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-tile/">blog</a>
+            </span>
+            <span class="description">arrange matching tiles</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/line" class="thumb"><img src="img/hackaday13.png"></a>
+            <span class="name">Hack-A-Line</span>
+            <span class="date">13</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/line">demo</a>
+                <a class="source" href="https://github.com/za3k/day13_line">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-line/">blog</a>
+            </span>
+            <span class="description">get 5-in-a-row with a friend</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/stats" class="thumb"><img src="img/hackaday14.png"></a>
+            <span class="name">Hack-A-Stats</span>
+            <span class="date">14</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/stats">demo</a>
+                <a class="source" href="https://github.com/za3k/day14_stats">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-stats/">blog</a>
+            </span>
+            <span class="description">see how hack-a-day is doing</span>
+        </div>
+        <div class="hack cool">
+            <a href="https://tilde.za3k.com/hackaday/sound" class="thumb"><img src="img/hackaday15.png"></a>
+            <span class="name">Hack-A-Sound</span>
+            <span class="date">15</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/sound">demo</a>
+                <a class="source" href="https://github.com/za3k/day15_sound">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-sound/">blog</a>
+            </span>
+            <span class="description">play with sounds and make tracks</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/song" class="thumb"><img src="img/hackaday16.png"></a>
+            <span class="name">Hack-A-Song</span>
+            <span class="date">16</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/song">demo</a>
+                <a class="source" href="https://github.com/za3k/day16_song">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-song/">blog</a>
+            </span>
+            <span class="description">play 'greensleeves'</span>
+        </div>
+        <div class="hack cool">
+            <a href="https://tilde.za3k.com/hackaday/tank" class="thumb"><img src="img/hackaday17.png"></a>
+            <span class="name">Hack-A-Tank</span>
+            <span class="date">17</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/tank">demo</a>
+                <a class="source" href="https://github.com/za3k/day17_tank">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-tank/">blog</a>
+            </span>
+            <span class="description">relax and play with fish</span>
+        </div>
+        <div class="hack">
+            <a href="https://tilde.za3k.com/hackaday/crop" class="thumb"><img src="img/hackaday18.png"></a>
+            <span class="name">Hack-A-Crop</span>
+            <span class="date">18</span>
+            <span class="links">
+                <a class="demo" href="https://tilde.za3k.com/hackaday/crop">demo</a>
+                <a class="source" href="https://github.com/za3k/day18_crop">source</a>
+                <a class="blog" href="https://blog.za3k.com/hack-a-day-hack-a-crop/">blog</a>
+            </span>
+            <span class="description">crop images</span>
+        </div>
+    </section>
+</body>
+</html>
diff --git a/img/hackaday01.png b/img/hackaday01.png
new file mode 100644 (file)
index 0000000..720af8d
Binary files /dev/null and b/img/hackaday01.png differ
diff --git a/img/hackaday02.png b/img/hackaday02.png
new file mode 100644 (file)
index 0000000..2d6dbda
Binary files /dev/null and b/img/hackaday02.png differ
diff --git a/img/hackaday03.png b/img/hackaday03.png
new file mode 100644 (file)
index 0000000..42b49d4
Binary files /dev/null and b/img/hackaday03.png differ
diff --git a/img/hackaday04.png b/img/hackaday04.png
new file mode 100644 (file)
index 0000000..4bc3001
Binary files /dev/null and b/img/hackaday04.png differ
diff --git a/img/hackaday05.png b/img/hackaday05.png
new file mode 100644 (file)
index 0000000..68aa3a6
Binary files /dev/null and b/img/hackaday05.png differ
diff --git a/img/hackaday06.png b/img/hackaday06.png
new file mode 100644 (file)
index 0000000..b50b609
Binary files /dev/null and b/img/hackaday06.png differ
diff --git a/img/hackaday07.png b/img/hackaday07.png
new file mode 100644 (file)
index 0000000..3de5673
Binary files /dev/null and b/img/hackaday07.png differ
diff --git a/img/hackaday08.png b/img/hackaday08.png
new file mode 100644 (file)
index 0000000..b6e9fde
Binary files /dev/null and b/img/hackaday08.png differ
diff --git a/img/hackaday09.png b/img/hackaday09.png
new file mode 100644 (file)
index 0000000..697795d
Binary files /dev/null and b/img/hackaday09.png differ
diff --git a/img/hackaday10.png b/img/hackaday10.png
new file mode 100644 (file)
index 0000000..6277f87
Binary files /dev/null and b/img/hackaday10.png differ
diff --git a/img/hackaday11.png b/img/hackaday11.png
new file mode 100644 (file)
index 0000000..892234b
Binary files /dev/null and b/img/hackaday11.png differ
diff --git a/img/hackaday13.png b/img/hackaday13.png
new file mode 100644 (file)
index 0000000..93537b5
Binary files /dev/null and b/img/hackaday13.png differ
diff --git a/img/hackaday14.png b/img/hackaday14.png
new file mode 100644 (file)
index 0000000..6a6fc45
Binary files /dev/null and b/img/hackaday14.png differ
diff --git a/img/hackaday15.png b/img/hackaday15.png
new file mode 100644 (file)
index 0000000..5ef6fb3
Binary files /dev/null and b/img/hackaday15.png differ
diff --git a/img/hackaday16.png b/img/hackaday16.png
new file mode 100644 (file)
index 0000000..3ec3922
Binary files /dev/null and b/img/hackaday16.png differ
diff --git a/img/hackaday17.png b/img/hackaday17.png
new file mode 100644 (file)
index 0000000..db93236
Binary files /dev/null and b/img/hackaday17.png differ
diff --git a/img/hackaday18.png b/img/hackaday18.png
new file mode 100644 (file)
index 0000000..4c98757
Binary files /dev/null and b/img/hackaday18.png differ
diff --git a/img/star.svg b/img/star.svg
new file mode 100644 (file)
index 0000000..b4fb5be
--- /dev/null
+++ b/img/star.svg
@@ -0,0 +1 @@
+<svg width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1728 647q0 22-26 48l-363 354 86 500q1 7 1 20 0 21-10.5 35.5t-30.5 14.5q-19 0-40-12l-449-236-449 236q-22 12-40 12-21 0-31.5-14.5t-10.5-35.5q0-6 2-20l86-500-364-354q-25-27-25-48 0-37 56-46l502-73 225-455q19-41 49-41t49 41l225 455 502 73q56 9 56 46z" fill="#FFB940"/></svg>
za3k.com source code