refactor: enhance dark mode support across components and improve user role handling in DetailProfile

This commit is contained in:
hamed
2025-11-19 12:22:14 +03:30
parent 18b03ca781
commit 95e55776c3
6 changed files with 103 additions and 40 deletions
+43 -32
View File
@@ -213,13 +213,11 @@ html {
}
.cover-head-blogs {
background: linear-gradient(
180deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.07) 31.47%,
rgba(0, 0, 0, 0.31) 59.72%,
rgba(0, 0, 0, 0.7) 89.39%
);
background: linear-gradient(180deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.07) 31.47%,
rgba(0, 0, 0, 0.31) 59.72%,
rgba(0, 0, 0, 0.7) 89.39%);
border-radius: 16px;
position: relative;
overflow: hidden;
@@ -595,6 +593,7 @@ html {
}
@media (max-width: 1024px) {
.day-label-bar-inner-rtl,
.panel-jalaali,
.panel-header-rtl,
@@ -628,15 +627,13 @@ html {
border-color: #343645 !important;
}
.dark
.MuiList-root.MuiList-padding.MuiMultiSectionDigitalClockSection-root::-webkit-scrollbar-track {
.dark .MuiList-root.MuiList-padding.MuiMultiSectionDigitalClockSection-root::-webkit-scrollbar-track {
background: #1f1d2b;
height: 50px;
border-radius: 10px;
}
.dark
.MuiList-root.MuiList-padding.MuiMultiSectionDigitalClockSection-root::-webkit-scrollbar-thumb {
.dark .MuiList-root.MuiList-padding.MuiMultiSectionDigitalClockSection-root::-webkit-scrollbar-thumb {
background: #222433;
height: 50px;
border-radius: 20px;
@@ -800,6 +797,33 @@ html {
transition: 0.5s ease-in !important;
}
.dark .jalali-dashboard .panel-elevation,
.dark .jalali-dashboard .panel-header-rtl,
.dark .jalali-dashboard .day-label-bar-inner-rtl,
.dark .jalali-dashboard .days-body {
background: transparent !important;
}
.dark .jalali-dashboard .day-label-item {
color: #A1A1A1 !important;
}
.dark .jalali-dashboard .days-body .day:not(.weekend-day) span {
color: #A1A1A1 !important;
}
.dark .jalali-dashboard .days-body .day.today:not(.weekend-day) {
background: #5559CE !important;
}
.dark .jalali-dashboard .days-body .day.today:not(.weekend-day) span {
color: #fafafa !important;
}
.dark .jalali-dashboard .days-body .day.weekend-day span {
color: #FF5450 !important;
}
/* Toastify */
.Toastify__toast {
@@ -892,26 +916,10 @@ html {
/* date picker appointment */
.datePickerApt
.first
.panel-header-wrapper
.center:first-child
.iconItem:first-child,
.datePickerApt
.first
.panel-header-wrapper
.center:last-child
.iconItem:last-child,
.datePickerApt
.second
.panel-header-wrapper
.center:first-child
.iconItem:first-child,
.datePickerApt
.second
.panel-header-wrapper
.center:last-child
.iconItem:last-child {
.datePickerApt .first .panel-header-wrapper .center:first-child .iconItem:first-child,
.datePickerApt .first .panel-header-wrapper .center:last-child .iconItem:last-child,
.datePickerApt .second .panel-header-wrapper .center:first-child .iconItem:first-child,
.datePickerApt .second .panel-header-wrapper .center:last-child .iconItem:last-child {
display: none;
}
@@ -921,6 +929,7 @@ html {
}
@media (min-width: 768px) {
.datePickerApt #nextIconF,
.datePickerApt #prevIconS {
display: none;
@@ -928,6 +937,7 @@ html {
}
@media (min-width: 1024px) {
.datePickerApt #nextIconF,
.datePickerApt #prevIconS {
display: flex;
@@ -935,6 +945,7 @@ html {
}
@media (min-width: 1280px) {
.datePickerApt #nextIconF,
.datePickerApt #prevIconS {
display: none;
@@ -945,4 +956,4 @@ html {
.hover-item-clinic:hover h3 {
color: #f17732;
}
}