Prevent highlighting/selecting UI elements and mitigate if done anyways

www/assets/css/app.css

@@ -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;
 }
 

www/assets/js/main.js

@@ -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) {

www/pages/add.html

@@ -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>

www/pages/home.html

@@ -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

www/pages/list.html

@@ -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">
+                <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" />
+                    <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 class="margin-top"><a href="/add" class="button button-round button-fill margin-horizontal">Add a Package</a></div>
-            </div>
+                </div>
-            <div class="list no-hairlines tablet-inset no-margin-top accordion-list" id="addresslist">
+                <div class="list no-hairlines tablet-inset no-margin-top accordion-list" id="addresslist">
-                <ul>
+                    <ul>
-                    <!-- Packages go here -->
+                        <!-- Packages go here -->
-                </ul>
+                    </ul>
-            </div>
+                </div>
             </div>
         </div>
     </div>

www/pages/settings.html

@@ -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">

www/pages/toolbox.html

@@ -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">

www/pages/toolbox/log.html

@@ -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>

www/pages/toolbox/scanner.html

@@ -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.

www/pages/toolbox/sharelist.html

@@ -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,

www/pages/toolbox/track.html

@@ -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.

www/pages/toolbox/weather.html

@@ -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">