Commit 3852120a authored by ransome1's avatar ransome1
Browse files

Fixed a bug in filter/view sidebar status, Tabindex will be jailed in modal windows

parent 7f5f6c8e
{
"name": "sleek",
"productName": "sleek",
"version": "1.0.6-1",
"version": "1.0.6-2",
"description": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
"synopsis": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
"category": "ProjectManagement",
......
export function createModalJail(modal) {
// add all the elements inside modal which you want to make focusable
const focusableElements = '[tabindex]:not([tabindex="-1"])';
const firstFocusableElement = modal.querySelectorAll(focusableElements)[0]; // get first element to be focused inside modal
const focusableContent = modal.querySelectorAll(focusableElements);
const lastFocusableElement = focusableContent[focusableContent.length - 1]; // get last element to be focused inside modal
document.addEventListener("keydown", function(e) {
let isTabPressed = e.key === "Tab" || e.keyCode === 9;
if (!isTabPressed) {
return;
}
if (e.shiftKey) { // if shift key pressed for shift + tab combination
if (document.activeElement === firstFocusableElement) {
lastFocusableElement.focus(); // add focus for the last focusable element
e.preventDefault();
}
} else { // if tab key is pressed
if (document.activeElement === lastFocusableElement) { // if focused has reached to last focusable element then focus first focusable element after pressing tab
firstFocusableElement.focus(); // add focus for the first focusable element
e.preventDefault();
}
}
});
}
/* Error: expected "}".
* ,
* 459 | }
* | ^
* '
* src\scss\dark.scss 459:2 root stylesheet */
body::before {
font-family: "Source Code Pro", "SF Mono", Monaco, Inconsolata, "Fira Mono",
"Droid Sans Mono", monospace, monospace;
white-space: pre;
display: block;
padding: 1em;
margin-bottom: 1em;
border-bottom: 2px solid black;
content: 'Error: expected "}".\a \2577 \a 459 \2502 }\a \2502 ^\a \2575 \a src\\scss\\dark.scss 459:2 root stylesheet';
body {
background-color: #212224;
color: #CCCDCF;
}
code, pre {
background-color: #212224 !important;
}
a {
color: white;
}
button:focus-visible,
a:focus-visible {
outline: 2px solid #CCCDCF !important;
}
a:hover,
button:hover,
strong {
color: #CCCDCF;
}
input,
select,
textarea {
border: none !important;
background: #2d2d2d !important;
color: white !important;
}
input[type=search]::-webkit-search-cancel-button {
background-color: white;
-webkit-mask-image: url("../img/svg/times-circle.svg");
mask-image: url("../img/svg/times-circle.svg");
}
input:active,
input:focus,
input.is-focused,
select:focus,
textarea:active,
textarea:focus,
input[type=search]:focus {
outline: none !important;
box-shadow: 0 0 0 2px #CCCDCF !important;
}
input::placeholder {
color: #4a4a4a !important;
}
input[type=checkbox]:focus,
input[type=checkbox]:active {
outline: none;
box-shadow: none !important;
}
input[type=range] {
background: #4a4a4a !important;
}
button {
color: white !important;
background: transparent !important;
}
button i {
color: #CCCDCF !important;
}
button.is-link,
.button.is-link:hover {
background-color: #2d2d2d !important;
}
button.is-link svg,
.button.is-link:hover svg {
color: inherit !important;
}
.button[disabled],
fieldset[disabled] {
background-color: transparent;
}
button.is-outlined:hover {
background: #3B3B3B !important;
}
::after {
border-color: white !important;
}
svg {
color: white;
}
table {
width: 100%;
background-color: transparent !important;
color: #CCCDCF !important;
}
table tr td {
border-color: #212224 !important;
}
table tr th {
color: white !important;
}
table.files tr td:last-child i {
color: white;
}
nav {
background-color: #2d2d2d;
}
nav svg {
color: #CCCDCF;
}
nav ul li.logo {
background: none;
}
nav ul li a {
color: #CCCDCF;
border-bottom: 1px solid #3B3B3B;
}
nav ul li a:hover,
nav ul li a:focus {
color: #CCCDCF;
border-bottom: none;
background-color: #3B3B3B;
}
nav ul li.is-highlighted a {
color: #CCCDCF;
border-bottom: none;
background-color: #3B3B3B;
}
#drawerContainer .zoom svg {
color: white !important;
}
#drawerContainer .zoom #zoomStatus {
color: white !important;
}
#todoTableSearchContainer {
background-color: #212224;
}
#todoTableSearchContainer .icon.is-left i,
#todoTableSearchContainer .icon.is-right i {
color: #4a4a4a;
}
#todoTableSearchContainer #btnToggleViewContainer {
background: transparent !important;
}
#resultStats .tag {
background-color: #3B3B3B !important;
color: #CCCDCF !important;
}
#todoTable .flex-table#previousItem.is-highlighted {
background-color: #3B3B3B;
}
#todoTable .flex-table:hover .flex-row .button,
#todoTable .flex-table.due .button {
color: #f5f5f5;
}
#todoTable .flex-table {
border-color: #3B3B3B;
}
#todoTable .flex-table .checkbox a {
color: #CCCDCF;
}
#todoTable .flex-table .checkbox a:hover {
color: white;
}
#todoTable .flex-table .flex-row.text {
color: #CCCDCF;
}
#todoTable .flex-table .flex-row.itemDueDate {
color: white;
}
#todoTable .flex-table .flex-row.itemDueDate i {
color: inherit;
}
#todoTable .flex-table .flex-row.itemDueDate.isToday,
#todoTable .flex-table .flex-row.itemDueDate.isPast {
color: #ff3860;
}
#todoTable .flex-table .flex-row.itemDueDate.isToday i,
#todoTable .flex-table .flex-row.itemDueDate.isPast i {
color: inherit;
}
#todoTable .flex-table .flex-row.itemDueDate.isTomorrow i {
color: #fa745e !important;
}
#todoTable .flex-table .flex-row span.contexts {
color: #c5ede3 !important;
background: #1e6251 !important;
}
#todoTable .flex-table .flex-row span.projects {
color: #f1d6f1 !important;
background: #6f266f !important;
}
#todoTable .flex-table .flex-row .is-white {
color: #CCCDCF;
background: none;
}
#modalForm i {
color: #CCCDCF !important;
}
#modalForm button {
color: white;
border-color: #3B3B3B !important;
background: transparent !important;
}
#modalForm button:hover {
color: #CCCDCF !important;
}
#modalForm .field input,
#modalForm .field input::placeholder,
#modalForm .field select,
#modalForm .field select::placeholder {
color: white !important;
}
#modalForm .field select option {
background: #3B3B3B;
}
#recurrencePicker #recurrencePickerInput,
#recurrencePicker .radio {
cursor: pointer;
background: none !important;
color: white !important;
}
#recurrencePicker #recurrencePickerInput::placeholder {
color: white !important;
}
#recurrencePicker .radio:hover {
color: #CCCDCF !important;
}
#recurrencePicker #recurrencePickerContainer {
background: #2d2d2d;
}
#recurrencePicker #recurrencePickerContainer .card-footer {
border-color: #212224;
}
#autoCompleteContainer {
background: #3B3B3B;
}
#autoCompleteContainer h4 {
color: #CCCDCF;
}
#drawerContainer .drawer {
background: #3B3B3B !important;
}
#drawerContainer .drawer h4.is-4 {
color: white;
}
#drawerContainer .drawer h4.is-4 i {
color: #CCCDCF !important;
}
#drawerContainer a.drawerClose {
background: #3B3B3B !important;
}
#drawerContainer svg {
color: #f5f5f5 !important;
}
#drawerContainer #btnFiltersResetFilters {
background: #212224 !important;
}
#filterMenu .card {
background: #3B3B3B;
}
#filterMenu .card #filterMenuSave {
background-color: transparent !important;
border-right: 1px solid #212224 !important;
}
#filterMenu .card-footer {
border-top: 1px solid #212224 !important;
}
#todoContext a {
color: #CCCDCF;
}
#todoContext .dropdown-content {
color: white;
background-color: #3B3B3B !important;
}
#todoContext .dropdown-content .dropdown-item:hover {
background: #2d2d2d;
}
.contexts .button {
color: #c5ede3;
background: #247561;
}
.contexts .button span.tag {
color: #184e41;
background: #c9eee5;
}
.contexts .button.is-dark {
background: #184e41;
color: white;
}
.projects .button {
color: #f1d6f1;
background: #822c82;
}
.projects .button span.tag {
color: #5c1f5c;
background: #f2daf2;
}
.projects .button.is-dark {
background: #5c1f5c;
color: white;
}
.priority .button {
opacity: 0.9;
}
.toggle .switch .slider {
background-color: #4a4a4a;
}
.toggle .switch input:checked + .slider {
background-color: #2d2d2d !important;
}
.toggle .switch input:focus + .slider {
box-shadow: none;
}
.toggle .switch input:focus-visible {
outline: 2px solid white !important;
}
.modal .modal-content .card {
background: #3B3B3B;
color: #CCCDCF;
}
.modal .modal-content .card .card-header-title {
color: white;
}
.modal .modal-content .card .card-content {
/*button {
background: $darker-grey!important;
}*/
}
.modal .modal-content .card .card-footer,
.modal .modal-content .card .card-footer-item {
border-color: #2d2d2d;
}
.modal.content {
color: #CCCDCF !important;
}
.modal.content .button {
background: #2d2d2d !important;
}
.modal.content .select:not(.is-multiple):not(.is-loading)::after {
border-color: white !important;
}
.modal.content .delete,
.modal.content .modal-close,
.modal.content .tag.is-info {
background: white !important;
color: #3B3B3B !important;
}
.modal.content .tag:not(body).is-dark {
background: #212224 !important;
}
.modal.content .modal-close::before,
.modal.content .modal-close::after {
color: #3B3B3B !important;
background: #3B3B3B !important;
}
.modal.content .modal-card,
.modal.content table {
background: #3B3B3B;
color: #CCCDCF !important;
}
.modal.content .title,
.modal.content table th {
color: white;
}
.modal.content table tr,
.modal.content table th,
.modal.content table td {
border-color: #2d2d2d !important;
}
.modal.content .tabs ul {
border-color: transparent;
}
.modal.content .tabs li a {
color: white;
border-color: #4a4a4a;
}
.modal.content .tabs li a:hover {
border-color: #CCCDCF;
}
.modal.content .tabs li.is-active a {
color: white;
border-color: #CCCDCF;
}
.message.fixed {
background: transparent !important;
}
.message.fixed i {
color: white !important;
}
.message.fixed .message-body {
color: #CCCDCF;
background: #3B3B3B !important;
}
.message.fixed .message-body .button {
background: #2d2d2d !important;
}
.dueDate #datePickerInput,
.dueDate #datePickerInput::placeholder {
color: white !important;
background: transparent !important;
cursor: pointer;
}
.datepicker {
background: transparent;
}
.datepicker .button {
background: transparent !important;
}
.datepicker .datepicker-cell.today.focused:not(.selected),
.datepicker .datepicker-cell.today:not(.selected) {
background: #212224 !important;
}
.datepicker .datepicker-cell.today.focused:not(.selected),
.datepicker .datepicker-cell.today:hover {
color: white !important;
}
.datepicker .datepicker-picker {
background: #2d2d2d;
color: white;
}
.datepicker .datepicker-picker .button,
.datepicker .datepicker-picker .button:hover,
.datepicker .datepicker-picker .datepicker-header .datepicker-controls .button:hover {
background: none;
color: inherit;
}
.datepicker .datepicker-picker .datepicker-footer .datepicker-controls .button {
color: inherit;
}
.datepicker .datepicker-picker .datepicker-cell.selected,
.datepicker .datepicker-picker .datepicker-cell.selected:hover {
color: #2d2d2d;
background: white;
}
.datepicker .datepicker-picker .datepicker-cell.focused:not(.selected),
.datepicker .datepicker-picker .datepicker-cell:hover {
color: #2d2d2d;
background: #CCCDCF;
}
.contentContainer .title.is-1 {
color: white;
}
.contentContainer .subtitle,
.contentContainer .subtitle strong {
color: #CCCDCF;
}
/*# sourceMappingURL=dark.css.map */
{"version":3,"sourceRoot":"","sources":["../scss/dark.scss","../scss/variables.scss"],"names":[],"mappings":"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","file":"dark.css"}
\ No newline at end of file
{"version":3,"sourceRoot":"","sources":["../scss/dark.scss","../scss/variables.scss"],"names":[],"mappings":"AAGA;EACE,kBCOa;EDNb;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAAA;EAEE;;;AAEF;AAAA;AAAA;EAGE,OCfa;;;ADiBf;AAAA;AAAA;EAGE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;EACA;;;AAEF;EACE;;;AAEF;AAAA;EAEE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;AACA;EACE;;;AAGJ;AAAA;EAEE;;AACA;AAAA;EACE;;;AAGJ;AAAA;EAEE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAKI;EACE;;;AAKR;EACE,kBC9FY;;AD+FZ;EACE,OCpGW;;ADuGX;EACE;;AAGA;EACE,OC5GO;ED6GP;;AAEF;AAAA;EAEE,OCjHO;EDkHP;EACA,kBC9GW;;ADiHf;EACE,OCvHS;EDwHT;EACA,kBCpHa;;;AD0Hf;EACE;;AAEF;EACE;;;AAIN;EACE,kBClIa;;ADmIb;AAAA;EAEE,OCxIQ;;AD0IV;EACE;;;AAIF;EACE;EACA;;;AAIF;EACE,kBCpJe;;ADwJf;AAAA;EACE,OC/JS;;ADkKb;EACE,cC7Je;;AD8Jf;EACE,OCpKS;;ADsKX;EACE;;AAEF;EACE,OC1KS;;AD4KX;EACE;;AACA;EACE;;AAGJ;AAAA;EAEE,OC5KY;;AD6KZ;AAAA;EACE;;AAIF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE,OCxMO;EDyMP;;;AAMN;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;AAGA;AAAA;AAAA;AAAA;EAIE;;AAEF;EACE,YC7Na;;;ADkOjB;AAAA;EAEE;EACA;EACA;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE,YChPU;;ADiPV;EACE,cChPS;;;ADoPf;EACE,YCtPiB;;ADuPjB;EACE,OC7PW;;;ADiQb;EACE;;AACA;EACE;;AACA;EACE;;AAIN;EACE;;AAEF;EACE;;AAEF;EACE;;;AAIF;EACE,YCjRe;;ADkRf;EACE;EACA;;AAGJ;EACE;;;AAIF;EACE,OClSW;;ADoSb;EACE;EACA;;AACA;EACE,YCpSQ;;;ADySZ;EACE,OCjSoB;EDkSpB;;AACA;EACE;EACA;;AAGJ;EACE;EACA;;;AAIF;EACE,OC9SoB;ED+SpB;;AACA;EACE;EACA;;AAGJ;EACE;EACA;;;AAIF;EACE;;;AAKA;EACE,kBC7UM;;AD+UR;EACE;;AAEF;EACE;;AAEF;EACE;;;AAMF;EACE,YC3Va;ED4Vb,OCjWS;;ADkWT;EACE;;AAEF;AACE;AAAA;AAAA;;AAIF;AAAA;EAEE,cCxWM;;;AD6Wd;EACE;;AACA;EACE;;AAEF;EACE;;AAEF;AAAA;AAAA;EAGE;EACA;;AAEF;EACE;;AAEF;AAAA;EAEE;EACA;;AAEF;AAAA;EAEE,YCpYe;EDqYf;;AAEF;AAAA;EAEE;;AAEF;AAAA;AAAA;EAGE;;AAEF;EACE;;AAEF;EACE;EACA,cCvZQ;;ADyZV;EACE,cC7ZW;;AD+Zb;EACE;EACA,cCjaW;;;ADoaf;EACE;;AACA;EACE;;AAEF;EACE,OC1aW;ED2aX;;AACA;EACE;;;AAKJ;AAAA;EAEE;EACA;EACA;;;AAGJ;EACE;;AACA;EACE;;AAEF;AAAA;EAEE;;AAEF;AAAA;EAEE;;AAEF;EACE,YCncU;EDocV;;AACA;AAAA;AAAA;EAGE;EACA;;AAEF;EACE;;AAEF;AAAA;EAEE,OChdQ;EDidR;;AAEF;AAAA;EAEE,OCrdQ;EDsdR,YC1dS;;;AD+db;EACE;;AAEF;AAAA;EAEE,OCpeW","file":"dark.css"}
\ No newline at end of file
......@@ -373,9 +373,11 @@ nav ul:nth-child(2) {
color: #4a4a4a;
font-family: FreeSansBold;
margin-bottom: 1.5em;
}
#drawerContainer .drawer h4.is-4.clickable {
cursor: pointer;
}
#drawerContainer .drawer h4.is-4 i {
#drawerContainer .drawer h4.is-4.clickable i {
color: #3273dc;
}
#drawerContainer .drawer .dropdown-item {
......@@ -641,6 +643,11 @@ nav ul:nth-child(2) {
display: block;
}
#modalForm[open]:not(:focus-within) {
background-color: #fffffe;
transition: background-color 0.01s;
}
#modalForm textarea#modalFormInput {
min-height: 5.5em;
overflow: hidden;
......
This diff is collapsed.
......@@ -228,12 +228,12 @@
<div class="modal-content">
<div class="card">
<header class="card-header">
<p id="modalTitle" class="card-header-title"></p>
<a id="modalTitle" class="card-header-title"></a>
</header>
<div class="card-content">
<div class="content">
<div class="control has-icons-right">
<input id="modalFormInput" class="input is-medium" type="text" tabindex="300">
<input id="modalFormInput" class="input is-medium" type="text" tabindex="0">
<a href="#" id="modalFormInputResize" class="icon is-right" tabindex="-1" data-input-type="input">
<i class="fas fa-expand-alt"></i>
</a>
......@@ -244,7 +244,7 @@
<div class="field">
<div class="control">
<div class="select">
<select id="priorityPicker" tabindex="305">
<select id="priorityPicker" tabindex="0">
<option value="">-</option>
<option value="A">A</option>
<option value="B">B</option>
......@@ -278,7 +278,7 @@
</div>
<div class="field dueDate">
<div class="control has-icons-left">
<input id="datePickerInput" class="input" tabindex="310" readonly>
<input id="datePickerInput" class="input" tabindex="0" readonly>
<a href="#" class="icon is-left" tabindex="-1">
<i class="far fa-clock is-left"></i>
</a>
......@@ -287,7 +287,7 @@
<div id="recurrencePicker" class="field">
<div class="control has-icons-left">
<input id="recurrencePickerInput" class="input" tabindex="-1" readonly>
<a href="#" class="icon is-left">
<a href="#" class="icon is-left" tabindex="-1">
<i class="fas fa-redo"></i>
</a>
</div>
......@@ -333,9 +333,9 @@
</div>
</div>
<footer class="card-footer">
<button id="btnSave" type="submit" class="card-footer-item" tabindex="315"></button>
<a href="#" id="btnItemStatus" class="card-footer-item" tabindex="320"></a>
<a href="#" class="card-footer-item btnModalCancel" tabindex="325"></a>
<button id="btnSave" type="submit" class="card-footer-item" tabindex="0"></button>
<a href="#" id="btnItemStatus" class="card-footer-item" tabindex="0"></a>
<a href="#" class="card-footer-item btnModalCancel" tabindex="0"></a>
</footer>
</div>
</div>
......@@ -512,7 +512,7 @@
</table>
<p><code>v<span id="version"></span></code></p>
</section>
<button class="modal-close close is-large" aria-label="close"></button>
<button class="modal-close close is-large" aria-label="close" tabindex="0"></button>
</div>
</div>
<div id="modalHelp" class="modal content" tabindex="0" data-track-content data-content-name="Help" data-content-piece="Keyboard shortcuts">
......@@ -659,7 +659,7 @@
</div>
</div>
</section>
<button class="modal-close close is-large" aria-label="close"></button>