5 files changed, 135 insertions(+), 27 deletions(-)

M .gitignore
M build.exs
M src/index.css
M src/index.html
A src/index.js

@@ 1,1 1,24 @@
-build>
\ No newline at end of file
+# The directory Mix will write compiled artifacts to.
+/_build/
+
+# If you run "mix test --cover", coverage assets end up here.
+/cover/
+
+# The directory Mix downloads your dependencies sources to.
+/deps/
+
+# Where third-party dependencies like ExDoc output generated docs.
+/doc/
+
+# Temporary files, for example, from tests.
+/tmp/
+
+# If the VM crashes, it generates a dump, let's ignore it too.
+erl_crash.dump
+
+# Also ignore archive artifacts (built via "mix archive.build").
+*.ez
+
+# Ignore package tarball (built via "mix hex.build").
+www-*.tar
+

@@ 1,4 1,14 @@
 defmodule Builders do
+  require EEx
+
+  binfo_template = """
+  commit=<%= commit %>
+  lightningcss=<%= lightningcss %>
+  html_minifer_next=<%= html_minifier_next %>
+  uglifyjs=<%= uglifyjs %>
+  build_time=<%= build_time %>
+  """
+
   def html(input_path) do
     output_path = String.replace_prefix(input_path, "src", "build")
 


@@ 22,19 32,58 @@ defmodule Builders do
     ])
   end
 
+  def js(input_path) do
+    output_path = String.replace_prefix(input_path, "src", "build")
+
+    System.cmd("uglifyjs", [
+      "-c",
+      "-o",
+      output_path,
+      input_path
+    ])
+  end
+
   # TODO: js support :)
+
+  EEx.function_from_string(
+    :def,
+    :build_info,
+    binfo_template,
+    [
+      :commit,
+      :lightningcss,
+      :html_minifier_next,
+      :uglifyjs,
+      :build_time
+    ]
+  )
 end
 
-File.rm_rf("build")
+commit =
+  System.cmd("git", ["rev-parse", "HEAD"])
+  |> elem(0)
+  |> String.trim()
 
-case File.mkdir("build") do
-  :ok -> {}
-  _ -> raise "Couldn't create build folder"
-end
+lightningcss =
+  System.cmd("lightningcss", ["-V"])
+  |> elem(0)
+  |> String.trim()
 
-case File.mkdir("build/static") do
+html_minifier_next =
+  System.cmd("html-minifier-next", ["-V"])
+  |> elem(0)
+  |> String.trim()
+
+uglifyjs =
+  System.cmd("uglifyjs", ["-V"])
+  |> elem(0)
+  |> String.trim()
+
+File.rm_rf("build")
+
+case File.mkdir_p("build/static") do
   :ok -> {}
-  _ -> raise "Couldn't create build/static folder"
+  _ -> raise "Couldn't create the build file structure (/build/static)"
 end
 
 Path.wildcard("src/**/*.html")


@@ 45,6 94,19 @@ Path.wildcard("src/**/*.css")
 |> Task.async_stream(fn file -> Builders.css(file) end)
 |> Enum.to_list()
 
+Path.wildcard("src/**/*.js")
+|> Task.async_stream(fn file -> Builders.js(file) end)
+|> Enum.to_list()
+
 Path.wildcard("static/**/*")
 |> Task.async_stream(fn file -> File.cp(file, "build/" <> file) end)
 |> Enum.to_list()
+
+build_time =
+  DateTime.utc_now()
+  |> Calendar.strftime("%H:%M:%S %d/%m/%y")
+
+File.write(
+  "build/info.txt",
+  Builders.build_info(commit, lightningcss, html_minifier_next, uglifyjs, build_time)
+)

@@ 1,7 1,8 @@
-@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Gothic+A1&family=Space+Grotesk:wght@300..700&display=swap');
 
 :root {
-    --bg-colour: #32174D;
+    --bg-colour: #272640;
+    --txt-colour: #fae9d3;
 }
 
 body,


@@ 10,38 11,48 @@ html {
     margin: 0px;
 }
 
-#title>h1,
-h3 {
+h1 {
     margin: 0px;
-    transform: scale(0.79, 1.0);
 }
 
-#title>h3 {
-    text-align: right;
+#mark {
+    font-family: "Space Grotesk", sans-serif;
+    font-optical-sizing: auto;
+    font-weight: 300;
+    font-style: normal;
+    display: inline-block;
+    color: var(--txt-colour);
+    margin-top: 1em;
+    margin-left: 1em;
 }
 
-h1 {
+#mark>h3 {
     margin: 0px;
-    font-family: "Avenir Next Condensed";
-    font-weight: normal;
+    text-align: right;
+    font-weight: 300;
 }
 
-#title {
-    font-family: 'Times New Roman', Times, 'serif' !important;
-    font-weight: bold;
-    display: inline-block;
-    color: #E0E0E0;
+#mark>h1 {
+    font-weight: 400;
 }
 
 #content {
-    font-family: "Avenir Next";
-    color: #E0E0E0;
+    font-family: "Gothic A1", sans-serif;
+    color: var(--txt-colour);
     position: absolute;
     top: 0px;
     left: 0px;
     width: 100vw;
 }
 
+#main-focus>h2 {
+    font-weight: normal;
+}
+
+#main-focus>p {
+    font-weight: lighter;
+}
+
 #main-focus {
     background-color: #00000080;
     width: 50vw;

@@ 6,10 6,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>home - m1kadev.nl</title>
     <link rel="stylesheet" href="/index.css">
+    <script src="/index.js" defer></script>
 </head>
 
 <body>
-    <div id="title">
+    <div id="mark">
         <h3>.nl</h3>
         <h1>m1kadev</h1>
     </div>


@@ 24,7 25,8 @@
             <hr>
             <footer>
                 <div id="metadata">
-                    <p>Deployed from commit $WWW_COMMIT</p>
+                    <p>Deployed from commit <code><span id="from-commit"></span></code>, on <span
+                            id="build-date"></span> </p>
                 </div>
                 <div id="lynx">
                     <a href="https://github.com/m1kadev">

@@ 0,0 1,10 @@
+const fromCommit = document.getElementById("from-commit");
+const buildDate = document.getElementById("build-date");
+
+fetch("/info.txt").then(async data => {
+   const res = await data.text();
+   let map = new Map();
+   res.split("\n").map(x => x.split("=", 2)).map(([k, v]) => map[k] = v);
+   fromCommit.innerHTML = " " + map["commit"].substr(0, 8);
+   buildDate.innerHTML = " " + map["build_time"];
+});