Merge pull request #57 from arturo-lang/more-minor-website-enhancements

More minor website enhancements
arturo-lang · Apr 15, 2024 · 381d242 · 381d242
2 parents 83f2c99 + e79e0dc
commit 381d242
Show file tree

Hide file tree

Showing 8 changed files with 54 additions and 105 deletions.
diff --git a/tools/generateweb.art b/tools/generateweb.art
@@ -144,19 +144,7 @@ processPackagePage: function [entry][
     postprocessHTML render.template read "website/package.html" entry\info\fullName
 ]
 
-;--------------------------------
-; DEBUGGING!
-;--------------------------------
-; entry2: new searchable\0
-; entry2\value: "easyhtml"
-
-; entry3: new searchable\0
-; entry3\value: "artsembly"
-
-; 'searchable ++ entry2
-; 'searchable ++ entry3
-
-searchable: write.json ø searchable
+searchable: write.compact.json ø searchable
 
 loop entries 'entry [
     tgtName: ~{public/|entry\name|}
@@ -167,6 +155,7 @@ loop entries 'entry [
     currentVersion: first entry\version
     currentVersionIsLatest: true
     write ~{|tgtName|/index.html} processPackagePage entry
+    compressHTML ~{|tgtName|/index.html}
 
     createSpecFile entry currentVersion tgtName
 
@@ -182,6 +171,7 @@ loop entries 'entry [
             currentVersionIsLatest: true
 
         write ~{|versionTgt|/index.html} processPackagePage entry
+        compressHTML ~{|versionTgt|/index.html}
 
         createSpecFile entry vv versionTgt
     ]

diff --git a/tools/gfm.rb b/tools/gfm.rb
@@ -5,7 +5,10 @@
         github_pre_lang: true,
         unsafe: true 
     },
-    extension: { footnotes: true }
+    extension: { 
+        header_ids: "",
+        footnotes: true 
+    }
 }, plugins: { 
     syntax_highlighter: nil 
 })
diff --git a/website/components/footer.html b/website/components/footer.html
@@ -15,11 +15,11 @@
                 </p>
             </div>
         </footer>
-        <script src="https://cdn.jsdelivr.net/npm/devbridge-autocomplete@1.4.11/dist/jquery.autocomplete.min.js"></script>
-        <script src="https://cdn.jsdelivr.net/gh/cferdinandi/smooth-scroll@15.0.0/dist/smooth-scroll.polyfills.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/combine/npm/devbridge-autocomplete@1.4.11/dist/jquery.autocomplete.min.js,gh/cferdinandi/smooth-scroll@15.0.0/dist/smooth-scroll.polyfills.min.js,npm/fuse.js@7.0.0,npm/protip@1.4.21/protip.min.js,npm/javascript-time-ago@2.5.9/bundle/javascript-time-ago.js"></script>
+        <!-- <script src="https://cdn.jsdelivr.net/"></script>
         <script src="https://cdn.jsdelivr.net/npm/fuse.js@7.0.0"></script>
         <script src="https://cdn.jsdelivr.net/npm/protip@1.4.21/protip.min.js"></script>
