Changed quickstart layout

12 files changed, 167 insertions, 50 deletions

diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.da.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.da.yml
index 7ad5c100..016765e4 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.da.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.da.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     # page_title: 'Quickstart'
+    # more: 'More…'
     # intro:
     #     title: 'Welcome to wallabag!'
     #     paragraph_1: "We'll accompany you to visit wallabag and show you some features which can interest you."
     #     paragraph_2: 'Follow us!'
     # configure:
     #     title: 'Configure the application'
+    #     description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
     #     language: 'Change language and design'
     #     rss: 'Enable RSS feeds'
     #     tagging_rules: 'Write rules to automatically tag your articles'
@@ -285,6 +287,7 @@ quickstart:
     #     import: 'Configure import'
     # first_steps:
     #     title: 'First steps'
+    #     description: "Now wallabag is well configured, it's time to archive the web"
     #     new_article: 'Save your first article'
     #     unread_articles: 'And classify it!'
     # migrate:
@@ -294,11 +297,15 @@ quickstart:
     #     wallabag_v1: 'Migrate from wallabag v1'
     #     wallabag_v2: 'Migrate from wallabag v2'
     #     readability: 'Migrate from Readability'
+    #     instapaper: 'Migrate from Instapaper'
     # developer:
     #     title: 'Developers'
+    #     description: 'We also thought to the developers: Docker, API, translations, etc.'
     #     create_application: 'Create your third application'
+    #     use_docker: 'Use Docker to install wallabag'
     # docs:
     #     title: 'Full documentation'
+    #     description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
     #     annotate: 'Annotate your article'
     #     export: 'Convert your articles into ePUB or PDF'
     #     search_filters: 'See how you can look for an article by using search engine and filters'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.de.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.de.yml
index 650e4761..d35ead7d 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.de.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.de.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Schnelleinstieg'
+    # more: 'More…'
     intro:
         title: 'Willkommen zu wallabag!'
         paragraph_1: "Wir werden dich bei der Benutzung von wallabag begleiten und dir einige Funktionen zeigen, die dich interessieren könnten."
         paragraph_2: 'Folge uns!'
     configure:
         title: 'Anwendung konfigurieren'
+        # description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: 'Sprache und Design ändern'
         rss: 'RSS-Feeds aktivieren'
         tagging_rules: 'Schreibe Regeln, um deine Beiträge automatisch zu taggen (verschlagworten)'
@@ -285,6 +287,7 @@ quickstart:
         import: 'Import-Einstellungen ändern'
     first_steps:
         title: 'Erste Schritte'
+        # description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Speichere deinen ersten Artikel'
         unread_articles: 'Und klassifiziere ihn!'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'von wallabag v1 migrieren'
         wallabag_v2: 'von wallabag v2 migrieren'
         readability: 'von Readability migrieren'
+        instapaper: 'von Instapaper migrieren'
     developer:
         title: 'Entwickler'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Erstelle eine Anwendung und nutze die wallabag API'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Komplette Dokumentation'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Anmerkungen zu Artikeln hinzufügen'
         export: 'Artikel nach ePUB oder PDF konvertieren'
         search_filters: 'Schau nach, wie du nach einem Artikel über die Such- und Filterfunktion suchen kannst'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.en.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.en.yml
index d5842cc5..26e5328e 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.en.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.en.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Quickstart'
+    more: 'More…'
     intro:
         title: 'Welcome to wallabag!'
         paragraph_1: "We'll accompany you on your visit to wallabag and show you some features that might interest you."
         paragraph_2: 'Follow us!'
     configure:
         title: 'Configure the application'
+        description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: 'Change language and design'
         rss: 'Enable RSS feeds'
         tagging_rules: 'Write rules to automatically tag your articles'
@@ -285,6 +287,7 @@ quickstart:
         import: 'Configure import'
     first_steps:
         title: 'First steps'
+        description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Save your first article'
         unread_articles: 'And classify it!'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'Migrate from wallabag v1'
         wallabag_v2: 'Migrate from wallabag v2'
         readability: 'Migrate from Readability'
+        instapaper: 'Migrate from Instapaper'
     developer:
         title: 'Developers'
+        description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Create your third application'
+        use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Full documentation'
+        description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Annotate your article'
         export: 'Convert your articles into ePUB or PDF'
         search_filters: 'See how you can look for an article by using the search engine and filters'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.es.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.es.yml
