diff --git a/.gitignore b/.gitignore index 5237d1b..a5eceb1 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,4 @@ *~ push +changes.log + diff --git a/config.toml b/config.yaml similarity index 71% rename from config.toml rename to config.yaml index 9cc3bae..7f76ec3 100644 --- a/config.toml +++ b/config.yaml @@ -1,51 +1,45 @@ -# config.toml for figset module +# config.yaml for figset module -# These are the bits that modules using this one will get: -[module.hugoVersion] -# Need at least 64 for ? and extended for SASS -min = "0.64.0" -extended = true - -# FIXME why does it work when I've only done this much -- perhaps things in the same place are automatic -#[[module.mounts]] -# source = "assets/sass/figset.scss" -# target = "assets/sass/figset.scss" +module: + hugoVersion: + # Need at least 64 for ? + min = "0.64.0" # ?? TODO can we set default imaging things here? -[imaging] +imaging: # Default resample filter used for resizing. Default is Box, # a simple and fast averaging filter appropriate for downscaling. # See https://github.com/disintegration/imaging # box | Lanczos | ... - resampleFilter = "Lanczos" - format = "jpg" + resampleFilter: "Lanczos" + format: "jpg" # Default JPEG quality setting. Default is 75. - quality = 90 + quality: 90 # Anchor used when cropping pictures. # Default is "smart" which does Smart Cropping, using https://github.com/muesli/smartcrop # Smart Cropping is content aware and tries to find the best crop for each image. # Valid values are Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight - #anchor = "smart" + #anchor: "smart" # Default background color. # Hugo will preserve transparency for target formats that support it, # but will fall back to this color for JPEG. # Expects a standard HEX color string with 3 or 6 digits. - #bgColor = "#ffffff" - [imaging.exif] + #bgColor: "#ffffff" + exif: # Regexp matching the fields you want to Exclude from the (massive) set of Exif info # available. As we cache this info to disk, this is for performance and # disk space reasons more than anything. # If you want it all, put ".*" in this config setting. # Note that if neither this or ExcludeFields is set, Hugo will return a small # default set. - includeFields = "" + includeFields: "" # Regexp matching the Exif fields you want to exclude. This may be easier to use # than IncludeFields above, depending on what you want. - excludeFields = ".*" + excludeFields: ".*" # Hugo extracts the "photo taken" date/time into .Date by default. # Set this to true to turn it off. - disableDate = true + disableDate: true # Hugo extracts the "photo taken where" (GPS latitude and longitude) into # .Long and .Lat. Set this to true to turn it off. - disableLatLong = true + disableLatLong: true diff --git a/layouts/partials/figset.html b/layouts/partials/figset.html index dab708f..3aac26d 100644 --- a/layouts/partials/figset.html +++ b/layouts/partials/figset.html @@ -1,49 +1,14 @@ {{- /* -figset partial, version of figure with srcsetting. -TODO: -* ? maxwidth or maxsize? -- widths are used vs screen widths / CSS limits... -* refactor the image filtering -** Double check thinking re min 1 or 2 in srcset -- is the fallback src in addition to that? -* option to clear before rather than after? -* Use separate file for calcs?? -* difference between small and thumb is too much? -* Still don't know when to use htmlEscape vs safeHTMLAttr -- the former leaves < in title attribute, but not in data-title !? -* more size options, e.g. 50% (width), 6em, bs4 class... -- but how to scale those for area? -* decouple from lightboxSSA to allow use of other lightboxes?? -* url/link -- option e.g. url=self to link to selfsize version of same image -- rename url to link? -* fix 'null' when hovering over image in carousel -* allow user to specify hugo's image processing and filtering options. How will that interact with the resizing that we're doing? Maybe not the resizing options, then. Just: rotate (e.g. 'r90' when resizing); output format (jpeg, png, webp); quality; But wait! These can be set globally in config.toml -- does the user need per-image settings? -... overlay (for watermark/logo) -... see https://gohugo.io/functions/images/#text -* maxwidth limits e.g. La Alhambra on a wide screen. think about it -- set a maxarea instead? -* left/right/start/end for Ltr and RTL scripts -- not well implemented so far. left gets used as start, and then we don't know which was intended -- perhaps just get rid of left/right -- but then in CSS, wanting to do float-left when start was asked for... -- OR, as text-align and float can do start/end, when should keep left separate from start etc. -- BETTER: keep left/start separate -- class for left can do the clever :dir() thing. etc. -* ??? remote images -* 'jpg' is hard-coded in places here +partials/figset.html -DONE: -* if image not found, create a placeholder with various assumptions, e.g. it's square. i.e. use a placeholder image in static or wherever -* use flex-grow and -shrink ?? NO -- see https://codepen.io/starsoftanalysis/pen/Rwyppdv -* FIRST: decide how multiple figsets should behave if not within a figrow. -- maybe don't try too hard -- encourage use of figrow. -- e.g. poses l, c, r pushes third one to next line. -* move error handling to shortcodes? -- see https://gohugo.io/templates/shortcode-templates/#error-handling-in-shortcodes -* Move anchor inside figure -* 'clear' option for figset (as done for figrow) -- see type2 test. -* NEXT: don't do flex if no ROW! OR do use a flex div to do the l/r/center!? -- would need another div that the figrow didn't provide. -* FIXME: mx-auto for non-figrow centred image doesn't work. (e.g. test1) -* caption alignment -- need to match figrow's justify? or does figset have a justify too? -* need left/center/right options for captions -- in figset and margin:0 auto for image if centred -* add Hugo's unsharp mask: https://gohugo.io/functions/images/unsharpmask/ -* get defaults from config file +This is similar to Hugo's built-in 'figure' partial, but uses srcsets +and has other new features. This can be used from another template, with args passed in as a dict, e.g. -{{- partial "figset.html" (dict "page" . "name" "thingy.jpg" "size" "medium" ) -}} + {{- partial "figset.html" (dict "page" . "name" "thingy.jpg" "size" "medium" ) -}} or via the corresponding shortcode: -{{< figset name="fred.png" size="medium" >}} + {{< figset name="fred.png" size="medium" >}} The figset shortcode can get all options from a figrow parent (if any).