27 files changed, 243 insertions, 19 deletions

diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.da.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.da.yml
index 3e11d675..fac3b4f8 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.da.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.da.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Download billeder på din server
 carrot: Aktiver deling til Carrot
 diaspora_url: Diaspora URL, hvis tjenesten er aktiv
@@ -15,6 +16,7 @@ share_diaspora: Aktiver deling til Diaspora
 share_mail: Aktiver deling med email
 share_shaarli: Aktiver deling gennem Shaarli
 share_twitter: Aktiver deling gennem Twitter
+share_unmark: Aktiver deling gennem Unmark.it
 show_printlink: Vis et link til print-indhold
 wallabag_support_url: Support-URL for wallabag
 wallabag_url: URL for *sin* wallabag-installation
@@ -29,3 +31,4 @@ piwik_enabled: Aktiver Piwik
 demo_mode_enabled: "Aktiver demo-indstilling? (anvendes kun til wallabags offentlige demo)"
 demo_mode_username: "Demobruger"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.de.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.de.yml
index c74b5c1f..d382733c 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.de.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.de.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Bilder auf den Server herunterladen
 carrot: Teilen zu Carrot aktivieren
 diaspora_url: Diaspora-URL, sofern der Service aktiviert ist
@@ -15,6 +16,7 @@ share_diaspora: Teilen zu Diaspora aktiveren
 share_mail: Teilen via E-Mail aktiveren
 share_shaarli: Teilen zu Shaarli aktiveren
 share_twitter: Teilen zu Twitter aktiveren
+share_unmark: Teilen zu Unmark.it aktiveren
 show_printlink: Link anzeigen, um den Inhalt auszudrucken
 wallabag_support_url: Support-URL für wallabag
 wallabag_url: URL von *deiner* wallabag-Instanz
@@ -29,3 +31,4 @@ piwik_enabled: Piwik aktivieren
 demo_mode_enabled: "Test-Modus aktivieren? (nur für die öffentliche wallabag-Demo genutzt)"
 demo_mode_username: "Test-Benutzer"
 share_public: Erlaube eine öffentliche URL für Einträge
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.en.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.en.yml
index 77c09db4..23de7a43 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.en.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.en.yml
@@ -1,3 +1,4 @@
+settings_changed: Configuration updated
 download_pictures: Download pictures on your server
 carrot: Enable share to Carrot
 diaspora_url: Diaspora URL, if the service is enabled
@@ -15,6 +16,7 @@ share_diaspora: Enable share to Diaspora
 share_mail: Enable share by email
 share_shaarli: Enable share to Shaarli
 share_twitter: Enable share to Twitter
+share_unmark: Enable share to Unmark.it
 show_printlink: Display a link to print content
 wallabag_support_url: Support URL for wallabag
 wallabag_url: URL of *your* wallabag instance
@@ -29,3 +31,4 @@ piwik_enabled: Enable Piwik
 demo_mode_enabled: "Enable demo mode ? (only used for the wallabag public demo)"
 demo_mode_username: "Demo user"
 share_public: Allow public url for entries
+download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.es.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.es.yml
index baa83849..ff1dd04f 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.es.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.es.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Descargar imágenes
 carrot: Activar compartir con Carrot
 diaspora_url: Diaspora URL, si el servicio está activado
@@ -15,6 +16,7 @@ share_diaspora: Activar compartir con Diaspora
 share_mail: Activar compartir con email
 share_shaarli: Activar compartir con Shaarli
 share_twitter: Activar compartir con Twitter
+share_unmark: Activar compartir con Unmark.it
 show_printlink: Mostrar un enlace para imprimir contenido
 wallabag_support_url: URL de soporte de wallabag
 wallabag_url: URL de *tu* instancia de wallabag
@@ -29,3 +31,4 @@ piwik_enabled: Activar Piwik
 demo_mode_enabled: "Activar modo demo (sólo usado para la demo de wallabag)"
 demo_mode_username: "Nombre de usuario demo"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fa.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fa.yml
index b394977e..4e712fdd 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fa.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fa.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: تصاویر را در کارگزار خودتان باربگیرید
 carrot: فعال‌سازی هم‌رسانی به Carrot
 diaspora_url: نشانی Diaspora، اگر فعال بود
@@ -15,6 +16,7 @@ share_diaspora: فعال‌سازی هم‌رسانی به Diaspora
 share_mail:  فعال‌سازی هم‌رسانی با ایمیل
 share_shaarli:  فعال‌سازی هم‌رسانی به Shaarli
 share_twitter:  فعال‌سازی هم‌رسانی به Twitter
