fix figure code, start board

Author: gedankenstuecke

content/page/board.md

@@ -6,6 +6,56 @@ title: Board
 url: /board/
 
 ---
+# Board of Directors 
+
+The Board can be contacted via email at board@open-bio.org (or, in case of mailing list problems, try obf-board@googlegroups.com as a fallback) You can also find us on [LinkedIn](https://www.linkedin.com/groups/9539620/). The minutes of the previous public Board meetings can be found on our [GitHub repository](https://github.com/OBF/obf-docs/tree/master/minutes) ([pre-2019 meeting minutes are linked here](https://www.open-bio.org/board/meeting-minutes/)).
+
+{{< gallery class="content-gallery" cols='2' >}}
+
+{{< figure
+  src="/wp-content/uploads/2022/10/Friedberg_Iddo_0817_square.jpg"
+  alt="Image of Iddo Friedberg"
+  title= "Iddo Friedberg"
+  caption=`
+_At-large Member_ 
+Associate Professor at Iowa State University. Chair, Function COSI. Early contributor to the Biopython project.
+`
+>}}
+
+{{< figure
+  src="/wp-content/uploads/2021/11/Hilya.jpg"
+  alt="Image of Hilyatuz Zahroh"
+  title= "[Hilyatuz Zahroh](https://www.linkedin.com/in/hilyatuz-zahroh-6671ab100/)"
+  caption=`
+_At-large Member_ 
+[APBioNET](https://www.apbionet.org/current-exco-officers-2020-2022/) ExCo
+`
+>}}
+
+{{< figure
+  src="/wp-content/uploads/2021/11/Caleb_Kibet_pic.jpg"
+  alt="Image of Caleb Kibet"
+  title= "[Caleb Kibet](https://kipkurui.github.io/)"
+  caption=`
+_At-large Member_ 
+Bioinformatician at the [International Center of Insect Physiology and Ecology, Kenya](http://www.icipe.org/research/research-support-units/molecular-biology-bioinformatics-and-biostatistics); Founder [OpenScienceKE](https://medium.com/openscienceke).
+`
+>}}
+
+{{< figure
+  src="/wp-content/uploads/2019/01/Hilmar-Lapp-1.jpg"
+  alt="Image of Hilmar Lapp"
+  title= "[Hilmar Lapp](https://lappland.io/)"
+  caption=`
+_At-large Member_ 
+Representing [BioPerl](http://www.bioperl.org/), Director of Informatics at the [Center for Genomic and Computational Biology](http://genome.duke.edu/) (GCB) at Duke University. Former OBF President.
+`
+>}}
+
+
+
+{{< /gallery >}}
+
 # Joining the Board
 
 Nominations for the Board of Directors may be made by the general membership at any time throughout the year by contacting any Board Member.  

layouts/shortcodes/figure.html

@@ -0,0 +1,40 @@
+<div class="box">
+	<figure{{ with .Get "class" }} class="{{ . }}"{{ end }}>
+	  {{- if .Get "link" -}}
+	    <a href="{{ .Get "link" }}"{{ with .Get "target" }} target="{{ . }}"{{ end }}{{ with .Get "rel" }} rel="{{ . }}"{{ end }}>
+	  {{- end -}}
+	
+	  {{- $u := urls.Parse (.Get "src") -}}
+	  {{- $src := $u.String -}}
+	  {{- if not $u.IsAbs -}}
+	    {{- with or (.Page.Resources.Get $u.Path) (resources.Get $u.Path) -}}
+	      {{- $src = .RelPermalink -}}
+	    {{- end -}}
+	  {{- end -}}
+	
+	  <img src="{{ $src }}"
+	    {{- if or (.Get "alt") (.Get "caption") }}
+	    alt="{{ with .Get "alt" }}{{ . }}{{ else }}{{ .Get "caption" | markdownify| plainify }}{{ end }}"
+	    {{- end -}}
+	    {{- with .Get "width" }} width="{{ . }}"{{ end -}}
+	    {{- with .Get "height" }} height="{{ . }}"{{ end -}}
+	    {{- with .Get "loading" }} loading="{{ . }}"{{ end -}}
+	  ><!-- Closing img tag -->
+	  {{- if .Get "link" }}</a>{{ end -}}
+	  {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}}
+	    <figcaption>
+	      {{ with (.Get "title") -}}
+	        <h4>{{ . |markdownify}}</h4>
+	      {{- end -}}
+	      {{- if or (.Get "caption") (.Get "attr") -}}<p>
+	        {{- .Get "caption" | markdownify -}}
+	        {{- with .Get "attrlink" }}
+	          <a href="{{ . }}">
+	        {{- end -}}
+	        {{- .Get "attr" | markdownify -}}
+	        {{- if .Get "attrlink" }}</a>{{ end }}</p>
+	      {{- end }}
+	    </figcaption>
+	  {{- end }}
+	</figure>
+</div>

static/css/custom.css

@@ -17,3 +17,42 @@ imagerow::after {
     width: 100%;
   }
 }
+
+/* Gallery code */
+
+.gallery {
+    overflow: hidden;
+    margin: 10px;
+    max-width: 768px;
+}
+.gallery .box {
+    float: left;
+    position: relative;
+    /* Default: 1 tile wide */
+    width: 100%;
+}
+@media only screen and (min-width : 365px) {
+    /* Tablet view: 2 tiles */
+    .gallery .box {
+        width: 50%;
+    }
+}
+@media only screen and (min-width : 480px) {
+    /* Small desktop / ipad view: 3 tiles */
+    .gallery .box {
+        width: 33.3%;
+    }
+}
+@media only screen and (min-width : 9999px) {
+   /* Medium desktop: 4 tiles */
+   .box {
+      width: 25%;
+   }
+}
+
+.gallery figure {
+    padding-left: 5%;
+    padding-right: 5%;
+    padding-top: 5%;
+    padding-bottom: 5%;
+}