Added dark mode as an option

app/Http/Controllers/AccountController.php

@@ -1143,6 +1143,7 @@ class AccountController extends BaseController
             $user->username = $email;
             $user->email = $email;
             $user->phone = trim(Input::get('phone'));
+            $user->dark_mode = Input::get('dark_mode');
 
             if (! Auth::user()->is_admin) {
                 $user->notify_sent = Input::get('notify_sent');

database/migrations/2015_07_08_114333_simplify_tasks.php

@@ -54,7 +54,7 @@ class SimplifyTasks extends Migration
             $table->integer('break_duration')->nullable();
         });
 
-        if (Schema::hasColumn('accounts', 'dark_mode')) {
+        if (Schema::hasColumn('users', 'dark_mode')) {
             Schema::table('users', function ($table) {
                 $table->dropColumn('dark_mode');
             });

database/migrations/2017_06_19_111515_update_dark_mode.php

@@ -0,0 +1,31 @@
+<?php
+
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Database\Migrations\Migration;
+
+class UpdateDarkMode extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('users', function ($table) {
+            $table->boolean('dark_mode')->default(true)->change();
+        });
+
+        DB::statement('update users set dark_mode = 1;');
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        //
+    }
+}

resources/assets/css/colors.css

@@ -39,38 +39,68 @@ thead th {
     border-left: 1px solid #999;
 }
 
-.sidebar-nav {
+.sidebar-nav-dark {
     background-color: #313131;
 }
 
-.sidebar-nav li {
+.sidebar-nav-dark li {
     border-bottom:solid 1px #444444;
 }
 
-.sidebar-nav i.fa {
-    color: white;
+.sidebar-nav-dark li > a {
+    color: #aaa;
 }
 
-.menu-toggle i,
-.sidebar-nav li > a {
-    color: #999999;
-}
-
-.menu-toggle:hover i,
-.sidebar-nav li:hover > a,
-.sidebar-nav li > a.active {
+.sidebar-nav-dark li:hover > a,
+.sidebar-nav-dark li > a.active {
     color: #fff;
 }
 
-.sidebar-nav li:hover,
-.sidebar-nav li.active {
+.sidebar-nav-dark li:hover,
+.sidebar-nav-dark li.active {
     background: rgba(255,255,255,0.1);
 }
 
+
+
+.sidebar-nav-light {
+    background-color: #FFFFFF;
+}
+
+.sidebar-nav-light li {
+    border-bottom:solid 1px #DDD;
+}
+
+.sidebar-nav-light li > a {
+    color: #757575;
+}
+
+.sidebar-nav-light li:hover > a,
+.sidebar-nav-light li > a.active {
+    color: #363636;
+}
+
+.sidebar-nav-light li:hover,
+.sidebar-nav-light li.active {
+    background: rgba(140,140,140,0.1);
+}
+
+
+
+.menu-toggle i {
+    color: #999999;
+}
+
+.menu-toggle:hover {
+    color: #fff;
+}
+
 .menu-toggle {
     color: #999 !important;
 }
 
+.sidebar-nav a.btn i.fa,
+.navbar-header:hover i,
 .menu-toggle:hover {
     color: #fff !important;
 }

resources/assets/css/sidebar.css

@@ -92,13 +92,23 @@
         margin: 0;
         list-style: none;
         height: 100%;
+    }
+
+    .sidebar-nav-dark {
         box-shadow: inset 0 0 6px #000000;
         -moz-box-shadow: inset 0 0 6px #000000;
         -webkit-box-shadow: inset 0 0 5px #000000;
     }
 
+    .sidebar-nav-light {
+        height: 100%;
+        box-shadow: inset 0 0 4px #888;
+        -moz-box-shadow: inset 0 0 4px #888;
+        -webkit-box-shadow: inset 0 0 4px #888;
+    }
+
     #left-sidebar-wrapper .sidebar-nav li {
-        text-indent: 20px;
+        text-indent: 14px;
         line-height: 36px;
     }
 

resources/lang/en/texts.php

@@ -624,7 +624,7 @@ $LANG = array(
     'times' => 'Times',
     'set_now' => 'Set to now',
     'dark_mode' => 'Dark Mode',
-    'dark_mode_help' => 'Show white text on black background',
+    'dark_mode_help' => 'Use a dark background for the sidebars',
     'add_to_invoice' => 'Add to invoice :invoice',
     'create_new_invoice' => 'Create new invoice',
     'task_errors' => 'Please correct any overlapping times',

resources/views/accounts/user_details.blade.php

@@ -14,6 +14,7 @@
     {{ Former::populateField('last_name', $user->last_name) }}
     {{ Former::populateField('email', $user->email) }}
     {{ Former::populateField('phone', $user->phone) }}
+    {{ Former::populateField('dark_mode', intval($user->dark_mode)) }}
 
     @if (Input::has('affiliate'))
         {{ Former::populateField('referral_code', true) }}
@@ -47,6 +48,11 @@
                      !!}
                 @endif
 
+                {!! Former::checkbox('dark_mode')
+                        ->help(trans('texts.dark_mode_help'))
+                        ->text(trans('texts.enable'))
+                        ->value(1)  !!}
+
                 @if (Utils::isNinja())
                     @if ($user->referral_code)
                         {{ Former::setOption('capitalize_translations', false) }}

resources/views/header.blade.php

@@ -361,7 +361,7 @@
 
     <!-- Sidebar -->
     <div id="left-sidebar-wrapper" class="hide-phone">
-        <ul class="sidebar-nav">
+        <ul class="sidebar-nav {{ Auth::user()->dark_mode ? 'sidebar-nav-dark' : 'sidebar-nav-light' }}">
             @foreach([
                 'dashboard',
                 'clients',
@@ -422,7 +422,7 @@
     <!-- /#left-sidebar-wrapper -->
 
     <div id="right-sidebar-wrapper" class="hide-phone" style="overflow-y:hidden">
-        <ul class="sidebar-nav">
+        <ul class="sidebar-nav {{ Auth::user()->dark_mode ? 'sidebar-nav-dark' : 'sidebar-nav-light' }}">
             {!! \App\Libraries\HistoryUtils::renderHtml(Auth::user()->account_id) !!}
         </ul>
     </div>

resources/views/partials/navigation_option.blade.php

@@ -17,7 +17,7 @@
     @endif
 
     <a href="{{ url($option == 'recurring' ? 'recurring_invoice' : $option) }}"
-        style="font-size:15px; padding-top:6px; padding-bottom:6px"
+        style="font-size:16px; padding-top:6px; padding-bottom:6px"
         class="nav-link {{ Request::is("{$option}*") ? 'active' : '' }}">
         <i class="fa fa-{{ empty($icon) ? \App\Models\EntityModel::getIcon($option) : $icon }}" style="width:46px; padding-right:10px"></i>
         {{ ($option == 'recurring_invoices') ? trans('texts.recurring') : mtrans($option) }}