[ADF-3746] Add style lint rules (#3975)

* add stylelint

* fix style first part

*  fix style second part

*  fix style third part

*  fix style fourth part

* Fix e2e tests first part

* Fix e2e tests second part

* Rebase branch

*  fix style third part

*  fix style fourth part

* Fix list error

* fix insights

* fix style abotu component

* Fix e2e tests second part

* Rebase branch

*  fix style third part

*  fix style fourth part

* Fix list error

* Fix e2e tests second part

* Rebase branch

*  fix style third part

*  fix style fourth part

* Fix list error

* [ADF-3746] Rebase branch

* Fix e2e tests second part

* Rebase branch

*  fix style third part

*  fix style fourth part

* Fix list error

* Fix e2e tests second part

* Rebase branch

* Fix list error

* fix new style added

* tslint fix

* [ADF-3746] Fix scss errors on Process Filters Cloud component

demo-shell/src/app/components/search/search-extended.component.html

@@ -4,7 +4,7 @@
             {{'APP_LAYOUT.SEARCH_SERVICE_APPROACH' | translate}}
     </mat-checkbox>
 
-    <div id="container-for-custom-input" class="search-extended-input-containers">
+    <div id="container-for-custom-input" class="adf-search-extended-input-containers">
         <mat-form-field>
             <label>{{'APP_LAYOUT.WORD_TO_SEARCH' | translate}}</label>
             <input type="text" matInput
@@ -14,12 +14,12 @@
     <div>
       <adf-search #auto="searchAutocomplete"
                   [queryBody]="generateQueryBody(searchedWord)"
-                  class="example-card-search-container">
+                  class="adf-example-card-search-container">
           <ng-template let-data>
-            <mat-card class="example-card"
+            <mat-card class="adf-example-card"
                  *ngFor="let item of data?.list?.entries; let idx = index" (click)="onClick(item)">
                 <mat-card-header>
-                    <div mat-card-avatar class="example-header-image"></div>
+                    <div mat-card-avatar class="adf-example-header-image"></div>
                     <mat-card-title>{{ item?.entry.name }}</mat-card-title>
                     <mat-card-subtitle>{{ item?.entry.createdAt }}</mat-card-subtitle>
                 </mat-card-header>
@@ -30,7 +30,7 @@
                     </p>
                 </mat-card-content>
             </mat-card>
-            <mat-card class="example-card" id="search_no_result" *ngIf="data?.list?.entries.length === 0">
+            <mat-card class="adf-example-card" id="search_no_result" *ngIf="data?.list?.entries.length === 0">
                 <p mat-line class="adf-search-fixed-text">{{ 'SEARCH.RESULTS.NONE' | translate:{searchTerm: searchedWord} }}</p>
             </mat-card>
         </ng-template>

demo-shell/src/app/components/search/search-extended.component.scss

@@ -1,50 +1,50 @@
-div.search-results-container {
-    padding: 0 20px 20px 20px;
+div.adf-search-results-container {
+    padding: 0 20px 20px;
 }
 
 .adf-search-title {
     font-size: 22px;
-    padding: 15px 0 15px 0;
+    padding: 15px 0;
 }
 
 @media screen and (max-width: 600px) {
-    :host .col-display-name {
+    :host .adf-col-display-name {
         min-width: 100px;
     }
-    :host .col-modified-at, :host .col-modified-by {
+    :host .adf-col-modified-at, :host .adf-col-modified-by {
         display: none;
     }
-    :host div.search-results-container table {
+    :host div.adf-search-results-container table {
         width: 100%;
     }
 }
 
-.adf-search-results-content{
+.adf-search-results-content {
     display: flex;
 }
 
-.search-extended-input-containers {
+.adf-search-extended-input-containers {
     display: flex;
     flex-direction: row-reverse;
     justify-content: space-evenly;
 }
 
-.search-extended-input-textarea {
+.adf-search-extended-input-textarea {
     width: 300px;
 }
 
-.search-extended-label-error {
+.adf-search-extended-label-error {
     display: flex;
     flex-direction: column;
 }
 
-.example-card {
+.adf-example-card {
     width: 200px;
     flex: 0 20%;
     margin: 15px;
   }
 
-  .example-card-search-container {
+  .adf-example-card-search-container {
     display: flex;
     flex-wrap: wrap;
   }

demo-shell/src/app/components/search/search-result.component.scss

@@ -20,23 +20,23 @@
     }
 }
 
-div.search-results-container {
-    padding: 0 20px 20px 20px;
+div.adf-search-results-container {
+    padding: 0 20px 20px;
 }
 
 .adf-search-title {
     font-size: 22px;
-    padding: 15px 0 15px 0;
+    padding: 15px 0;
 }
 
 @media screen and (max-width: 600px) {
-    :host .col-display-name {
+    :host .adf-col-display-name {
         min-width: 100px;
     }
-    :host .col-modified-at, :host .col-modified-by {
+    :host .adf-col-modified-at, :host .adf-col-modified-by {
         display: none;
     }
-    :host div.search-results-container table {
+    :host div.adf-search-results-container table {
         width: 100%;
     }
 }