diff --git a/build.sh b/build.sh index 23670b0..832c760 100755 --- a/build.sh +++ b/build.sh @@ -29,6 +29,8 @@ render_image() { fi fi convert "${EXTRA_OPTIONS[@]}" "orig/${FILENAME}" "build/images/${FILENAME%.*}-${SIZE}.${EXTENSION}" + exiftool -overwrite_original -all= -- "build/images/${FILENAME%.*}-${SIZE}.${EXTENSION}" + cwebp "build/images/${FILENAME%.*}-${SIZE}.${EXTENSION}" -o "build/images/${FILENAME%.*}-${SIZE}.webp" } render_image 200 "5._Elementary_GLOBE_Climate_Book_Cover.jpg" --square @@ -58,6 +60,5 @@ render_image full "Stanitski_Adler_JASON_Argonauts.png" render_image full "Stanitski_JASON.jpg" echo "Stripping metadata" -exiftool -overwrite_original -all= -- build/images/*.* - +exiftool -overwrite_original -all= -- build/images/*.{jpg,png} echo "Website built $(date)" diff --git a/css/custom.css b/css/custom.css index 773be84..3667608 100644 --- a/css/custom.css +++ b/css/custom.css @@ -8,7 +8,7 @@ img.thumbnail { -moz-border-radius: 50%; } -img.big { +img.big, picture.big, .big > img { width: 100%; } diff --git a/includes/head.pug b/includes/head.pug index 0dd80ee..9452c62 100644 --- a/includes/head.pug +++ b/includes/head.pug @@ -57,7 +57,15 @@ mixin bigimage(src, alt, ryanhawk) - var loc = src.replace(/[.].+?$/, ""); - var ext = src.replace(/^.+[.]/, ""); a(href=`images/${loc}-full.${ext}`) - img.big(src=`images/${loc}-full.${ext}`, alt=alt) + picture.big + source(type="image/webp" srcset=`images/${loc}-full.webp`) + source(srcset=`images/${loc}-full.${ext}`) + img(src=`images/${loc}-full.${ext}`) + + + // img(srcset=`images/${loc}-full.webp images/${loc}-full.${ext}` src=`images/${loc}-full.${ext}`, alt=alt) + + // img(src=`images/${loc}-full.webp`) figcaption block if ryanhawk diff --git a/templates/education.pug b/templates/education.pug index 3381bc7..a0fece5 100644 --- a/templates/education.pug +++ b/templates/education.pug @@ -23,23 +23,23 @@ div.section h4 NOAA Teacher at Sea books - div(style="flex-flow:row;") + div(style="display: flex;flex-flow:row;") - div(style="") - p Teacher at Sea: Miss Cook's Voyage on the Ronald H. Brown + div(style="padding: 2rem;") img(src="images/1._TAS_Miss_Cook_Book_Cover-215.png") + p Teacher at Sea: Miss Cook's Voyage on the Ronald H. Brown - div(style="") - p Teacher in the Air: Dr. Diane's Flight with the NOAA Hurricane Hunters + div(style="padding: 2rem;") img(src="images/2._TIA_Book_Cover-215.png") + p Teacher in the Air: Dr. Diane's Flight with the NOAA Hurricane Hunters - div(style="") - p Teacher at Sea, Mrs. Armwood's Hydrographic Adventure on the NOAA Ship FAIRWEATHER + div(style="padding: 2rem;") img(src="images/3._TAS_Hydrography_Book_Cover-215.png") + p Teacher at Sea, Mrs. Armwood's Hydrographic Adventure on the NOAA Ship FAIRWEATHER - div(style="") - p Teacher at Sea: Mr. Tanenbaum Explores Atlantic Fisheries on the NOAA Ship Henry B. Bigelow + div(style="padding: 2rem;") img(src="images/4._TAS_Fisheries_book_Cover-215.png") + p Teacher at Sea: Mr. Tanenbaum Explores Atlantic Fisheries on the NOAA Ship Henry B. Bigelow br p | Diane authored/co-authored four NOAA Teacher at Sea (TAS) books and accompanying teacher activities between 2005 and 2009. The updated TAS website will soon feature the books and lessons here: