diff options
Diffstat (limited to 'ext/welcome.html')
| -rw-r--r-- | ext/welcome.html | 152 |
1 files changed, 33 insertions, 119 deletions
diff --git a/ext/welcome.html b/ext/welcome.html index d15686a1..f2192686 100644 --- a/ext/welcome.html +++ b/ext/welcome.html @@ -26,6 +26,22 @@ <h1>Welcome to Yomitan!</h1> + <h2><strong>Recommended Permissions (Important)</strong></h2> + <div class="settings-group"> + <div class="settings-item"><div class="settings-item-inner"> + <div class="settings-item-left"> + <div class="settings-item-label">Enable recommended permissions</div> + <div class="settings-item-description">This will allow Yomitan to scan text from most sites. Further configuration is available on the <a href="/permissions.html" rel="noopener">Permissions page</a>.</div> + <div class="danger-text margin-above" id="permissions-disabled" hidden><strong>Yomitan features will be limited if the recommended permissions are not enabled.</strong></div> + <div class="success-text margin-above" id="permissions-enabled" hidden><strong>All Yomitan features are available.</strong></div> + <div id="recommended-permissions-error" class="margin-above danger-text" hidden></div> + </div> + <div class="settings-item-right"> + <label class="toggle"><input type="checkbox" id="recommended-permissions-toggle" data-origin="<all_urls>"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> + </div> + </div></div> + </div> + <!-- Notifications --> <div class="settings-group settings-group-top-margin warn-custom-templates-notification"> <div class="settings-item"> @@ -41,103 +57,37 @@ <!-- Content --> <h2>Here are some basics to get started</h2> <div class="settings-group"> - <div class="settings-item"> - <div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - Clicking the <img src="/images/yomitan-icon.svg" class="inline-icon" alt=""> <em>Yomitan</em> button in the browser bar will open the quick-actions popup. - </div></div></div> - <div class="settings-item-children settings-item-children-group"> - <div class="settings-item"><div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - The <img src="/images/cog.svg" class="inline-icon" alt=""> <em>cog</em> button will open the <a href="/settings.html" target="_blank" rel="noopener">Settings</a> page. - </div></div></div></div> - <div class="settings-item"><div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - The <img src="/images/magnifying-glass.svg" class="inline-icon" alt=""> <em>magnifying glass</em> button will open the <a href="/search.html" target="_blank" rel="noopener">Search</a> page, - enabling text and terms to be looked up using the installed dictionaries. - This can even be used in offline mode! - </div></div></div></div> - <div class="settings-item"><div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - The <img src="/images/question-mark-circle.svg" class="inline-icon" alt=""> <em>question mark</em> button will open the <a href="/info.html" target="_blank" rel="noopener">Information</a> page, - which has some helpful information and links about Yomitan. - </div></div></div></div> - </div> - </div> - <div class="settings-item"> - <div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - Yomitan requires one or more dictionaries to be installed in order to look up terms, kanji, and other information. - Several downloadable dictionaries can be found on the <a href="https://github.com/themoeway/yomitan/blob/master/docs/dictionaries.md#dictionaries" target="_blank" rel="noopener noreferrer">Yomitan homepage</a>. - Dictionaries can be configured using the button below, - or later from the <a href="/settings.html" rel="noopener">Settings</a> page. - </div></div></div> - <div class="settings-item-children settings-item-children-group"> - <div class="settings-item settings-item-button" data-modal-action="show,dictionaries"><div class="settings-item-inner"> - <div class="settings-item-left"> - <div class="settings-item-label">Install or remove dictionaries…</div> - </div> - <div class="settings-item-right open-panel-button-container"> - <button type="button" class="icon-button"><span class="icon-button-inner"><span class="icon" data-icon="material-right-arrow"></span></span></button> - </div> - </div></div> + <a href="/quick-start-guide.html" rel="noopener" class="settings-item settings-item-button"><div class="settings-item-inner"> + <div class="settings-item-left"> + <div class="settings-item-label">Yomitan Quick Start Guide</div> </div> - </div> - <div class="settings-item"> - <div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - You can also import an exported collection of dictionaries from the <a href="/settings.html#!backup">Backup section of the Settings</a> page. - - <br><br> - - If you are migrating from Yomichan, you may be interested in importing your data into Yomitan. - Please follow instructions from <a href="https://github.com/themoeway/yomitan/blob/master/docs/yomichan-migration.md#migrating-from-yomichan" target="_blank" rel="noopener noreferrer">Yomitan's README</a> for that. - - <br><br> - - If you are using or planning to use custom templates for Anki note creation, note that <a href="https://github.com/themoeway/yomitan/blob/master/docs/yomichan-migration.md#custom-templates" target="_blank" rel="noopener noreferrer">some syntax has changed from Yomichan and Yomibaba.</a> - Please ensure that your custom templates are using the updated syntax. - </div></div></div> - </div> - <div class="settings-item"> - <div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - After dictionaries have been installed, webpage text can be scanned by moving the cursor while holding a modifier key. - The default key is <kbd>Shift</kbd>, which can be disabled or configured below. - </div></div></div> - <div class="settings-item-children settings-item-children-group"> - <div class="settings-item"><div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - Clicking the <img src="/images/play-audio.svg" class="inline-icon" alt=""> <em>speaker</em> button of an entry in the search results - will play an audio clip of a term's pronunciation using an online dictionary, if available. - </div></div></div></div> - <div class="settings-item"><div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - Clicking on a kanji character in a term's definition will show additional information about that character. - <span class="light">(Requires a kanji dictionary to be installed.)</span> - </div></div></div></div> + <div class="settings-item-right open-panel-button-container"> + <button type="button" class="icon-button"><span class="icon-button-inner"><span class="icon" data-icon="material-right-arrow"></span></span></button> </div> - </div> - <div class="settings-item"> - <div class="settings-item-inner"><div class="settings-item-left"><div class="settings-item-label"> - This startup notification can be turned off using the options below, or later from the <a href="/settings.html" rel="noopener">Settings</a> page. - </div></div></div> - </div> + </div></a> </div> - <h2>Recommended Permissions (Important)</h2> + <h2>Basic customization</h2> <div class="settings-group"> <div class="settings-item"><div class="settings-item-inner"> <div class="settings-item-left"> - <div class="settings-item-label">Enable recommended permissions</div> - <div class="settings-item-description">This will allow Yomitan to scan text from most sites. Further configuration is available on the <a href="/permissions.html" rel="noopener">Permissions page</a>.</div> + <div class="settings-item-label">Show this welcome guide on browser startup</div> </div> <div class="settings-item-right"> - <label class="toggle"><input type="checkbox" class="recommended-permissions-toggle" data-origin="<all_urls>"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> + <label class="toggle"><input type="checkbox" data-setting="general.showGuide"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> </div> - <div id="recommended-permissions-error" class="margin-above danger-text" hidden></div> </div></div> - </div> - - <h2>Basic customization</h2> - <div class="settings-group"> - <div class="settings-item"><div class="settings-item-inner"> + <div class="settings-item"><div class="settings-item-inner settings-item-inner-wrappable"> <div class="settings-item-left"> - <div class="settings-item-label">Show this welcome guide on browser startup</div> + <div class="settings-item-label"> + Language + </div> + <div class="settings-item-description"> + Language of the text that is being looked up. + </div> </div> <div class="settings-item-right"> - <label class="toggle"><input type="checkbox" data-setting="general.showGuide"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> + <select id="language-select" data-setting="general.language"></select> </div> </div></div> <div class="settings-item"> @@ -160,42 +110,6 @@ <label class="toggle"><input type="checkbox" id="middle-mouse-button-scan"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> </div> </div></div> - <div class="settings-item"> - <div class="settings-item-inner"> - <div class="settings-item-left"> - <div class="settings-item-label">Auto-hide search popup</div> - <div class="settings-item-description">When no definitions are found after scanning text, the popup will be hidden.</div> - </div> - <div class="settings-item-right"> - <label class="toggle"><input type="checkbox" data-setting="scanning.autoHideResults" - data-transform='{ - "type": "setVisibility", - "selector": "#auto-hide-search-popup-options", - "condition": {"op": "===", "value": true} - }' - ><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label> - </div> - </div> - <div class="settings-item-children settings-item-children-group" id="auto-hide-search-popup-options" hidden> - <div class="settings-item"><div class="settings-item-inner"> - <div class="settings-item-left"> - <div class="settings-item-label">Delay <span class="light">(in milliseconds)</span></div> - </div> - <div class="settings-item-right"> - <input type="number" data-setting="scanning.hideDelay" min="0"> - </div> - </div></div> - </div> - </div> - <div class="settings-item"><div class="settings-item-inner"> - <div class="settings-item-left"> - <div class="settings-item-label">Scan delay <span class="light">(in milliseconds)</span></div> - <div class="settings-item-description">Change the delay before scanning occurs when no modifier key is required.</div> - </div> - <div class="settings-item-right"> - <input type="number" data-setting="scanning.delay" min="0"> - </div> - </div></div> <div class="settings-item"><div class="settings-item-inner settings-item-inner-wrappable"> <div class="settings-item-left"> <div class="settings-item-label">Theme</div> |