diff options
Diffstat (limited to 'ext')
| -rw-r--r-- | ext/bg/css/settings2.css | 18 | ||||
| -rw-r--r-- | ext/bg/settings2.html | 8 | ||||
| -rw-r--r-- | ext/bg/welcome.html | 37 | ||||
| -rw-r--r-- | ext/mixed/css/material.css | 3 |
4 files changed, 24 insertions, 42 deletions
diff --git a/ext/bg/css/settings2.css b/ext/bg/css/settings2.css index 4a465a2c..46e859c1 100644 --- a/ext/bg/css/settings2.css +++ b/ext/bg/css/settings2.css @@ -45,9 +45,8 @@ --line-height-default: calc(20 / var(--font-size-no-units)); --outline-item-height: 40px; --outline-item-icon-size: 32px; - --input-short: 80px; - --input-height-short: 24px; - --input-half-width: calc(var(--input-width-large) / 2 - var(--padding) / 2); + --input-short-width: calc(var(--input-width-large) / 2 - var(--padding) / 2); + --input-short-height: 24px; --fab-button-size: 56px; --fab-button-padding: 16px; --modal-width: 600px; @@ -648,19 +647,14 @@ a.settings-item.settings-item-button { input[type=text].short-width, input[type=number].short-width, select.short-width { - width: var(--input-short); -} -input[type=text].half-width, -input[type=number].half-width, -select.short-width { - width: var(--input-half-width); + width: var(--input-short-width); } input[type=text].short-height, input[type=number].short-height, select.short-height { - height: var(--input-height-short); - margin-top: calc(var(--settings-group-right-max-height) - var(--input-height-short) - var(--font-size-small)); - line-height: var(--input-height-short); + height: var(--input-short-height); + margin-top: calc(var(--settings-group-right-max-height) - var(--input-short-height) - var(--font-size-small)); + line-height: var(--input-short-height); } .settings-item-button-group-container { max-height: none; diff --git a/ext/bg/settings2.html b/ext/bg/settings2.html index d29bd4a1..2f1e2f73 100644 --- a/ext/bg/settings2.html +++ b/ext/bg/settings2.html @@ -579,7 +579,7 @@ <div class="settings-item-group-item"> <div class="settings-item-group-item-label">Shadow</div> <select data-setting="general.popupOuterTheme" class="short-width short-height"> - <option value="auto">Auto-detect</option> + <option value="auto">Auto</option> <option value="default">Light</option> <option value="dark">Dark</option> </select> @@ -876,9 +876,9 @@ </div> <div class="settings-item-right"> <select data-setting="general.popupVerticalTextPosition"> - <option value="default">Same as for horizontal text</option> - <option value="before">Before text reading direction</option> - <option value="after">After text reading direction</option> + <option value="default">Same as horizontal text</option> + <option value="before">Before reading direction</option> + <option value="after">After reading direction</option> <option value="left">Left of text</option> <option value="right">Right of text</option> </select> diff --git a/ext/bg/welcome.html b/ext/bg/welcome.html index 5ff3c818..44db4a77 100644 --- a/ext/bg/welcome.html +++ b/ext/bg/welcome.html @@ -40,16 +40,16 @@ </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="/mixed/img/cog.svg" class="inline-icon" alt=""> <em>cog</em> button will open the settings page. + The <img src="/mixed/img/cog.svg" class="inline-icon" alt=""> <em>cog</em> button will open the <a href="settings2.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="/mixed/img/magnifying-glass.svg" class="inline-icon" alt=""> <em>magnifying glass</em> button will open a search page, + The <img src="/mixed/img/magnifying-glass.svg" class="inline-icon" alt=""> <em>magnifying glass</em> button will open the <a href="/bg/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="/mixed/img/question-mark-circle.svg" class="inline-icon" alt=""> <em>question mark</em> button will open a page - with some general information about Yomichan. + The <img src="/mixed/img/question-mark-circle.svg" class="inline-icon" alt=""> <em>question mark</em> button will open the <a href="/bg/info.html" target="_blank" rel="noopener">Information</a> page, + which has some helpful information and links about Yomichan. </div></div></div></div> </div> </div> @@ -74,12 +74,12 @@ </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 the scanning modifier key. - The default key is <kbd>Shift</kbd>, which can be configured below. + 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="/mixed/img/play-audio.svg" class="inline-icon" alt=""> <em>speaker</em> button of an entry in the popup search results + Clicking the <img src="/mixed/img/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"> @@ -167,28 +167,15 @@ <div class="settings-item-description">Adjust the style of the popup.</div> </div> <div class="settings-item-right"> - <div class="settings-item-group"> - <div class="settings-item-group-item"> - <div class="settings-item-group-item-label">Body</div> - <select data-setting="general.popupTheme" class="short-width short-height"> - <option value="default">Light</option> - <option value="dark">Dark</option> - </select> - </div> - <div class="settings-item-group-item"> - <div class="settings-item-group-item-label">Shadow</div> - <select data-setting="general.popupOuterTheme" class="short-width short-height"> - <option value="auto">Auto-detect</option> - <option value="default">Light</option> - <option value="dark">Dark</option> - </select> - </div> - </div> + <select data-setting="general.popupTheme" class="short-width"> + <option value="default">Light</option> + <option value="dark">Dark</option> + </select> </div> </div></div> <a href="settings2.html" rel="noopener" class="settings-item settings-item-button"><div class="settings-item-inner"> <div class="settings-item-left"> - <div class="settings-item-label">View more settings on the Settings page</div> + <div class="settings-item-label">More customization options are available on the Settings page</div> </div> <div class="settings-item-right open-panel-button-container"> <button class="icon-button"><span class="icon-button-inner"><span class="icon" data-icon="material-right-arrow"></span></span></button> diff --git a/ext/mixed/css/material.css b/ext/mixed/css/material.css index 1f1d45d7..bbc4fb83 100644 --- a/ext/mixed/css/material.css +++ b/ext/mixed/css/material.css @@ -33,7 +33,8 @@ --input-font-size-no-units: 1; --input-font-size: calc(1em * var(--input-font-size-no-units)); - --input-width: calc(100em / (var(--font-size-no-units) * var(--input-font-size-no-units))); + --input-spacing: calc(10em / var(--font-size-no-units)); + --input-width: calc(100em / (var(--font-size-no-units) * var(--input-font-size-no-units)) - var(--input-spacing) / 2); --input-width-large: calc(200em / (var(--font-size-no-units) * var(--input-font-size-no-units))); --input-height: calc(32em / (var(--font-size-no-units) * var(--input-font-size-no-units))); --input-border-radius: 0.25em; |