-        <script src="https://cdn.jsdelivr.net/npm/javascript-time-ago@2.5.9/bundle/javascript-time-ago.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/javascript-time-ago@2.5.9/bundle/javascript-time-ago.js"></script> -->
         <script src="<||= siteroot ||>/script.js"></script>
         <script>
             $(document).ready(function(){

diff --git a/website/components/header.html b/website/components/header.html
@@ -5,14 +5,9 @@
         <!-- Meta -->
         <meta charset="utf-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title><||= packageTitle ||>Arturo Packages</title>
-
-        <!-- Fonts -->
-        <link rel="stylesheet" href="https://cdn.jsdelivr.net/combine/npm/bulma@0.9.4/css/bulma.min.css,npm/prismjs@1.29.0/themes/prism.min.css">
-        <link rel="preconnect" href="https://fonts.googleapis.com">
-        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-        <link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&family=Inter:wght@0..900&display=swap" rel="stylesheet">
+        <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1.0, user-scalable=no">
+        <title><||= packageTitle ||>Arturo Packager</title>
+        <meta name="description" content="<||= (packageTitle = "") ? -> "Package manager for the Arturo programming language" -> ~"Download |capitalize packageTitle|Package for the Arturo programming language" ||>">
 
         <!-- FavIcon -->
         <link rel="apple-touch-icon" sizes="57x57" href="<||= siteroot ||>/favico/apple-icon-57x57.png">
@@ -32,6 +27,13 @@
         <meta name="msapplication-TileImage" content="<||= siteroot ||>/favico/ms-icon-144x144.png">
         <meta name="theme-color" content="#ffffff">
 
+        <!-- Fonts & Styles -->
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/combine/npm/bulma@0.9.4/css/bulma.min.css,npm/prismjs@1.29.0/themes/prism-okaidia.min.css,npm/protip@1.4.21/protip.min.css">
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css">
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
+
         <!-- Icons -->
         <script src="https://kit.fontawesome.com/8bfb2fe6f4.js" crossorigin="anonymous"></script>
 
@@ -41,9 +43,6 @@
             integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
             crossorigin="anonymous"></script>
 
-        <!-- Extra styles -->
-        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/protip@1.4.21/protip.min.css">
-
         <!-- Our main style -->
         <link rel="stylesheet" type="text/css" href="<||= siteroot ||>/style.css">
     </head>

diff --git a/website/components/search.html b/website/components/search.html
@@ -4,7 +4,7 @@
             <div class="column is-4 is-offset-4 main-header">
                 <|| if isHome [||>
                     <figure class="logo">
-                        <img src="<||= siteroot ||>/images/logo.png">
+                        <img src="<||= siteroot ||>/images/logo.png" alt="Arturo package manager">
                     </figure>
                 <|| ] ||>
                 <h1 class="title has-text-black main-title">

diff --git a/website/package.html b/website/package.html
@@ -22,9 +22,6 @@ <h2 class="is-size-2"><b><a href="<||= getLink entry\name ø ||>"><||= entry\nam
                                         <i class="fa fa-github"></i>
                                     </span>
                                 </a>
-                                <!-- <span class="icon">
-                                    <i class="fas fa-cube"></i>
-                                </span>&nbsp;<||= entry\name ||>.pkgr.art -->
                             </div>
                         </div>
                     </div>
@@ -218,73 +215,8 @@ <h3 class="is-size-5"><||= entry\info\description ||></h3>
             });
         <|| ] ||>
     });
