move text into strings

_i18n/en.yml

@@ -6,6 +6,57 @@ app_tiles_image_alt: 'Butter App features collection'
 view_all_apps: 'View All Apps'
 built_on_fdroid: Built on F-Droid Free Software
 
+butter_box_title: 'Welcome to the Butter Box'
+explore: 'Explore'
+explore_missing: 'Insert USB drive to broadcast content'
+message_board: "Message Board"
+app_store: 'App Store'
+offline_maps: 'Offline Maps'
+
+apps:
+  breadcrumb: "App Store"
+  footer: The Butter App Store is built on F-Droid free software
+  title: Discover the Butter App Store
+  subtitle: 'Featuring free, ad-free Android apps that use less internet and less battery'
+  main_cta: Download App Store
+  sub_cta: "Less than 10 MB"
+  view_in_browser: View in Browser
+
+maps:
+  breadcrumb: "Offline Maps"
+  main_cta: "Download OsmAnd"
+  sub_cta: "137 MB"
+  title: "Navigating Offline"
+  subtitle: "OsmAnd is an offline world map application based on OpenStreetMap"
+  sections:
+    section1:
+      title: "About OsmAnd"
+      text: OsmAnd allows you to navigate taking into account the preferred roads and vehicle dimensions. Plan routes based on inclines and record GPX tracks without an internet connection. OsmAnd is an open source app. It does not collect user data and you decide what data the app will have access to.
+    section2:
+      title: "Map Files"
+      text: Download map files for your region. To import a map file into OsmAnd, locate the file in your device downloads. Then open it with the OsmAnd app.
+
+sideloading_modal:
+  heading: Continue With Confidence
+  paragraphs:
+  - 'Downloading apps from unknown sources can expose your device to malicious software. For this reason, your phone will warn against it.'
+  - 'The Butter App Store and the apps in it are checked for malware before they are shared. Consider it a safe source.'
+  confirm: Continue to Download
+  go_back: Go Back
+
+explore_page:
+  files: 'Files'
+  folders: 'Folders'
+  items: 'items'
+  sort_by: 'Sort by'
+  sort_options:
+    name_a: 'Name: A-Z'
+    namd_d: 'Name: Z-A'
+    date_a: 'Date Modified: Oldest'
+    date_d: 'Date Modified: Newest'
+    size_a: 'Size: Smallest'
+    size_d: 'Size: Biggest'
+
 modal:
   title: 'Butter: Free, ad-free apps to help you offline'
   butter_app_logo_alt: 'Butter App Logo'
@@ -19,11 +70,6 @@ modal:
   warning: |
     You will need to enable downloads from unknown sources to install this app on your Android phone.
 
-butter_box_title: 'Welcome to the Butter Box'
-explore: 'Explore'
-message_board: "Message Board"
-app_store: 'App Store'
-offline_maps: 'Offline Maps'
 
 # Some of these are disused.
 apps_subtitle: 'Get Android Apps.'

_includes/fancybutton.html

@@ -5,8 +5,8 @@
             <img class="btn-android" src="{{ site.baseurl}}/assets/images/btr-android.svg">
         </div>
         <div class="btn-text">
-            <span class="button-main-text">{{ include.main_cta }}</span><br>
+            <span class="button-main-text">{% t include.main_cta %}</span><br>
-            <span class="button-sub-text">{{ include.sub_cta }}</span>
+            <span class="button-sub-text">{% t include.sub_cta %}</span>
         </div>
     </div>
 </a>

_includes/sideload.html

@@ -4,27 +4,24 @@
             <main class="modal__content" id="product-modal-content">
                 <div class="modal__content__header">
                     <div class="header__text">
-                        <h2 class="modal__title ls-40" id="product-modal-title">Continue With Confidence</h2>
+                        <h2 class="modal__title ls-40" id="product-modal-title">{% t sideloading_modal.heading %}</h2>
                     </div>
                 </div>
                 <div class="modal__content__description">
+                    {% for paragraph in site.translations[site.lang].sideloading_modal.paragraphs %}
                     <p class="modal__text ls-40">
