automate project structure

15 files changed, 0 insertions, 818 deletions

diff --git a/mod/web/blog/.gitignore b/mod/web/blog/.gitignore
deleted file mode 100644
index decc3f8..0000000
--- a/mod/web/blog/.gitignore
+++ /dev/null
@@ -1,2 +0,0 @@
-public/
-nohup.out
diff --git a/mod/web/blog/config.toml b/mod/web/blog/config.toml
deleted file mode 100644
index 69c389b..0000000
--- a/mod/web/blog/config.toml
+++ /dev/null
@@ -1,8 +0,0 @@
-base_url = "https://4kb.net"
-build_search_index = false
-compile_sass = false
-generate_feeds = true
-minify_html = true
-
-[markdown]
-highlight_code = false
diff --git a/mod/web/blog/content/posts/_index.md b/mod/web/blog/content/posts/_index.md
deleted file mode 100644
index 9efc62e..0000000
--- a/mod/web/blog/content/posts/_index.md
+++ /dev/null
@@ -1,6 +0,0 @@
-+++
-title = "Posts"
-sort_by = "date"
-page_template = "post.html"
-redirect_to="/"
-+++
diff --git a/mod/web/blog/content/posts/deterministic-hostnames.md b/mod/web/blog/content/posts/deterministic-hostnames.md
deleted file mode 100644
index 43dc7d8..0000000
--- a/mod/web/blog/content/posts/deterministic-hostnames.md
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: "Deterministic and unique network hostnames"
-date: "2024-11-10"
----
-
-As part of building out a Kubernetes cluster, I wanted to build and distribute a
-single OS image to create stateless worker nodes. Using network booting, and
-some clever tricks to differentiate nodes, we can create a scaleable and
-efficient farm of workers for a cluster that don't even need disks.
-
-The idea came from a plan to build a cluster using the
-[compute blade](https://computeblade.com/), and a few Raspberry Pi SBCs I
-already own. Running the cluster from an SD card is not recommended due to the
-not-so-great reliability of the flash used by most manufacturers, so I wanted to
-try PXE booting each Pi to save money rather than purchasing an SSD for each
-one. The compute blades do support an NVMe disk, but I plan to use those for a
-storage cluster later, so they need to remain empty.
-
-## Base image
-
-Alpine Linux has been my preferred server OS for a long time. It provides a very
-lightweight base system, and bundles an excellent bootstrapping system,
-[apkovl](https://wiki.alpinelinux.org/wiki/Alpine_local_backup), that allows the
-user to save a set of customisations to an system as an overlay to a stock
-Alpine live image. In other words, we can create our image once, save the
-changes as an `apkovl.tar.gz` file, and apply the same changes to a base system
-on boot. This file can even be provided as a
-[kernel parameter](https://wiki.alpinelinux.org/wiki/PXE_boot#Guide_to_options)
-and will be fetched from a remote webserver automatically!
-
-Since the image and configuration will be shipped to the node via the network,
-an added benefit of using Alpine is its tiny space consumption. I'm not using
-enough nodes for this to really matter, but it's a cool optimization regardless.
-
-## Differentiating the nodes
-
-One of the main goals of this project is that there should be no persistent
-storage required outside the boot image itself. Since every node will download
-and generate the same root file-system on startup, the first problem that arises
-is how the nodes will identify themselves both on the network and the cluster,
-given that it's not possible to name them ahead of time. In other words, any
-given node has to generate a unique hostname that won't collide with other
-workers, and that will be the same each time that node boots.
-
-Since these nodes will not have a predefined name, we have to rely on
-characteristics of the hardware to differentiate each one. The hardware MAC
-address is perfect for this, since it's unique to to each node and will not be
-wiped away after the node reboots. On a system like Linux that exposes its
-hardware through a _sysfs_, we can find a file containing the address at
-`/sys/class/net/eth0/address`. I don't really like the idea of attaching the
-literal MAC address of the node to its network hostname, since it's a security
-risk, and a bit too verbose. Instead, we can transform it into something safer
-using a `sha1sum`, which is already present on our Alpine base system:
-
-```console
-sha1sum /sys/class/net/eth0/address | head -c 6 | awk '{print "worker-" $0}'
-```
-
-### Applying the new name
-
-Ideally, the node should apply its generated hostname before reaching out for an
-address over DHCP or joining the cluster. We can make sure it happens before any
-traffic is sent out by adding a `pre-up` command to the right interface in
-`/etc/network/interfaces`:
-
-```
-
-...
-
-auto eth0
-iface eth0 inet dhcp
-    pre-up sha1sum /sys/class/net/eth0/address | head -c 6 | awk '{print "worker-" $0}' > /etc/hostname
-
-...
-```
-
-The VM I tested with looks outputs `worker-e2fae8`. Pretty clean result, and if
-you want to know the physical node that maps to each hostname, you can take note
-of the MAC address beforehand and generate the same hash on another computer to
-match them up.
diff --git a/mod/web/blog/content/posts/nohup.md b/mod/web/blog/content/posts/nohup.md
deleted file mode 100644
index 64f7983..0000000
--- a/mod/web/blog/content/posts/nohup.md
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: "Spawning background processes"
-date: "2024-11-17"
----
-
-Working in a terminal,
-I often pair my editor with a background process watching files.
-Before reaching for terminal multiplexers,
-see if you can get away with simple tty job control.
-Spawn the background process,
-still attached to the terminal instance:
-
-```
-program args &
-```
-
-Also redirect its output to a file,
-for when the process writes to the tty from the background:
-
-```
-nohup program args &
-```
-
-Extra reading:
-
-- <https://jvns.ca/blog/2024/07/03/reasons-to-use-job-control/>
diff --git a/mod/web/blog/content/posts/stateless-compute-networks.md b/mod/web/blog/content/posts/stateless-compute-networks.md
deleted file mode 100644
index bac9e5d..0000000
--- a/mod/web/blog/content/posts/stateless-compute-networks.md
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: "On stateless compute networks"
-date: "2024-11-10"
-draft: true
----
-
-On the topic of distributed systems and clustering,
-I am quite invested in the idea of compute nodes that rely entirely on the network for configuration.
-Arbitrary nodes can join a pre-existing cluster,
-offering their CPU time and memory for computation without relying on any pre-existing configuration on the node itself.
-In other words, any computer could pick up work,
-only needing power and a network connection to the cluster.
-
-Perhaps this eventually leads into a "self-healing" cluster where only one node is manually bootstrapped,
-which then serves a _configuration endpoint_ for other stateless nodes to reach out to for their instructions,
-which they will then also serve once they are themselves ready.
-
-Early revisions of these notes mention Kubernetes,
-but I am also trying to achieve similar results with NixOS on a custom project.
-In any case, these are my ever-updating notes towards a general implementation of a stateless distributed systems architecture.
-
-## Self healing cluster
-
-Assuming control of an external DHCP server,
-a self healing Kubernetes cluster would be feasible,
-with the PXE boot artifacts supplied by the cluster itself.
-That is, as long as one node is running the pod hosting the artifacts on a given endpoint,
-other nodes can boot those artifacts and join the cluster,
-thereby being able to host the artifacts as well.
-
-## Configuration endpoint
-
-The nodes shouldn't require a disk installed to be able to join the network.
-Rather, the lofty goal of zero-configuration compute nodes passes the job of node initialization to the supporting network.
-This is accomplished with PXE boot instructions supplied over DHCP.
-
-I delegate the following tasks to a single node in the subnet:
-
-- Gateway: Optional outbound connections if required
-- DHCP server: Cluster IPAM
-- TFTP and HTTP server: Serves iPXE firmware and kernel/initrd artifacts
diff --git a/mod/web/blog/content/posts/vim-compilers.md b/mod/web/blog/content/posts/vim-compilers.md
deleted file mode 100644
index f735228..0000000
--- a/mod/web/blog/content/posts/vim-compilers.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: "Neovim's built-in compilers"
-date: "2025-01-17"
----
-
-Today I learned that neovim's `:make` comes with many
-[backends](https://neovim.io/doc/user/quickfix.html#_6.-selecting-a-compiler)
-already configured.
-This works for checking c/cpp and python files, among other, but I was
-most interested to see [Typst] and [Pandoc] listed as well.
-
-I was looking to add this functionality with a plugin or implementing it
-manually,
-where a document can be compiled on the fly from the editor.
-After setting `:compiler pandoc`,
-generating a pdf is done with `:make pdf`,
-with other pandoc options just appended afterwards if needed.
-
-[typst]: https://typst.app
-[pandoc]: https://github.com/jgm/pandoc
diff --git a/mod/web/blog/default.nix b/mod/web/blog/default.nix
deleted file mode 100644
index 1f91a68..0000000
--- a/mod/web/blog/default.nix
+++ /dev/null
@@ -1,30 +0,0 @@
-{ pkgs, depot, ... }:
-let
-  inherit (pkgs)
-    symlinkJoin
-    ;
-
-  posts = pkgs.stdenvNoCC.mkDerivation {
-    pname = "4kb.net";
-    version = "1.0";
-    src = ./.;
-
-    nativeBuildInputs = with pkgs; [
-      zola
-    ];
-
-    buildPhase = "zola build";
-    installPhase = ''
-      mkdir -p $out
-      cp -r public/* $out/
-    '';
-  };
-
-in
-symlinkJoin {
-  name = "site";
-  paths = [
-    posts
-    depot.misc.cv
-  ];
-}
diff --git a/mod/web/blog/templates/404.html b/mod/web/blog/templates/404.html
deleted file mode 100644
index a4669df..0000000
--- a/mod/web/blog/templates/404.html
+++ /dev/null
@@ -1,9 +0,0 @@
-{% extends "base.html" %}
-
-{% block content %}
-<head>
-  <title>Error 404!</title>
-</head>
-
-404!
-{% endblock content %}
diff --git a/mod/web/blog/templates/base.html b/mod/web/blog/templates/base.html
deleted file mode 100644
index 5a91df5..0000000
--- a/mod/web/blog/templates/base.html
+++ /dev/null
@@ -1,88 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>{% block title %}4kb.net{% endblock title %}</title>
-  </head>
-  <style>
-    :root {
-      --bg: #181616;
-      --fg: #c5c9c5;
-      --link: #76946a;
-      --linkhover: #98bb6c;
-    }
-
-    html {
-      scroll-behavior: smooth;
-      color-scheme: dark;
-    }
-
-    body {
-      font-family: serif;
-      padding: 0 0.75em;
-      max-width: 42em;
-      margin: auto;
-      background: var(--bg);
-      color: var(--fg);
-    }
-
-    p {
-      line-height: 1.3em;
-    }
-
-    th,
-    td {
-      padding: 0.2em 0.4em;
-      border: thin solid;
-    }
-
-    table {
-      border: thin solid;
-      border-collapse: collapse;
-    }
-
-    a,
-    a:link {
-      color: var(--link);
-    }
-
-    a:hover {
-      color: var(--linkhover);
-    }
-
-    article img {
-      display: block;
-      margin: 0 auto;
-      max-width: 80%;
-      height: auto;
-      object-fit: contain;
-    }
-
-    pre {
-      padding: 1em;
-      overflow-x: scroll;
-    }
-  </style>
-  <body>
-    <header
-      style="
-        margin: 3em 0 3em 0;
-        display: flex;
-        gap: 8px;
-        flex-direction: column;
-        font-family: monospace;
-      "
-    >
-      <span
-        >Kleidi Bujari <<a href="mailto:mail@4kb.net">mail@4kb.net</a>></span
-      >
-      <nav style="display: flex; gap: 8px">
-        <span><a href="/">4kb.net</a> |</span>
-        <a target="_blank" href="https://github.com/kbujari">git</a>
-        <a href="/atom.xml">rss</a>
-      </nav>
-    </header>
-    <main>{% block content %} {% endblock %}</main>
-  </body>
-</html>
diff --git a/mod/web/blog/templates/index.html b/mod/web/blog/templates/index.html
deleted file mode 100644
index 6e8a2af..0000000
--- a/mod/web/blog/templates/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
-{% extends "base.html" %} {% block content %}
-
-<div>
-  {% set section = get_section(path="posts/_index.md") %}
-
-  <ul style="list-style: none; padding-left: 0">
-    {% for page in section.pages %}
-    <li style="display: flex; gap: 1em; margin-bottom: 0.3em">
-      <span sty>{{ page.date }}</span>
-      <a href="{{ page.permalink | safe }}">{{ page.title }}</a>
-    </li>
-    {% endfor %}
-  </ul>
-
-  {% endblock content %}
-</div>
diff --git a/mod/web/blog/templates/post.html b/mod/web/blog/templates/post.html
deleted file mode 100644
index b819520..0000000
--- a/mod/web/blog/templates/post.html
+++ /dev/null
@@ -1,14 +0,0 @@
-{% extends "base.html" %}
-
-{% block title%}
-  {{ page.title }} - {{ super() }}
-{% endblock title %}
-
-{% block content %}
-
-<h1 style="text-align: center">{{ page.title }}</h1>
-<article>
-  {{ page.content | safe }}
-</article>
-
-{% endblock content %}
diff --git a/mod/web/resistors/default.nix b/mod/web/resistors/default.nix
deleted file mode 100644
index 5fca68b..0000000
--- a/mod/web/resistors/default.nix
+++ /dev/null
@@ -1,12 +0,0 @@
-{ pkgs, ... }:
-
-pkgs.stdenvNoCC.mkDerivation {
-  pname = "resistors";
-  version = "0.0";
-  src = ./.;
-
-  buildInputs = [ pkgs.nodePackages.prettier ];
-
-  phases = [ "installPhase" ];
-  installPhase = "mkdir -p $out; cp -r $src/*.{css,html} $out/";
-}
diff --git a/mod/web/resistors/index.html b/mod/web/resistors/index.html
deleted file mode 100644
index 0683f49..0000000
--- a/mod/web/resistors/index.html
+++ /dev/null
@@ -1,339 +0,0 @@
-<!doctype html>
-<head>
-  <meta charset="utf-8" />
-  <title>rs-calc</title>
-  <link rel="stylesheet" href="styles.css" />
-  <meta name="viewport" content="initial-scale=1.0" />
-</head>
-
-<body>
-  <h1>rs-calc</h1>
-
-  <input id="resistor-query" placeholder="e.g. 3.3K" />
-  <label class="resistor-query-label" for="resistor-query">&#8486;</label>
-
-  <div id="resistor-result" style="display: none">
-    <h2>four bands</h2>
-    <div class="resistor-diagram resistor-diagram-4">
-      <div id="resistor-stripe-4-1" class="resistor-stripe"></div>
-      <div id="resistor-stripe-4-2" class="resistor-stripe"></div>
-      <div id="resistor-stripe-4-3" class="resistor-stripe"></div>
-      <div id="resistor-stripe-4-4" class="resistor-stripe">
-        &nbsp;<br />&nbsp;
-      </div>
-      <div
-        class="resistor-stripe-tolerance resistor-stripe"
-        style="color: #000; background-color: #cfb53b"
-      >
-        gold<br />&plusmn;5%
-      </div>
-    </div>
-    <h2>five bands</h2>
-    <div class="resistor-diagram resistor-diagram-5">
-      <div id="resistor-stripe-5-1" class="resistor-stripe"></div>
-      <div id="resistor-stripe-5-2" class="resistor-stripe"></div>
-      <div id="resistor-stripe-5-3" class="resistor-stripe"></div>
-      <div id="resistor-stripe-5-4" class="resistor-stripe"></div>
-      <div
-        class="resistor-stripe-tolerance resistor-stripe"
-        style="color: #fff; background-color: #964b00"
-      >
-        brown<br />&plusmn;1%
-      </div>
-    </div>
-    <h2>surface mount</h2>
-    <div id="resistor-smt-3" class="resistor-smt"></div>
-  </div>
-
-  <footer>
-    <p>
-      forked from
-      <a href="https://github.com/joewalnes/resisto.rs/" target="_blank">this</a
-      >, with removed analytics, cleaned up code.
-      <a href="https://github.com/kleidib" target="_blank">my github</a>
-    </p>
-  </footer>
-</body>
-
-<script>
-  // Resistor calculator.
-  // -Joe Walnes
-  // See resistors-test.html
-
-  var resistors = {};
-
-  // These hex codes came from
-  // http://en.wikipedia.org/wiki/Electronic_color_code
-  resistors.digitsToColors = {
-    "-2": { hex: "#c0c0c0", label: "#000", name: "silver", multiplier: "0.01" },
-    "-1": { hex: "#cfb53b", label: "#000", name: "gold", multiplier: "0.1" },
-    0: { hex: "#000000", label: "#fff", name: "black", figure: "0" },
-    1: {
-      hex: "#964b00",
-      label: "#fff",
-      name: "brown",
-      figure: "1",
-      multiplier: "10",
-    },
-    2: {
-      hex: "#ff0000",
-      label: "#fff",
-      name: "red",
-      figure: "2",
-      multiplier: "100",
-    },
-    3: {
-      hex: "#ffa500",
-      label: "#000",
-      name: "orange",
-      figure: "3",
-      multiplier: "1K",
-    },
-    4: {
-      hex: "#ffff00",
-      label: "#000",
-      name: "yellow",
-      figure: "4",
-      multiplier: "10K",
-    },
-    5: {
-      hex: "#9acd32",
-      label: "#000",
-      name: "green",
-      figure: "5",
-      multiplier: "100K",
-    },
-    6: {
-      hex: "#6495ed",
-      label: "#000",
-      name: "blue",
-      figure: "6",
-      multiplier: "1M",
-    },
-    7: {
-      hex: "#ee82ee",
-      label: "#000",
-      name: "purple",
-      figure: "7",
-      multiplier: "10M",
-    },
-    8: {
-      hex: "#a0a0a0",
-      label: "#000",
-      name: "gray",
-      figure: "8",
-      multiplier: "100M",
-    },
-    9: {
-      hex: "#ffffff",
-      label: "#000",
-      name: "white",
-      figure: "9",
-      multiplier: "1000M",
-    },
-  };
-
-  resistors.query = function (input) {
-    input = input
-      .replace(/ +?/g, "")
-      .replace(/ohm[s]?/, "")
-      .replace(/\u2126/, "")
-      .replace(/\.$/, "");
-
-    var value = this.parseValue(input);
-
-    if (value !== null) {
-      value = this.roundToSignificantPlaces(value, 3);
-
-      if ((value <= 99900000000 && value >= 1) || value === 0) {
-        var colors5 = this.numberTo5ColorDigits(value);
-        var colors4 = this.numberTo4ColorDigits(value);
-        var smt3 = value < 10 ? colors4[0].toString() : colors4.join("");
-        var self = this;
-
-        return {
-          value: value,
-          smt3: smt3,
-          //smt4: smt4,
-          //smtEia96: smtEia96,
-          formatted: this.formatValue(value),
-          colors5: colors5.map(function (d) {
-            return self.digitsToColors[d];
-          }),
-          colors4: colors4.map(function (d) {
-            return self.digitsToColors[d];
-          }),
-        };
-      }
-    }
-
-    return null;
-  };
-
-  /**
-   * Given ohm rating as string (e.g. 3.2m or 3M2), return
-   * integer value (e.g. 3200000).
-   */
-  resistors.parseValue = function (input) {
-    var multiplier = 1;
-    var match;
-
-    if ((match = input.match(/^(\d+)(\.(\d+))?([km])?$/i))) {
-      // e.g. 123, 1.23, 1M, 1.23M
-      var unit = match[4];
-      if (unit) {
-        if (unit == "k" || unit == "K") {
-          multiplier = 1000;
-        }
-        if (unit == "m" || unit == "M") {
-          multiplier = 1000000;
-        }
-      }
-
-      return (match[1] + "." + (match[3] || 0)) * multiplier;
-    } else if ((match = input.match(/^(\d+)([km])(\d+)$/i))) {
-      // e.g. 12K3
-      var unit = match[2];
-      if (unit) {
-        if (unit == "k" || unit == "K") {
-          multiplier = 1000;
-        }
-        if (unit == "m" || unit == "M") {
-          multiplier = 1000000;
-        }
-      }
-      return (match[1] + "." + (match[3] || 0)) * multiplier;
-    } else {
-      return null;
-    }
-  };
-
-  /**
-   * Round a value to significant places.
-   * e.g. (123456789, 3) -> 123000000)
-   *     (0.0045678, 3) -> 0.00457)
-   */
-  resistors.roundToSignificantPlaces = function (value, significant) {
-    if (!value) {
-      return 0;
-    }
-    var nearest = Math.pow(
-      10,
-      Math.floor(Math.log(Math.abs(value)) / Math.log(10)) - (significant - 1),
-    );
-    return Math.round(value / nearest) * nearest;
-  };
-
-  /**
-   * Given ohm rating as integer (e.g. 470000), return
-   * array of color digits (e.g. 4, 7, 0, 3). See digitsTo_Colors.
-   */
-  resistors.numberTo5ColorDigits = function (value) {
-    if (!value) {
-      return [0, 0, 0, 0]; // Special case
-    }
-
-    var precision = 5;
-    var digits = (
-      Math.floor(value * 100 * Math.pow(10, precision)) /
-      Math.pow(10, precision)
-    ).toString();
-    function getDigit(digits, i) {
-      var d = parseInt(digits[i]);
-      return isNaN(d) ? 0 : d;
-    }
-    return [
-      getDigit(digits, 0),
-      getDigit(digits, 1),
-      getDigit(digits, 2),
-      digits.length - 5,
-    ];
-  };
-
-  /**
-   * Given ohm rating as integer (e.g. 470000), return
-   * array of color digits (e.g. 4, 7, 0, 3). See digitsTo_Colors.
-   */
-  resistors.numberTo4ColorDigits = function (value) {
-    if (!value) {
-      return [0, 0, 0]; // Special case
-    }
-
-    var precision = 5;
-    var digits = (
-      Math.floor(value * 100 * Math.pow(10, precision)) /
-      Math.pow(10, precision)
-    ).toString();
-    function getDigit(digits, i) {
-      var d = parseInt(digits[i]);
-      return isNaN(d) ? 0 : d;
-    }
-    return [getDigit(digits, 0), getDigit(digits, 1), digits.length - 4];
-  };
-
-  /**
-   * Given a numeric value, format it like '3.2M' etc.
-   */
-  resistors.formatValue = function (value) {
-    if (value >= 1000000) {
-      return value / 1000000 + "M";
-    } else if (value >= 1000) {
-      return value / 1000 + "K";
-    } else {
-      return value.toString();
-    }
-  };
-</script>
-<script>
-  var queryEl = document.getElementById("resistor-query"),
-    resultEl = document.getElementById("resistor-result");
-
-  function showStripes(colors, prefix) {
-    for (var i = 0; i < colors.length; i++) {
-      var color = colors[i];
-      var stripeEl = document.getElementById(
-        "resistor-stripe-" + prefix + "-" + (i + 1),
-      );
-      stripeEl.style.backgroundColor = color.hex;
-      stripeEl.style.color = color.label;
-      var text = color.name + "<br>";
-
-      if (i == colors.length - 1) {
-        if (color.multiplier !== undefined) {
-          text += "&times;" + color.multiplier;
-        } else {
-          text += "&nbsp;";
-        }
-      } else {
-        text += color.figure;
-      }
-      stripeEl.innerHTML = text;
-    }
-  }
-
-  queryEl.onchange = queryEl.onkeyup = function () {
-    location.hash = encodeURIComponent(queryEl.value);
-    var result = resistors.query(queryEl.value);
-
-    if (result) {
-      resultEl.style.display = "block";
-      showStripes(result.colors4, "4");
-      showStripes(result.colors5, "5");
-      document.getElementById("resistor-smt-3").innerHTML = result.smt3;
-    } else {
-      resultEl.style.display = "none";
-    }
-  };
-
-  if (location.hash) {
-    queryEl.value = decodeURIComponent(location.hash.substring(1));
-    queryEl.onchange();
-  }
-
-  window.onhashchange = function () {
-    queryEl.value = decodeURIComponent(location.hash.substring(1));
-    queryEl.onchange();
-  };
-
-  queryEl.focus();
-</script>
diff --git a/mod/web/resistors/styles.css b/mod/web/resistors/styles.css
deleted file mode 100644
index e2823e4..0000000
--- a/mod/web/resistors/styles.css
+++ /dev/null
@@ -1,127 +0,0 @@
-* {
-  /*font-family: 'firacode';*/
-  text-rendering: optimizeLegibility;
-}
-
-body {
-  margin: 10px 20px;
-  color: #cccccc;
-  background: #252525;
-  background-attachment: fixed !important;
-}
-
-h1 {
-  font-weight: normal;
-  font-size: 50px;
-  margin: -10px 0 10px 0;
-}
-
-h2 {
-  font-weight: normal;
-  font-size: 15px;
-}
-
-strong {
-  font-weight: normal;
-}
-
-footer {
-  position: absolute;
-  font-size: 12px;
-  color: #555;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  padding: 20px;
-}
-
-a {
-  text-decoration: none;
-}
-
-a:hover {
-  text-decoration: underline;
-}
-
-footer a {
-  color: #775;
-}
-
-#resistor-query {
-  font-size: 20px;
-  border: 1px solid #999;
-  color: #fff;
-  background-color: #444;
-  outline: none;
-  width: 180px;
-}
-
-.resistor-stripe {
-  width: 80px;
-  height: 150px;
-  display: inline-block;
-  padding: 4px 4px;
-}
-
-.resistor-smt {
-  display: inline-block;
-  padding: 0px 10px;
-  font-size: 35px;
-  background-color: #000;
-  border-left: 15px solid silver;
-  border-right: 15px solid silver;
-  border-top: 1px solid silver;
-  border-bottom: 1px solid silver;
-  margin-right: 10px;
-}
-
-@media print, screen and (max-width: 520px) {
-  .resistor-stripe {
-    width: 55px;
-    font-size: 80%;
-    height: 100px;
-  }
-  .resistor-smt {
-    font-size: 25px;
-    border-left: 12px solid silver;
-    border-right: 12px solid silver;
-  }
-}
-
-@media print, screen and (max-width: 410px) {
-  .resistor-stripe {
-    width: 35px;
-    font-size: 55%;
-    height: 70px;
-  }
-  .resistor-smt {
-    font-size: 18px;
-    border-left: 8px solid silver;
-    border-right: 8px solid silver;
-  }
-}
-
-@media print, screen and (max-width: 300px) {
-  .resistor-stripe {
-    width: 25px;
-    font-size: 50%;
-    height: 60px;
-    padding: 2px;
-  }
-  .resistor-smt {
-    font-size: 13px;
-    border-left: 6px solid silver;
-    border-right: 6px solid silver;
-    padding: 2px 4px;
-  }
-}
-
-@media print, screen and (max-height: 660px) {
-  .resistor-stripe {
-    height: 55px;
-  }
-  footer {
-    position: inherit;
-    padding: 10px 0;
-  }
-}