refactor: Some tweaks to the example demo (i18next#1057)

* fix: Remove css styles that are overriden later * refactor: Use dynamic title based on the locale
skrivanos · Mar 11, 2021 · c6fc2e3 · c6fc2e3
1 parent 8973022
commit c6fc2e3
Show file tree

Hide file tree

Showing 8 changed files with 13 additions and 11 deletions.
diff --git a/examples/simple/components/Header.js b/examples/simple/components/Header.js
@@ -1,9 +1,9 @@
 import Head from 'next/head'
 
-export const Header = ({ title }) => (
+export const Header = ({ heading, title }) => (
   <>
     <Head>
-      <title>next-i18next</title>
+      <title>{title}</title>
 
       <link href='https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css' rel='stylesheet' />
       <link href='/app.css' rel='stylesheet' />
@@ -17,7 +17,7 @@ export const Header = ({ title }) => (
       <hr />
     </h2>
     <h1>
-      {title}
+      {heading}
     </h1>
     <a
       className='github'

diff --git a/examples/simple/pages/index.js b/examples/simple/pages/index.js
@@ -15,7 +15,7 @@ const Homepage = () => {
   return (
     <>
       <main>
-        <Header title={t('h1')} />
+        <Header heading={t('h1')} title={t('title')} />
         <div>
           <Link
             href='/'

diff --git a/examples/simple/pages/second-page.js b/examples/simple/pages/second-page.js
@@ -13,7 +13,7 @@ const SecondPage = () => {
   return (
     <>
       <main>
-        <Header title={t('h1')} />
+        <Header heading={t('h1')} title={t('title')} />
         <Link href='/'>
           <button
             type='button'

diff --git a/examples/simple/public/app.css b/examples/simple/public/app.css
@@ -50,13 +50,11 @@ button {
   outline: 0;
   text-decoration: none;
   cursor: pointer;
-  padding: .4rem;
   background-color: rgba(255, 255, 255, 0.5);
   box-sizing: border-box;
   font-size: 1em;
   font-family: inherit;
   border-radius: 3px;
-  margin: .1rem;
   transition: box-shadow .2s ease;
   user-select: none;
   line-height: 2.5em;

diff --git a/examples/simple/public/locales/de/common.json b/examples/simple/public/locales/de/common.json
@@ -3,5 +3,6 @@
   "change-locale": "Wechseln Locale",
   "to-second-page": "Zur zweiten Seite",
   "error-with-status": "Auf dem Server ist ein Fehler ({{statusCode}}) aufgetreten",
-  "error-without-status": "Auf dem Server ist ein Fehler aufgetreten"
+  "error-without-status": "Auf dem Server ist ein Fehler aufgetreten",
+  "title": "Hauptseite | next-i18next"
 }
diff --git a/examples/simple/public/locales/de/second-page.json b/examples/simple/public/locales/de/second-page.json
@@ -1,4 +1,5 @@
 {
   "h1": "Eine zweite Seite, um das Routing zu demonstrieren",
-  "back-to-home": "Zurück zur Hauptseite"
+  "back-to-home": "Zurück zur Hauptseite",
+  "title": "Zweite Seite | next-i18next"
 }
diff --git a/examples/simple/public/locales/en/common.json b/examples/simple/public/locales/en/common.json
@@ -3,5 +3,6 @@
   "change-locale": "Change locale",
   "to-second-page": "To second page",
   "error-with-status": "A {{statusCode}} error occurred on server",
-  "error-without-status": "An error occurred on the server"
+  "error-without-status": "An error occurred on the server",
+  "title": "Home | next-i18next"
 }
diff --git a/examples/simple/public/locales/en/second-page.json b/examples/simple/public/locales/en/second-page.json
@@ -1,4 +1,5 @@
 {
   "h1": "A second page, to demonstrate routing",
-  "back-to-home": "Back to home"
+  "back-to-home": "Back to home",
+  "title": "Second page | next-i18next"
 }