index bd691c1c..2e3e6248 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.es.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.es.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Comienzo rápido'
+    # more: 'More…'
     intro:
         title: 'Bienvenido a wallabag !'
         paragraph_1: "Le acompañaremos a su visita de wallabag y le mostraremos algunas características que le pueden interesar."
         paragraph_2: '¡Síganos!'
     configure:
         title: 'Configure la aplicación'
+        # description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: 'Cambie el idioma y el diseño de la aplicación'
         rss: 'Activar los feeds RSS'
         tagging_rules: 'Escribir reglas para etiquetear automaticamente sus artículos'
@@ -285,6 +287,7 @@ quickstart:
         import: 'Configure importación'
     first_steps:
         title: 'Primeros pasos'
+        # description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Guarde su primer artículo'
         unread_articles: '¡Y clasifíquelo!'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'Migrar desde wallabag v1'
         wallabag_v2: 'Migrar desde wallabag v2'
         readability: 'Migrar desde Readability'
+        instapaper: 'Migrar desde Instapaper'
     developer:
         title: 'Promotores'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Cree su tercera aplicación'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Documentación completa'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Anote su artículo'
         export: 'Convierta sus artículos a ePub o a PDF'
         search_filters: 'Aprenda a utilizar el buscador y los filtros para encontrar el artículo que le interese'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.fa.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.fa.yml
index a9989a83..ca01ce13 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.fa.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.fa.yml
@@ -266,6 +266,7 @@ howto:
 
 quickstart:
     page_title: 'Quickstart'
+    # more: 'More…'
     intro:
         title: 'به wallabag خوش آمدید!!'
         paragraph_1: "به شما کمک خواهیم کرد تا wallabag را بشناسید و با برخی از ویژگی‌های جالبش آشنا شوید"
@@ -294,11 +295,15 @@ quickstart:
         wallabag_v1: 'مهاجرت از نسخهٔ یکم wallabag'
         wallabag_v2: 'مهاجرت از نسخهٔ دوم wallabag'
         readability: 'مهاجرت از نسخهٔ دوم Readability'
+        instapaper: 'مهاجرت از نسخهٔ دوم Instapaper'
     developer:
         title: 'برنامه‌نویسان'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'برنامهٔ wallabag خود را بسازید'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'راهنمای کامل'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'روی مقاله‌هایتان یادداشت بگذارید'
         export: 'مقاله‌هایتان را به قالب ePUB یا PDF دربیاورید'
         search_filters: 'به کمک موتور جستجو و فیلترها به دنبال مقاله‌هایتان بگردید'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.fr.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.fr.yml
index b70ca64d..e2a61059 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.fr.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.fr.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Pour bien débuter'
+    more: 'Plus…'
     intro:
         title: 'Bienvenue sur wallabag !'
         paragraph_1: "Nous allons vous accompagner pour vous faire faire le tour de la maison et vous présenter quelques fonctionnalités qui pourraient vous intéresser pour vous approprier cet outil."
         paragraph_2: 'Suivez-nous !'
     configure:
         title: "Configurez l'application"
+        description: 'Pour voir une application qui vous correspond, allez voir du côté de la configuration de wallabag.'
         language: "Changez la langue et le design de l'application"
         rss: 'Activez les flux RSS'
         tagging_rules: 'Écrivez des règles pour classer automatiquement vos articles'
@@ -285,6 +287,7 @@ quickstart:
         import: "Configurer l'import"
     first_steps:
         title: 'Premiers pas'
+        description: "Maintenant que wallabag est bien configurée, il est temps d'archiver le web"
         new_article: 'Ajoutez votre premier article'
         unread_articles: 'Et rangez-le !'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'Migrer depuis wallabag v1'
         wallabag_v2: 'Migrer depuis wallabag v2'
         readability: 'Migrer depuis Readability'
+        instapaper: 'Migrer depuis Instapaper'
     developer:
         title: 'Pour les développeurs'
+        description: 'Nous avons aussi pensé aux développeurs : Docker, API, traductions, etc.'
         create_application: 'Créer votre application tierce'
+        use_docker: 'Utiliser Docker pour installer wallabag'
     docs:
         title: 'Documentation complète'