-    document.addEventListener('DOMContentLoaded', () => {
-        TimeAgo.addDefaultLocale({
-            "locale": "en",
-            "long": {
-                "year": {
-                    "previous": "last year",
-                    "past": {
-                        "one": "{0} year ago",
-                        "other": "{0} years ago"
-                    }
-                },
-                "quarter": {
-                    "previous": "last quarter",
-                    "past": {
-                        "one": "{0} quarter ago",
-                        "other": "{0} quarters ago"
-                    }
-                },
-                "month": {
-                    "previous": "last month",
-                    "past": {
-                        "one": "{0} month ago",
-                        "other": "{0} months ago"
-                    }
-                },
-                "week": {
-                    "previous": "last week",
-                    "past": {
-                        "one": "{0} week ago",
-                        "other": "{0} weeks ago"
-                    }
-                },
-                "day": {
-                    "previous": "yesterday",
-                    "past": {
-                        "one": "{0} day ago",
-                        "other": "{0} days ago"
-                    }
-                },
-                "hour": {
-                    "past": {
-                        "one": "{0} hour ago",
-                        "other": "{0} hours ago"
-                    }
-                },
-                "minute": {
-                    "past": {
-                        "one": "{0} minute ago",
-                        "other": "{0} minutes ago"
-                    }
-                },
-                "second": {
-                    "current": "now",
-                    "past": {
-                        "one": "{0} second ago",
-                        "other": "{0} seconds ago"
-                    },
-                }
-            },
-            "now": {
-                "now": {
-                    "current": "now",
-                    "past": "just now"
-                }
-            }
-        });
-        $("#last-version-ago").html(new TimeAgo('en').format(Date.parse("<||= to :string get first entry\version 'date ||>"), 'long'));
+    document.addEventListener("DOMContentLoaded",()=>{
+        TimeAgo.addDefaultLocale({locale:"en",long:{year:{previous:"last year",past:{one:"{0} year ago",other:"{0} years ago"}},quarter:{previous:"last quarter",past:{one:"{0} quarter ago",other:"{0} quarters ago"}},month:{previous:"last month",past:{one:"{0} month ago",other:"{0} months ago"}},week:{previous:"last week",past:{one:"{0} week ago",other:"{0} weeks ago"}},day:{previous:"yesterday",past:{one:"{0} day ago",other:"{0} days ago"}},hour:{past:{one:"{0} hour ago",other:"{0} hours ago"}},minute:{past:{one:"{0} minute ago",other:"{0} minutes ago"}},second:{current:"now",past:{one:"{0} second ago",other:"{0} seconds ago"}}},now:{now:{current:"now",past:"just now"}}}),$("#last-version-ago").html(new TimeAgo("en").format(Date.parse("<||= to :string get first entry\version 'date ||>"),"long"))
     });
 </script>
 

diff --git a/website/script.js b/website/script.js
@@ -21,6 +21,9 @@ Prism.languages.arturo = {
         greedy: true,
         alias: 'function'
     },
+	"attribute": {
+		pattern: /\.([\w]+\b\??:?)/i
+	},
     'builtin': {
         pattern: /[\w]+\b\??:/i
     },
@@ -40,13 +43,20 @@ Prism.languages.arturo = {
         pattern: /\b(?:abs|accept|acos|acosh|acsec|acsech|actan|actanh|add|after|alert|alias|alphabet|alphaParticleMass|and|angle|angstromStar|append|arg|args|arithmeticError|arity|arrange|array|as|asec|asech|asin|asinh|assertionError|atan|atan2|atanh|atomicMass|attr|attrs|average|avogadroConstant|before|benchmark|blend|bohrRadius|boltzmannConstant|break|browse|builtins1|builtins2|call|capitalize|case|ceil|chop|chunk|clamp|classicalElectronRadius|clear|clip|close|cluster|coalesce|collect|color|combine|compare|conductanceQuantum|config|conj|connect|constructor|continue|conversionError|convert|copy|cos|cosh|couple|crc|csec|csech|ctan|ctanh|cursor|darken|dec|decode|decouple|define|delete|denominator|desaturate|deuteronMass|deviation|dialog|dictionary|difference|digest|digits|div|divmod|do|download|drop|dup|electronCharge|electronMass|electronMassEnergy|else|empty|encode|ensure|enumerate|env|epsilon|escape|execute|exit|exp|extend|extract|factorial|factors|false|fdiv|filter|first|flatten|floor|fold|from|function|gamma|gather|gcd|get|goto|gravitationalConstant|grayscale|hartreeEnergy|hash|helionMass|hypot|if|impedanceOfVacuum|import|in|inc|indent|index|indexError|infinite|info|input|insert|inspect|intersection|inverseConductanceQuantum|invert|is|jaro|join|josephsonConstant|keys|kurtosis|last|lcm|let|levenshtein|libraryError|lighten|list|listen|ln|log|loop|lower|magneticFluxQuantum|mail|map|match|max|maximum|maybe|median|method|methods|min|minimum|mod|molarGasConstant|move|mul|muonMass|nameError|nand|neg|neutronMass|new|nor|normalize|not|now|null|numerator|open|or|outdent|packageError|pad|palette|panic|path|pause|permissions|permutate|pi|planckConstant|planckLength|planckMass|planckTemperature|planckTime|pop|popup|pow|powerset|powmod|prepend|print|prints|process|product|property|protonMass|protonMassEnergy|query|random|range|read|receive|reciprocal|reducedPlanckConstant|relative|remove|rename|render|repeat|replace|request|return|reverse|rotate|round|runtimeError|rydbergConstant|sample|saturate|scalar|script|sec|sech|select|send|serve|set|shl|shr|shuffle|sin|sinh|size|skewness|slice|sort|sortable|specify|speedOfLight|spin|split|sqrt|squeeze|stack|standardGasVolume|standardPressure|standardTemperature|store|strip|sub|sum|switch|symbols|symlink|syntaxError|sys|systemError|take|tally|tan|tanh|tau|tauMass|terminal|terminate|thomsonCrossSection|throw|timestamp|to|translate|tritonMass|true|truncate|try|type|typeError|uiError|unclip|union|unique|units|unless|unplug|unstack|until|unzip|upper|vacuumPermeability|vacuumPermittivity|valueError|values|var|variance|vmError|volume|vonKlitzingConstant|webview|while|with|wordwrap|write|xnor|xor|zip)\b/,
         alias: 'keyword'
     },
-    'sugar': {
-        pattern: /\->|=>|\||\:\:/,
+	"user": {
+		pattern: /([\w]+\b\??:?)/i
+	},
+	'sugar': {
+        pattern: /\-\>|\=\>|\:\:/,
         alias: 'important'
     },
     'symbol': {
-        pattern: /<\:|\-\:|ø|@|#|\+|\||\*|\$|\-|\%|\/|\.\.|\^|~|=|<|>|\\|\-\-\-/
-    }
+        pattern: /\<\=|\<\=\>|\<\<\=|\=\>\>|\<\<\=\>\>|\<\-|\<\-\>|\<\<\-|\-\>\>|\<\<\-\>\>|\-\<|\>\-|\>\-\<|\-\<\<|\>\>\-|\>\>\-\<\<|\<\<|\>\>|\<\<\<|\>\>\>|\<\-\-|\-\-\>|\<\-\-\>|\<\=\=|\=\=\>|\<\=\=\>|\<~|~\>|\<~\>|\|\>|\<\||\<\|\>|\=\<|\>\=|\<\>|\<\:|\-\:|\>\:|~|\!|\!\!|\?|\?\?|@|\#|\#\#|\#\#\#|\#\#\#\#|\#\#\#\#\#|\#\#\#\#\#\#|\$|%|\^|&|\*|\*\*|\-|\-\-|\=|\=\=|\=~|\+|\+\+|\<|\>|\/|\/%|\/\/|\\\\|\\\\\\\\|\||\|\-|\|\=|\.\.|\.\.\.|\.\/|\:|\:\:|\:\=|\|\||ø|∅|∞|∑|∏|∩|∪|⊂|⊃|⊆|⊇|∈|∉|∧|∨|⊻|⊼|¬|\-\-\-/
+    },
+	"more-sugar": {
+		pattern: /\|/,
+		alias: 'important'
+	}
 };
 
 Prism.languages.art = Prism.languages['arturo'];

diff --git a/website/style.scss b/website/style.scss
@@ -9,6 +9,13 @@ $borderColor: #e0e0e0;
 $mobileWidth: 768px;
 $tabletWidth: 1023px;
 
+/* Specify in CSS */
+pre, code { font-family: 'Fira Code', monospace !important; }
+
+@supports (font-variation-settings: normal) {
+  pre, code { font-family: 'Fira Code VF', monospace !important; }
+}
+
 html,body {
     font-family: 'Inter', sans-serif;
     font-weight: 400;
@@ -393,10 +400,18 @@ a.version-link {
                             }
                         }
                     }
+
+
+                    pre, code {
+                        -webkit-font-feature-settings: "ss03", "ss04", "ss05", "ss07", "ss09", "cv01", "cv02", "cv20", "cv22", "cv23", "calt";;
+                        -moz-font-feature-settings: "ss03", "ss04", "ss05", "ss07", "ss09", "cv01", "cv02", "cv20", "cv22", "cv23", "calt";
+                        font-feature-settings: "ss03", "ss04", "ss05", "ss07", "ss09", "cv01", "cv02", "cv20", "cv22", "cv23", "calt";
+                        text-rendering: optimizelegibility;
+                    }
 
-                    code {
+                    code:not([class*=language-]),
+                    pre:not([class*=language-]) {
                         color: inherit !important;
-                        font-family: "Fira Code", monospace !important;
                     }
 
                     a {