Change to lowercase and scoped translation keys

src/index.html

@@ -105,7 +105,7 @@
         </div>
     </script>
 
-    <a class="offline-banner animateMe" ng-show="client.offline" ng-cloak href="https://docs.cloudron.io/troubleshooting/" target="_blank"><i class="fa fa-circle-notch fa-spin"></i> Cloudron is offline. Reconnecting...</a>
+    <a class="offline-banner animateMe" ng-show="client.offline" ng-cloak href="https://docs.cloudron.io/troubleshooting/" target="_blank"><i class="fa fa-circle-notch fa-spin"></i> {{ 'main.offline' | translate }}</a>
 
     <div class="animateMe ng-hide layout-root" ng-show="initialized">
 

src/translation/de.json

@@ -1,3 +1,8 @@
 {
-    "MY_APPS": "Meine Apps"
+    "apps": {
+        "title": "Meine Apps"
+    },
+    "main": {
+        "offline": "Cloudron ist nicht erreichbar. Verbindungsaufbau…"
+    }
 }

src/translation/en.json

@@ -1,4 +1,8 @@
 {
-    "MY_APPS": "My Apps",
-    "CLOUDRON_OFFLINE": "Cloudron is offline. Reconnecting…"
+    "apps": {
+        "title": "My Apps"
+    },
+    "main": {
+        "offline": "Cloudron is offline. Reconnecting…"
+    }
 }

src/views/apps.html

@@ -112,7 +112,7 @@
 
     <div class="animateMeOpacity ng-hide" ng-show="installedApps.length > 0">
       <h1 class="view-header">
-        {{ 'MY_APPS' | translate }}
+        {{ 'apps.title' | translate }}
         <div class="pull-right">
           <form class="form-inline">
             <input type="text" class="form-control" ng-show="installedApps.length > 8" placeholder="Search Apps" id="appSearch" ng-model="appSearch"/>