Shortcode Improvements

README.md

@@ -78,6 +78,8 @@ Using the above example, you can see that a German language version of `index.md
 
 Please note that if you need to add a new language to the list, you will also need to edit `/config/_default/languages.toml` (pay attention to indentation!). 2 letter ISO codes are used, for a list you can [refer to this document](https://www.iban.com/country-codes). Use the lower-case versions otherwise our documentation engine freaks out.
 
+Lastly, create a copy of `/i18n/en.yaml` and name it with the newly added country code. This file contains the translations used by shortcodes throughout the site.
+
 When you add content in other languages, note that you do not need to update the links to point to the language-specific version of the documentation - the documentation engine will sort this out for you.
 
 ### Convenience Functions
@@ -126,24 +128,33 @@ This is an example multi-line alert.
 {{< /alert >}}
 ```
 
+#### Carousel
+A carousel is a slideshow for cycling through a series of images. List the images you would like to include inside the carousel element. Each picture will automatically be sequentially numbered. To add a caption to an image, follow the image path with a pipe (`|`) and then the caption text:
+``` hugo
+{{< carousel >}}
+    images/image-1.jpg
+    images/image-2.jpg | Caption for image 2
+    images/image-3.jpg
+    images/image-4.jpg | Caption for image 4
+{{< /carousel >}}
+```
+
 #### Details
-Shortcode:
+This shortcode is simply a wrapper for the HTML [details element](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/details). Specify the summary text and optionally choose whether to have the element open by default instead of closed.
+
 ```
-{{< details <summary> [state] >}}
-<content>
+{{< details "Summary text" >}}
+Content goes here. This will be hidden until the user clicks to expand.
+{{< /details >}}
+
+{{< details "Summary text" "open" >}}
+This content will be visible by default because state is set to "open".
 {{< /details >}}
 ```
 
 #### Document Status
 
-This is a variation of the Alert shortcode however it has different statuses depending on what's required.
-
-Shortcode:
-```
-{{< docstatus status="STATUS" >}}
-```
-
-The following statuses are supported:
+This is a variation of the Alert shortcode with certain predefined statuses. The following statuses are supported:
 
 * (blank) - Defaults to "not yet written"
 * `workinprogress` - Documentation is in progress and subject to change.
@@ -154,6 +165,10 @@ The following statuses are supported:
 * `obsolete` - States that no further development will occur on this component, but it is retained for compatibility reasons.
 * `untranslated` - Documentation has not been translated into your native language yet. This will gradually disappear as more efforts are put into translation for various locales.
 
+```
+{{< docstatus status="STATUS" >}}
+```
+
 #### Simple image
 
 This will allow you to create quick, simple images that can be inserted into the body of documentation, with additional CSS classes.

assets/js/darkmode-init.js

@@ -5,17 +5,20 @@ if (globalDark && (localMode === null)) {
 
   localStorage.setItem('theme', 'dark');
   document.documentElement.setAttribute('data-dark-mode', '');
+  document.documentElement.setAttribute('data-bs-theme', 'dark');
 
 }
 
 if (globalDark && (localMode === 'dark')) {
 
   document.documentElement.setAttribute('data-dark-mode', '');
+  document.documentElement.setAttribute('data-bs-theme', 'dark');
 
 }
 
 if (localMode === 'dark') {
 
   document.documentElement.setAttribute('data-dark-mode', '');
+  document.documentElement.setAttribute('data-bs-theme', 'dark');
 
 }

assets/js/darkmode.js

@@ -8,11 +8,13 @@ if (mode !== null) {
 
       localStorage.setItem('theme', 'dark');
       document.documentElement.setAttribute('data-dark-mode', '');
+      document.documentElement.setAttribute('data-bs-theme', 'dark');
 
     } else {
 
       localStorage.setItem('theme', 'light');
       document.documentElement.removeAttribute('data-dark-mode');
+      document.documentElement.setAttribute('data-bs-theme', 'light');
 
     }
 
@@ -22,6 +24,7 @@ if (mode !== null) {
 
     document.documentElement.toggleAttribute('data-dark-mode');
     localStorage.setItem('theme', document.documentElement.hasAttribute('data-dark-mode') ? 'dark' : 'light');
+    document.documentElement.hasAttribute('data-dark-mode') ? document.documentElement.setAttribute('data-bs-theme', 'dark') : document.documentElement.setAttribute('data-bs-theme', 'light');
 
   });
 

