Replace automatic listing with a manual one for the "Oceandrift D-Man…

… collection"

css/main.css

@@ -20,6 +20,20 @@
  display: inline-block;
 }
 
+img.big {
+ max-width: 90%;
+}
+
 .gallery img {
  max-width: 30%;
 }
+
+.gallery.big img {
+ max-width: 90%;
+}
+
+@media (min-width: 1200px) {
+ .gallery.big img {
+ max-width: 60%;
+ }
+}

oceandrift/index.md

@@ -8,14 +8,66 @@ title: Oceandrift
 by Elias A. Batek ([@0xEAB](https://github.com/0xEAB)). 
 License: [CC-BY-4.0](./COPYING.txt).
 
-<div>
-{% assign sorted_files = site.static_files | sort: 'path' -%}
-{% for file in sorted_files -%}
- {%- assign pageurl = page.url | replace: 'index.html', '' -%}
- {%- if file.path contains pageurl -%}
- {%- if file.extname == '.svg' or file.extname == '.png' %}
-<img src="{{ site.baseurl }}{{ file.path }}" alt="{{ file.basename }}" style="max-width:30%">
- {%- endif -%}
- {%- endif -%}
-{% endfor -%}
+
+## Contract Programming
+
+*2024-08-25*
+
+[Contract programming](https://dlang.org/spec/contracts.html) is a nice and powerful feature.
+
+<div class="gallery big">
+ <img
+ src="{{ site.baseurl }}/oceandrift/2024-08-25_contract-programming/d-man_contract-programming.svg"
+ alt="Comic Strip: Contract Programming"
+ >
+</div>
+
+But like with every tool it’s important to use it for the right job.
+If one finds themselves in a situation where contracts verify whether input has been properly validated,
+it might be better to replace those contracts with input validation.
+This can not only save maintenance time spent keeping validation in sync with the contracts
+but also prevent those application crashes that go hand in hand with failed contract assertions.
+As crashes are bad for availability, they can end up becoming denial-of-service security vulnerabilities.
+Keep in mind that availability is a security criterion similar to confidentiality and integrity.
+
+[→ Source file](./2024-08-25_contract-programming/d-man_contract-programming.inkscape.svg)
+
+### Sketch of panel 1 (Bonus)
+
+<div class="gallery">
+ <img
+ src="{{ site.baseurl }}/oceandrift/2024-08-25_contract-programming/d-man_contract-programming_sketch.png"
+ alt="Sketch of panel 1 of the Contract Programming comic strip"
+ >
+</div>
+
+
+## Ship
+
+*2024-07-21*
+
+Created for the “dlang-dockerized” project to be used as its avatar.
+
+Note: `d-man_cargo-ship.svg` is an Inkscape-SVG file.
+You might want to reduce it to plain SVG for further use.
+
+The original sketch was drawn using the “Simple Draw” app on my phone.
+It’s included here as a bonus (`d-man_ship-sketch.svg`).
+
+<div class="gallery">
+ <img
+ src="{{ site.baseurl }}/oceandrift/2024-07-21_ship/d-man_cargo-ship.svg"
+ alt="D Man on a cargo ship"
+ class="big"
+ >
+ <img
+ src="{{ site.baseurl }}/oceandrift/2024-07-21_ship/d-man_ship-draft.svg"
+ alt="Draft: D Man on a cargo ship"
+ class="big"
+ >
+ <img
+ src="{{ site.baseurl }}/oceandrift/2024-07-21_ship/d-man_ship-sketch.svg"
+ alt="Sketch: D Man on a cargo ship"
+ class="big"
+ >
 </div>