+        description: "Il y a tellement de fonctionnalités dans wallabag. N'hésitez pas à lire le manuel pour les connaitre et apprendre comment les utiliser.There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Annoter votre article'
         export: 'Convertissez vos articles en ePub ou en PDF'
         search_filters: "Apprenez à utiliser le moteur de recherche et les filtres pour retrouver l'article qui vous intéresse"
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.it.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.it.yml
index 118098fe..ae486c70 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.it.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.it.yml
@@ -265,12 +265,14 @@ howto:
 
 quickstart:
     page_title: 'Introduzione'
+    # more: 'More…'
     intro:
         title: 'Benvenuto su wallabag!'
         paragraph_1: "Un tour in cui ti guideremo per scoprire e che ti mostrerà delle funzionalità che potrebbero interessarti."
         paragraph_2: 'Seguici!'
     configure:
         title: "Configura l'applicazione"
+        # description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: 'Cambia lingua e design'
         rss: 'Abilita i feed RSS'
         tagging_rules: 'Scrivi delle regole per taggare automaticamente i contenuti'
@@ -284,6 +286,7 @@ quickstart:
         import: "Configura l'importazione"
     first_steps:
         title: 'Pimi passi'
+        # description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Salva il tuo primo contenuto'
         unread_articles: 'E classificalo!'
     migrate:
@@ -293,11 +296,15 @@ quickstart:
         wallabag_v1: 'Trasferisci da wallabag v1'
         wallabag_v2: 'Trasferisci da wallabag v2'
         readability: 'Trasferisci da Readability'
+        instapaper: 'Trasferisci da Instapaper'
     developer:
         title: 'Sviluppatori'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Crea la tua applicazione'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Documentazione completa'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Annota il tuo contenuto'
         export: 'Converti i tuoi contenuti in EPUB o PDF'
         search_filters: 'Impara come puoi recuperare un contenuto tramite la ricerca e i filtri'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.oc.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.oc.yml
index 93467dac..d82ed4cb 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.oc.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.oc.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Per ben començar'
+    # more: 'More…'
     intro:
         title: 'Benvenguda sus wallabag !'
         paragraph_1: "Anem vos guidar per far lo torn de la proprietat e vos presentar unas fonccionalitats que vos poirián interessar per vos apropriar aquesta aisina."
         paragraph_2: 'Seguètz-nos '
     configure:
         title: "Configuratz l'aplicacio"
+        # description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: "Cambiatz la lenga e l'estil de l'aplicacion"
         rss: 'Activatz los fluxes RSS'
         tagging_rules: 'Escrivètz de règlas per classar automaticament vòstres articles'
@@ -285,6 +287,7 @@ quickstart:
         import: 'Configurar los impòrt'
     first_steps:
         title: 'Primièrs passes'
+        # description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Ajustatz vòstre primièr article'
         unread_articles: 'E racaptatz-lo !'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'Migrar dempuèi wallabag v1'
         wallabag_v2: 'Migrar dempuèi wallabag v2'
         readability: 'Migrar dempuèi Readability'
+        instapaper: 'Migrar dempuèi Instapaper'
     developer:
         title: 'Pels desvolopadors'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Crear vòstra aplicacion tèrça'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Documentacion complèta'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Anotatar vòstre article'
         export: 'Convertissètz vòstres articles en ePub o en PDF'
         search_filters: "Aprenètz a utilizar lo motor de recèrca e los filtres per retrobar l'article que vos interèssa"
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.pl.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.pl.yml
index 27507a81..4a035520 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.pl.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.pl.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Szybki start'
+    # more: 'More…'
     intro:
          title: 'Witaj w wallabag!'
          paragraph_1: "Będziemy ci towarzyszyli w Twojej poznaniu wallabag i pokażemy możliwości, które mogą cię zainteresować."
          paragraph_2: 'Śledź nas!'
     configure:
          title: 'Konfiguruj aplikację'
+         description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
          language: 'Zmień język i wygląd'
          rss: 'Włącz kanały RSS'
          tagging_rules: 'Napisz reguły pozwalające na automatyczne otagowanie twoich artykułów'
@@ -285,6 +287,7 @@ quickstart:
          import: 'Skonfigurować import'
     first_steps:
         title: 'Pierwsze kroki'
+        description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'Zapisz swój pierwszy artukuł'
         unread_articles: 'I sklasyfikuj go!'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: 'Migruj z wallabag v1'
         wallabag_v2: 'Migruj z wallabag v2'
         readability: 'Migruj z Readability'
