fix

DevExpress · Nov 22, 2024 · c30a935 · c30a935
1 parent 4d0eb6a
commit c30a935
Show file tree

Hide file tree

Showing 12 changed files with 171 additions and 36 deletions.
diff --git a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.component.css
@@ -1,3 +1,8 @@
+::ng-deep .dx-scheduler-group-header-content,
+::ng-deep .dx-scheduler-date-table-cell {
+  position: relative;
+}
+
 ::ng-deep .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
   color: rgba(0, 0, 0, 0.3) !important;
@@ -27,11 +32,6 @@
   color: rgba(255, 255, 255, 1);
 }
 
-::ng-deep .dx-scheduler-group-header-content,
-::ng-deep .dx-scheduler-date-table-cell {
-  position: relative;
-}
-
 ::ng-deep .dx-scheduler-date-table-cell .dx-template-wrapper {
   position: absolute;
   height: 100%;
@@ -40,11 +40,32 @@
 }
 
 ::ng-deep .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+::ng-deep .avatar[title="John Heart"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
+}
+
+::ng-deep .avatar[title="Sandra Johnson"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
 }
 
 ::ng-deep .name {
@@ -69,14 +90,24 @@
   font-size: 11pt;
   font-weight: normal;
   padding: 25px 20px;
+  color: #707070;
+}
+
+::ng-deep .dx-color-scheme-contrast .info {
+  color: #fff;
 }
 
 ::ng-deep .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+::ng-deep .dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 ::ng-deep .employee-1 {
   background-color: rgba(55, 126, 58, 0.08);
 }

