localization in progress

4 years ago · 121c5526b3
10 changed files with 40 additions and 43 deletions
--- a/public/android-chrome-192x192.png
+++ b/public/android-chrome-192x192.png
--- a/public/android-chrome-512x512.png
+++ b/public/android-chrome-512x512.png
--- a/public/apple-touch-icon.png
+++ b/public/apple-touch-icon.png
--- a/public/index.html
+++ b/public/index.html
@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en">
+<html lang="de">

 <head>
  <meta charset="utf-8">
@ -13,10 +13,10 @@
  <link rel="icon" type="image/png" sizes="16x16" href="%PUBLIC_URL%/favicon-16x16.png">
  <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
  <link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#5bbad5">
-  <meta name="theme-color" content="#50d29d">
+  <meta name="theme-color" content="#55b223">
  <script src="https://apis.google.com/js/api.js"></script>

-  <title>Expenses</title>
+  <title>Haushaltsbuch</title>
 </head>

 <body>
--- a/public/manifest.json
+++ b/public/manifest.json
@ -1,6 +1,6 @@
 {
-    "short_name": "Expenses",
-    "name": "Expense Manager",
+    "short_name": "Haushaltsbuch",
+    "name": "Haushaltsbuch",
    "icons": [
        {
            "src": "/android-chrome-192x192.png",
@ -13,8 +13,8 @@
            "type": "image/png"
        }
    ],
-    "theme_color": "#50d29d",
-    "background_color": "#50d29d",
+    "theme_color": "#55b223",
+    "background_color": "#55b223",
    "display": "standalone",
    "start_url": "."
 }
--- a/src/App.css
+++ b/src/App.css
@ -5,7 +5,7 @@
 }

 header.mdc-toolbar {
-  background-color: #50d29d;
+  background-color: #55b223;
 }
 button.mdc-toolbar__icon {
  display: inline-block;
--- a/src/App.js
+++ b/src/App.js
@ -86,12 +86,12 @@ class App extends Component {
    submitAction(this.state.expense).then(
      response => {
        this.snackbar.show({
-          message: `Expense ${this.state.expense.id ? "updated" : "added"}!`
+          message: `Ausgabe ${this.state.expense.id ? "aktualisiert" : "hinzugefügt"}!`
        });
        this.load();
      },
      response => {
-        console.error("Something went wrong");
+        console.error("Ausgabe konnte nicht gespeichert werden!");
        console.error(response);
        this.setState({loading: false});
      }
@ -127,11 +127,11 @@ class App extends Component {
      })
      .then(
        response => {
-          this.snackbar.show({ message: "Expense deleted!" });
+          this.snackbar.show({message: "Ausgabe entfernt!"});
          this.load();
        },
        response => {
-          console.error("Something went wrong");
+          console.error("Ausgabe konnte nicht entfernt werden!");
          console.error(response);
          this.setState({loading: false});
        }
@ -246,7 +246,7 @@ class App extends Component {
        <header className="mdc-toolbar mdc-toolbar--fixed">
          <div className="mdc-toolbar__row">
            <section className="mdc-toolbar__section mdc-toolbar__section--align-start">
-              <span className="mdc-toolbar__title">Expenses</span>
+              <span className="mdc-toolbar__title">Haushaltsrechner</span>
            </section>
            <section
              className="mdc-toolbar__section mdc-toolbar__section--align-end"
@ -347,13 +347,13 @@ class App extends Component {
        <div>
          <div className="mdc-card">
            <section className="mdc-card__primary">
-              <h2 className="mdc-card__subtitle">This month you've spent:</h2>
+              <h2 className="mdc-card__subtitle">Ausgaben dieses Monat:</h2>
              <h1 className="mdc-card__title mdc-card__title--large center">
                {this.state.currentMonth}
              </h1>
            </section>
            <section className="mdc-card__supporting-text">
-              Previous month: {this.state.previousMonth}
+              Vorheriges Monat: {this.state.previousMonth}
            </section>
          </div>
          <ExpenseList
--- a/src/components/expense-form/ExpenseForm.js
+++ b/src/components/expense-form/ExpenseForm.js
@ -103,7 +103,7 @@ class ExpenseForm extends Component {
              min="0"
              required
            />
-            <label className="mdc-textfield__label">Amount</label>
+            <label className="mdc-textfield__label">Betrag</label>
          </div>
        </div>

@ -130,7 +130,7 @@ class ExpenseForm extends Component {
              onChange={this.handleInputChange}
              type="text"
            />
-            <label className="mdc-textfield__label">Description</label>
+            <label className="mdc-textfield__label">Notiz</label>
          </div>
        </div>

@ -144,7 +144,7 @@ class ExpenseForm extends Component {
              type="date"
              required
            />
-            <label className="mdc-textfield__label">Date</label>
+            <label className="mdc-textfield__label">Datum</label>
          </div>
        </div>

@ -166,7 +166,7 @@ class ExpenseForm extends Component {
          <input
            type="submit"
            className="mdc-button"
-            value={this.props.expense.id ? "Update" : "Add"}
+            value={this.props.expense.id ? "Updaten" : "Hinzufügen"}
            disabled={!this.state.isValid}
          />
          {this.props.expense.id &&
@ -174,13 +174,13 @@ class ExpenseForm extends Component {
              type="button"
              className="mdc-button"
              onClick={() => this.dialog.show()}
-              value="Delete"
+              value="Löschen"
            />}
          <input
            type="button"
            className="mdc-button"
            onClick={() => this.props.onCancel()}
-            value="Close"
+            value="Schliessen"
          />
        </div>
      </form>
--- a/src/components/expense-list/ExpenseDetail.js
+++ b/src/components/expense-list/ExpenseDetail.js
@ -4,7 +4,7 @@ import ExpenseIcon from "./ExpenseIcon";
 export default class ExpenseDetail extends Component {
  formatDate(date) {
    const dateParts = date.split("-");
-    return `${dateParts[2]}/${dateParts[1]}/${dateParts[0]}`;
+    return `${dateParts[2]}.${dateParts[1]}.${dateParts[0]}`;
  }

  render() {
--- a/src/components/expense-list/ExpenseList.css
+++ b/src/components/expense-list/ExpenseList.css
@ -15,23 +15,20 @@
 .Lebensmittel {
  background: rgb(85, 178, 35);
 }
-.Restaurant {
-  background: rgb(242, 60, 0);
-}
 .Auto, .Transport, .Tanken {
-  background: rgb(166, 2, 221);
+  background: rgb(242, 60, 0);
 }
 .Hobbies {
-  background: rgb(38, 94, 4);
+  background: rgb(39, 70, 211);
 }
 .Kleidung, .Shopping, Drogerie {
  background: rgb(0, 183, 224);
 }
-.Übernachtung {
+.Übernachtung, .Restaurant {
  background: rgb(214, 214, 0);
 }
 .Gesundheit {
-  background: rgb(252, 169, 5);
+  background: rgb(242, 60, 0);
 }
 .Unterhaltung {
  background: rgb(245, 151, 29);