+share_unmark:  فعال‌سازی هم‌رسانی به Unmark.it
 show_printlink: نمایش پیوندی برای چاپ مطلب
 wallabag_support_url: نشانی صفحهٔ پشتیبانی wallabag
 wallabag_url: نشانی صفحهٔ wallabag *شما*
@@ -29,3 +31,4 @@ modify_settings: "اعمال"
 # demo_mode_enabled: "Enable demo mode ? (only used for the wallabag public demo)"
 # demo_mode_username: "Demo user"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fr.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fr.yml
index 31a80880..cae4c662 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fr.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.fr.yml
@@ -1,3 +1,4 @@
+settings_changed: Configuration mise à jour
 download_pictures: Télécharger les images sur le serveur
 carrot: Activer le partage vers Carrot
 diaspora_url: URL de Diaspora, si le service Diaspora est activé
@@ -15,6 +16,7 @@ share_diaspora: Activer le partage vers Diaspora
 share_mail: Activer le partage par email
 share_shaarli: Activer le partage vers Shaarli
 share_twitter: Activer le partage vers Twitter
+share_unmark: Activer le partage vers Unmark.it
 show_printlink: Afficher un lien pour imprimer
 wallabag_support_url: URL de support de wallabag
 wallabag_url: URL de *votre* instance de wallabag
@@ -29,3 +31,4 @@ piwik_enabled: Activer Piwik
 demo_mode_enabled: "Activer le mode démo ? (utiliser uniquement pour la démo publique de wallabag)"
 demo_mode_username: "Utilisateur de la démo"
 share_public: Autoriser une URL publique pour les articles
+download_images_enabled: Télécharger les images en local
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.it.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.it.yml
index ba038556..f94f834f 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.it.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.it.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Scarica le immagini sul tuo server
 carrot: Abilita la condivisione con Carrot
 diaspora_url: Diaspora URL, se il servizio è abilitato
@@ -15,6 +16,7 @@ share_diaspora: Abilita la condivisione con Diaspora
 share_mail: Abilita la condivisione per email
 share_shaarli: Abilita la condivisione con Shaarli
 share_twitter: Abilita la condivisione con Twitter
+share_unmark: Abilita la condivisione con Unmark.it
 show_printlink: Mostra un collegamento per stampare il contenuto
 wallabag_support_url: URL di supporto per wallabag
 wallabag_url: URL della *tua* installazione di wallabag
@@ -29,3 +31,4 @@ piwik_enabled: Abilita Piwik
 demo_mode_enabled: "Abilita modalità demo ? (usato solo per la demo pubblica di wallabag)"
 demo_mode_username: "Utente Demo"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.oc.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.oc.yml
index 55249e33..de60a194 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.oc.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.oc.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Telecargar los imatges sul servidor
 carrot: Activar lo partatge cap a Carrot
 diaspora_url: URL de Diaspora, se lo servici Diaspora es activat
@@ -15,6 +16,7 @@ share_diaspora: Activar lo partatge cap a Diaspora
 share_mail: Activar lo partatge per corrièl
 share_shaarli: Activar lo partatge cap a Shaarli
 share_twitter: Activar lo partatge cap a Twitter
+share_unmark: Activar lo partatge cap a Unmark.it
 show_printlink: Afichar un ligam per imprimir
 wallabag_support_url: URL d'assisténcia de wallabag
 wallabag_url: URL de *vòstra* instància de wallabag
@@ -29,3 +31,4 @@ piwik_enabled: Activar Piwik
 demo_mode_enabled: "Activar lo mode demostracion ? (utilizar solament per la demostracion publica de wallabag)"
 demo_mode_username: "Utilizaire de la demostracion"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pl.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pl.yml
index 42cc5b52..11579745 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pl.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pl.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Pobierz obrazy na swój serwer
 carrot: Włącz udostępnianie dla Carrot
 diaspora_url: Adres URL Diaspora, jeżeli usługa jest włączona
@@ -15,6 +16,7 @@ share_diaspora: Włącz udostępnianie dla Diaspora
 share_mail: Włącz udostępnianie przez email
 share_shaarli: Włącz udostępnianie dla Shaarli
 share_twitter: Włącz udostępnianie dla Twitter
+share_unmark: Włącz udostępnianie dla Unmark.it
 show_printlink: Pokaż link do wydrukowania zawartości
 wallabag_support_url: Adres URL wsparcia dla wallabag
 wallabag_url: Adres *twojej* instacji wallabag
