diff options
Diffstat (limited to 'ext/css/settings.css')
-rw-r--r-- | ext/css/settings.css | 442 |
1 files changed, 442 insertions, 0 deletions
diff --git a/ext/css/settings.css b/ext/css/settings.css new file mode 100644 index 00000000..707de85a --- /dev/null +++ b/ext/css/settings.css @@ -0,0 +1,442 @@ +/* + * Copyright (C) 2019-2021 Yomichan Authors + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see <https://www.gnu.org/licenses/>. + */ + + +.help-block[hidden] { + display: none; +} + +html:root:not([data-options-anki-enable=true]) #anki-general, +html:root:not([data-options-general-debug-info=true]) .debug, +html:root:not([data-options-general-show-advanced=true]) .options-advanced, +html:root[data-options-general-show-advanced=true] .options-non-advanced, +html:root:not([data-options-general-result-output-mode=merge]) #dictionary-main-group { + display: none; +} + +.tab-content { + border-bottom: 1px #ddd solid; + border-left: 1px #ddd solid; + border-right: 1px #ddd solid; + padding: 10px; +} + +.bottom-links { + padding-bottom: 1em; +} + +.label-light { + font-weight: normal; +} + +.form-control[data-invalid=true] { + border-color: #f00000; +} + +.mouse-button { + padding-left: 10px; + padding-right: 10px; +} +.mouse-button[hidden] { + display: none; +} +.mouse-button-icon { + width: 20px; + height: 20px; + display: block; + background: url(/images/mouse.svg) no-repeat center center; + background-size: 20px 20px; +} + +.condition { + display: flex; + -flex-wrap: wrap; +} +.profile-condition-input-container { + flex: 1 1 auto; +} +.profile-condition-line-break { + flex: 1 0 100%; + display: none; +} +.condition>.input-group-btn { + width: auto; +} +.condition>.profile-condition-prefix::after { + content: 'IF'; +} +.condition:nth-child(n+2)>.profile-condition-prefix::after { + content: 'AND'; +} + +.profile-condition-prefix { + flex: 0 0 auto; +} +.profile-condition-prefix, +.profile-condition-group-separator-label { + width: 60px; + text-align: center; +} +.profile-condition-group-separator-label { + padding: 6px 12px; + font-weight: bold; + display: inline-block; +} +.profile-condition-type, +.profile-condition-operator { + width: auto; + text-align: center; + text-align-last: center; +} + +.profile-condition-list>.condition>*:first-child, +.audio-source-list>.audio-source>*:first-child { + border-bottom-left-radius: 0; +} +.profile-condition-list>.condition:nth-child(n+2)>*:first-child, +.audio-source-list>.audio-source:nth-child(n+2)>*:first-child { + border-top-left-radius: 0; +} +.profile-condition-list>.condition:nth-child(n+2)>div:last-child>button, +.audio-source-list>.audio-source:nth-child(n+2)>*:last-child>button { + border-top-right-radius: 0; +} +.profile-condition-list>.condition:nth-last-child(n+2)>div:last-child>button, +.audio-source-list>.audio-source:nth-last-child(n+2)>*:last-child>button { + border-bottom-right-radius: 0; +} +.profile-condition-group-options>.profile-condition-add-button, +.audio-source-options>.audio-source-add { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.profile-condition-groups>.profile-condition-group:last-child>.profile-condition-group-separator-label { + display: none; +} + +.scan-input-list { + counter-reset: scan-input-id; +} +.scan-input-grid { + display: grid; + grid-template-columns: auto auto 1fr auto; + grid-template-rows: auto; + width: 100%; + margin-bottom: 8px; +} +.scan-input-index { + height: 100%; + width: 40px; + font-size: 14px; + color: #555; + background-color: #eee; + border: 1px solid #ccc; + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; + display: flex; + justify-content: center; + align-items: center; +} +.scan-input-index::after { + display: block; + counter-increment: scan-input-id; + content: counter(scan-input-id); +} +.scan-input-prefix { + padding: 6px 12px; + font-size: 14px; + color: #555; + text-align: center; + background-color: #eee; + border: 1px solid #ccc; + width: 100%; + height: 100%; +} +.scan-input-input-cell { + width: 100%; +} +.scan-input-content-cell .form-control, +.scan-input-content-cell button { + border-radius: 0; +} +.scan-input-prefix-cell[data-property=include] { + grid-area: 1/2/1/2; +} +.scan-input-prefix-cell[data-property=exclude] { + grid-area: 2/2/2/2; +} +.scan-input-prefix-cell[data-property=types] { + grid-area: 3/2/3/2; +} +.scan-input-prefix-cell[data-property=options] { + grid-area: 4/2/4/2; +} +.scan-input-content-cell[data-property=include] { + grid-area: 1/3/1/3; +} +.scan-input-content-cell[data-property=exclude] { + grid-area: 2/3/2/3; +} +.scan-input-content-cell[data-property=types] { + grid-area: 3/3/3/3; +} +.scan-input-content-cell[data-property=options] { + grid-area: 4/3/4/3; +} +.scan-input-suffix-cell { + grid-area: 1/4/1/4; +} +.scan-input-index-cell { + grid-area: 1/1/5/1; +} +.scan-input-suffix-cell>button { + height: 100%; +} +.scan-input-input-cell-inner { + display: flex; +} +.scan-input-input-cell-inner button { + padding-left: 10px; + padding-right: 10px; +} +.scan-input-input-cell-inner button>span { + width: 20px; +} +.scan-input-suffix-cell>button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.scan-input-input-cell-inner>.scan-input-type-list-container { + height: auto; + min-height: 34px; + border-bottom-right-radius: 4px; + padding-top: 5px; + padding-bottom: 5px; +} +.scan-input-toggle { + font-weight: normal; + margin: 0; +} +.scan-input-toggle>input[type=checkbox] { + margin: 0 0.375em 0 0; + padding: 0; + vertical-align: middle; +} +.scan-input-toggle>span { + vertical-align: middle; +} +.scan-input-type-list { + display: flex; + flex-flow: row wrap; + margin-left: -1em; +} +.scan-input-type { + margin-left: 1em; + white-space: nowrap; +} +.scan-input:not([data-show-advanced=true]) .scan-input-prefix-cell[data-property=options], +.scan-input:not([data-show-advanced=true]) .scan-input-content-cell[data-property=options] { + display: none; +} +.scan-input[data-show-advanced=true] .scan-input-content-cell[data-property=types] .scan-input-input-cell-inner>.scan-input-type-list-container { + border-bottom-right-radius: 0; +} + +.generic-input-list { + counter-reset: generic-input-id; +} +.generic-input-list .generic-input-prefix { + flex: 0 0 auto; + width: 39px; + text-align: center; +} +.generic-input-list .generic-input-prefix::after { + counter-increment: generic-input-id; + content: counter(generic-input-id); +} + +#custom-popup-css, +#custom-popup-outer-css, +#anki-card-templates-textarea { + width: 100%; + min-height: 34px; + line-height: 18px; + resize: vertical; + font-family: 'Courier New', Courier, monospace; + white-space: pre; + height: 240px; + border-bottom-left-radius: 0; +} +#anki-card-templates-reset-button { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.btn-inner-middle { + vertical-align: middle; +} +.storage-button-inner { + pointer-events: none; +} +input[type=checkbox].storage-button-checkbox { + margin: 0 0.375em 0 0; + padding: 0; +} + +#settings-popup-preview-frame { + background-color: transparent; + border: none; + margin: 0; + padding: 0; + width: 100%; + height: 320px; +} + +.dictionary-delete-table { + display: table; + width: 100%; +} +.dictionary-delete-table>*:first-child { + display: table-cell; + vertical-align: middle; + padding-right: 1em; +} +.dictionary-delete-table>*:nth-child(n+2) { + display: table-cell; + width: 100%; + vertical-align: middle; +} +.dictionary-delete-table .progress { + margin: 0; +} +.dictionary-delete-table>*[hidden] { + display: none; +} + +#anki-error-message-details-toggle { + display: inline-block; + margin-left: 0.5em; + cursor: pointer; + font-weight: bold; +} + +#anki-error-message-details { + margin-top: 0.25em; + font-family: 'Courier New', Courier, monospace; + white-space: pre; + overflow-x: auto; +} + +[data-show-for-browser], +[data-show-for-operating-system] { + display: none; +} + +html:root[data-browser=edge] [data-show-for-browser~=edge], +html:root[data-browser=edge-legacy] [data-show-for-browser~=edge-legacy], +html:root[data-browser=chrome] [data-show-for-browser~=chrome], +html:root[data-browser=firefox] [data-show-for-browser~=firefox], +html:root[data-browser=firefox-mobile] [data-show-for-browser~=firefox-mobile], +html:root[data-operating-system=mac] [data-show-for-operating-system~=mac], +html:root[data-operating-system=win] [data-show-for-operating-system~=win], +html:root[data-operating-system=android] [data-show-for-operating-system~=android], +html:root[data-operating-system=cros] [data-show-for-operating-system~=cros], +html:root[data-operating-system=linux] [data-show-for-operating-system~=linux], +html:root[data-operating-system=openbsd] [data-show-for-operating-system~=openbsd] { + display: initial; +} + +html:root[data-browser=edge] [data-hide-for-browser~=edge], +html:root[data-browser=edge-legacy] [data-hide-for-browser~=edge-legacy], +html:root[data-browser=chrome] [data-hide-for-browser~=chrome], +html:root[data-browser=firefox] [data-hide-for-browser~=firefox], +html:root[data-browser=firefox-mobile] [data-hide-for-browser~=firefox-mobile], +html:root[data-operating-system=mac] [data-hide-for-operating-system~=mac], +html:root[data-operating-system=win] [data-hide-for-operating-system~=win], +html:root[data-operating-system=android] [data-hide-for-operating-system~=android], +html:root[data-operating-system=cros] [data-hide-for-operating-system~=cros], +html:root[data-operating-system=linux] [data-hide-for-operating-system~=linux], +html:root[data-operating-system=openbsd] [data-hide-for-operating-system~=openbsd] { + display: none; +} + +#dictionary-list { + display: flex; + flex-flow: column; +} + +.dictionary-details-container { + margin: 0.5em 0; +} + +.dictionary-details-toggle-link { + cursor: pointer; +} + +.dictionary-details { + margin-left: 1em; +} + +.dictionary-details-table { + display: table; + width: 100%; +} + +.dictionary-details-entry { + display: table-row; +} + +.dictionary-details-entry+.dictionary-details-entry>* { + padding-top: 0.25em; +} + +.dictionary-details-entry-label { + display: table-cell; + font-weight: bold; + white-space: nowrap; + padding-right: 0.5em; +} + +.dictionary-details-entry-info { + display: table-cell; + white-space: pre-line; +} + + +@media screen and (max-width: 740px) { + .col-xs-6 { + float: none; + width: 100%; + } + .col-xs-6+.col-xs-6 { + margin-top: 15px; + } +} + +@media screen and (max-width: 600px) { + .condition { + flex-wrap: wrap; + } + .profile-condition-input-container { + order: 2; + } + .profile-condition-line-break { + display: block; + order: 1; + } +} |