+        instapaper: 'Migruj z Instapaper'
     developer:
         title: 'Deweloperzy'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         create_application: 'Stwórz swoją aplikację'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Pełna Dokumentacja'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         annotate: 'Dadaj adnotację do swojego artykułu'
         export: 'Konwertuj swoje artykuły do ePUB lub PDF'
         search_filters: 'Zabacz jak możesz znaleźć artykuł dzięku użyciu silnika wyszukiwarki i filtrów'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.ro.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.ro.yml
index 7c77ffb7..39a2f33d 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.ro.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.ro.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     # page_title: 'Quickstart'
+    # more: 'More…'
     # intro:
     #     title: 'Welcome to wallabag!'
     #     paragraph_1: "We'll accompany you to visit wallabag and show you some features which can interest you."
     #     paragraph_2: 'Follow us!'
     # configure:
     #     title: 'Configure the application'
+    #     description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
     #     language: 'Change language and design'
     #     rss: 'Enable RSS feeds'
     #     tagging_rules: 'Write rules to automatically tag your articles'
@@ -285,6 +287,7 @@ quickstart:
     #     import: 'Configure import'
     # first_steps:
     #     title: 'First steps'
+    #     description: "Now wallabag is well configured, it's time to archive the web"
     #     new_article: 'Save your first article'
     #     unread_articles: 'And classify it!'
     # migrate:
@@ -294,11 +297,15 @@ quickstart:
     #     wallabag_v1: 'Migrate from wallabag v1'
     #     wallabag_v2: 'Migrate from wallabag v2'
     #     readability: 'Migrate from Readability'
+    #     instapaper: 'Migrate from Instapaper'
     # developer:
     #     title: 'Developers'
+    #     description: 'We also thought to the developers: Docker, API, translations, etc.'
     #     create_application: 'Create your third application'
+    #     use_docker: 'Use Docker to install wallabag'
     # docs:
     #     title: 'Full documentation'
+    #     description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
     #     annotate: 'Annotate your article'
     #     export: 'Convert your articles into ePUB or PDF'
     #     search_filters: 'See how you can look for an article by using search engine and filters'
diff --git a/src/Wallabag/CoreBundle/Resources/translations/messages.tr.yml b/src/Wallabag/CoreBundle/Resources/translations/messages.tr.yml
index 8bc0c4b9..73adc78e 100644
--- a/src/Wallabag/CoreBundle/Resources/translations/messages.tr.yml
+++ b/src/Wallabag/CoreBundle/Resources/translations/messages.tr.yml
@@ -266,12 +266,14 @@ howto:
 
 quickstart:
     page_title: 'Hızlı başlangıç'
+    # more: 'More…'
     intro:
         title: 'wallabag'
         paragraph_1: "wallabag kurduğunuz için teşekkür ederiz. Bu sayfada biz size eşlik edecek ve ilginizi çekecek birkaç özellik göstereceğim."
         paragraph_2: 'Bizi takip edin!'
     configure:
         title: 'Uygulamayı Yapılandırma'
+        # description: 'In order to have an application which suits you, have a look into the configuration of wallabag.'
         language: 'Dili ve tasarımı değiştirme'
         rss: 'RSS akışını aktifleştirme'
         # tagging_rules: 'Write rules to automatically tag your articles'
@@ -285,6 +287,7 @@ quickstart:
         # import: 'Configure import'
     first_steps:
         title: 'İlk adım'
+        # description: "Now wallabag is well configured, it's time to archive the web"
         new_article: 'İlk makalenizi kaydedin'
         unread_articles: 'Ve bunu sınıflandırın!'
     migrate:
@@ -294,11 +297,15 @@ quickstart:
         wallabag_v1: "wallabag v1 üzerindeki verilerinizi wallabag'in yeni sürümüne aktarın"
         wallabag_v2: "wallabag v2 üzerindeki verilerinizi wallabag'in yeni sürümüne aktarın"
         readability: "Readability üzerindeki verilerinizi wallabag'e aktarın'"
+        instapaper: "Instapaper üzerindeki verilerinizi wallabag'e aktarın'"
     developer:
         # title: 'Developers'
+        # description: 'We also thought to the developers: Docker, API, translations, etc.'
         # create_application: 'Create your third application'
+        # use_docker: 'Use Docker to install wallabag'
     docs:
         title: 'Dokümantasyon'
