Prevent highlighting/selecting UI elements and mitigate if done anyways

Skylar Ittner 4 years ago
parent 991b49e8a0
commit b3c770bda2

@ -23,7 +23,7 @@ Framework7 and FontAwesome both have a .fab class
padding-bottom: var(--f7-fab-size);
}
.navbar, .item-link .item-title, .item-divider, .item-label, .noselect {
.navbar, .item-link .item-title, .item-media, .item-divider, .item-label, .fab, .button, .noselect {
user-select: none;
}

@ -48,6 +48,12 @@ router.on("pageInit", function (pagedata) {
eval($$(this).text());
}
});
// Stop text selection from popping a system toolbar even after changing pages
if (window.getSelection) {
window.getSelection().removeAllRanges();
} else if (document.selection) {
document.selection.empty();
}
});
/**
@ -66,6 +72,12 @@ function handleBackButton() {
} else {
router.back({force: true, ignoreCache: true});
}
// Stop text selection from popping a system toolbar even after changing pages
if (window.getSelection) {
window.getSelection().removeAllRanges();
} else if (document.selection) {
document.selection.empty();
}
}
$(document).keyup(function (e) {

@ -150,14 +150,14 @@
<div class="title">Recent Items</div>
</div>
</div>
<div class="block text-align-center" id="no-history">
<div class="block text-align-center noselect" id="no-history">
<img style="width: 60%; max-width: 300px; max-height: 40vh;" src="assets/images/history-dashed.svg" class="margin-vertical" />
<div class="margin-top">No recently added items! <span id="history-empty-swipe-prompt">Swipe <i class="fas fa-arrow-left"></i> to add some.</span></div>
</div>
<ul class="list no-hairlines tablet-inset no-margin-top" id="historylist">
<!-- Packages go here -->
</ul>
<div class="block text-align-center display-none" id="tap-to-remove-history-prompt">
<div class="block text-align-center display-none noselect" id="tap-to-remove-history-prompt">
<span class="block-header"><span class="taptext">Tap</span><span class="clicktext">Click</span> a recently added item to delete it.</span>
</div>
</div>

@ -11,7 +11,7 @@
</div>
</div>
<div class="page-content">
<div class="page-content noselect">
<div class="row margin-top noselect">
<div class="col text-align-center">
<div

@ -49,15 +49,15 @@
<div class="row justify-content-center">
<div class="col-100 small-80 medium-60 large-50 xlarge-40">
<div id="no-packages-display" class="block display-none text-align-center">
<img style="width: 60%; max-width: 300px; max-height: 40vh;" src="assets/images/box-open-dashed.svg" class="margin-vertical" />
<div class="margin-top"><a href="/add" class="button button-round button-fill margin-horizontal">Add a Package</a></div>
</div>
<div class="list no-hairlines tablet-inset no-margin-top accordion-list" id="addresslist">
<ul>
<!-- Packages go here -->
</ul>
</div>
<div id="no-packages-display" class="block display-none text-align-center noselect">
<img style="width: 60%; max-width: 300px; max-height: 40vh;" src="assets/images/box-open-dashed.svg" class="margin-vertical" />
<div class="margin-top"><a href="/add" class="button button-round button-fill margin-horizontal">Add a Package</a></div>
</div>
<div class="list no-hairlines tablet-inset no-margin-top accordion-list" id="addresslist">
<ul>
<!-- Packages go here -->
</ul>
</div>
</div>
</div>
</div>

@ -17,7 +17,7 @@
</div>
<div class="page-content">
<div class="page-content noselect">
<div class="row justify-content-center">
<div class="col-100 medium-60 large-50 xlarge-40 elevation-tablet margin-top-tablet">
<div class="list media-list no-hairlines no-margin-top no-margin-bottom tablet-inset">

@ -16,7 +16,7 @@
</div>
</div>
<div class="page-content">
<div class="page-content noselect">
{{#if oldui}}
<div class="row justify-content-center">
<div class="col-100 small-80 medium-60 large-50 xlarge-40">

@ -28,7 +28,7 @@
<div class="timeline medium-sides">
{{#each events}}
<div class="timeline-item">
<div class="timeline-item-date">{{date}} <small>{{addldate}}</small></div>
<div class="timeline-item-date noselect">{{date}} <small>{{addldate}}</small></div>
<div class="timeline-item-divider"></div>
<div class="timeline-item-content">
{{#each entries}}
@ -44,7 +44,7 @@
{{/each}}
</div>
{{else}}
<div class="block text-align-center">
<div class="block text-align-center noselect">
<img style="width: 60%; max-width: 300px; max-height: 40vh;" src="assets/images/history-dashed.svg" class="margin-vertical" />
<div class="margin-top">Log empty! When you mark packages as delivered, add notes, and more, this log will automatically gain entries.</div>
</div>

@ -40,7 +40,7 @@
</ul>
</div>
<div class="block text-align-center">
<div class="block text-align-center noselect">
<i class="material-icons material-icons-24px">info</i>
<br />
Scan barcodes while your postal scanner is crashed or restarting.

@ -57,7 +57,7 @@
</ul>
</div>
<div class="block text-align-center">
<div class="block text-align-center noselect">
<i class="material-icons material-icons-24px">info</i>
<br />
Share your delivery list to another device. The sender uploads the list,

@ -42,7 +42,7 @@
</ul>
</div>
<div class="block text-align-center">
<div class="block text-align-center noselect">
<i class="material-icons material-icons-24px">info</i>
<br />
Compatible with USPS, UPS, FedEx, and DHL tracking codes.

@ -21,7 +21,7 @@
</div>
</div>
<div class="page-content">
<div class="page-content noselect">
<div class="row justify-content-center">
<div class="col-100 small-80 medium-60 large-50 xlarge-40">
<div class="block text-align-center">

Loading…
Cancel
Save