Skip to content

Commit

Permalink
Bugfixes + auto focus on the opening of the popup
Browse files Browse the repository at this point in the history
  • Loading branch information
@Silbad
Silbad committed Aug 5, 2018
1 parent 3f8e228 commit bc6b1d4
Show file tree
Hide file tree
Showing 8 changed files with 462 additions and 562 deletions.
Binary file added _build/deeplt-1.5.3.zip
View file
Binary file not shown.
6 changes: 3 additions & 3 deletions app/popup-min.css
View file

Large diffs are not rendered by default.

133 changes: 68 additions & 65 deletions app/popup.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* Bootstrap v4.1.2 (https://getbootstrap.com/)
* Bootstrap v4.1.3 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
Expand Down Expand Up @@ -175,7 +175,7 @@ img {
vertical-align: middle;
border-style: none; }

svg:not(:root) {
svg {
overflow: hidden;
vertical-align: middle; }

Expand Down Expand Up @@ -1036,7 +1036,6 @@ pre {

.table {
width: 100%;
max-width: 100%;
margin-bottom: 1rem;
background-color: transparent; }
.table th,
Expand Down Expand Up @@ -1252,6 +1251,7 @@ pre {
.form-control {
display: block;
width: 100%;
height: calc(2.25rem + 2px);
padding: 0.375rem 0.75rem;
font-size: 1rem;
line-height: 1.5;
Expand Down Expand Up @@ -1280,9 +1280,6 @@ pre {
background-color: #e9ecef;
opacity: 1; }

select.form-control:not([size]):not([multiple]) {
height: calc(2.25rem + 2px); }

select.form-control:focus::-ms-value {
color: #495057;
background-color: #fff; }
Expand Down Expand Up @@ -1322,51 +1319,29 @@ select.form-control:focus::-ms-value {
background-color: transparent;
border: solid transparent;
border-width: 1px 0; }
.form-control-plaintext.form-control-sm, .input-group-sm > .form-control-plaintext.form-control,
.input-group-sm > .input-group-prepend > .form-control-plaintext.input-group-text,
.input-group-sm > .input-group-append > .form-control-plaintext.input-group-text,
.input-group-sm > .input-group-prepend > .form-control-plaintext.btn,
.input-group-sm > .input-group-append > .form-control-plaintext.btn, .form-control-plaintext.form-control-lg, .input-group-lg > .form-control-plaintext.form-control,
.input-group-lg > .input-group-prepend > .form-control-plaintext.input-group-text,
.input-group-lg > .input-group-append > .form-control-plaintext.input-group-text,
.input-group-lg > .input-group-prepend > .form-control-plaintext.btn,
.input-group-lg > .input-group-append > .form-control-plaintext.btn {
.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {
padding-right: 0;
padding-left: 0; }

.form-control-sm, .input-group-sm > .form-control,
.input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn {
.form-control-sm {
height: calc(1.8125rem + 2px);
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
line-height: 1.5;
border-radius: 0.2rem; }

select.form-control-sm:not([size]):not([multiple]), .input-group-sm > select.form-control:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.btn:not([size]):not([multiple]) {
height: calc(1.8125rem + 2px); }

.form-control-lg, .input-group-lg > .form-control,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
.form-control-lg {
height: calc(2.875rem + 2px);
padding: 0.5rem 1rem;
font-size: 1.25rem;
line-height: 1.5;
border-radius: 0.3rem; }

select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.form-control:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.btn:not([size]):not([multiple]) {
height: calc(2.875rem + 2px); }
select.form-control[size], select.form-control[multiple] {
height: auto; }

textarea.form-control {
height: auto; }

.form-group {
margin-bottom: 1rem; }
Expand Down Expand Up @@ -1424,13 +1399,13 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
z-index: 5;
display: none;
max-width: 100%;
padding: .5rem;
padding: 0.25rem 0.5rem;
margin-top: .1rem;
font-size: .875rem;
line-height: 1;
font-size: 0.875rem;
line-height: 1.5;
color: #fff;
background-color: rgba(40, 167, 69, 0.8);
border-radius: .2rem; }
background-color: rgba(40, 167, 69, 0.9);
border-radius: 0.25rem; }

.was-validated .form-control:valid, .form-control.is-valid, .was-validated
.custom-select:valid,
Expand Down Expand Up @@ -1482,7 +1457,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for

.was-validated .custom-file-input:valid ~ .custom-file-label, .custom-file-input.is-valid ~ .custom-file-label {
border-color: #28a745; }
.was-validated .custom-file-input:valid ~ .custom-file-label::before, .custom-file-input.is-valid ~ .custom-file-label::before {
.was-validated .custom-file-input:valid ~ .custom-file-label::after, .custom-file-input.is-valid ~ .custom-file-label::after {
border-color: inherit; }

.was-validated .custom-file-input:valid ~ .valid-feedback,
Expand All @@ -1506,13 +1481,13 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
z-index: 5;
display: none;
max-width: 100%;
padding: .5rem;
padding: 0.25rem 0.5rem;
margin-top: .1rem;
font-size: .875rem;
line-height: 1;
font-size: 0.875rem;
line-height: 1.5;
color: #fff;
background-color: rgba(220, 53, 69, 0.8);
border-radius: .2rem; }
background-color: rgba(220, 53, 69, 0.9);
border-radius: 0.25rem; }

.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated
.custom-select:invalid,
Expand Down Expand Up @@ -1564,7 +1539,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for

.was-validated .custom-file-input:invalid ~ .custom-file-label, .custom-file-input.is-invalid ~ .custom-file-label {
border-color: #dc3545; }
.was-validated .custom-file-input:invalid ~ .custom-file-label::before, .custom-file-input.is-invalid ~ .custom-file-label::before {
.was-validated .custom-file-input:invalid ~ .custom-file-label::after, .custom-file-input.is-invalid ~ .custom-file-label::after {
border-color: inherit; }

.was-validated .custom-file-input:invalid ~ .invalid-feedback,
Expand Down Expand Up @@ -1644,8 +1619,6 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
opacity: 0.65; }
.btn:not(:disabled):not(.disabled) {
cursor: pointer; }
.btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active {
background-image: none; }

a.btn.disabled,
fieldset:disabled a.btn {
Expand Down Expand Up @@ -2378,6 +2351,8 @@ input[type="button"].btn-block {
.input-group > .custom-select:focus,
.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label {
z-index: 3; }
.input-group > .custom-file .custom-file-input:focus {
z-index: 4; }
.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) {
border-top-right-radius: 0;
Expand Down Expand Up @@ -2438,6 +2413,28 @@ input[type="button"].btn-block {
.input-group-text input[type="checkbox"] {
margin-top: 0; }

.input-group-lg > .form-control,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
height: calc(2.875rem + 2px);
padding: 0.5rem 1rem;
font-size: 1.25rem;
line-height: 1.5;
border-radius: 0.3rem; }

.input-group-sm > .form-control,
.input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn {
height: calc(1.8125rem + 2px);
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
line-height: 1.5;
border-radius: 0.2rem; }

.input-group > .input-group-prepend > .btn,
.input-group > .input-group-prepend > .input-group-text,
.input-group > .input-group-append:not(:last-child) > .btn,
Expand Down Expand Up @@ -2644,6 +2641,12 @@ input[type="button"].btn-block {
appearance: none; }
.custom-range:focus {
outline: none; }
.custom-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range:focus::-ms-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range::-moz-focus-outer {
border: 0; }
.custom-range::-webkit-slider-thumb {
Expand All @@ -2658,9 +2661,6 @@ input[type="button"].btn-block {
@media screen and (prefers-reduced-motion: reduce) {
.custom-range::-webkit-slider-thumb {
transition: none; } }
.custom-range::-webkit-slider-thumb:focus {
outline: none;
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range::-webkit-slider-thumb:active {
background-color: #27a1f2; }
.custom-range::-webkit-slider-runnable-track {
Expand All @@ -2682,9 +2682,6 @@ input[type="button"].btn-block {
@media screen and (prefers-reduced-motion: reduce) {
.custom-range::-moz-range-thumb {
transition: none; } }
.custom-range::-moz-range-thumb:focus {
outline: none;
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range::-moz-range-thumb:active {
background-color: #27a1f2; }
.custom-range::-moz-range-track {
Expand All @@ -2698,6 +2695,9 @@ input[type="button"].btn-block {
.custom-range::-ms-thumb {
width: 1rem;
height: 1rem;
margin-top: 0;
margin-right: 0.2rem;
margin-left: 0.2rem;
background-color: #063C60;
border: 0;
border-radius: 1rem;
Expand All @@ -2706,9 +2706,6 @@ input[type="button"].btn-block {
@media screen and (prefers-reduced-motion: reduce) {
.custom-range::-ms-thumb {
transition: none; } }
.custom-range::-ms-thumb:focus {
outline: none;
box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(6, 60, 96, 0.25); }
.custom-range::-ms-thumb:active {
background-color: #27a1f2; }
.custom-range::-ms-track {
Expand Down Expand Up @@ -3748,6 +3745,9 @@ button.close {

.modal-open {
overflow: hidden; }
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto; }

.modal {
position: fixed;
Expand All @@ -3759,9 +3759,6 @@ button.close {
display: none;
overflow: hidden;
outline: 0; }
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto; }

.modal-dialog {
position: relative;
Expand All @@ -3781,6 +3778,10 @@ button.close {
display: flex;
align-items: center;
min-height: calc(100% - (0.5rem * 2)); }
.modal-dialog-centered::before {
display: block;
height: calc(100vh - (0.5rem * 2));
content: ""; }

.modal-content {
position: relative;
Expand Down Expand Up @@ -3852,6 +3853,8 @@ button.close {
margin: 1.75rem auto; }
.modal-dialog-centered {
min-height: calc(100% - (1.75rem * 2)); }
.modal-dialog-centered::before {
height: calc(100vh - (1.75rem * 2)); }
.modal-sm {
max-width: 300px; } }

Expand Down Expand Up @@ -8639,7 +8642,7 @@ a.text-dark:hover, a.text-dark:focus {
overflow: visible;
clip: auto; }

textarea {
textarea.form-control {
resize: none;
height: 120px;
overflow: auto; }
Expand Down
17 changes: 12 additions & 5 deletions app/popup.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ $(function() {
if ($.inArray(langUI, langArray) < 0) {
langUI = 'EN';
}

// update version app
var manifest = chrome.runtime.getManifest();
$('.version').html(manifest.version);
Expand Down Expand Up @@ -44,8 +44,6 @@ $(function() {
browser.storage.local.set({ langTarget: langDefault });
$('#lang-origin').val('auto');
$('#lang-target').val(langDefault);
tmpLangOrigin = $('#lang-origin').val();
tmpLangTarget = $('#lang-target').val();
}

// add event to switch lang
Expand All @@ -57,7 +55,11 @@ $(function() {
$('#lang-target').val(tmpOrigin);
} else {
$('#lang-origin').val(tmpTarget);
$('#lang-target').val(langUI);
if (tmpTarget != langUI) {
$('#lang-target').val(langUI);
} else {
$('#lang-target').val('EN');
}
}
browser.storage.local.set({ langOrigin: tmpTarget });
browser.storage.local.set({ langTarget: tmpOrigin });
Expand Down Expand Up @@ -111,13 +113,17 @@ $(function() {
// if session too old, create new one
if (seconds > 600) {
resetLangs(langUI);
tmpLangOrigin = $('#lang-origin').val();
tmpLangTarget = $('#lang-target').val();
} else {
$('#lang-origin').val(tmpLangOrigin);
$('#lang-target').val(tmpLangTarget);
}

} else {
resetLangs(langUI);
tmpLangOrigin = $('#lang-origin').val();
tmpLangTarget = $('#lang-target').val();
}

// add or update sessios date
Expand Down Expand Up @@ -238,7 +244,8 @@ $(function() {
$('#lang-origin option[value="IT"], #lang-target option[value="IT"]').html(italian);
$('#lang-origin option[value="NL"], #lang-target option[value="NL"]').html(dutch);
$('#lang-origin option[value="PL"], #lang-target option[value="PL"]').html(polish);
$('#trad-search').attr('placeholder', textToBeTranslated).attr('aria-label', textToBeTranslated);
$('.deepl img').attr('alt', name);
// localizaton and focus on field
$('#trad-search').attr('placeholder', textToBeTranslated).attr('aria-label', textToBeTranslated).focus();

});
2 changes: 1 addition & 1 deletion manifest.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"manifest_version": 2,
"name": "__MSG_deepLTName__",
"version": "1.5.2",
"version": "1.5.3",
"description": "__MSG_deepLTDescription__",
"homepage_url": "https://github.com/Silbad/DeepLT",
"default_locale": "en",
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "DeepLT",
"version": "1.5.2",
"version": "1.5.3",
"description": "A simple translation extension for Firefox powered by DeepL",
"repository": "https://github.com/Silbad/DeepLT",
"author": "Silbad",
Expand Down
2 changes: 1 addition & 1 deletion scss/_form.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
textarea {
textarea.form-control {
resize: none;
height: 120px;
overflow: auto;
Expand Down
Loading

0 comments on commit bc6b1d4

Please sign in to comment.