Use "Javascript include" for plugins.
authorRichard W.M. Jones <rjones@redhat.com>
Fri, 25 Jan 2019 15:28:24 +0000 (15:28 +0000)
committerRichard W.M. Jones <rjones@redhat.com>
Fri, 25 Jan 2019 15:40:08 +0000 (15:40 +0000)
2019-fosdem/4050-about-nbdkit.html
2019-fosdem/4100-about-nbdkit-today.html
2019-fosdem/4200-about-nbdkit-langs.html
2019-fosdem/4300-about-nbdkit-filters.html
2019-fosdem/4400-about-nbdkit-filters-today.html
2019-fosdem/4500-about-nbdkit-layers.html
2019-fosdem/4600-about-nbdkit-layers-command.html
2019-fosdem/7000-visualization.html
2019-fosdem/code.js
2019-fosdem/style.css

index b403f01..b856c5f 100644 (file)
@@ -4,39 +4,6 @@
 
 <h1>nbdkit &mdash; plugins</h1>
 
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 1px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;">sh</code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;">xz</code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+</script>
index b006d95..10dd9f8 100644 (file)
@@ -4,48 +4,11 @@
 
 <h1>nbdkit &mdash; plugins</h1>
 
-<style>
-b {
-    border: 1px solid rgb(204,0,0);
-    background: #eef;
-    padding: 5px;
-    border-radius: 15px;
-}
-</style>
-
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 1px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;"><b>file</b></code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;"><b>memory</b></code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;"><b>sh</b></code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;"><b>vddk</b></code>
-  <code style="position: absolute; top: 290px; left: 600px;"><b>xz</b></code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+
+document.getElementById("plugin-file").classList.add("highlighted")
+document.getElementById("plugin-floppy").classList.add("highlighted")
+document.getElementById("plugin-memory").classList.add("highlighted")
+document.getElementById("plugin-sh").classList.add("highlighted")
+</script>
index 11f6033..e6bb7fc 100644 (file)
@@ -4,48 +4,14 @@
 
 <h1>nbdkit &mdash; plugins</h1>
 
