~magic_rb/website

6d6862cf7b0d9195f38baf92924e8cada39d0626 — Magic_RB 5 months ago ebed05f
Improve card display and add more of them

Signed-off-by: Magic_RB <magic_rb@redalder.org>
4 files changed, 81 insertions(+), 5 deletions(-)

M assets/css/style.css
A assets/icons/file-dotfiles.svg
M home/index.org
M lisp/extra-blocks.el
M assets/css/style.css => assets/css/style.css +13 -2
@@ 86,6 86,10 @@ pre {
    color: black;
}

a.card-link {
    text-decoration: none !important;
}

#organizer {
    display: flex;
    flex-direction: column;


@@ 150,11 154,18 @@ 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 {
    color: black;
}

A assets/icons/file-dotfiles.svg => assets/icons/file-dotfiles.svg +54 -0
@@ 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>

M home/index.org => home/index.org +10 -1
@@ 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

M lisp/extra-blocks.el => lisp/extra-blocks.el +4 -2
@@ 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>"