diff --git a/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts b/apps/demos/Demos/Scheduler/Overview/Angular/app/app.service.ts
@@ -28,14 +28,14 @@ const employees: Employee[] = [{
   text: 'John Heart',
   id: 1,
   color: 'rgba(50, 134, 56, 1)',
-  avatar: '../../../../images/gym/coach-man.png',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
   text: 'Sandra Johnson',
   id: 2,
   color: 'rgba(194, 81, 0, 1)',
-  avatar: '../../../../images/gym/coach-woman.png',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];

diff --git a/apps/demos/Demos/Scheduler/Overview/React/data.ts b/apps/demos/Demos/Scheduler/Overview/React/data.ts
@@ -83,14 +83,14 @@ export const employees: Resource[] = [{
   text: 'John Heart',
   id: 1,
   color: 'rgba(50, 134, 56, 1)',
-  avatar: '../../../../images/gym/coach-man.png',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
   text: 'Sandra Johnson',
   id: 2,
   color: 'rgba(194, 81, 0, 1)',
-  avatar: '../../../../images/gym/coach-woman.png',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];
diff --git a/apps/demos/Demos/Scheduler/Overview/React/styles.css b/apps/demos/Demos/Scheduler/Overview/React/styles.css
@@ -1,3 +1,8 @@
+.dx-scheduler-group-header,
+.dx-scheduler-date-table-cell {
+  position: relative;
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
   color: rgba(0, 0, 0, 0.3) !important;
@@ -27,11 +32,6 @@
   color: rgba(255, 255, 255, 1);
 }
 
-.dx-template-wrapper,
-.dx-scheduler-date-table-cell {
-  position: relative;
-}
-
 .dx-scheduler-date-table-cell .dx-template-wrapper {
   position: absolute;
   height: 100%;
@@ -40,11 +40,32 @@
 }
 
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar[title="John Heart"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Sandra Johnson"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
 }
 
 .name {
@@ -77,11 +98,16 @@
 }
 
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
   background-color: rgba(55, 126, 58, 0.08);
 }
@@ -109,3 +135,4 @@
 .training-background-2 {
   background-image: url("../../../../images/gym/icon-fitball.png");
 }
+
diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js b/apps/demos/Demos/Scheduler/Overview/ReactJs/data.js
@@ -83,15 +83,15 @@ export const employees = [
     text: 'John Heart',
     id: 1,
     color: 'rgba(50, 134, 56, 1)',
-    avatar: '../../../../images/gym/coach-man.png',
+    avatar: '../../../../images/employees/19.png',
     age: 27,
     discipline: 'ABS, Fitball, StepFit',
   },
   {
     text: 'Sandra Johnson',
     id: 2,
     color: 'rgba(194, 81, 0, 1)',
-    avatar: '../../../../images/gym/coach-woman.png',
+    avatar: '../../../../images/employees/31.png',
     age: 25,
     discipline: 'ABS, Fitball, StepFit',
   },

diff --git a/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css b/apps/demos/Demos/Scheduler/Overview/ReactJs/styles.css
@@ -1,3 +1,8 @@
+.dx-scheduler-group-header,
+.dx-scheduler-date-table-cell {
+  position: relative;
+}
+
 .dx-scheduler-date-table-other-month.dx-scheduler-date-table-cell {
   opacity: 1;
   color: rgba(0, 0, 0, 0.3) !important;
@@ -27,11 +32,6 @@
   color: rgba(255, 255, 255, 1);
 }
 
-.dx-template-wrapper,
-.dx-scheduler-date-table-cell {
-  position: relative;
-}
-
 .dx-scheduler-date-table-cell .dx-template-wrapper {
   position: absolute;
   height: 100%;
@@ -40,11 +40,32 @@
 }
 
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar[title="John Heart"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Sandra Johnson"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
 }
 
 .name {
@@ -77,11 +98,16 @@
 }
 
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 .employee-1 {
   background-color: rgba(55, 126, 58, 0.08);
 }

diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/App.vue b/apps/demos/Demos/Scheduler/Overview/Vue/App.vue
@@ -82,9 +82,13 @@ const dataSource = data;
 
 .dx-scheduler-date-table-cell .dx-template-wrapper {
   position: absolute;
-  width: 100%;
   height: 100%;
+  width: 100%;
   padding-right: 6px;
 }
 
+.dx-scheduler-appointment {
+  color: rgba(255, 255, 255, 1);
+}
+
 </style>
diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue b/apps/demos/Demos/Scheduler/Overview/Vue/DataCell.vue
@@ -43,6 +43,7 @@ function getCurrentTraining(date, employeeID) {
 </script>
 <style>
 .day-cell {
+  width: 100%;
   height: 100%;
   background-position: center center;
   background-repeat: no-repeat;

diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue b/apps/demos/Demos/Scheduler/Overview/Vue/ResourceCell.vue
@@ -28,11 +28,32 @@ withDefaults(defineProps<{
 </script>
 <style>
 .avatar {
-  width: 155px;
+  width: 124px;
   float: left;
   overflow: hidden;
   position: relative;
-  height: 125px;
+  height: 124px;
+  border: 1px solid rgba(0, 0, 0, 0.24);
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.avatar[title="John Heart"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
+}
+
+.avatar[title="Sandra Johnson"] img {
+  position: relative;
+  width: 126px;
+  height: 130px;
+  object-fit: contain;
+  top: 5px;
+  left: 3px;
 }
 
 .name {

diff --git a/apps/demos/Demos/Scheduler/Overview/Vue/data.ts b/apps/demos/Demos/Scheduler/Overview/Vue/data.ts
@@ -2,14 +2,14 @@ export const employees = [{
   text: 'John Heart',
   id: 1,
   color: 'rgba(50, 134, 56, 1)',
-  avatar: '../../../../images/gym/coach-man.png',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
   text: 'Sandra Johnson',
   id: 2,
   color: 'rgba(194, 81, 0, 1)',
-  avatar: '../../../../images/gym/coach-woman.png',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];

diff --git a/apps/demos/Demos/Scheduler/Overview/jQuery/data.js b/apps/demos/Demos/Scheduler/Overview/jQuery/data.js
@@ -2,14 +2,14 @@ const employees = [{
   text: 'John Heart',
   id: 1,
   color: 'rgba(50, 134, 56, 1)',
-  avatar: '../../../../images/gym/coach-man.png',
+  avatar: '../../../../images/employees/19.png',
   age: 27,
   discipline: 'ABS, Fitball, StepFit',
 }, {
   text: 'Sandra Johnson',
   id: 2,
   color: 'rgba(194, 81, 0, 1)',
-  avatar: '../../../../images/gym/coach-woman.png',
+  avatar: '../../../../images/employees/31.png',
   age: 25,
   discipline: 'ABS, Fitball, StepFit',
 }];