Improve card display and add more of them

Signed-off-by: Magic_RB <magic_rb@redalder.org>

assets/css/style.css

@@ -86,6 +86,10 @@ pre {
     color: black;
 }
 
+a.card-link {
+    text-decoration: none !important;
+}
+
 #organizer {
     display: flex;
     flex-direction: column;
@@ -150,9 +154,16 @@ pre {
 .card-icon {
     max-width: 10rem;
     max-height: 10rem;
-    width: auto;
-    height: auto;
+    width: 10rem;
+    height: 10rem;
+    min-width: 10rem;
+    min-height: 10rem;
     margin: 0 1rem 0 0;
+    margin: 0 1rem 0 0;
+}
+
+.card-icon-text {
+    text-size-adjust: auto;
 }
 
 .card-body {

assets/icons/file-dotfiles.svg

@@ -0,0 +1,54 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 384 512"
+   version="1.1"
+   id="svg4"
+   sodipodi:docname="file-dotfiles.svg"
+   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs8">
+    <rect
+       x="187.94444"
+       y="689.27777"
+       width="186.52499"
+       height="149.46408"
+       id="rect660" />
+  </defs>
+  <sodipodi:namedview
+     id="namedview6"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="2.0058594"
+     inkscape:cx="191.93768"
+     inkscape:cy="255.75073"
+     inkscape:window-width="2560"
+     inkscape:window-height="1565"
+     inkscape:window-x="0"
+     inkscape:window-y="35"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg4" />
+  <!--! Font Awesome Pro 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. -->
+  <path
+     d="M320 464c8.8 0 16-7.2 16-16V160H256c-17.7 0-32-14.3-32-32V48H64c-8.8 0-16 7.2-16 16V448c0 8.8 7.2 16 16 16H320zM0 64C0 28.7 28.7 0 64 0H229.5c17 0 33.3 6.7 45.3 18.7l90.5 90.5c12 12 18.7 28.3 18.7 45.3V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V64z"
+     id="path2" />
+  <text
+     xml:space="preserve"
+     transform="matrix(2.7054371,0,0,2.7054371,-449.6215,-1660.6374)"
+     id="text658"
+     style="font-style:normal;font-weight:normal;font-size:40px;line-height:1.25;font-family:sans-serif;white-space:pre;shape-inside:url(#rect660);fill:#000000;fill-opacity:1;stroke:none"><tspan
+       x="187.94531"
+       y="745.90234"
+       id="tspan1502"><tspan
+         style="font-weight:bold;font-size:64px;font-family:'DejaVu Serif';-inkscape-font-specification:'DejaVu Serif, Bold'"
+         id="tspan1500">~/.</tspan></tspan></text>
+</svg>

home/index.org

@@ -1,4 +1,13 @@
 #+begin_card NixNG :link "https://github.com/nix-community/NixNG" :image "/icons/nix-ng-greener-no-gradient.svg"
   A NixOS derivative with simpler design, currently replacing systemd with runit,
- aiming to deliver lighter systems and containers. TEST
+ aiming to deliver lighter systems and containers.
+#+end_card
+
+#+begin_card NixNG :link "https://git.sr.ht/~magic_rb/dotfiles" :image "/icons/file-dotfiles.svg"
+  Set of Nix files and other configuration files, which define my every past, present and future system. Including a Raspberry Pi 3, a complex SuperMicro server, a laptop and in the future many more. Also contains definition for a multitude of NixNG containers.
+#+end_card
+
+# dont add links, nesting <a> :(
+#+begin_card NixNG :link "https://git.sr.ht/~magic_rb/website" :image "/icons/favicon-512x512.png"
+  The repository from which this website is built. It utilizes a =org-thtml= and =org-special-block-extra= to turn Emacs into a pretty good static website generator, complete with unparalleled syntax highlighting thanks to =emacs-htmlize= and =modus-themes=.
 #+end_card

lisp/extra-blocks.el

@@ -15,14 +15,16 @@
    title contents))
 
 (org-defblock
- card (name "Card" link "" image "")
+ card (name "Card" link "" image nil image-html nil)
  "Card"
  (cl-case backend
    ((html templated-html)
     (concat
        "<a class=\"card-link\" href=\"" link "\">"
        "  <div class=\"card-entry\">"
-       "    <img src=\"" image "\" class=\"card-icon\"/>"
+       (if image
+           (concat "<img src=\"" image "\" class=\"card-icon\"/>")
+         (concat "<div class=\"card-icon\">" image-html "</div>"))
        "    <div class=\"card-separator\"></div>"
        "      <div class=\"card-body\">"
        "        <h4 class=\"card-heading\">" name "</h4>"