assets/scss/components/_alerts.scss

@@ -1,6 +1,5 @@
 .alert {
-  font-family: $font-family-monospace;
-  font-size: $font-size-sm;
+  font-size: $font-size-base;
 }
 
 .alert-icon {
@@ -61,73 +60,73 @@
 */
 
 .alert-secondary {
-  color: #41464b;
-  background-color: #e2e3e5;
-  border-color: #d3d6d8;
+  color: var(--bs-secondary-text);
+  background-color: var(--bs-secondary-bg-subtle);
+  border-color: var(--bs-secondary-border-subtle);
 }
 
 .alert-secondary .alert-link {
-  color: #34383c;
+  color: var(--bs-secondary-text);
 }
 
 .alert-success {
-  color: #0f5132;
-  background-color: #d1e7dd;
-  border-color: #badbcc;
+  color: var(--bs-success-text);
+  background-color: var(--bs-success-bg-subtle);
+  border-color: var(--bs-success-border-subtle);
 }
 
 .alert-success .alert-link {
-  color: #0c4128;
+  color: var(--bs-success-text);
 }
 
 .alert-info {
-  color: #055160;
-  background-color: #cff4fc;
-  border-color: #b6effb;
+  color: var(--bs-info-text);
+  background-color: var(--bs-info-bg-subtle);
+  border-color: var(--bs-info-border-subtle);
 }
 
 .alert-info .alert-link {
-  color: #04414d;
+  color: var(--bs-info-text);
 }
 
 .alert-warning {
-  color: #664d03;
-  background-color: #fff3cd;
-  border-color: #ffecb5;
+  color: var(--bs-warning-text);
+  background-color: var(--bs-warning-bg-subtle);
+  border-color: var(--bs-warning-border-subtle);
 }
 
 .alert-warning .alert-link {
-  color: #523e02;
+  color: var(--bs-warning-text);
 }
 
 .alert-danger {
-  color: #842029;
-  background-color: #f8d7da;
-  border-color: #f5c2c7;
+  color: var(--bs-danger-text);
+  background-color: var(--bs-danger-bg-subtle);
+  border-color: var(--bs-danger-border-subtle);
 }
 
 .alert-danger .alert-link {
-  color: #6a1a21;
+  color: var(--bs-danger-text);
 }
 
 .alert-light {
-  color: #636464;
-  background-color: #fefefe;
-  border-color: #fdfdfe;
+  color: var(--bs-light-text);
+  background-color: var(--bs-light-bg-subtle);
+  border-color: var(--bs-light-border-subtle);
 }
 
 .alert-light .alert-link {
-  color: #4f5050;
+  color: var(--bs-light-text);
 }
 
 .alert-dark {
-  color: #141619;
-  background-color: #d3d3d4;
-  border-color: #bcbebf;
+  color: var(--bs-dark-text);
+  background-color: var(--bs-dark-bg-subtle);
+  border-color: var(--bs-dark-border-subtle);
 }
 
 .alert-dark .alert-link {
-  color: #101214;
+  color: var(--bs-dark-text);
 }
 
 .alert .alert-link:hover,

content/docs/feature-guides/canals/index.md

@@ -9,64 +9,65 @@ images: []
 url: "docs/feature-guides/canals"
 ---
 
+{{< docstatus status="legacy" >}}
+
 ## Overview
 
 The CAN-AM is designed to work with either the **CAL SG Canals** by callagrafx (recommended) or the original **SG Canals** by SimGoober.
-Both of these are available in the [SC4D LEX Legacy - BSC Canals Collection](https://www.sc4evermore.com/index.php/downloads/download/14-park/277-sc4d-lex-legacy-bsc-canals-collection). This package also includes additional passenger and freight stations, as NAM CAN-AM only includes a single passenger station.
+Both of these are available in the [SC4D LEX Legacy - BSC Canals Collection](https://www.sc4evermore.com/index.php/downloads/download/14-park/277-sc4d-lex-legacy-bsc-canals-collection). This package also includes additional passenger and freight stations. Additional ferry skins may be found in the [SC4D LEX Legacy - BSC VDK Mods Ferries](https://www.sc4evermore.com/index.php/downloads/download/41-automata-mods/298-sc4d-lex-legacy-vdk-mods-ferries) package, among others.
 
 The CAN-AM is available under **2 Network Features** → **Water Transport** → **Canal Addon Mod**. It is installed by default.
 
-## Building CAN-AM Canals
-
-The canal pieces are located under the Misc. Transit menu.
+Note that CAN-AM is an older feature that has not seen much new development in the past decade. As such, it is reliant on a limited array of semi-deprecated/legacy features, especially in terms of crosslinks with newer and more modern NAM features.
 
-{{< img-simple src="images/can-am-menu-button.jpg" >}}
+## Building Canals
 
-To build a functional canal with CAN-AM, start by building the outer walls of the canal with your canal set (in this case, the CAL SG Canals).  In between the walls, place the CAN-AM pieces, which provide the actual transportation functionality.  CAN-AM canals must be _at least 3 tiles wide:_ 2 tiles for the walls on each side, and at least 1 tile for the CAN-AM pieces.
+To build a functional canal with CAN-AM, start by building the outer walls of the canal with your chosen canal set (in this case, the CAL SG Canals). Use the CAN-AM pieces, located in the Misc. Transit menu, in between the outer walls. These pieces provide the actual transportation functionality. Note that CAN-AM canals must be at least 3 tiles wide: 2 tiles for the walls on each side, and at least 1 tile for the CAN-AM pieces.
 
-{{< gallery col-xl="2" col-lg="2" clickable="true" >}}
+{{< carousel >}}
     images/can-am-building-1.jpg
-    images/can-am-building-2.jpg
-    images/can-am-building-3.jpg
-    images/can-am-building-4.jpg
-{{< /gallery >}}
+    images/can-am-building-2.jpg | Place the outer walls of the canal
+    images/can-am-menu-button.jpg | Use the functional canal pieces
+    images/can-am-building-3.jpg | Place functional canal pieces in between the walls
+    images/can-am-building-4.jpg | The finished canal must be minimum 3 tiles wide
+{{< /carousel >}}
 
-Crossings with CAN-AM are currently puzzle piece-based.  There are two versions of each crossing piece for the supported network crossings--one for the wall, and one for the open water.  The open water tiles allow for canal traffic to pass underneath.
+### Crossings
 
-The crossing can be assembled as follows:
+Crossings with CAN-AM are currently puzzle piece-based. There are two versions of each crossing piece for the supported network crossings: one for the wall, and one for the center canal traffic, allowing canal traffic to pass underneath. The crossing can be assembled as follows:
 
-{{< gallery col-xl="2" col-lg="2" clickable="true" >}}
-    images/can-am-building-5.jpg
-    images/can-am-building-6.jpg
+{{< carousel >}}
+    images/can-am-building-5.jpg | Place the center piece allowing traffic
+    images/can-am-building-6.jpg | Place the edge pieces
     images/can-am-building-7.jpg
-{{< /gallery >}}
+{{< /carousel >}}
 
-Neighbor Connections with CAN-AM are possible as well.  Build a standard Road-based Neighbor Connection, and plop the CAN-AM pieces over top of the Road.
+### Neighbor Connections
 
-{{< gallery col-xl="2" col-lg="2" clickable="true" >}}
-    images/can-am-nc-1.jpg
-    images/can-am-nc-2.jpg
-    images/can-am-nc-3.jpg
-{{< /gallery >}}
+Neighbor Connections with CAN-AM are possible as well. Start by building a standard Road-based Neighbor Connection, and then plop the CAN-AM pieces over top of the Road.
 
-Note that CAN-AM is an older feature that has not seen much new development in the past decade.  As such, it is reliant on a limited array of semi-deprecated/legacy features, especially in terms of crosslinks with newer/more modern NAM features.
+{{< carousel >}}
+    images/can-am-nc-1.jpg | Start with a road neighbor connection
+    images/can-am-nc-2.jpg | Plop canal transit pieces over the road
+    images/can-am-nc-3.jpg | Plop canal transit pieces over the road
+{{< /carousel >}}
 
-## CAN-AM Stations
 
-The CAN-AM canals function as a mass transit network and is technically based on the Bus vehicle type, meaning they need stations to properly function.  The CAS 1x1 Ferry Terminal (included in the mod) is one option.  Place it aligned with a canal wall, with the arrow pointing toward the water in the canal.  The stations require Power in order to function.
+### Stations
 
-{{< gallery col-xl="2" col-lg="2" clickable="true" >}}
+The CAN-AM canals function as a mass transit network based on the Bus vehicle type, meaning they need stations to properly function. The NAM includes one passenger ferry terminal - additional passenger and freight stations are available in the BSC Canals Collection linked above. Place the station aligned with a canal wall, with the arrow pointing toward the water in the canal. The stations require power in order to function.
+
+{{< carousel >}}
     images/can-am-building-8.jpg
     images/can-am-building-9.jpg
     images/can-am-building-10.jpg
-{{< /gallery >}}
-
-Note that in order for canal boat automata to appear on the canals, one of the "magic pieces" must be placed as part of the build process, preferrably in the open water next to the station.  These include the + and T-intersections, as well as the 90° L-bend. (Thanks to <strong>CorinaMarie</strong> for this discovery!)
+    images/can-am-building-10a.jpg | Place one of the "magic pieces"
+{{< /carousel >}}
 
-{{< img-simple src="images/can-am-building-10a.jpg" >}}
+Note that in order for canal boat automata to appear on the canals, one of the "magic pieces" must be placed as part of the build process, preferably in the open water next to the station.  These include the + and T-intersections, as well as the 90° L-bend. (Thanks to <strong>CorinaMarie</strong> for this discovery!)
 
 {{< img-simple src="images/can-am-magic-pieces.jpg" >}}
 
-If everything is done properly (at least two stations of the same type are needed for full functionality), traffic should begin to use the canal.
+If everything is done properly, traffic should begin to use the canal. Like any other mass transit network, at least two stations of the same type are needed for full functionality.
 
 {{< img-simple src="images/can-am-building-11.jpg" >}}

content/docs/tech-specs/hybrid-railway.it.md

@@ -9,40 +9,13 @@ images: []
 url: "docs/tech-specs/hybrid-railway"
 ---
 <!-- markdownlint-disable MD001 -->
-{{< feature-guide link="docs/feature-guides/hybrid-railway" mod="Hybrid Railway feature guide" >}}
+{{< feature-guide link="/docs/feature-guides/hybrid-railway" >}}
 
-## Capacità della rete e del pezzo FLEX
-
-### Chiave
-
-<table class="table-bordered nam-compat-status processed">
-<tr>
-    <td data-compat="yes"> SI </td>
-    <td>Questa particolare caratteristica può essere costruita, con limitazioni minime (se non addirittura nulle).</td>
-</tr>
-<tr>
-    <td data-compat="partial"> Supporto parziale </td>
-    <td>Questa particolare caratteristica può essere costruita, ma non in tutti i casi. Verranno forniti dettagli su ciò che è/non è possibile. Il supporto parziale può essere dovuto a ragioni di progettazione intenzionali (come il realismo o la non fattibilità generale), o semplicemente perché la caratteristica non è stata completamente sviluppata.</td>
-</tr>
-<tr>
-    <td data-compat="limited"> Supporto limitato </td>
-    <td>Questa particolare caratteristica può essere costruita, ma solo in circostanze estremamente limitate. I casi possibili possono essere elencati, nella misura in cui è possibile. L'uso è a proprio rischio e pericolo.</td>
-</tr>
-<tr>
-    <td data-compat="no"> Nessun supporto </td>
-    <td>Questa particolare caratteristica non può essere costruita. Questa restrizione può essere dovuta a ragioni di progettazione intenzionali (come il realismo, la non fattibilità generale o le limitazioni del gioco) o semplicemente perché non è ancora stata sviluppata.</td>
-</tr>
-</table>
-
-### Additional Notes
+## Chiave
 
-**OxO**: OxO sta per "ortogonale x ortogonale" e si riferisce a una situazione in cui entrambe le reti sono ortogonali (in linea retta) lungo la griglia di gioco, intersecandosi perpendicolarmente (con angoli di 90° in tutti gli angoli).
+{{< compatibility-key >}}
 
-**OxD**: OxD sta per "ortogonale x diagonale" e si riferisce a una situazione in cui la rete data è ortogonale (in linea retta) lungo la griglia di gioco e la rete trasversale è diagonale (con un angolo di 45°).
-
-**DxO**: DxO sta per "diagonale x ortogonale" e si riferisce a una situazione in cui la rete di base è diagonale (con un angolo di 45°) e la rete trasversale è ortogonale (in linea retta) lungo la griglia di gioco.
-
-**DxD**: DxD sta per "diagonale x diagonale" e si riferisce a una situazione in cui entrambe le reti sono diagonali (con un angolo di 45°) lungo la griglia di gioco e si intersecano perpendicolarmente (con angoli di 90° in tutti gli angoli).
+## Capacità della rete e del pezzo FLEX
 
 ### Available Height Levels