Library Innovation Lab website

This repository contains the code for the LIL website. We use the static site generator Eleventy and Tailwind CSS to build the site.

Development setup

1. Clone this repository
2. cd website-static
3. npm install to install dependencies
4. npm start to start the dev server
5. View the dev server at http://localhost:8080

Adding current affiliates

At the moment, current staff and affiliates listed on the About page should have three sizes of photos. The current convention is to take a square, high-resolution grayscale image and convert it using ImageMagick. You can use something like this, assuming that the files are in the current working directory and named something like firstname-lastname.jpg:

for SIZE in 216 432 648 ; do for FILE in *.jpg ; do THUMBDIR=~/Documents/code/website-static/app/assets/thumbs/${SIZE}x${SIZE}c ; cp ${FILE} ${THUMBDIR}/ ; mogrify -scale ${SIZE}x${SIZE} -density 1x1 ${THUMBDIR}/${FILE} ; done ; done

For people who do not want to have an image on the website, we use a placeholder (image: no-photo.jpg in people.yaml), which was produced like this:

magick -size 1000x1000 xc:lightgray -fill gray -stroke gray -draw "circle 500,400 500,600" -draw "ellipse 500,950 320,400 0,360" no-photo.jpg
for SIZE in 216 432 648 ; do THUMBDIR=~/Documents/code/website-static/app/assets/thumbs/${SIZE}x${SIZE}c ; cp no-photo.jpg ${THUMBDIR}/ ; mogrify -scale ${SIZE}x${SIZE} -density 1x1 ${THUMBDIR}/no-photo.jpg ; done