website: misc updates with added samples

1 files changed, 63 insertions, 50 deletions

diff --git a/docs/inter.css b/docs/inter.css
index 2087f688d..7467e6284 100644
--- a/docs/inter.css
+++ b/docs/inter.css
@@ -1,136 +1,149 @@
+---
+layout: none
+---
+{%
+
+for file in site.static_files %}{%
+  assign _path = file.path | remove_first: "/inter" %}{%
+  if _path == "/font-files/Inter-Regular.woff2" %}{%
+    assign font_v = file.modified_time | date: "%Y%m%d%H%M%S" %}{%
+  endif %}{%
+endfor
+
+%}
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 100;
-  src: url("font-files/Inter-Thin.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Thin.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Thin.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Thin.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 100;
-  src: url("font-files/Inter-ThinItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-ThinItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-ThinItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-ThinItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 200;
-  src: url("font-files/Inter-ExtraLight.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-ExtraLight.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-ExtraLight.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-ExtraLight.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 200;
-  src: url("font-files/Inter-ExtraLightItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-ExtraLightItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-ExtraLightItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-ExtraLightItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 300;
-  src: url("font-files/Inter-Light.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Light.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Light.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Light.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 300;
-  src: url("font-files/Inter-LightItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-LightItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-LightItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-LightItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 400;
-  src: url("font-files/Inter-Regular.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Regular.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Regular.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Regular.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 400;
-  src: url("font-files/Inter-Italic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Italic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Italic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Italic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 500;
-  src: url("font-files/Inter-Medium.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Medium.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Medium.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Medium.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 500;
-  src: url("font-files/Inter-MediumItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-MediumItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-MediumItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-MediumItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 600;
-  src: url("font-files/Inter-SemiBold.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-SemiBold.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-SemiBold.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-SemiBold.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 600;
-  src: url("font-files/Inter-SemiBoldItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-SemiBoldItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-SemiBoldItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-SemiBoldItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 700;
-  src: url("font-files/Inter-Bold.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Bold.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Bold.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Bold.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 700;
-  src: url("font-files/Inter-BoldItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-BoldItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-BoldItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-BoldItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 800;
-  src: url("font-files/Inter-ExtraBold.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-ExtraBold.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-ExtraBold.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-ExtraBold.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 800;
-  src: url("font-files/Inter-ExtraBoldItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-ExtraBoldItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-ExtraBoldItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-ExtraBoldItalic.woff?v={{font_v}}") format("woff");
 }
 
 @font-face {
   font-family: 'Inter';
   font-style:  normal;
   font-weight: 900;
-  src: url("font-files/Inter-Black.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-Black.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-Black.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-Black.woff?v={{font_v}}") format("woff");
 }
 @font-face {
   font-family: 'Inter';
   font-style:  italic;
   font-weight: 900;
-  src: url("font-files/Inter-BlackItalic.woff2?v=3.3") format("woff2"),
-       url("font-files/Inter-BlackItalic.woff?v=3.3") format("woff");
+  src: url("font-files/Inter-BlackItalic.woff2?v={{font_v}}") format("woff2"),
+       url("font-files/Inter-BlackItalic.woff?v={{font_v}}") format("woff");
 }
 
 /* -------------------------------------------------------
@@ -147,18 +160,18 @@ Usage:
   font-weight: 100 900;
   font-style: normal;
   font-named-instance: 'Regular';
-  src: url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2 supports variations(gvar)"),
-       url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2-variations"),
-       url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2");
+  src: url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2 supports variations(gvar)"),
+       url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2-variations"),
+       url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2");
 }
 @font-face {
   font-family: 'Inter var';
   font-weight: 100 900;
   font-style: italic;
   font-named-instance: 'Italic';
-  src: url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2 supports variations(gvar)"),
-       url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2-variations"),
-       url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2");
+  src: url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2 supports variations(gvar)"),
+       url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2-variations"),
+       url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2");
 }
 
 /* Legacy naming compatibility */
@@ -167,18 +180,18 @@ Usage:
   font-weight: 100 900;
   font-style: normal;
   font-named-instance: 'Regular';
-  src: url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2 supports variations(gvar)"),
-       url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2-variations"),
-       url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2");
+  src: url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2 supports variations(gvar)"),
+       url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2-variations"),
+       url("font-files/Inter-upright.var.woff2?v={{font_v}}") format("woff2");
 }
 @font-face {
   font-family: 'Inter var alt';
   font-weight: 100 900;
   font-style: italic;
   font-named-instance: 'Italic';
-  src: url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2 supports variations(gvar)"),
-       url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2-variations"),
-       url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2");
+  src: url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2 supports variations(gvar)"),
+       url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2-variations"),
+       url("font-files/Inter-italic.var.woff2?v={{font_v}}") format("woff2");
 }
 
 
@@ -199,6 +212,6 @@ explicitly, e.g.
   font-family: 'Inter var experimental';
   font-weight: 100 900;
   font-style: oblique 0deg 10deg;
-  src: url("font-files/Inter.var.woff2?v=3.3") format("woff2-variations"),
-       url("font-files/Inter.var.woff2?v=3.3") format("woff2");
+  src: url("font-files/Inter.var.woff2?v={{font_v}}") format("woff2-variations"),
+       url("font-files/Inter.var.woff2?v={{font_v}}") format("woff2");
 }