CSS Gallery functionality for practically any SSG | https://duchnovsky.com/2020/11/gallery-function-css

style.css

img {
  height: auto;
  pointer-events: none;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

img[alt~="_gallery"] {
  -moz-box-shadow:    0px 0px 3px rgba(0, 0, 0, .5), 0px 0px 10px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, .5), 0px 0px 10px rgba(0, 0, 0, 0.2);
  box-shadow:         0px 0px 3px rgba(0, 0, 0, .5), 0px 0px 10px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  margin-bottom: 2%;
}

/* Aligning images only on tablet/pc, not mobile. */
@media (min-width: 550px) {
  img[alt~="_gallery"] {
    max-width: 49%;
  }
  img[alt$=">"] {
    float: right;
  }

  img[alt$="<"] {
    float: left;
  }

  img[alt$="><"] {
    display: block;
    margin: auto;
    float: none;
  }
}

/* Cleanup after gallery image */
p::after {
  content: "";
  clear: both;
  display: table;
}