[ADF-1434] Theming ADF component (#2228)

* start custom theming adf

* demo shell cleaning

* login mdl cleaning

* uploader mdl cleaning

* prebuilt themes

* theme picker in demo shell

* clean custom colors and mdl

* fix rebase errors

* theming from color style guide

* dev default theme orange purple

* fix color accent inverted in picker

* fix test and add colors classes

* fix tag component theming issues

* fix datatable theming

* add theming guides

ng2-components/ng2-alfresco-search/src/components/search-autocomplete.component.html

@@ -20,6 +20,7 @@
     </tr>
     </tbody>
 </table>
+
 <table id="search_no_result" data-automation-id="search_no_result_found" *ngIf="results && results.length === 0"
        class="mdl-data-table mdl-js-data-table mdl-shadow--2dp full-width">
     <tbody>
@@ -30,6 +31,7 @@
     </tr>
     </tbody>
 </table>
+
 <table data-automation-id="autocomplete_error_message" *ngIf="errorMessage"
        class="mdl-data-table mdl-js-data-table mdl-shadow--2dp full-width">
     <tbody>

ng2-components/ng2-alfresco-search/src/components/search-autocomplete.component.ts

@@ -23,7 +23,7 @@ import { ThumbnailService } from 'ng2-alfresco-core';
 @Component({
     selector: 'adf-search-autocomplete, alfresco-search-autocomplete',
     templateUrl: './search-autocomplete.component.html',
-    styleUrls: ['./search-autocomplete.component.css']
+    styleUrls: ['./search-autocomplete.component.scss']
 })
 export class SearchAutocompleteComponent implements OnChanges {
 

ng2-components/ng2-alfresco-search/src/components/search-control.component.ts

@@ -24,7 +24,7 @@ import { SearchAutocompleteComponent } from './search-autocomplete.component';
 @Component({
     selector: 'adf-search-control, alfresco-search-control',
     templateUrl: './search-control.component.html',
-    styleUrls: ['./search-control.component.css']
+    styleUrls: ['./search-control.component.scss']
 })
 export class SearchControlComponent implements OnInit, OnDestroy {
 

ng2-components/ng2-alfresco-search/src/components/search.component.scss

@@ -13,6 +13,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
 }
+
 .no-result-message {
     height: 32px;
     opacity: 0.26;

ng2-components/ng2-alfresco-search/src/components/search.component.ts

@@ -23,7 +23,7 @@ import { PermissionModel } from 'ng2-alfresco-documentlist';
 
 @Component({
     selector: 'adf-search, alfresco-search',
-    styleUrls: ['./search.component.css'],
+    styleUrls: ['./search.component.scss'],
     templateUrl: './search.component.html'
 })
 export class SearchComponent implements OnChanges, OnInit {