From 1d168804e86fbc0b02f8f58703c965592a165dd3 Mon Sep 17 00:00:00 2001
From: Mikael Finstad <finstaden@gmail.com>
Date: Sun, 13 Dec 2020 23:57:03 +0100
Subject: [PATCH] Beginner improvements #546

---
 src/App.jsx                         | 2 +-
 src/NoFileLoaded.jsx                | 8 +++-----
 src/components/SimpleModeButton.jsx | 2 +-
 3 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 05076927..ad258802 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -675,7 +675,7 @@ const App = memo(() => {
   const toggleMovFastStart = useCallback(() => setMovFastStart((val) => !val), []);
 
   const toggleSimpleMode = useCallback(() => setSimpleMode((v) => {
-    if (!hideAllNotifications) toast.fire({ text: v ? i18n.t('Simple mode has been disabled. You will now see also non-essential buttons') : i18n.t('Simple mode enabled. You will now see only the most essential buttons') });
+    if (!hideAllNotifications) toast.fire({ text: v ? i18n.t('Advanced view has been enabled. You will now also see non-essential buttons and functions') : i18n.t('Advanced view disabled. You will now see only the most essential buttons and functions') });
     return !v;
   }), [hideAllNotifications]);
 
diff --git a/src/NoFileLoaded.jsx b/src/NoFileLoaded.jsx
index 0bafd142..8f1370d5 100644
--- a/src/NoFileLoaded.jsx
+++ b/src/NoFileLoaded.jsx
@@ -19,14 +19,12 @@ const NoFileLoaded = memo(({ topBarHeight, bottomBarHeight, mifiLink, toggleHelp
         Press <kbd>H</kbd> for help
       </div>
 
-      <div style={{ fontSize: '3vmin', color: '#ccc' }}><kbd>←</kbd> <kbd>→</kbd> to seek timeline</div>
-
-      <div style={{ fontSize: '3vmin', color: '#ccc' }}>
+      <div style={{ fontSize: '3vmin', color: '#ccc', cursor: 'pointer' }}>
         <SetCutpointButton currentCutSeg={currentCutSeg} side="start" Icon={FaHandPointLeft} style={{ verticalAlign: 'middle' }} /> <SetCutpointButton currentCutSeg={currentCutSeg} side="end" Icon={FaHandPointRight} style={{ verticalAlign: 'middle' }} /> or <kbd>I</kbd> <kbd>O</kbd> to set cutpoints
       </div>
 
-      <div style={{ fontSize: '3vmin', color: '#ccc' }}>
-        <SimpleModeButton simpleMode={simpleMode} toggleSimpleMode={toggleSimpleMode} style={{ verticalAlign: 'middle' }} size={16} /> to toggle simple mode
+      <div style={{ fontSize: '3vmin', color: '#ccc', cursor: 'pointer' }} role="button" onClick={toggleSimpleMode}>
+        <SimpleModeButton simpleMode={simpleMode} toggleSimpleMode={toggleSimpleMode} style={{ verticalAlign: 'middle' }} size={16} /> {simpleMode ? 'to show advanced view' : 'to show simple view'}
       </div>
 
 
diff --git a/src/components/SimpleModeButton.jsx b/src/components/SimpleModeButton.jsx
index 23092062..aa5ab048 100644
--- a/src/components/SimpleModeButton.jsx
+++ b/src/components/SimpleModeButton.jsx
@@ -10,7 +10,7 @@ const SimpleModeButton = memo(({ simpleMode, toggleSimpleMode, size = 20, style
 
   return (
     <FaBaby
-      title={t('Simple mode')}
+      title={t('Toggle advanced view')}
       size={size}
       style={{ color: simpleMode ? primaryTextColor : 'white', ...style }}
       onClick={toggleSimpleMode}