diff --git a/api.php b/api.php
index 77d63e6..b16a7f2 100644
--- a/api.php
+++ b/api.php
@@ -14,7 +14,7 @@ header("Content-Type: application/json");
 
 $username = $VARS['username'];
 $password = $VARS['password'];
-if (user_exists($username) !== true || authenticate_user($username, $password, $errmsg) !== true) {
+if (user_exists($username) !== true || authenticate_user($username, $password, $errmsg) !== true || account_has_permission($username, "QWIKCLOCK") !== true) {
     header("HTTP/1.1 403 Unauthorized");
     die("\"403 Unauthorized\"");
 }
diff --git a/app.php b/app.php
index 00aa34c..4d6ba5d 100644
--- a/app.php
+++ b/app.php
@@ -53,7 +53,7 @@ if (!is_empty($_GET['page'])) {
                     ?>
                 </div>
             </div>
-            <nav class="navbar navbar-inverse navbar-<?php echo MENU_BAR_STYLE; ?>-top">
+            <nav class="navbar navbar-inverse navbar-blue navbar-<?php echo MENU_BAR_STYLE; ?>-top">
                 <div class="container-fluid">
                     <div class="navbar-header">
                         <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
diff --git a/index.php b/index.php
index 763bbb4..7ad8600 100644
--- a/index.php
+++ b/index.php
@@ -122,8 +122,8 @@ if (checkLoginServer()) {
 
                                 if ($multiauth != true) {
                                     ?>
-                                    <input type="text" class="form-control" name="username" placeholder="<?php lang("username"); ?>" required="required" autofocus /><br />
-                                    <input type="password" class="form-control" name="password" placeholder="<?php lang("password"); ?>" required="required" /><br />
+                                    <input type="text" class="form-control" name="username" placeholder="<?php lang("username"); ?>" required="required" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" autofocus /><br />
+                                    <input type="password" class="form-control" name="password" placeholder="<?php lang("password"); ?>" required="required" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" /><br />
                                     <?php if (RECAPTCHA_ENABLED) { ?>
                                         <div class="g-recaptcha" data-sitekey="<?php echo RECAPTCHA_SITE_KEY; ?>"></div>
                                         <br />
@@ -135,7 +135,7 @@ if (checkLoginServer()) {
                                     <div class="alert alert-info">
                                         <?php lang("2fa prompt"); ?>
                                     </div>
-                                    <input type="text" class="form-control" name="authcode" placeholder="<?php lang("authcode"); ?>" required="required" autocomplete="off" autofocus /><br />
+                                    <input type="text" class="form-control" name="authcode" placeholder="<?php lang("authcode"); ?>" required="required" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" autofocus /><br />
                                     <input type="hidden" name="progress" value="2" />
                                     <input type="hidden" name="username" value="<?php echo $VARS['username']; ?>" />
                                     <?php
diff --git a/mobile/index.php b/mobile/index.php
index 373f48f..31d1db4 100644
--- a/mobile/index.php
+++ b/mobile/index.php
@@ -9,6 +9,7 @@ require __DIR__ . "/../required.php";
 require __DIR__ . "/../lib/login.php";
 
 header('Content-Type: application/json');
+header('Access-Control-Allow-Origin: *');
 
 // Allow ping check without authentication
 if ($VARS['action'] == "ping") {
diff --git a/pages.php b/pages.php
index e9bf776..5fa2876 100644
--- a/pages.php
+++ b/pages.php
@@ -26,4 +26,17 @@ define("PAGES", [
             "static/js/punches.js"
         ]
     ],
+    "shifts" => [
+        "title" => "shifts",
+        "navbar" => true,
+        "icon" => "calendar",
+        "styles" => [
+            "static/css/datatables.min.css",
+            "static/css/tables.css"
+        ],
+        "scripts" => [
+            "static/js/datatables.min.js",
+            "static/js/shifts.js"
+        ]
+    ],
 ]);
diff --git a/pages/shifts.php b/pages/shifts.php
new file mode 100644
index 0000000..72b3709
--- /dev/null
+++ b/pages/shifts.php
@@ -0,0 +1,67 @@
+<?php
+require_once __DIR__ . '/../required.php';
+
+redirectifnotloggedin();
+
+
+require_once __DIR__ . "/../lib/dates.php";
+$weekstart = sqldatetime(getstartofweek(WEEK_START));
+$punches = $database->select('punches', ['in', 'out'], ['AND' => ['uid' => $_SESSION['uid'], 'in[>]' => $weekstart]]);
+$punchtimes = [];
+foreach ($punches as $p) {
+    $punchtimes[] = [$p['in'], $p['out']];
+}
+$totalseconds = sumelapsedtimearray($punchtimes);
+$totalpunches = count($punches);
+?>
+<p class="page-header h5"><i class="fa fa-calendar fa-fw"></i> <?php lang("this week") ?></p>
+<div class="row">
+
+    <div class="col-xs-12 col-sm-6 col-md-4 col-md-offset-2">
+        <div class="panel panel-blue">
+            <div class="panel-body">
+                <h4>
+                    <?php
+                    lang2("x on the clock", ["time" => seconds2string($totalseconds, false)]);
+                    ?>
+                </h4>
+            </div>
+        </div>
+    </div>
+    
+    <div class="col-xs-12 col-sm-6 col-md-4">
+        <div class="panel panel-blue">
+            <div class="panel-body">
+                <h4>
+                    <?php
+                    lang2("x punches", ["count" => $totalpunches]);
+                    ?>
+                </h4>
+            </div>
+        </div>
+    </div>
+</div>
+
+<a id="punches" style="height: 0px; width: 0px;">&nbsp;</a>
+
+<p class="page-header h5"><i class="fa fa-clock-o fa-fw"></i> <?php lang("punch card") ?></p>
+<table id="punchtable" class="table table-bordered table-striped">
+    <thead>
+        <tr>
+            <th data-priority="0"></th>
+            <th data-priority="1"><i class="fa fa-fw fa-play"></i> <?php lang('in'); ?></th>
+            <th data-priority="1"><i class="fa fa-fw fa-stop"></i> <?php lang('out'); ?></th>
+            <th data-priority="2"><i class="fa fa-fw fa-sticky-note-o"></i> <?php lang('notes'); ?></th>
+        </tr>
+    </thead>
+    <tbody>
+
+    </tbody>
+    <tfoot>
+        <tr>
+            <th data-priority="0"></th>
+            <th data-priority="1"><i class="fa fa-fw fa-play"></i> <?php lang('in'); ?></th>
+            <th data-priority="1"><i class="fa fa-fw fa-stop"></i> <?php lang('out'); ?></th>
+            <th data-priority="2"><i class="fa fa-fw fa-sticky-note-o"></i> <?php lang('notes'); ?></th>
+    </tfoot>
+</table>
\ No newline at end of file
diff --git a/static/css/app.css b/static/css/app.css
index 52431ed..13e89f9 100644
--- a/static/css/app.css
+++ b/static/css/app.css
@@ -55,4 +55,20 @@ file and add a .navbar-[color] class to the navbar in app.php.
 
 .navbar-inverse .navbar-link {
     color: white;
+}
+
+
+@media screen and (max-width: 767px) {
+    button.navbar-toggle[data-toggle="collapse"] {
+        float: left;
+        margin-left: 15px;
+    }
+
+    .navbar-header .navbar-brand {
+        margin-left: -20px;
+    }
+
+    .navbar-header .navbar-brand img {
+        display: none;
+    }
 }
\ No newline at end of file
diff --git a/static/js/home.js b/static/js/home.js
index a3f4b0a..6f85706 100644
--- a/static/js/home.js
+++ b/static/js/home.js
@@ -7,12 +7,12 @@ function setClock() {
             $('#server_date').text(resp.date);
             var seconds = resp.seconds * 1;
             var interval = 60 - seconds;
-            console.log(interval);
+            //console.log(interval);
             if (interval > 5) {
                 interval = 5;
             }
-            console.log(interval);
-            console.log((((seconds + interval) / 60) * 100));
+            //console.log(interval);
+            //console.log((((seconds + interval) / 60) * 100));
 
             $('#seconds_bar div').animate({
                 width: (((seconds + interval) / 60) * 100) + "%"