From 44b0b4645df6ec5fdfbcbc69ed58bdcc220a656a Mon Sep 17 00:00:00 2001
From: waysonwei <degui.wei@gmail.com>
Date: Wed, 4 Aug 2021 15:18:16 +1200
Subject: [PATCH] update fixed for po reviews - disable button color

---
 app/assets/css/app.css                        | 345 +++++++++---------
 .../components/box-selector/box-selector.css  |   5 +-
 .../views/init/admin/initAdminController.js   |  19 +
 app/portainer/views/main/mainController.js    |   8 +-
 4 files changed, 207 insertions(+), 170 deletions(-)

diff --git a/app/assets/css/app.css b/app/assets/css/app.css
index bc3bba626..6e287049e 100644
--- a/app/assets/css/app.css
+++ b/app/assets/css/app.css
@@ -1,275 +1,284 @@
 :root[theme='dark'] {
   --bg-card-color: #212121;
-  --text-main-color: #fff;
-  --border-color: rgba(255, 255, 255, 0.1);
   --bg-main-color: #181818;
   --bg-body-color: #181818;
-  --text-body-color: #fff;
   --bg-checkbox-border-color: #aaa;
   --bg-sidebar-color: #212121;
-  --hover-sidebar-color: rgba(255, 255, 255, 0.1);
-  --text-sidebar-title-color: #aaa;
   --bg-widget-color: #212121;
-  --border-widget-color: #212121;
   --bg-widget-header-color: #212121;
-  --text-widget-header-color: #ffffff;
   --bg-widget-table-color: #212121;
-  --border-sidebar-color: #3ea6ff;
-  --border-form-control-color: rgb(54, 54, 54);
   --bg-header-color: #181818;
-  --text-form-control-color: #aaa;
-  --text-muted-color: #aaa;
-  --border-table-color: rgba(255, 255, 255, 0.1);
-  --bg-hover-table-color: rgba(255, 255, 255, 0.1);
+  --bg-hover-table-color: #383838;
   --bg-switch-box-color: rgba(255, 255, 255, 0.6);
-  --border-table-top-color: rgba(255, 255, 255, 0.1);
-  --border-datatable-top-color: rgba(255, 255, 255, 0.1);
-  --text-link-color: #3ea6ff;
-  --text-link-hover-color: #337ab7;
-  --border-blocklist-color: rgba(255, 255, 255, 0.1);
-  --border-input-group-addon-color: #434343;
-  --bg-input-group-addon-color: rgba(255, 255, 255, 0.1);
-  --text-input-group-addon-color: #aaa;
-  --border-btn-default-color: #434343;
-  --bg-btn-default-color: rgba(255, 255, 255, 0.1);
-  --text-btn-default-color: #aaa;
-  --bg-blocklist-hover-color: rgba(255, 255, 255, 0.1);
-  --text-blocklist-hover-color: #fff;
+  --bg-input-group-addon-color: #383838;
+  --bg-btn-default-color: #383838;
+  --bg-blocklist-hover-color: #383838;
   --bg-boxselector-color: rgba(255, 255, 255, 0.3);
-  --border-boxselector-color: #212121;
-  --text-boxselector-color: #fff;
-  --blue-color: #337ab7;
-  --text-dashboard-item-color: #337ab7;
-  --text-danger-color: #d9534f;
   --bg-table-color: #212121;
   --bg-md-checkbox-color: #868686;
-  --border-md-checkbox-color: #b4b4b4;
-  --bg-form-control-disabled-color: rgba(255, 255, 255, 0.1);
+  --bg-form-control-disabled-color: #383838;
   --bg-modal-content-color: #212121;
-  --border-modal-header-color: #212121;
-  --button-close-color: #fff;
-  --button-opacity: 0.6;
-  --button-opacity-hover: 0.3;
-  --text-code-color: #fff;
   --bg-code-color: #d9534f;
-  --text-navtabs-color: #ffffff;
-  --bg-navtabs-color: rgba(255, 255, 255, 0.1);
-  --border-navtabs-color: #434343;
+  --bg-navtabs-color: #383838;
   --bg-navtabs-hover-color: #383838;
-  --border-form-section-title-color: #aaa;
-  --text-form-section-title-color: #aaa;
   --bg-table-selected-color: #383838;
+  --bg-codemirror-color: #181818;
+  --bg-codemirror-gutters-color: #181818;
+  --bg-dropdown-menu-color: #212121;
+  --bg-log-viewer-color: #181818;
+  --bg-log-line-selected-color: #383838;
+  --bg-pre-color: #181818;
+  --bg-blocklist-item-selected-color: #383838;
+  --bg-progress-color: #383838;
+  --bg-pagination-color: #383838;
+  --bg-pagination-span-color: #383838;
+  --bg-pagination-hover-color: #585858;
+  --bg-ui-select-hover-color: #383838;
+  --bg-motd-body-color: #212121;
+  --bg-item-highlighted-color: #181818;
+  --bg-item-highlighted-null-color: #181818;
+  --bg-row-header-color: #181818;
+  --bg-multiselect-button-color: #383838;
+  --bg-image-multiselect-button: none !important;
+  --bg-multiselect-checkbox-color: #383838;
+  --bg-sidebar-wrapper-color: #212121;
+  --bg-panel-body-color: #212121;
+  --bg-boxselector-wrapper-disabled-color: #194973;
+  --bg-codemirror-selected-color: #383838;
+
+  --text-main-color: #fff;
+  --text-body-color: #fff;
+  --text-sidebar-title-color: #aaa;
+  --text-widget-header-color: #ffffff;
+  --text-form-control-color: #aaa;
+  --text-muted-color: #aaa;
+  --text-link-color: #3ea6ff;
+  --text-link-hover-color: #337ab7;
+  --text-input-group-addon-color: #aaa;
+  --text-btn-default-color: #aaa;
+  --text-blocklist-hover-color: #fff;
+  --text-dashboard-item-color: #337ab7;
+  --text-danger-color: #d9534f;
+  --text-code-color: #fff;
+  --text-navtabs-color: #ffffff;
+  --text-form-section-title-color: #aaa;
   --text-cm-default-color: #61b6ff;
   --text-cm-meta-color: #fff;
   --text-cm-string-color: #ff2727;
   --text-cm-number-color: #1ec863;
-  --border-codemirror-cursor-color: #fff;
-  --bg-codemirror-color: #181818;
   --text-codemirror-color: #fff;
-  --bg-codemirror-gutters-color: #181818;
-  --border-codemirror-gutters-color: #777;
-  --bg-dropdown-menu-color: #212121;
   --text-dropdown-menu-color: #fff;
   --text-log-viewer-color: #fff;
-  --bg-log-viewer-color: #181818;
-  --bg-log-line-selected-color: #383838;
-  --border-pre-color: #383838;
   --text-json-tree-color: #cfddfc;
   --text-json-tree-leaf-color: #577bc9;
   --text-json-tree-branch-preview-color: #6b9aff;
-  --bg-pre-color: #181818;
   --text-pre-color: #fff;
-  --bg-blocklist-item-selected-color: #383838;
-  --border-blocklist-item-selected-color: #434343;
   --text-blocklist-item-selected-color: #fff;
-  --bg-progress-color: #383838;
   --text-progress-bar-color: #fff;
   --text-pagination-color: #fff;
-  --bg-pagination-color: #383838;
-  --border-pagination-color: #383838;
-  --bg-pagination-span-color: #383838;
-  --border-pagination-span-color: #383838;
-  --bg-pagination-hover-color: #585858;
-  --border-pagination-hover-color: #383838;
-  --border-pagination-hover-color: #383838;
   --text-pagination-span-color: #fff;
   --text-pagination-span-hover-color: #fff;
   --text-ui-select-color: #fff;
-  --bg-ui-select-hover-color: #383838;
   --text-ui-select-hover-color: #fff;
-  --bg-motd-body-color: #212121;
   --text-summary-color: #fff;
-  --bg-item-highlighted-color: #181818;
-  --bg-item-highlighted-null-color: #181818;
-  --bg-row-header-color: #181818;
   --text-multiselect-button-color: #fff;
-  --border-multiselect-button-color: #383838;
-  --bg-multiselect-button-color: #383838;
-  --bg-image-multiselect-button: none !important;
-  --bg-multiselect-checkbox-color: #383838;
   --text-multiselect-item-color: #fff;
-  --border-searchbar-color: #212121;
   --text-sidebar-list-color: #fff;
-  --bg-sidebar-wrapper-color: #212121;
-  --bg-panel-body-color: #212121;
-  --border-boxselector-wrapper: 3px solid #337ab7;
-  --border-boxselector-wrapper-hover: 3px solid #90ccff;
+
+  --border-color: #383838;
+  --border-widget-color: #212121;
+  --border-sidebar-color: #3ea6ff;
+  --border-form-control-color: rgb(54, 54, 54);
+  --border-table-color: #383838;
+  --border-table-top-color: #383838;
+  --border-datatable-top-color: #383838;
+  --border-blocklist-color: #383838;
+  --border-input-group-addon-color: #434343;
+  --border-btn-default-color: #434343;
+  --border-boxselector-color: #212121;
+  --border-md-checkbox-color: #b4b4b4;
+  --border-modal-header-color: #212121;
+  --border-navtabs-color: #434343;
+  --border-form-section-title-color: #aaa;
+  --border-codemirror-cursor-color: #fff;
+  --border-codemirror-gutters-color: #777;
+  --border-pre-color: #383838;
+  --border-blocklist-item-selected-color: #434343;
+  --border-pagination-color: #383838;
+  --border-pagination-span-color: #383838;
+  --border-pagination-hover-color: #383838;
+  --border-pagination-hover-color: #383838;
+  --border-multiselect-button-color: #383838;
+  --border-searchbar-color: #212121;
+
+  --hover-sidebar-color: #383838;
+  --blue-color: #337ab7;
+  --button-close-color: #fff;
+  --button-opacity: 0.6;
+  --button-opacity-hover: 0.3;
 }
 
 :root[theme='highcontrast'] {
   --bg-card-color: #000;
-  --text-main-color: #fff;
-  --border-color: rgba(255, 255, 255, 0.8);
   --bg-main-color: #000;
   --bg-body-color: #000;
-  --text-body-color: #fff;
   --bg-checkbox-border-color: #aaa;
   --bg-sidebar-color: #000;
-  --hover-sidebar-color: #3ea6ff;
-  --text-sidebar-title-color: #aaa;
   --bg-widget-color: #000;
-  --border-widget-color: #fff;
   --bg-widget-header-color: #000;
-  --text-widget-header-color: #ffffff;
   --bg-widget-table-color: #000;
-  --border-sidebar-color: #3ea6ff;
-  --border-form-control-color: rgb(54, 54, 54);
   --bg-header-color: #000;
-  --border-table-color: rgba(255, 255, 255, 0.8);
-  --bg-hover-table-color: rgba(255, 255, 255, 0.1);
+  --bg-hover-table-color: #383838;
   --bg-switch-box-color: rgba(255, 255, 255, 0.6);
-  --border-table-top-color: rgba(255, 255, 255, 0.8);
-  --border-datatable-top-color: rgba(255, 255, 255, 0.8);
+  --bg-panel-body-color: #000;
+  --bg-boxselector-wrapper-disabled-color: #194973;
+  --bg-dropdown-menu-color: #000;
+  --bg-codemirror-selected-color: #383838;
+
+  --text-main-color: #fff;
+  --text-body-color: #fff;
+  --text-sidebar-title-color: #aaa;
+  --text-widget-header-color: #ffffff;
   --text-link-color: #3ea6ff;
   --text-link-hover-color: #3ea6ff;
-  --hover-sidebar-color: #000;
-  --border-sidebar-high-contrast: 1px solid #3ea6ff;
-  --text-danger-color: #ff00e0;
   --text-code-color: #fff;
   --text-form-control-color: #fff;
-  --border-code-high-contrast: 1px solid #fff;
   --text-blocklist-hover-color: #3ea5ff;
-  --bg-panel-body-color: #000;
-  --border-boxselector-wrapper: 3px solid #337ab7;
-  --border-boxselector-wrapper-hover: 3px solid #90ccff;
+  --text-danger-color: #ff00e0;
+  --text-dropdown-menu-color: #fff;
+
+  --border-color: rgba(255, 255, 255, 0.8);
+  --border-widget-color: #fff;
+  --border-sidebar-color: #3ea6ff;
+  --border-form-control-color: rgb(54, 54, 54);
+  --border-table-color: rgba(255, 255, 255, 0.8);
+  --border-table-top-color: rgba(255, 255, 255, 0.8);
+  --border-datatable-top-color: rgba(255, 255, 255, 0.8);
+  --border-sidebar-high-contrast: 1px solid #3ea6ff;
+  --border-code-high-contrast: 1px solid #fff;
+
+  --hover-sidebar-color: #3ea6ff;
+  --hover-sidebar-color: #000;
 }
 
 :root[theme='light'] {
   --bg-card-color: #f6f6f6;
-  --text-main-color: #767676;
-  --border-color: #d2d1d1;
   --bg-main-color: #fff;
   --bg-body-color: #f3f3f3;
-  --text-body-color: #333333;
   --bg-checkbox-border-color: rgba(0, 0, 0, 0.54);
   --bg-sidebar-color: #2d3e63;
-  --hover-sidebar-color: #2d3e63;
-  --text-sidebar-title-color: #738bc0;
   --bg-widget-color: #ffffff;
-  --border-widget-color: #e9e9e9;
   --bg-widget-header-color: #f6f6f6;
-  --text-widget-header-color: #767676;
   --bg-widget-table-color: #fafafa;
-  --border-sidebar-color: #ffffff;
-  --border-form-control-color: #ccc;
   --bg-header-color: #fff;
-  --text-form-control-color: #555555;
-  --text-muted-color: #777777;
-  --border-table-color: #ddd;
   --bg-hover-table-color: #f5f5f5;
   --bg-switch-box-color: #ffffff;
-  --border-table-top-color: #ddd;
-  --border-datatable-top-color: #f6f6f6;
-  --text-link-color: #337ab7;
-  --text-link-hover-color: #23527c;
-  --border-blocklist-color: #cccccc;
-  --shadow-box-color: 0 3px 10px -2px rgba(161, 170, 166, 0.5);
-  --border-input-group-addon-color: #ccc;
   --bg-input-group-addon-color: #eeeeee;
-  --text-input-group-addon-color: #555555;
-  --border-btn-default-color: #ccc;
   --bg-btn-default-color: #fff;
-  --text-btn-default-color: #333;
   --bg-blocklist-hover-color: #ececec;
-  --text-blocklist-hover-color: #2d3e63;
   --bg-boxselector-color: #fff;
-  --border-boxselector-color: #333333;
-  --shadow-boxselector-color: 0 3px 10px -2px rgba(161, 170, 166, 0.5);
-  --blue-color: #2361ae;
-  --text-dashboard-item-color: #65798e;
-  --text-danger-color: #a94442;
   --bg-table-color: #fff;
   --bg-md-checkbox-color: #ececec;
-  --border-md-checkbox-color: #ddd;
   --bg-form-control-disabled-color: #eeeeee;
   --bg-modal-content-color: #fff;
-  --border-modal-header-color: #e5e5e5;
-  --button-close-color: #000;
-  --button-opacity: 0.2;
-  --button-opacity-hover: 0.5;
-  --text-code-color: #c7254e;
   --bg-code-color: #f9f2f4;
-  --text-navtabs-color: #555555;
   --bg-navtabs-color: #fff;
-  --border-navtabs-color: #ddd;
   --bg-navtabs-hover-color: #eee;
-  --border-form-section-title-color: #777;
-  --text-form-section-title-color: #777;
   --bg-table-selected-color: #f5f5f5;
+  --bg-codemirror-gutters-color: #f7f7f7;
+  --bg-dropdown-menu-color: #fff;
+  --bg-log-viewer-color: #fff;
+  --bg-log-line-selected-color: #c5cae9;
+  --bg-pre-color: #f5f5f5;
+  --bg-blocklist-item-selected-color: #ececec;
+  --bg-progress-color: #f5f5f5;
+  --bg-pagination-color: #fff;
+  --bg-pagination-span-color: #fff;
+  --bg-pagination-hover-color: #eeeeee;
+  --bg-ui-select-hover-color: #f5f5f5;
+  --bg-motd-body-color: #dae3f3;
+  --bg-item-highlighted-color: #d5e8f3;
+  --bg-item-highlighted-null-color: #f5f5f5;
+  --bg-row-header-color: #fff;
+  --bg-image-multiselect-button: linear-gradient(#fff, #f7f7f7);
+  --bg-multiselect-checkbox-color: #fff;
+  --bg-sidebar-wrapper-color: #30426a;
+  --bg-panel-body-color: #fff;
+  --bg-codemirror-color: #fff;
+  --bg-codemirror-selected-color: #c3c3e4;
+
+  --text-main-color: #767676;
+  --text-body-color: #333333;
+  --text-sidebar-title-color: #738bc0;
+  --text-widget-header-color: #767676;
+  --text-form-control-color: #555555;
+  --text-muted-color: #777777;
+  --text-link-color: #337ab7;
+  --text-link-hover-color: #23527c;
+  --text-input-group-addon-color: #555555;
+  --text-btn-default-color: #333;
+  --text-blocklist-hover-color: #2d3e63;
+  --text-dashboard-item-color: #65798e;
+  --text-danger-color: #a94442;
+  --text-code-color: #c7254e;
+  --text-navtabs-color: #555555;
+  --text-form-section-title-color: #777;
   --text-cm-default-color: #219;
   --text-cm-meta-color: #000;
   --text-cm-string-color: #a11;
   --text-cm-number-color: #164;
-  --border-codemirror-cursor-color: #000;
-  --bg-codemirror-color: #fff;
   --text-codemirror-color: #000;
-  --bg-codemirror-gutters-color: #f7f7f7;
-  --border-codemirror-gutters-color: #ddd;
-  --bg-dropdown-menu-color: #fff;
   --text-dropdown-menu-color: #333333;
   --text-log-viewer-color: #000;
-  --bg-log-viewer-color: #fff;
-  --bg-log-line-selected-color: #c5cae9;
-  --border-pre-color: #e9e9e9;
   --text-json-tree-color: #738bc0;
   --text-json-tree-leaf-color: #30426a;
   --text-json-tree-branch-preview-color: #30426a;
-  --bg-pre-color: #f5f5f5;
   --text-pre-color: #333333;
-  --bg-blocklist-item-selected-color: #ececec;
-  --border-blocklist-item-selected-color: #bbbbbb;
   --text-blocklist-item-selected-color: #2d3e63;
-  --bg-progress-color: #f5f5f5;
   --text-progress-bar-color: #4e4e4e;
   --text-pagination-color: #777777;
-  --bg-pagination-color: #fff;
-  --border-pagination-color: #ddd;
-  --bg-pagination-span-color: #fff;
-  --border-pagination-span-color: #ddd;
-  --bg-pagination-hover-color: #eeeeee;
-  --border-pagination-hover-color: #ddd;
   --text-pagination-span-color: #337ab7;
   --text-pagination-span-hover-color: #23527c;
   --text-ui-select-color: #333;
-  --bg-ui-select-hover-color: #f5f5f5;
   --text-ui-select-hover-color: #262626;
-  --bg-motd-body-color: #dae3f3;
   --text-summary-color: #000;
-  --bg-item-highlighted-color: #d5e8f3;
-  --bg-item-highlighted-null-color: #f5f5f5;
-  --bg-row-header-color: #fff;
   --text-multiselect-button-color: #555;
-  --border-multiselect-button-color: #c6c6c6;
-  --bg-image-multiselect-button: linear-gradient(#fff, #f7f7f7);
-  --bg-multiselect-checkbox-color: #fff;
   --text-multiselect-item-color: #444;
-  --border-searchbar-color: #f6f6f6;
   --text-sidebar-list-color: #b2bfdc;
-  --bg-sidebar-wrapper-color: #30426a;
-  --bg-panel-body-color: #fff;
-  --border-boxselector-wrapper: 1px solid #000;
-  --border-boxselector-wrapper-hover: 1px solid #000;
-  --text-boxselector-color: #000;
+
+  --border-color: #d2d1d1;
+  --border-widget-color: #e9e9e9;
+  --border-sidebar-color: #ffffff;
+  --border-form-control-color: #ccc;
+  --border-table-color: #ddd;
+  --border-table-top-color: #ddd;
+  --border-datatable-top-color: #f6f6f6;
+  --border-blocklist-color: #cccccc;
+  --border-input-group-addon-color: #ccc;
+  --border-btn-default-color: #ccc;
+  --border-boxselector-color: #333333;
+  --border-md-checkbox-color: #ddd;
+  --border-modal-header-color: #e5e5e5;
+  --border-navtabs-color: #ddd;
+  --border-form-section-title-color: #777;
+  --border-codemirror-cursor-color: #000;
+  --border-codemirror-gutters-color: #ddd;
+  --border-pre-color: #e9e9e9;
+  --border-blocklist-item-selected-color: #bbbbbb;
+  --border-pagination-color: #ddd;
+  --border-pagination-span-color: #ddd;
+  --border-pagination-hover-color: #ddd;
+  --border-multiselect-button-color: #c6c6c6;
+  --border-searchbar-color: #f6f6f6;
+
+  --hover-sidebar-color: #2d3e63;
+  --shadow-box-color: 0 3px 10px -2px rgba(161, 170, 166, 0.5);
+  --shadow-boxselector-color: 0 3px 10px -2px rgba(161, 170, 166, 0.5);
+  --blue-color: #2361ae;
+  --button-close-color: #000;
+  --button-opacity: 0.2;
+  --button-opacity-hover: 0.5;
+  --bg-boxselector-wrapper-color: #333333;
 }
 /* Overide Vendor CSS */
 .form-control {
@@ -439,6 +448,10 @@ code {
   color: var(--text-codemirror-color);
 }
 
+.CodeMirror-selected {
+  background: var(--bg-codemirror-selected-color) !important;
+}
+
 .CodeMirror-cursor {
   border-left: 1px solid var(--border-codemirror-cursor-color);
 }
diff --git a/app/portainer/components/box-selector/box-selector.css b/app/portainer/components/box-selector/box-selector.css
index 38c506634..d2e529960 100644
--- a/app/portainer/components/box-selector/box-selector.css
+++ b/app/portainer/components/box-selector/box-selector.css
@@ -27,12 +27,12 @@
 
 .boxselector_wrapper input[type='radio']:not(:disabled) ~ label {
   cursor: pointer;
-  border-bottom: var(--border-boxselector-wrapper);
+  background-color: var(--bg-boxselector-wrapper-disabled-color);
+  color: var(--bg-boxselector-wrapper-color);
 }
 
 .boxselector_wrapper input[type='radio']:not(:disabled):hover ~ label:hover {
   cursor: pointer;
-  border-bottom: var(--border-boxselector-wrapper-hover);
 }
 
 .boxselector_wrapper label {
@@ -41,7 +41,6 @@
   display: block;
   background: var(--bg-boxselector-color);
   border: 1px solid var(--border-boxselector-color);
-  color: var(--text-boxselector-color);
   border-radius: 2px;
   padding: 10px 10px 0 10px;
   text-align: center;
diff --git a/app/portainer/views/init/admin/initAdminController.js b/app/portainer/views/init/admin/initAdminController.js
index 31b0c34bc..6a1cfcdc6 100644
--- a/app/portainer/views/init/admin/initAdminController.js
+++ b/app/portainer/views/init/admin/initAdminController.js
@@ -79,7 +79,26 @@ angular.module('portainer.app').controller('InitAdminController', [
         });
     }
 
+<<<<<<< HEAD
     async function uploadBackup() {
+=======
+    async function waitPortainerRestart() {
+      for (let i = 0; i < 10; i++) {
+        await new Promise((resolve) => setTimeout(resolve, 5 * 1000));
+        try {
+          const status = await StatusService.status();
+          if (status && status.Version) {
+            return;
+          }
+        } catch (e) {
+          // pass
+        }
+      }
+      throw 'Timeout to wait for Portainer restarting';
+    }
+
+    $scope.uploadBackup = async function () {
+>>>>>>> dc9de212 (update fixed for po reviews - disable button color)
       $scope.state.backupInProgress = true;
 
       const file = $scope.formValues.BackupFile;
diff --git a/app/portainer/views/main/mainController.js b/app/portainer/views/main/mainController.js
index 00fb4436c..f004e8232 100644
--- a/app/portainer/views/main/mainController.js
+++ b/app/portainer/views/main/mainController.js
@@ -3,7 +3,8 @@ angular.module('portainer.app').controller('MainController', [
   'LocalStorage',
   'StateManager',
   'EndpointProvider',
-  function ($scope, LocalStorage, StateManager, EndpointProvider) {
+  'ThemeManager',
+  function ($scope, LocalStorage, StateManager, EndpointProvider, ThemeManager) {
     /**
      * Sidebar Toggle & Cookie Control
      */
@@ -12,6 +13,11 @@ angular.module('portainer.app').controller('MainController', [
       return window.innerWidth;
     };
 
+    // Portainer Default Theme
+    $scope.theme = 'light';
+
+    ThemeManager.setTheme($scope.theme);
+
     $scope.applicationState = StateManager.getState();
     $scope.endpointState = EndpointProvider.endpoint();