-                        Downloading apps from unknown sources can expose your device to malicious software. For this
+                        {{ paragraph }}
-                        reason, your phone will warn against it.
-                    </p>
-                    <p class="modal__text ls-40">
-                        The Butter App Store and the apps in it are checked for malware before they are shared. Consider
-                        it a safe source.
                     </p>
+                    {% endfor %}
                 </div>
                 <a class="modal__close" aria-label="Close modal" data-micromodal-close>
-                    Go Back
+                    {% t sideloading_modal.go_back %}
                 </a>
                 <hr style="color: #00000033">
                 <a class="modal__close modal__continue"
                     onclick="MicroModal.close(); window.location='{{ site.baseurl }}/assets/download/butter.apk'"
                     aria-label="Download App Store">
-                    Continue to Download
+                    {% t sideloading_modal.confirm %}
                 </a>
             </main>
         </div>

apps/index.html

@@ -1,10 +1,10 @@
 ---
 layout: informational
-breadcrumb: "App Store"
 footer_content: |
     <a href="https://gitlab.com/guardianproject/wind-fdroidclient">
         The Butter App Store is built on F-Droid free software
     </a>
+breadcrumb: "App Store"
 ---
 
 <!-- Custom style= makes the image line up with the icon. -->
@@ -12,12 +12,12 @@ footer_content: |
     style="max-width: 473px; display: block; margin: 0 auto;">
 <img src="{{ site.baseurl }}/assets/images/butter-app-icon-large.svg" alt="Butter Tile" class="app-tile">
 
-<h1>Discover the Butter App Store</h1>
+<h1>{% t title %}</h1>
-<p class="subtitle">Featuring free, ad-free Android apps that use less internet and less battery</p>
+<p class="subtitle">{% t apps.subtitle %}</p>
 
 <div class="btn-container">
-    {% include fancybutton.html main_cta="Download App Store" sub_cta="Less than 10 MB" href="#" modal="product-modal" %}
+    {% include fancybutton.html main_cta="apps.main_cta" sub_cta="apps.sub_cta" href="#" modal="product-modal" %}
 </div>
 {% include sideload.html %}
 
-<a class="btn-secondary" href="{{ site.base_url }}/fdroid-webdash/">View in Browser</a>
+<a class="btn-secondary" href="{{ site.base_url }}/fdroid-webdash/">{% t apps.view_in_browser %}</a>

maps/index.html

@@ -6,21 +6,18 @@ breadcrumb: "Offline Maps"
 <img src="{{ site.baseurl }}/assets/images/maps-header.png" alt="Maps Header" class="hero">
 <img src="{{ site.baseurl }}/assets/images/osm-tile.png" alt="OpenStreetMaps Tile" class="app-tile">
 
-<h1>Navigating Offline</h1>
+<h1>{% t maps.title %}</h1>
-<p class="subtitle">OsmAnd is an offline world map application based on OpenStreetMap</p>
+<p class="subtitle">{% t maps.subtitle %}</p>
 
 <div class="btn-container">
     {% assign apk_url = site.baseurl | append: "/fdroid/repo/net.osmand.plus_471703.apk" %}
-    {% include fancybutton.html main_cta="Download OsmAnd" sub_cta="137 MB" href=apk_url %}
+    {% include fancybutton.html main_cta="maps.main_cta" sub_cta="maps.sub_cta" href=apk_url %}
 </div>
 
-<h2>About OsmAnd</h2>
+{% for section in site.translations[site.lang].maps.sections %}
-<p class="informational-text">OsmAnd allows you to navigate taking into account the preferred roads and vehicle dimensions. Plan routes based on
+    <h2>{{section[1].title}}</h2>
-    inclines and record GPX tracks without an internet connection. OsmAnd is an open source app. It does not collect
+    <p class="informational-text">{{section[1].text}}</p>
-    user data and you decide what data the app will have access to.</p>
+{% endfor %}
-<h2>Map Files</h2>
-<p class="informational-text">Download map files for your region. To import a map file into OsmAnd, locate the file in your device downloads. Then
-    open it with the OsmAnd app.</p>
 
 <div class="filelist">    
     {% assign obf_url= site.basurl | append: "/fdroid/repo/" | append: "Angola_africa_2.obf.zip" %}