Refactoring css style

ui-ngx/src/app/shared/components/markdown-editor.component.html

@@ -21,11 +21,11 @@
     <label class="tb-title no-padding" [ngClass]="{'tb-error': !disabled && required && !markdownValue, 'tb-required': !disabled && required}">{{ label }}</label>
     <span fxFlex></span>
     <button [fxShow]="!editorMode"
-            class="edit-toggle"
+            class="panel-button"
             type="button"
             mat-button (click)="toggleEditMode()">{{ 'markdown.edit' | translate }}</button>
     <button [fxShow]="editorMode"
-            class="edit-toggle"
+            class="panel-button"
             type="button"
             mat-button (click)="toggleEditMode()">{{ 'markdown.preview' | translate }}</button>
     <div *ngIf = "helpId" [tb-help-popup]="helpId"></div>
@@ -34,7 +34,7 @@
            matTooltipPosition="above"
            style="border-radius: 50%"
            (click)="fullscreen = !fullscreen">
-        <button type='button' mat-button mat-icon-button class="tb-mat-32">
+        <button type='button' mat-button mat-icon-button class="tb-mat-32 panel-button">
           <mat-icon class="material-icons">{{ fullscreen ? 'fullscreen_exit' : 'fullscreen' }}</mat-icon>
         </button>
       </div>

ui-ngx/src/app/shared/components/markdown-editor.component.scss

@@ -58,17 +58,7 @@
     overflow: auto;
     height: 100%;
   }
-  button.edit-toggle {
-    min-width: 32px;
-    min-height: 15px;
-    padding: 4px;
-    margin-right: 4px;
-    font-size: .8rem;
-    line-height: 15px;
-    color: #7b7b7b;
-    background: rgba(220, 220, 220, .35);
-  }
-  button.mat-button, button.mat-icon-button, button.mat-icon-button.tb-mat-32 {
+  button.panel-button {
     background: rgba(220, 220, 220, .35);
     align-items: center;
     vertical-align: middle;
@@ -77,8 +67,6 @@
     padding: 4px;
     font-size: .8rem;
     line-height: 15px;
-    &:not(.tb-help-popup-button) {
-      color: #7b7b7b;
-    }
+    color: #7b7b7b;
   }
 }