Instructor Analytics Design and Functionalities ( Filter Functionality Excluded)

assets/core/scss/components/_table.scss

@@ -7,8 +7,6 @@
   display: block;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
-  border: 1px solid $tutor-border-idle;
-  border-radius: $tutor-radius-lg;
   table {
     min-width: 600px;
   }
@@ -41,7 +39,6 @@
     td {
       padding: $tutor-spacing-5;
       vertical-align: middle;
-      min-width: 180px;
     }
   }
 }

assets/src/js/v3/shared/icons/types.ts

@@ -259,6 +259,7 @@ export const icons = [
   'profile',
   'profileCircle',
   'profileCircleFill',
+  'progress',
   'psd',
   'publish',
   'qa',
@@ -285,6 +286,7 @@ export const icons = [
   'reload',
   'reload2',
   'reload3',
+  'reload4',
   'removeImage',
   'report',
   'resources',
@@ -320,6 +322,7 @@ export const icons = [
   'spreadsheet',
   'star',
   'star2',
+  'starLine',
   'stepper',
   'stopwatch',
   'storeEye',
@@ -360,10 +363,12 @@ export const icons = [
   'videoQuality',
   'vimeo',
   'visited',
+  'wallet',
   'warning',
   'weightBox',
   'wifi',
   'wishlist',
+  'withdraw',
   'x',
   'xls',
   'xml',

assets/src/scss/frontend/dashboard/_profile.scss

@@ -21,7 +21,7 @@
     border: 1px solid $tutor-border-idle;
     border-radius: $tutor-radius-2xl;
     padding: $tutor-spacing-6;
-    margin-top: $tutor-spacing-9;
+    margin-top: $tutor-spacing-6;
 
     @include tutor-breakpoint-down(sm) {
       margin-top: $tutor-spacing-5;

assets/src/scss/frontend/dashboard/_stat-card.scss

@@ -92,6 +92,97 @@
     }
   }
 
+	&-time-spent {
+		.tutor-stat-card-icon {
+			color: $tutor-text-exception4;
+		}
+
+		.tutor-stat-card-value {
+			color: $tutor-text-exception4;
+		}
+	}
+
+	&-courses {
+    .tutor-stat-card-icon {
+        color: $tutor-text-success;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-text-success;
+		}
+	}
+
+
+	&-students {
+    .tutor-stat-card-icon {
+        color: $tutor-text-brand;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-text-brand;
+		}
+	}
+
+	&-reviews {
+    .tutor-stat-card-icon {
+        color: $tutor-warning-400;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-warning-400;
+		}
+	}
+
+	&-passed {
+    .tutor-stat-card-icon {
+        color: $tutor-text-brand;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-text-brand;
+		}
+	}
+
+	&-progress {
+    .tutor-stat-card-icon {
+        color: $tutor-exception-5;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-exception-5;
+		}
+	}
+
+	&-completed {
+    .tutor-stat-card-icon {
+        color: $tutor-text-success;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-text-success;
+		}
+	}
+
+	&-qa {
+    .tutor-stat-card-icon {
+        color: $tutor-exception-2;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-exception-2;
+		}
+	}
+
+	&-book-2 {
+    .tutor-stat-card-icon {
+        color: $tutor-exception-1;
+    }
+
+		.tutor-stat-card-value {
+			color: $tutor-exception-1;
+		}
+	}
+
   &-exception1 {
     .tutor-stat-card-icon {
       color: $tutor-exception-1;
@@ -132,4 +223,64 @@
       color: $tutor-text-exception5;
     }
   }
+
+  &-earning {
+    .tutor-stat-card-icon {
+      color: $tutor-text-success;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-success;
+    }
+  }
+
+  &-wallet {
+    .tutor-stat-card-icon {
+      color: $tutor-text-brand;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-brand;
+    }
+  }
+
+  &-withdraw {
+    .tutor-stat-card-icon {
+      color: $tutor-text-exception5;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-exception5;
+    }
+  }
+
+  &-sale {
+    .tutor-stat-card-icon {
+      color: $tutor-text-exception1;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-exception1;
+    }
+  }
+
+  &-commission {
+    .tutor-stat-card-icon {
+      color: $tutor-text-exception2;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-exception2;
+    }
+  }
+
+  &-fees {
+    .tutor-stat-card-icon {
+      color: $tutor-text-exception4;
+    }
+
+    .tutor-stat-card-value {
+      color: $tutor-text-exception4;
+    }
+  }
 }

classes/Icon.php

@@ -91,6 +91,7 @@ final class Icon {
 	const CODING                     = 'coding';
 	const COLLAPSED                  = 'collapsed';
 	const COLOR_OPTION               = 'color-option';
+	const COMMISSION                 = 'commission';
 	const COMMAND                    = 'command';
 	const COMMENTS                   = 'comments';
 	const COMPLETED                  = 'completed';
@@ -158,6 +159,7 @@ final class Icon {
 	const EYE                        = 'eye';
 	const EYE_LINE                   = 'eye-line';
 	const FACEBOOK                   = 'facebook';
+	const FEES                       = 'fees';
 	const FEATHER                    = 'feather';
 	const FILE                       = 'file';
 	const FILE_ATTACHEMENT           = 'file-attachement';
@@ -275,6 +277,7 @@ final class Icon {
 	const PROFILE                    = 'profile';
 	const PROFILE_CIRCLE             = 'profile-circle';
 	const PROFILE_CIRCLE_FILL        = 'profile-circle-fill';
+	const PROGRESS                   = 'progress';
 	const PSD                        = 'psd';
 	const PUBLISH                    = 'publish';
 	const QA                         = 'qa';
@@ -301,11 +304,13 @@ final class Icon {
 	const RELOAD                     = 'reload';
 	const RELOAD_2                   = 'reload-2';
 	const RELOAD_3                   = 'reload-3';
+	const RELOAD_4                   = 'reload-4';
 	const REMOVE_IMAGE               = 'remove-image';
 	const REPORT                     = 'report';
 	const RESOURCES                  = 'resources';
 	const ROTATE                     = 'rotate';
 	const RTF                        = 'rtf';
+	const SALE                       = 'sale';
 	const SALE_TYPE                  = 'sale-type';
 	const SAVE                       = 'save';
 	const SEARCH                     = 'search';
@@ -336,6 +341,7 @@ final class Icon {
 	const SPREADSHEET                = 'spreadsheet';
 	const STAR                       = 'star';
 	const STAR_2                     = 'star-2';
+	const STAR_LINE                  = 'star-line';
 	const STEPPER                    = 'stepper';
 	const STOPWATCH                  = 'stopwatch';
 	const STORE_EYE                  = 'store-eye';
@@ -376,10 +382,12 @@ final class Icon {
 	const VIDEO_QUALITY              = 'video-quality';
 	const VIMEO                      = 'vimeo';
 	const VISITED                    = 'visited';
+	const WALLET                     = 'wallet';
 	const WARNING                    = 'warning';
 	const WEIGHT_BOX                 = 'weight-box';
 	const WIFI                       = 'wifi';
 	const WISHLIST                   = 'wishlist';
+	const WITHDRAW                   = 'withdraw';
 	const X                          = 'x';
 	const XLS                        = 'xls';
 	const XML                        = 'xml';