@@ -29,3 +31,4 @@ piwik_enabled: Włacz Piwik
 demo_mode_enabled: "Włacz tryb demo? (używany wyłącznie dla publicznej demonstracji Wallabag)"
 demo_mode_username: "Użytkownik Demonstracyjny"
 share_public: Zezwalaj na publiczny adres url dla wpisow
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pt.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pt.yml
index e8260422..74ae5a44 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pt.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.pt.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Download imagens no seu servidor
 carrot: Habilitar compartilhamento para o Carrot
 diaspora_url: URL Diaspora, se o serviço está habilitado
@@ -8,12 +9,14 @@ export_csv: Habilita exportação para CSV
 export_json: Habilita exportação para JSON
 export_txt: Habilita exportação para TXT
 export_xml: Habilita exportação para XML
-pocket_consumer_key: Chave de consumidor do Pocket para importar conteúdo (https://getpocket.com/developer/docs/authentication)
+# import_with_rabbitmq: Enable RabbitMQ to import data asynchronously
+# import_with_redis: Enable Redis to import data asynchronously
 shaarli_url: URL Shaarli, se o serviço está habilitado
 share_diaspora: Habilitar compartilhamento para o Diaspora
 share_mail: Habilitar compartilhamento por e-mail
 share_shaarli: Habilitar compartilhamento para o Shaarli
 share_twitter: Habilitar compartilhamento para o Twitter
+share_unmark: Habilitar compartilhamento para o Unmark.it
 show_printlink: Mostrar um link para imprimir o conteúdo
 wallabag_support_url: URL de Suporte do wallabag
 wallabag_url: URL de *sua* instância do wallabag
@@ -27,3 +30,5 @@ piwik_site_id: ID de seu website Piwik
 piwik_enabled: Habilitar Piwik
 demo_mode_enabled: "Habilitar modo demo? (somente usado para o demo público do wallabag)"
 demo_mode_username: "Usuário demo"
+# share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.ro.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.ro.yml
index 8e72b955..5095dfa0 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.ro.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.ro.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 download_pictures: Descarcă poze pe server
 carrot: Permite share către Carrot
 diaspora_url: Diaspora URL, dacă serviciul este permis
@@ -15,6 +16,7 @@ share_diaspora: Permite share către Diaspora
 share_mail: Permite share prin email
 share_shaarli: Permite share către Shaarli
 share_twitter: Permite share către Twitter
+share_unmark: Permite share către Unmark.it
 show_printlink: Afișează un link pentru a printa content-ul
 wallabag_support_url: URL-ul de suport pentru wallabag
 wallabag_url: URL-ul instanței tale wallabag
@@ -29,3 +31,4 @@ modify_settings: "aplică"
 # demo_mode_enabled: "Enable demo mode ? (only used for the wallabag public demo)"
 # demo_mode_username: "Demo user"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.tr.yml b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.tr.yml
index 55f70843..cd42e595 100644
--- a/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.tr.yml
+++ b/app/Resources/CraueConfigBundle/translations/CraueConfigBundle.tr.yml
@@ -1,3 +1,4 @@
+# settings_changed: Configuration updated
 # download_pictures: Download pictures on your server
 # carrot: Enable share to Carrot
 # diaspora_url: Diaspora URL, if the service is enabled
@@ -15,6 +16,7 @@
 # share_mail: Enable share by email
 # share_shaarli: Enable share to Shaarli
 # share_twitter: Enable share to Twitter
+# share_unmark: Enable share to Unmark.it
 # show_printlink: Display a link to print content
 # wallabag_support_url: Support URL for wallabag
 # wallabag_url: URL of *your* wallabag instance
@@ -29,3 +31,4 @@
 # demo_mode_enabled: "Enable demo mode ? (only used for the wallabag public demo)"
 # demo_mode_username: "Demo user"
 # share_public: Allow public url for entries
+# download_images_enabled: Download images locally
diff --git a/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png b/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png
new file mode 100644
index 00000000..45f679ee
--- /dev/null
+++ b/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png
diff --git a/app/Resources/static/themes/_global/js/bookmarklet.js b/app/Resources/static/themes/_global/js/bookmarklet.js
index 5174ff47..a497628b 100644
--- a/app/Resources/static/themes/_global/js/bookmarklet.js
+++ b/app/Resources/static/themes/_global/js/bookmarklet.js
@@ -1,4 +1,3 @@
-
 top['bookmarklet-url@wallabag.org'] =
     '<!DOCTYPE html><html><head><title>bag it!</title>' +
     '<link rel="icon" href="tpl/img/favicon.ico" />' +
diff --git a/app/Resources/static/themes/_global/js/shortcuts/entry.js b/app/Resources/static/themes/_global/js/shortcuts/entry.js
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/shortcuts/entry.js
diff --git a/app/Resources/static/themes/_global/js/shortcuts/main.js b/app/Resources/static/themes/_global/js/shortcuts/main.js
new file mode 100644
index 00000000..ef6a1b84
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/shortcuts/main.js
@@ -0,0 +1,15 @@
+import Mousetrap from 'mousetrap';
+
+/** Shortcuts **/
+
+/* Go to */
+Mousetrap.bind('g u', () => { window.location.href = Routing.generate('homepage'); });
+Mousetrap.bind('g s', () => { window.location.href = Routing.generate('starred'); });
+Mousetrap.bind('g r', () => { window.location.href = Routing.generate('archive'); });
+Mousetrap.bind('g a', () => { window.location.href = Routing.generate('all'); });
+Mousetrap.bind('g t', () => { window.location.href = Routing.generate('tag'); });
+Mousetrap.bind('g c', () => { window.location.href = Routing.generate('config'); });
+Mousetrap.bind('g i', () => { window.location.href = Routing.generate('import'); });
+Mousetrap.bind('g d', () => { window.location.href = Routing.generate('developer'); });
+Mousetrap.bind('?', () => { window.location.href = Routing.generate('howto'); });
+Mousetrap.bind('g l', () => { window.location.href = Routing.generate('logout'); });
diff --git a/app/Resources/static/themes/_global/js/tools.js b/app/Resources/static/themes/_global/js/tools.js
index ab30deb1..568b2dce 100644
--- a/app/Resources/static/themes/_global/js/tools.js
+++ b/app/Resources/static/themes/_global/js/tools.js
@@ -1,4 +1,9 @@
-const $ = require('jquery');
+import $ from 'jquery';
+import './shortcuts/main';
+import './shortcuts/entry';
+
+/* Allows inline call qr-code call */
+import jrQrcode from 'jr-qrcode'; // eslint-disable-line
 
 function supportsLocalStorage() {
   try {
diff --git a/app/Resources/static/themes/baggy/css/main.css b/app/Resources/static/themes/baggy/css/main.css
index 4dfa8790..4f48f8ca 100755
--- a/app/Resources/static/themes/baggy/css/main.css
+++ b/app/Resources/static/themes/baggy/css/main.css
@@ -936,6 +936,11 @@ a.add-to-wallabag-link-after::after {
   background-image: url("../../_global/img/icons/diaspora-icon--black.png");
 }
 
+/* Unmark.it */
+.icon-image--unmark {
+  background-image: url("../../_global/img/icons/unmark-icon--black.png");
+}
+
 /* shaarli */
 .icon-image--shaarli {
   background-image: url("../../_global/img/icons/shaarli.png");
diff --git a/app/Resources/static/themes/baggy/js/autoCompleteTags.js b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
index f287ebfa..64fdaa92 100755
--- a/app/Resources/static/themes/baggy/js/autoCompleteTags.js
+++ b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
@@ -5,4 +5,4 @@ function extractLast(term) {
   return split(term).pop();
 }
 
-export { split, extractLast };
+export default { split, extractLast };
diff --git a/app/Resources/static/themes/baggy/js/init.js b/app/Resources/static/themes/baggy/js/init.js
index dc11043a..05360a28 100755
--- a/app/Resources/static/themes/baggy/js/init.js
+++ b/app/Resources/static/themes/baggy/js/init.js
@@ -1,11 +1,26 @@
-import { savePercent, retrievePercent } from '../../_global/js/tools';
-import { toggleSaveLinkForm } from './uiTools';
+/* jQuery */
+import $ from 'jquery';
+
+/* eslint-disable no-unused-vars */
+/* jquery has default scope */
+import cookie from 'jquery.cookie';
+import ui from 'jquery-ui-browserify';
+/* eslint-enable no-unused-vars */
+
+/* Annotations */
+import annotator from 'annotator';
 
-const $ = global.jquery = require('jquery');
-require('jquery.cookie');
-require('jquery-ui-browserify');
-const annotator = require('annotator');
+/* Shortcuts */
+import './shortcuts/main';
+import './shortcuts/entry';
+import '../../_global/js/shortcuts/main';
+import '../../_global/js/shortcuts/entry';
+
+/* Tools */
+import { savePercent, retrievePercent } from '../../_global/js/tools';
+import toggleSaveLinkForm from './uiTools';
 
+global.jquery = $;
 
 $.fn.ready(() => {
   const $listmode = $('#listmode');
diff --git a/app/Resources/static/themes/baggy/js/shortcuts/entry.js b/app/Resources/static/themes/baggy/js/shortcuts/entry.js
new file mode 100644
index 00000000..728df8bd
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/shortcuts/entry.js
@@ -0,0 +1,22 @@
+import Mousetrap from 'mousetrap';
+import $ from 'jquery';
+
+/* Article view */
+Mousetrap.bind('o', () => {
+  $('div#article_toolbar ul.links a.original')[0].click();
+});
+
+/* mark as favorite */
+Mousetrap.bind('s', () => {
+  $('div#article_toolbar ul.links a.favorite')[0].click();
+});
+
+/* mark as read */
+Mousetrap.bind('a', () => {
+  $('div#article_toolbar ul.links a.markasread')[0].click();
+});
+
+/* delete */
+Mousetrap.bind('del', () => {
+  $('div#article_toolbar ul.links a.delete')[0].click();
+});
diff --git a/app/Resources/static/themes/baggy/js/shortcuts/main.js b/app/Resources/static/themes/baggy/js/shortcuts/main.js
new file mode 100644
index 00000000..aed09aee
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/shortcuts/main.js
@@ -0,0 +1,7 @@
+$(document).ready(() => {
+  Mousetrap.bind('s', () => {
+    $('#search').trigger('click');
+    $('#search_entry_term').focus();
+    return false;
+  });
+});
diff --git a/app/Resources/static/themes/baggy/js/uiTools.js b/app/Resources/static/themes/baggy/js/uiTools.js
index 900b2707..713c53f7 100644
--- a/app/Resources/static/themes/baggy/js/uiTools.js
+++ b/app/Resources/static/themes/baggy/js/uiTools.js
@@ -1,4 +1,4 @@
-const $ = require('jquery');
+import $ from 'jquery';
 
 function toggleSaveLinkForm(url, event) {
   $('#add-link-result').empty();
@@ -32,4 +32,4 @@ function toggleSaveLinkForm(url, event) {
   plainUrl.focus();
 }
 
-export { toggleSaveLinkForm };
+export default toggleSaveLinkForm;
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css
index 408fe14c..8e33cfbc 100755
--- a/app/Resources/static/themes/material/css/main.css
+++ b/app/Resources/static/themes/material/css/main.css
@@ -150,6 +150,11 @@
   background-image: url("../../_global/img/icons/diaspora-icon--black.png");
 }
 
+/* Unmark.it */
+.icon-image--unmark {
+  background-image: url("../../_global/img/icons/unmark-icon--black.png");
+}
+
 /* Shaarli */
 .icon-image--shaarli {
   background-image: url("../../_global/img/icons/shaarli.png");
@@ -317,11 +322,13 @@ nav input {
   color: #444;
 }
 
-.input-field.nav-panel-add label {
+.input-field.nav-panel-add label,
+.input-field.nav-panel-search label {
   left: 1rem;
 }
 
-.input-field.nav-panel-add .close {
+.input-field.nav-panel-add .close,
+.input-field.nav-panel-search .close {
   position: absolute;
   top: 0;
   right: 1rem;
@@ -340,7 +347,9 @@ nav input {
 }
 
 .input-field.nav-panel-add,
-.input-field.nav-panel-add form {
+.input-field.nav-panel-add form,
+.input-field.nav-panel-search,
+.input-field.nav-panel-search form {
   height: 100%;
 }
 
diff --git a/app/Resources/static/themes/material/js/init.js b/app/Resources/static/themes/material/js/init.js
index a68269e0..0b2832c0 100755
--- a/app/Resources/static/themes/material/js/init.js
+++ b/app/Resources/static/themes/material/js/init.js
@@ -1,10 +1,21 @@
+/* jQuery */
+import $ from 'jquery';
+
+/* Annotations */
+import annotator from 'annotator';
+
+/* Tools */
 import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools';
 
-const $ = require('jquery');
+/* Import shortcuts */
+import './shortcuts/main';
+import './shortcuts/entry';
+import '../../_global/js/shortcuts/main';
+import '../../_global/js/shortcuts/entry';
 
-global.jQuery = $;
 require('materialize'); // eslint-disable-line
-const annotator = require('annotator');
+
+global.jQuery = $;
 
 $(document).ready(() => {
   // sideNav
@@ -44,7 +55,7 @@ $(document).ready(() => {
     $('.nav-panels .action').hide(100);
     $('.nav-panel-menu').addClass('hidden');
     $('.nav-panels').css('background', 'white');
-    $('#searchfield').focus();
+    $('#search_entry_term').focus();
     return false;
   });
   $('.close').on('click', () => {
diff --git a/app/Resources/static/themes/material/js/shortcuts/entry.js b/app/Resources/static/themes/material/js/shortcuts/entry.js
new file mode 100644
index 00000000..357c22fe
--- /dev/null
+++ b/app/Resources/static/themes/material/js/shortcuts/entry.js
@@ -0,0 +1,22 @@
+import Mousetrap from 'mousetrap';
+import $ from 'jquery';
+
+/* open original article */
+Mousetrap.bind('o', () => {
+  $('ul.side-nav a.original i')[0].click();
+});
+
+/* mark as favorite */
+Mousetrap.bind('s', () => {
+  $('ul.side-nav a.favorite i')[0].click();
+});
+
+/* mark as read */
+Mousetrap.bind('a', () => {
+  $('ul.side-nav a.markasread i')[0].click();
+});
+
+/* delete */
+Mousetrap.bind('del', () => {
+  $('ul.side-nav a.delete i')[0].click();
+});
diff --git a/app/Resources/static/themes/material/js/shortcuts/main.js b/app/Resources/static/themes/material/js/shortcuts/main.js
new file mode 100644
index 00000000..ad4ca80a
--- /dev/null
+++ b/app/Resources/static/themes/material/js/shortcuts/main.js
@@ -0,0 +1,76 @@
+import Mousetrap from 'mousetrap';
+import $ from 'jquery';
+
+function toggleFocus(cardToToogleFocus) {
+  if (cardToToogleFocus) {
+    $(cardToToogleFocus).toggleClass('z-depth-4');
+  }
+}
+
+$(document).ready(() => {
+  let cardIndex = 0;
+  const cardNumber = $('#content ul.data > li').length;
+  let card = $('#content ul.data > li')[cardIndex];
+  const pagination = $('.pagination');
+
+  /* Show nothing on quickstart */
+  if ($('#content > div.quickstart').length > 0) {
+    return;
+  }
+
+  /* If we come from next page */
+  if (window.location.hash === '#prev') {
+    cardIndex = cardNumber - 1;
+    card = $('ul.data > li')[cardIndex];
+  }
+
+  /* Focus current card */
+  toggleFocus(card);
+
+  /* Actions */
+  Mousetrap.bind('g n', () => {
+    $('#nav-btn-add').trigger('click');
+    return false;
+  });
+
+  Mousetrap.bind('s', () => {
+    $('#nav-btn-search').trigger('click');
+    return false;
+  });
+
+  Mousetrap.bind('esc', () => {
+    $('.close').trigger('click');
+  });
+
+  /* Select right card. If there's a next page, go to next page */
+  Mousetrap.bind('right', () => {
+    if (cardIndex >= 0 && cardIndex < cardNumber - 1) {
+      toggleFocus(card);
+      cardIndex += 1;
+      card = $('ul.data > li')[cardIndex];
+      toggleFocus(card);
+      return;
+    }
+    if (pagination.length > 0 && pagination.find('li.next:not(.disabled)').length > 0 && cardIndex === cardNumber - 1) {
+      window.location.href = window.location.origin + $(pagination).find('li.next a').attr('href');
+    }
+  });
+
+  /* Select previous card. If there's a previous page, go to next page */
+  Mousetrap.bind('left', () => {
+    if (cardIndex > 0 && cardIndex < cardNumber) {
+      toggleFocus(card);
+      cardIndex -= 1;
+      card = $('ul.data > li')[cardIndex];
+      toggleFocus(card);
+      return;
+    }
+    if (pagination.length > 0 && $(pagination).find('li.prev:not(.disabled)').length > 0 && cardIndex === 0) {
+      window.location.href = `${window.location.origin + $(pagination).find('li.prev a').attr('href')}#prev`;
+    }
+  });
+
+  Mousetrap.bind('enter', () => {
+    window.location.href = window.location.origin + $(card).find('span.card-title a').attr('href');
+  });
+});