css

js/apps/system/_admin/aardvark/APP/clusterFrontend/build/style.css

@@ -4600,6 +4600,13 @@ div.dropdownInner {
     div.dropdownInner ul label {
       color: #000;
       padding-left: 35px; }
+  div.dropdownInner ul li .fa {
+    margin-right: 5px;
+    color: #8c8a89; }
+    div.dropdownInner ul li .fa.fa-square-0 {
+      margin-left: 1px; }
+    div.dropdownInner ul li .fa.fa-check-square-o, div.dropdownInner ul li .fa.fa-check-circle-o {
+      color: #8aa051; }
 
 div.queryline {
   color: #000;
@@ -4866,7 +4873,33 @@ div.headerBar > div.headerButtonBar {
   font-size: 14px;
   font-weight: 300; }
   .modal-body .select2-choices {
-    border-radius: 3px; }
+    border-radius: 3px;
+    border: 1px solid #aaa;
+    box-shadow: none;
+    -webkit-box-shadow: none;
+    background-image: none !important; }
+    .modal-body .select2-choices input {
+      box-shadow: none;
+      -webkit-box-shadow: none;
+      outline: transparent !important; }
+    .modal-body .select2-choices input:active {
+      box-shadow: none;
+      -webkit-box-shadow: none;
+      outline: none !important; }
+    .modal-body .select2-choices .select2-search-choice {
+      margin: 5px 0 3px 5px !important; }
+    .modal-body .select2-choices li {
+      color: #000;
+      background-color: #fff !important;
+      background-image: none !important; }
+      .modal-body .select2-choices li a {
+        margin-top: -1px;
+        margin-left: 1px; }
+  .modal-body .select2-choices:active {
+    outline: transparent !important;
+    border: 1px solid #aaa;
+    box-shadow: none !important;
+    -webkit-box-shadow: none !important; }
   .modal-body .nav-tabs {
     margin-top: 15px; }
   .modal-body input, .modal-body select, .modal-body textarea {
@@ -5410,8 +5443,8 @@ div .bigtile {
     padding-top: 5px; }
     .dashboard-small-chart .dashboard-small-chart-inner .dashboard-interior-chart .nv-bar rect {
       fill-opacity: .15;
-      stroke-opacity: 1;
+      stroke-opacity: 0.8;
-      stroke-width: 1px; }
+      stroke-width: 0.5px; }
 
 .dashboard-medium-chart-outer {
   border: 1px solid rgba(104, 103, 102, 0.1);
@@ -5496,8 +5529,8 @@ div .bigtile {
         text-align: right; }
     .dashboard-bar-chart-container .dashboard-bar-chart .dashboard-bar-chart-chart .nv-bar rect {
       fill-opacity: .15;
-      stroke-opacity: 1;
+      stroke-opacity: .8;
-      stroke-width: 1px; }
+      stroke-width: 0.5px; }
 
 .dashboard-legend .dashboard-legend-inner {
   padding: 0 5px 5px 0; }

js/apps/system/_admin/aardvark/APP/frontend/js/templates/collectionsView.ejs

@@ -30,23 +30,28 @@
         <li><a>
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox checkSystemCollections" type="checkbox">
-            <label class="css-label"></label>System
+            <i class="fa"></i>
+            System
           </label>
         </a></li>
 
         <li><a>
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="checkDocument">
-            <label class="css-label" id="checkDocument"></label>Document
+            <i class="fa"></i>
+            Document
           </label>
         </a></li>
 
         <li><a>
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="checkEdge">
-            <label class="css-label" id="checkEdge"></label>Edge
+            <i class="fa"></i>
+            Edge
           </label>
         </a></li>
+
+        </li>
       </ul>
 
       <ul>
@@ -55,14 +60,16 @@
         <li><a href="#">
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="checkLoaded">
-            <label class="css-label"></label>Loaded
+            <i class="fa"></i>
+            Loaded
           </label>
         </a></li>
 
         <li><a href="#">
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="checkUnloaded">
-            <label class="css-label"></label>Unloaded
+            <i class="fa"></i>
+            Unloaded
           </label>
         </a></li>
 
@@ -73,21 +80,24 @@
         <li><a href="#">
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="sortName">
-            <label class="css-label css-label-round"></label>Sort by name
+            <i class="fa css-round-label"></i>
+            Sort by name
           </label>
         </a></li>
 
         <li><a href="#">
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="sortType">
-            <label class="css-label css-label-round"></label>Sort by type
+            <i class="fa css-round-label"></i>
+            Sort by type
           </label>
         </a></li>
 
         <li><a href="#">
           <label class="checkbox checkboxLabel">
             <input class="css-checkbox" type="checkbox" id="sortOrder">
-            <label class="css-label"></label>Sort descending
+            <i class="fa"></i>
+            Sort descending
           </label>
         </a></li>
       </ul>

js/apps/system/_admin/aardvark/APP/frontend/js/views/collectionsView.js

@@ -47,6 +47,7 @@
       }
 
       var length;
+      this.setCheckboxStatus("#collectionsDropdown");
 
       try {
         length = searchOptions.searchPhrase.length;
@@ -57,11 +58,35 @@
       $('#searchInput').focus();
       $('#searchInput')[0].setSelectionRange(length, length);
 
+
       arangoHelper.fixTooltips(".icon_arangodb, .arangoicon", "left");
 
       return this;
     },
 
+    setCheckboxStatus: function(id) {
+      $.each($(id).find('ul').find('li'), function(key, element) {
+         if (!$(element).hasClass("nav-header")) {
+           if ($(element).find('input').attr('checked')) {
+             if ($(element).find('i').hasClass('css-round-label')) {
+               $(element).find('i').addClass('fa-dot-circle-o');
+             }
+             else {
+               $(element).find('i').addClass('fa-check-circle-o');
+             }
+           }
+           else {
+             if ($(element).find('i').hasClass('css-round-label')) {
+               $(element).find('i').addClass('fa-circle-o');
+             }
+             else {
+               $(element).find('i').addClass('fa-circle-o');
+             }
+           }
+         }
+      });
+    },
+
     events: {
       "click #createCollection"        : "createCollection",
       "keydown #searchInput"           : "restrictToSearchPhraseKey",
@@ -98,6 +123,7 @@
       //chrome bugfix
       var clicked = e.currentTarget.id;
       $('#'+clicked).click();
+      console.log(e);
     },
 
     checkSystem: function () {

js/apps/system/_admin/aardvark/APP/frontend/scss/_dropdowns.scss

@@ -68,6 +68,24 @@ div.dropdownInner {
     }
   }
 
+  ul {
+    li {
+      .fa {
+        margin-right: 5px;
+        color: #8c8a89;
+
+        &.fa-square-0 {
+          margin-left: 1px;
+        }
+
+        &.fa-check-square-o,
+        &.fa-check-circle-o {
+          color: $c-positive;
+        }
+      }
+    }
+  }
+
 }
 
 div.queryline {