Update templates/customer_details.html
Browse files
templates/customer_details.html
CHANGED
@@ -74,19 +74,25 @@
|
|
74 |
font-weight: bold;
|
75 |
cursor: pointer;
|
76 |
text-transform: uppercase;
|
77 |
-
padding:
|
78 |
-
|
|
|
|
|
|
|
|
|
|
|
79 |
}
|
80 |
.change-btn.disabled {
|
81 |
color: #A9A9A9;
|
82 |
cursor: not-allowed;
|
|
|
83 |
}
|
84 |
.update-btn {
|
85 |
width: 100%;
|
86 |
padding: 12px;
|
87 |
-
background-color: #
|
88 |
-
border-color: #
|
89 |
-
color: #
|
90 |
border: 1px solid;
|
91 |
border-radius: 10px;
|
92 |
font-size: 1rem;
|
@@ -95,8 +101,8 @@
|
|
95 |
margin-top: 20px;
|
96 |
}
|
97 |
.update-btn:hover {
|
98 |
-
background-color: #
|
99 |
-
border-color: #
|
100 |
}
|
101 |
|
102 |
/* Media Queries for Smaller Screens */
|
@@ -116,6 +122,10 @@
|
|
116 |
font-size: 0.9rem;
|
117 |
padding: 8px;
|
118 |
}
|
|
|
|
|
|
|
|
|
119 |
.update-btn {
|
120 |
padding: 10px;
|
121 |
font-size: 0.9rem;
|
@@ -128,7 +138,7 @@
|
|
128 |
var field = document.getElementById(fieldId);
|
129 |
var flagField = document.getElementById(flagId);
|
130 |
var changeBtn = $(field).siblings('.change-btn');
|
131 |
-
changeBtn.hide();
|
132 |
if (flagField.value === "false") {
|
133 |
field.removeAttribute("readonly");
|
134 |
field.focus();
|
@@ -139,7 +149,9 @@
|
|
139 |
}
|
140 |
function onFocusNext(inputField) {
|
141 |
var changeBtn = $(inputField).siblings('.change-btn');
|
142 |
-
|
|
|
|
|
143 |
}
|
144 |
function updateProfile(event) {
|
145 |
event.preventDefault();
|
|
|
74 |
font-weight: bold;
|
75 |
cursor: pointer;
|
76 |
text-transform: uppercase;
|
77 |
+
padding: 5px 8px;
|
78 |
+
border-radius: 5px;
|
79 |
+
background-color: rgba(255, 255, 255, 0.8);
|
80 |
+
transition: opacity 0.3s ease;
|
81 |
+
}
|
82 |
+
.change-btn:hover {
|
83 |
+
opacity: 0.8;
|
84 |
}
|
85 |
.change-btn.disabled {
|
86 |
color: #A9A9A9;
|
87 |
cursor: not-allowed;
|
88 |
+
background-color: rgba(255, 255, 255, 0.5);
|
89 |
}
|
90 |
.update-btn {
|
91 |
width: 100%;
|
92 |
padding: 12px;
|
93 |
+
background-color: #8B4513; /* Brown */
|
94 |
+
border-color: #8B4513;
|
95 |
+
color: #FFFFFF; /* White text for contrast */
|
96 |
border: 1px solid;
|
97 |
border-radius: 10px;
|
98 |
font-size: 1rem;
|
|
|
101 |
margin-top: 20px;
|
102 |
}
|
103 |
.update-btn:hover {
|
104 |
+
background-color: #5C2D0C; /* Darker brown */
|
105 |
+
border-color: #5C2D0C;
|
106 |
}
|
107 |
|
108 |
/* Media Queries for Smaller Screens */
|
|
|
122 |
font-size: 0.9rem;
|
123 |
padding: 8px;
|
124 |
}
|
125 |
+
.change-btn {
|
126 |
+
font-size: 0.7rem;
|
127 |
+
padding: 4px 6px;
|
128 |
+
}
|
129 |
.update-btn {
|
130 |
padding: 10px;
|
131 |
font-size: 0.9rem;
|
|
|
138 |
var field = document.getElementById(fieldId);
|
139 |
var flagField = document.getElementById(flagId);
|
140 |
var changeBtn = $(field).siblings('.change-btn');
|
141 |
+
changeBtn.hide(); // Hide CHANGE button when clicked
|
142 |
if (flagField.value === "false") {
|
143 |
field.removeAttribute("readonly");
|
144 |
field.focus();
|
|
|
149 |
}
|
150 |
function onFocusNext(inputField) {
|
151 |
var changeBtn = $(inputField).siblings('.change-btn');
|
152 |
+
if ($(inputField).prop('readonly')) {
|
153 |
+
changeBtn.show(); // Show CHANGE button only if field is readonly
|
154 |
+
}
|
155 |
}
|
156 |
function updateProfile(event) {
|
157 |
event.preventDefault();
|