+        # description: "There are so much features in wallabag. Don't hesitate to read the manual to know them and to learn how to use them."
         # annotate: 'Annotate your article'
         export: 'Makalelerinizi ePUB ya da PDF formatına çevirme'
         search_filters: 'Makaleleri görüntülemek için arama motorlarını ve filteri kullanma'
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/common/Static/quickstart.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/common/Static/quickstart.html.twig
index 8cbf4ab4..226bafea 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/common/Static/quickstart.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/common/Static/quickstart.html.twig
@@ -10,64 +10,106 @@
 
                 <div class="row">
                     <h3>{{ 'quickstart.intro.title'|trans }}</h3>
-                    <p>{{ 'quickstart.intro.paragraph_1'|trans }}</p>
-                    <p>{{ 'quickstart.intro.paragraph_2'|trans }}</p>
 
-                    <h4>{{ 'quickstart.configure.title'|trans }}</h4>
-                    <ul>
-                        <li><a href="{{ path('config') }}">{{ 'quickstart.configure.language'|trans }}</a></li>
-                        <li><a href="{{ path('config') }}#set2">{{ 'quickstart.configure.rss'|trans }}</a></li>
-                        <li><a href="{{ path('config') }}#set5">{{ 'quickstart.configure.tagging_rules'|trans }}</a></li>
-                    </ul>
+                    <ul class="row data">
+                        <li class="col l4 m6 s12">
+                            <div class="card teal darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.configure.title'|trans }}</span>
+                                    <p>{{ 'quickstart.configure.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="{{ path('config') }}">{{ 'quickstart.configure.language'|trans }}</a></li>
+                                        <li><a href="{{ path('config') }}#set2">{{ 'quickstart.configure.rss'|trans }}</a></li>
+                                        <li><a href="{{ path('config') }}#set5">{{ 'quickstart.more'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    {% if is_granted('ROLE_SUPER_ADMIN') %}
-                    <h4>{{ 'quickstart.admin.title'|trans }}</h4>
-                    <p>{{ 'quickstart.admin.description'|trans }}</p>
-                    <ul>
-                        <li><a href="{{ path('config') }}#set6">{{ 'quickstart.admin.new_user'|trans }}</a></li>
-                        <li><a href="{{ path('craue_config_settings_modify') }}#set-analytics">{{ 'quickstart.admin.analytics'|trans }}</a></li>
-                        <li><a href="{{ path('craue_config_settings_modify') }}#set-entry">{{ 'quickstart.admin.sharing'|trans }}</a></li>
-                        <li><a href="{{ path('craue_config_settings_modify') }}#set-export">{{ 'quickstart.admin.export'|trans }}</a></li>
-                        <li><a href="{{ path('craue_config_settings_modify') }}#set-import">{{ 'quickstart.admin.import'|trans }}</a></li>
-                    </ul>
-                    {% endif %}
+                        <li class="col l4 m6 s12">
+                            <div class="card green darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.first_steps.title'|trans }}</span>
+                                    <p>{{ 'quickstart.first_steps.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="{{ path('new') }}">{{ 'quickstart.first_steps.new_article'|trans }}</a></li>
+                                        <li><a href="{{ path('unread') }}">{{ 'quickstart.first_steps.unread_articles'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    <h4>{{ 'quickstart.first_steps.title'|trans }}</h4>
-                    <ul>
-                        <li><a href="{{ path('new') }}">{{ 'quickstart.first_steps.new_article'|trans }}</a></li>
-                        <li><a href="{{ path('unread') }}">{{ 'quickstart.first_steps.unread_articles'|trans }}</a></li>
-                    </ul>
+                        <li class="col l4 m6 s12">
+                            <div class="card light-green darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.migrate.title'|trans }}</span>
+                                    <p>{{ 'quickstart.migrate.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="{{ path('import_pocket') }}">{{ 'quickstart.migrate.pocket'|trans }}</a></li>
+                                        <li><a href="{{ path('import_readability') }}">{{ 'quickstart.migrate.readability'|trans }}</a></li>
+                                        <li><a href="{{ path('import_instapaper') }}">{{ 'quickstart.migrate.instapaper'|trans }}</a></li>
+                                        <li><a href="{{ path('import') }}">{{ 'quickstart.more'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    <h4>{{ 'quickstart.migrate.title'|trans }}</h4>
-                    <p>{{ 'quickstart.migrate.description'|trans }}</p>
-                    <ul>
-                        <li><a href="{{ path('import_pocket') }}">{{ 'quickstart.migrate.pocket'|trans }}</a></li>
-                        <li><a href="{{ path('import_wallabag_v1') }}">{{ 'quickstart.migrate.wallabag_v1'|trans }}</a></li>
-                        <li><a href="{{ path('import_wallabag_v2') }}">{{ 'quickstart.migrate.wallabag_v2'|trans }}</a></li>
-                        <li><a href="{{ path('import_readability') }}">{{ 'quickstart.migrate.readability'|trans }}</a></li>
-                    </ul>
+                        <li class="col l4 m6 s12">
+                            <div class="card blue darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.developer.title'|trans }}</span>
+                                    <p>{{ 'quickstart.developer.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="{{ path('developer') }}">{{ 'quickstart.developer.create_application'|trans }}</a></li>
+                                        <li><a href="http://doc.wallabag.org/en/master/developer/docker.html">{{ 'quickstart.developer.use_docker'|trans }}</a></li>
+                                        <li><a href="http://doc.wallabag.org/en/master/index.html#dev-docs">{{ 'quickstart.more'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    <h4>{{ 'quickstart.developer.title'|trans }}</h4>
-                    <ul>
-                        <li><a href="{{ path('developer') }}">{{ 'quickstart.developer.create_application'|trans }}</a></li>
-                    </ul>
+                        <li class="col l4 m6 s12">
+                            <div class="card light-blue darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.docs.title'|trans }}</span>
+                                    <p>{{ 'quickstart.docs.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="http://doc.wallabag.org/en/master/user/annotations.html">{{ 'quickstart.docs.annotate'|trans }}</a></li>
+                                        <li><a href="http://doc.wallabag.org/en/master/user/download_articles.html">{{ 'quickstart.docs.export'|trans }}</a></li>
+                                        <li><a href="http://doc.wallabag.org/">{{ 'quickstart.docs.all_docs'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    <h4>{{ 'quickstart.docs.title'|trans }}</h4>
-                    <ul>
-                        <li><a href="http://doc.wallabag.org/en/master/user/annotations.html">{{ 'quickstart.docs.annotate'|trans }}</a></li>
-                        <li><a href="http://doc.wallabag.org/en/master/user/download_articles.html">{{ 'quickstart.docs.export'|trans }}</a></li>
-                        <li><a href="http://doc.wallabag.org/en/master/user/filters.html">{{ 'quickstart.docs.search_filters'|trans }}</a></li>
-                        <li><a href="http://doc.wallabag.org/en/master/user/errors_during_fetching.html">{{ 'quickstart.docs.fetching_errors'|trans }}</a></li>
-                        <li><a href="http://doc.wallabag.org/">{{ 'quickstart.docs.all_docs'|trans }}</a></li>
-                    </ul>
+                        <li class="col l4 m6 s12">
+                            <div class="card cyan darken-1">
+                                <div class="card-content white-text">
+                                    <span class="card-title">{{ 'quickstart.support.title'|trans }}</span>
+                                    <p>{{ 'quickstart.support.description'|trans }}</p>
+                                </div>
+                                <div class="card-action">
+                                    <ul>
+                                        <li><a href="https://github.com/wallabag/wallabag/issues/">{{ 'quickstart.support.github'|trans }}</a></li>
+                                        <li><a href="mailto:hello@wallabag.org">{{ 'quickstart.support.email'|trans }}</a></li>
+                                        <li><a href="https://gitter.im/wallabag/wallabag">{{ 'quickstart.support.gitter'|trans }}</a></li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </li>
 
-                    <h4>{{ 'quickstart.support.title'|trans }}</h4>
-                    <p>{{ 'quickstart.support.description'|trans }}</p>
-                    <ul>
-                        <li><a href="https://github.com/wallabag/wallabag/issues/">{{ 'quickstart.support.github'|trans }}</a></li>
-                        <li><a href="mailto:hello@wallabag.org">{{ 'quickstart.support.email'|trans }}</a></li>
-                        <li><a href="https://gitter.im/wallabag/wallabag">{{ 'quickstart.support.gitter'|trans }}</a></li>
                     </ul>
+
                 </div>
 
             </div>