-<style>
-b {
-    border: 1px solid rgb(204,0,0);
-    background: #eef;
-    padding: 5px;
-    border-radius: 15px;
-}
-</style>
+<script>
+plugins()
 
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 1px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;"><b>lua</b></code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;"><b>ocaml</b></code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;"><b>perl</b></code>
-  <code style="position: absolute; top: 340px; left: 280px;"><b>python</b></code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;"><b>ruby</b></code>
-  <code style="position: absolute; top: 90px; left: 700px;"><b>sh</b></code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;"><b>tcl</b></code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;">xz</code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+document.getElementById("plugin-lua").classList.add("highlighted")
+document.getElementById("plugin-ocaml").classList.add("highlighted")
+document.getElementById("plugin-perl").classList.add("highlighted")
+document.getElementById("plugin-python").classList.add("highlighted")
+document.getElementById("plugin-ruby").classList.add("highlighted")
+document.getElementById("plugin-sh").classList.add("highlighted")
+document.getElementById("plugin-tcl").classList.add("highlighted")
+</script>
index 36f2583..5c95c1c 100644 (file)
 
 <p></p>
 
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 2px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;
-            transform: translate(-100px,-50px) scale(0.75,0.75);">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;">sh</code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;">xz</code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+</script>
index 5a508e6..a71f23e 100644 (file)
@@ -34,40 +34,6 @@ b {
 
 <p></p>
 
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 2px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;
-            transform: translate(-100px,-50px) scale(0.75,0.75);">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;">sh</code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;">xz</code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+</script>
index 9b114f6..f977e3a 100644 (file)
@@ -67,38 +67,6 @@ b {
   <code style="position: absolute; top: 180px; left: 480px;">truncate</code>
 </div>
 
-<div style="background: #ccf; border: 2px solid rgb(204,0,0);
-            position: absolute; top: 595px; left: 32px;
-            width: 800px; height: 400px;
-            transform: translate(-100px,-50px) scale(0.75,0.75);">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;">sh</code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;"><b>xz</b></code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+</script>
index c8f477e..c780251 100644 (file)
@@ -67,41 +67,11 @@ b {
   <code style="position: absolute; top: 180px; left: 480px;">truncate</code>
 </div>
 
-<div style="background: #ccf; border: 2px solid rgb(204,0,0);
-            position: absolute; top: 595px; left: 32px;
-            width: 800px; height: 400px;
-            transform: translate(-100px,-50px) scale(0.75,0.75);">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;">data</code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;">file</code>
-  <code style="position: absolute; top: 150px; left: 10px;">floppy</code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;">iso</code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
+<script>
+plugins()
 
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;">memory</code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;">sh</code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;"><b>xz</b></code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+document.getElementById("plugin-file").classList.add("highlighted")
+</script>
 
 <pre
 style="position: absolute;
index a4cd003..5fee4da 100644 (file)
@@ -13,42 +13,16 @@ b {
 }
 </style>
 
-<!-- note: div must have position: relative so child elements position
-     is correct -->
-<div style="background: #ccf; border: 1px solid rgb(204,0,0);
-            position:relative;
-            width: 800px; height: 400px;">
-  <code style="position: absolute; top: 1px; left: 10px;">curl</code>
-  <code style="position: absolute; top: 50px; left: 20px;"><b>data</b></code>
-  <code style="position: absolute; top: 100px; left: 10px;">ext2</code>
-  <code style="position: absolute; top: 120px; left: 140px;"><b>file</b></code>
-  <code style="position: absolute; top: 150px; left: 10px;"><b>floppy</b></code>
-  <code style="position: absolute; top: 200px; left: 20px;">guestfs</code>
-  <code style="position: absolute; top: 250px; left: 10px;">gzip</code>
-  <code style="position: absolute; top: 280px; left: 150px;"><b>iso</b></code>
-  <code style="position: absolute; top: 350px; left: 10px;">libvirt</code>
-
-  <code style="position: absolute; top: 5px; left: 340px;">lua</code>
-  <code style="position: absolute; top: 55px; left: 380px;"><b>memory</b></code>
-  <code style="position: absolute; top: 105px; left: 340px;">nbd</code>
-  <code style="position: absolute; top: 125px; left: 450px;">null</code>
-  <code style="position: absolute; top: 155px; left: 340px;">ocaml</code>
-  <code style="position: absolute; top: 185px; left: 160px;">partitioning</code>
-  <code style="position: absolute; top: 240px; left: 380px;">pattern</code>
-  <code style="position: absolute; top: 300px; left: 320px;">perl</code>
-  <code style="position: absolute; top: 340px; left: 280px;">python</code>
-
-  <code style="position: absolute; top: 10px; left: 600px;">random</code>
-  <code style="position: absolute; top: 60px; left: 600px;">ruby</code>
-  <code style="position: absolute; top: 90px; left: 700px;"><b>sh</b></code>
-  <code style="position: absolute; top: 130px; left: 590px;">split</code>
-  <code style="position: absolute; top: 180px; left: 600px;">streaming</code>
-  <code style="position: absolute; top: 190px; left: 450px;">tar</code>
-  <code style="position: absolute; top: 230px; left: 580px;">tcl</code>
-  <code style="position: absolute; top: 260px; left: 650px;">vddk</code>
-  <code style="position: absolute; top: 290px; left: 600px;">xz</code>
-  <code style="position: absolute; top: 320px; left: 600px;">zero</code>
-</div>
+<script>
+plugins()
+
+document.getElementById("plugin-data").classList.add("highlighted")
+document.getElementById("plugin-file").classList.add("highlighted")
+document.getElementById("plugin-floppy").classList.add("highlighted")
+document.getElementById("plugin-iso").classList.add("highlighted")
+document.getElementById("plugin-memory").classList.add("highlighted")
+document.getElementById("plugin-sh").classList.add("highlighted")
+</script>
 
 <p></p>
 
index e69de29..749558c 100644 (file)
@@ -0,0 +1,38 @@
+function plugins ()
+{
+    document.write ("\
+<div class=\"plugins\"> \
+<p id=\"caption\">plugins available in nbdkit 1.10</p> \
+<ul> \
+<li id=\"plugin-curl\"> curl \
+<li id=\"plugin-data\"> data \
+<li id=\"plugin-ext2\"> ext2 \
+<li id=\"plugin-file\"> file \
+<li id=\"plugin-floppy\"> floppy \
+<li id=\"plugin-full\"> full \
+<li id=\"plugin-guestfs\"> guestfs \
+<li id=\"plugin-gzip\"> gzip \
+<li id=\"plugin-iso\"> iso \
+<li id=\"plugin-libvirt\"> libvirt \
+<li id=\"plugin-lua\"> lua \
+<li id=\"plugin-memory\"> memory \
+<li id=\"plugin-nbd\"> nbd \
+<li id=\"plugin-null\"> null \
+<li id=\"plugin-ocaml\"> ocaml \
+<li id=\"plugin-partitioning\"> partitioning \
+<li id=\"plugin-pattern\"> pattern \
+<li id=\"plugin-perl\"> perl \
+<li id=\"plugin-python\"> python \
+<li id=\"plugin-random\"> random \
+<li id=\"plugin-ruby\"> ruby \
+<li id=\"plugin-sh\"> sh \
+<li id=\"plugin-split\"> split \
+<li id=\"plugin-streaming\"> streaming \
+<li id=\"plugin-tar\"> tar \
+<li id=\"plugin-tcl\"> tcl \
+<li id=\"plugin-vddk\"> vddk \
+<li id=\"plugin-zero\"> zero \
+</ul> \
+</div> \
+");
+}
index 69f2571..64a66b5 100644 (file)
@@ -72,3 +72,46 @@ code {
 li {
     padding-bottom: 16px;
 }
+
+/* Plugins box. */
+div.plugins {
+    background: #f8f8ff;
+    border: 1px solid rgb(204,0,0);
+    border-radius: 15px;
+    width: 800px;
+    height: 400px;
+    /* Position relative is needed so that items may be
+       positioned inside. */
+    position: relative;
+    column-count: 4;
+}
+
+div.plugins p#caption {
+    position: absolute;
+    bottom: -5px; right: 5px;
+    color: rgb(204,0,0);
+    text-align: right;
+    font-size: 16px;
+    font-weight: bold;
+}
+
+div.plugins ul {
+    list-style-type: none;
+    top: 50%;
+    transform: translateY(15%);
+    margin: 0;
+}
+
+div.plugins ul li {
+    padding: 4px;
+    margin: 5px;
+}
+
+div.plugins ul li.highlighted {
+    border: 1px solid rgb(204,0,0);
+    background: #fff;
+    padding-left: 10px;
+    color: rgb(204,0,0);
+    border-radius: 20px;
+    font-weight: bold;
+}