Improvements to the climbing theme

Models/Denomination.ts

@@ -79,6 +79,19 @@ export class Denomination {
      * unit.canonicalValue("42 meter") // =>"42 m"
      * 
      * 
+     * // Should be trimmed if canonical is empty
+     * const unit = new Denomination({
+     *               canonicalDenomination: "",
+     *               alternativeDenomination: ["meter","m],
+     *               'default': true,
+     *               human: {
+     *                   en: "meter"
+     *               }
+     *           }, "test")
+     * unit.canonicalValue("42m") // =>"42"
+     * unit.canonicalValue("42") // =>"42"
+     * unit.canonicalValue("42 m") // =>"42"
+     * unit.canonicalValue("42 meter") // =>"42"
      */
     public canonicalValue(value: string, actAsDefault?: boolean) : string {
         if (value === undefined) {
@@ -89,9 +102,9 @@ export class Denomination {
             return null;
         }
         if (stripped === "1" && this._canonicalSingular !== undefined) {
-            return "1 " + this._canonicalSingular
+            return ("1 " + this._canonicalSingular).trim()
         }
-        return stripped + " " + this.canonical;
+        return (stripped + " " + this.canonical).trim();
     }
 
     /**

UI/Popup/FeatureInfoBox.ts

@@ -64,8 +64,10 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
         const title = new TagRenderingAnswer(tags, layerConfig.title ?? new TagRenderingConfig("POI"), state)
             .SetClass("break-words font-bold sm:p-0.5 md:p-1 sm:p-1.5 md:p-2 text-2xl");
         const titleIcons = new Combine(
-            layerConfig.titleIcons.map(icon => new TagRenderingAnswer(tags, icon, state,
+            layerConfig.titleIcons.map(icon => {
-                "block w-8 h-8 max-h-8 align-baseline box-content sm:p-0.5 w-10",)
+                    return new TagRenderingAnswer(tags, icon, state,
+                        "block h-8 max-h-8 align-baseline box-content sm:p-0.5").SetClass("flex");
+                }
             ))
             .SetClass("flex flex-row flex-wrap pt-0.5 sm:pt-1 items-center mr-2")
 

UI/SubstitutedTranslation.ts

@@ -35,7 +35,7 @@ export class SubstitutedTranslation extends VariableUiElement {
             )
         })
 
-        const linkToWeblate = new LinkToWeblate(translation.context, translation.translations)
+        const linkToWeblate = translation !== undefined ? new LinkToWeblate(translation.context, translation.translations) : undefined;
         
         super(
             Locale.language.map(language => {

UI/i18n/Translation.ts

@@ -131,7 +131,6 @@ export class Translation extends BaseUIElement {
 
         const wrapper = document.createElement("span")
         wrapper.appendChild(el)
-        wrapper.classList.add("flex")
         Locale.showLinkToWeblate.addCallbackAndRun(doShow => {
 
             if (!doShow) {

assets/themes/climbing/climbing.json

@@ -143,10 +143,6 @@
           },
           "id": "climbing_club-name"
         },
-        {
-          "id": "minimap",
-          "render": "{minimap(18): height: 5rem; overflow: hidden; border-radius:3rem; }"
-        },
         "website",
         "email",
         "phone",
@@ -287,11 +283,6 @@
       },
       "tagRenderings": [
         "images",
-        "questions",
-        {
-          "id": "minimap",
-          "render": "{minimap(18): height: 5rem; overflow: hidden; border-radius:3rem; }"
-        },
         {
           "render": {
             "en": "<strong>{name}</strong>",
@@ -320,8 +311,7 @@
         "website",
         "phone",
         "email",
-        "opening_hours",
+        "opening_hours"
-        "reviews"
       ],
       "mapRendering": [
         {
@@ -397,11 +387,6 @@
       },
       "tagRenderings": [
         "images",
-        "questions",
-        {
-          "id": "minimap",
-          "render": "{minimap(18): height: 5rem; overflow: hidden; border-radius:3rem; }"
-        },
         {
           "render": {
             "en": "<strong>{name}</strong>",
@@ -555,8 +540,7 @@
             "key": "_embedding_features_with_rock:rock"
           },
           "id": "Rock type"
-        },
+        }
-        "reviews"
       ],
       "presets": [
         {
@@ -704,7 +688,6 @@
       },
       "tagRenderings": [
         "images",
-        "questions",
         {
           "id": "minimap",
           "render": "{minimap(18, id, _contained_climbing_route_ids): height: 9rem; overflow: hidden; border-radius:3rem; }"
@@ -846,8 +829,7 @@
             ]
           },
           "id": "Rock type (crag/rock/cliff only)"
-        },
+        }
-        "reviews"
       ],
       "presets": [
         {
@@ -955,10 +937,6 @@
         "it": "Un’opportunità di arrampicata?"
       },
       "tagRenderings": [
-        {
-          "id": "minimap",
-          "render": "{minimap(18): height: 5rem; overflow: hidden; border-radius:3rem; }"
-        },
         {
           "id": "climbing-opportunity-name",
           "render": {
@@ -1053,26 +1031,50 @@
     }
   ],
   "overrideAll": {
-    "titleIcons": [
+    "+titleIcons": [
       {
-        "render": "<div style='display:block ruby;' class='m-1 '><img src='./assets/themes/climbing/height.svg' style='width:2rem; height:2rem'/>{climbing:length}m</div>",
+        "render": "<div class='flex' style='word-wrap: normal; padding-right: 0.25rem;'><img src='./assets/themes/climbing/height.svg' style='height: 1.75rem;'/>{climbing:length}m</div>",
-        "freeform": {
+        "condition": "climbing:length~*"
-          "key": "climbing:length"
-        }
       },
       {
-        "render": "<div style='display:block ruby;' class='m-1 '><img src='./assets/themes/climbing/carabiner.svg' style='width:2rem; height:2rem'/>{climbing:bolted}</div>",
-        "freeform": {
-          "key": "climbing:bolted"
-        },
         "mappings": [
+          {
+            "if": "climbing:bolts~*",
+            "then": "<div class='flex' style='padding-right: 0.25rem;'><img src='./assets/themes/climbing/carabiner.svg' style='width: 1rem;'/>{climbing:bolts}</div>"
+          },
           {
             "if": "climbing:bolted=yes",
             "then": "<img src='./assets/themes/climbing/carabiner.svg' style='width:2rem; height:2rem'/>"
           }
         ]
       },
-      "defaults"
+      {
+            "mappings": [
+              {
+                "if": "climbing:grade:french~3.*",
+                "then": "<div class='rounded-full px-1' style='background-color:#ebf224'> {climbing:grade:french}</div>"
+              },
+              {
+                "if": "climbing:grade:french~4.*",
+                "then": "<div class='rounded-full pl-2 pr-2' style='background-color:#7af224'> {climbing:grade:french}</div>"
+              },{
+                "if": "climbing:grade:french~5.*",
+                "then": "<div class='rounded-full pl-2 pr-2' style='background-color:#f24a24'> {climbing:grade:french}</div>"
+              },
+              {
+                "if": "climbing:grade:french~6.*",
+                "then": "<div class='text-white rounded-full pl-2 pr-2' style='background-color:#244af2'> {climbing:grade:french}</div>"
+              },
+              {
+                "if": "climbing:grade:french~7.*",
+                "then": "<div class='text-white rounded-full pl-2 pr-2' style='background-color:#e904ed'> {climbing:grade:french}</div>"
+              },
+              {
+                "if": "climbing:grade:french~*",
+                "then": "<div class='text-white rounded-full px-2' style='background-colour:black'> {climbing:grade:french}</div>"
+              }
+        ]
+      }
     ],
     "+calculatedTags": [
       "_embedding_feature_properties=feat.overlapWith('climbing').map(f => f.feat.properties).filter(p => p !== undefined).map(p => {return{access: p.access, id: p.id, name: p.name, climbing: p.climbing, 'access:description': p['access:description']}})",
@@ -1690,7 +1692,9 @@
             "hideInAnswer": true
           }
         ]
-      }
+      },
+      "questions",
+      "reviews"
     ]
   }
 }

css/index-tailwind-output.css

@@ -1523,10 +1523,6 @@ video {
   padding-left: 1rem;
 }
 
-.pl-1 {
-  padding-left: 0.25rem;
-}
-
 .pl-2 {
   padding-left: 0.5rem;
 }
@@ -1543,6 +1539,10 @@ video {
   padding-bottom: 0.25rem;
 }
 
+.pl-1 {
+  padding-left: 0.25rem;
+}
+
 .pr-1 {
   padding-right: 0.25rem;
 }