diff --git a/assets/images/completed_done.svg b/assets/images/completed_done.svg
new file mode 100644
index 00000000..759f0cba
--- /dev/null
+++ b/assets/images/completed_done.svg
@@ -0,0 +1,4 @@
+<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M37.8033 16.3567C37.2313 15.7848 36.3039 15.7847 35.7318 16.3568L21.5532 30.5353L14.2681 23.2504C13.6962 22.6784 12.7686 22.6783 12.1966 23.2505C11.6246 23.8226 11.6246 24.75 12.1966 25.3221L20.5174 33.6427C20.8034 33.9287 21.1783 34.0717 21.5531 34.0717C21.928 34.0717 22.3029 33.9287 22.5888 33.6426L37.8033 18.4283C38.3754 17.8563 38.3754 16.9288 37.8033 16.3567Z" fill="#023DFE" fill-opacity="0.7"/>
+<path d="M42.6776 7.32236C37.9558 2.60049 31.6776 0 25 0C18.3223 0 12.0442 2.60049 7.32236 7.32236C2.60039 12.0443 0 18.3224 0 25C0 31.6778 2.60039 37.9559 7.32236 42.6777C12.0441 47.3996 18.3223 50 25 50C31.6777 50 37.9558 47.3996 42.6776 42.6777C47.3995 37.9559 50 31.6778 50 25C50 18.3224 47.3995 12.0443 42.6776 7.32236ZM25 47.0703C12.8304 47.0703 2.92969 37.1696 2.92969 25C2.92969 12.8304 12.8304 2.92969 25 2.92969C37.1696 2.92969 47.0703 12.8304 47.0703 25C47.0703 37.1696 37.1696 47.0703 25 47.0703Z" fill="#023DFE" fill-opacity="0.7"/>
+</svg>
diff --git a/lib/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart b/lib/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart
index 64044b94..0d3a1a92 100644
--- a/lib/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart
@@ -4,6 +4,7 @@ import 'package:syncrow_web/pages/device_managment/curtain_module/bloc/curtain_m
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/calibrate_completed_dialog.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
 
 class AccurteCalibratingDialog extends StatelessWidget {
   final String deviceId;
@@ -17,6 +18,7 @@ class AccurteCalibratingDialog extends StatelessWidget {
   @override
   Widget build(_) {
     return AlertDialog(
+      backgroundColor: ColorsManager.whiteColors,
       contentPadding: EdgeInsets.zero,
       content: AccurateDialogWidget(
         title: 'Calibrating',
diff --git a/lib/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart b/lib/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart
index 997e70cf..7124639d 100644
--- a/lib/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
 
 class AccurateCalibrationDialog extends StatelessWidget {
   final String deviceId;
@@ -15,6 +16,7 @@ class AccurateCalibrationDialog extends StatelessWidget {
   @override
   Widget build(_) {
     return AlertDialog(
+      backgroundColor: ColorsManager.whiteColors,
       contentPadding: EdgeInsets.zero,
       content: AccurateDialogWidget(
         title: 'Accurate Calibration',
diff --git a/lib/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart b/lib/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart
index 433608ac..d13ebca0 100644
--- a/lib/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart
@@ -22,6 +22,7 @@ class AccurateDialogWidget extends StatelessWidget {
       child: Column(
         children: [
           Expanded(
+            flex: 3,
             child: Column(
               children: [
                 Padding(
@@ -43,13 +44,15 @@ class AccurateDialogWidget extends StatelessWidget {
             ),
           ),
           Expanded(
+            flex: 5,
             child: body,
           ),
           Expanded(
+            flex: 2,
             child: Column(
               mainAxisAlignment: MainAxisAlignment.end,
               children: [
-                const Divider(),
+                const Expanded(child: Divider()),
                 Row(
                   children: [
                     Expanded(
diff --git a/lib/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart b/lib/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart
index c322fe9d..fa293ec6 100644
--- a/lib/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart
@@ -28,7 +28,7 @@ class NormalTextBodyForDialog extends StatelessWidget {
                 title,
                 style: const TextStyle(
                   color: ColorsManager.grayColor,
-                  fontSize: 17,
+                  fontSize: 15,
                 ),
               ),
             ),
@@ -42,7 +42,7 @@ class NormalTextBodyForDialog extends StatelessWidget {
                 const Text('1. ',
                     style: TextStyle(
                       color: ColorsManager.grayColor,
-                      fontSize: 17,
+                      fontSize: 15,
                     )),
                 SizedBox(
                   width: 450,
@@ -50,7 +50,7 @@ class NormalTextBodyForDialog extends StatelessWidget {
                     step1,
                     style: const TextStyle(
                       color: ColorsManager.grayColor,
-                      fontSize: 17,
+                      fontSize: 15,
                     ),
                   ),
                 ),
@@ -67,13 +67,13 @@ class NormalTextBodyForDialog extends StatelessWidget {
                 const Text('2. ',
                     style: TextStyle(
                       color: ColorsManager.grayColor,
-                      fontSize: 17,
+                      fontSize: 15,
                     )),
                 Text(
                   step2,
                   style: const TextStyle(
                     color: ColorsManager.grayColor,
-                    fontSize: 17,
+                    fontSize: 15,
                   ),
                 ),
               ],
diff --git a/lib/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart b/lib/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart
index 8514d432..6fc9adf2 100644
--- a/lib/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart
@@ -63,6 +63,7 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
   @override
   Widget build(_) {
     return AlertDialog(
+      backgroundColor: ColorsManager.whiteColors,
       contentPadding: EdgeInsets.zero,
       content: AccurateDialogWidget(
         title: 'Calibrating',
@@ -71,7 +72,7 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
           children: [
             const Expanded(
               child: Align(
-                alignment: Alignment.center,
+                alignment: Alignment.topCenter,
                 child: Padding(
                   padding: EdgeInsets.only(right: 75),
                   child: Text(
@@ -85,17 +86,21 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
               child: Align(
                 alignment: Alignment.center,
                 child: Container(
-                  width: 110,
+                  width: 130,
                   padding: const EdgeInsets.all(5),
                   decoration: BoxDecoration(
-                    color: ColorsManager.whiteColors,
+                    color: ColorsManager.neutralGray.withValues(
+                      alpha: 0.5,
+                    ),
                     borderRadius: BorderRadius.circular(12),
                   ),
                   child: Row(
                     crossAxisAlignment: CrossAxisAlignment.center,
                     children: [
                       Expanded(
-                        child: NumberInputField(controller: _controller),
+                        child: Padding(
+                            padding: const EdgeInsetsGeometry.only(left: 5),
+                            child: NumberInputField(controller: _controller)),
                       ),
                       Expanded(
                         child: Text(
@@ -127,7 +132,7 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
               ),
             const Expanded(
               child: Align(
-                alignment: Alignment.center,
+                alignment: Alignment.bottomCenter,
                 child: Text(
                   '2.click Next to Complete the calibration',
                   style: TextStyle(color: ColorsManager.lightGrayColor),
diff --git a/lib/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart b/lib/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart
index 6c776293..06b386c8 100644
--- a/lib/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart
+++ b/lib/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart';
 import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
 
 class QuickCalibrationDialog extends StatelessWidget {
   final int timControl;
@@ -17,6 +18,7 @@ class QuickCalibrationDialog extends StatelessWidget {
   @override
   Widget build(_) {
     return AlertDialog(
+      backgroundColor: ColorsManager.whiteColors,
       contentPadding: EdgeInsets.zero,
       content: AccurateDialogWidget(
         title: 'Quick Calibration',