povxtv commited on
Commit
88d2772
·
verified ·
1 Parent(s): 4e09f84

make some edits by add questionnaire asking questions about what the customer goals and reason to wanting to improve there credit report to make them feel more engaged to the get started page

Browse files
Files changed (1) hide show
  1. getstarted.html +103 -67
getstarted.html CHANGED
@@ -53,104 +53,134 @@
53
  <p class="text-gray-600">Complete this simple form to begin your AI-powered credit repair journey</p>
54
  </div>
55
  <form class="space-y-6">
56
- <div>
57
- <label for="full-name" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label>
58
- <input type="text" id="full-name" name="full-name" required
59
- class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
60
- </div>
61
-
62
- <div>
63
- <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email Address</label>
64
- <input type="email" id="email" name="email" required
65
- class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
66
- </div>
67
-
68
- <div>
69
- <label for="phone" class="block text-sm font-medium text-gray-700 mb-1">Phone Number</label>
70
- <input type="tel" id="phone" name="phone"
71
- class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
 
 
 
72
  </div>
73
 
74
- <!-- Goals Questionnaire -->
75
- <div class="pt-4 border-t border-gray-200">
76
- <h3 class="text-lg font-medium text-gray-900 mb-4">Help us understand your credit goals</h3>
77
-
78
- <div class="mb-4">
79
- <label class="block text-sm font-medium text-gray-700 mb-2">What's your primary reason for improving your credit?</label>
80
  <div class="space-y-2">
81
  <label class="flex items-center">
82
- <input type="radio" name="goal" value="home" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
83
- <span class="ml-3 text-sm text-gray-700">Buying a home</span>
84
  </label>
85
  <label class="flex items-center">
86
- <input type="radio" name="goal" value="car" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
87
- <span class="ml-3 text-sm text-gray-700">Getting a car loan</span>
88
  </label>
89
  <label class="flex items-center">
90
- <input type="radio" name="goal" value="credit-cards" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
91
- <span class="ml-3 text-sm text-gray-700">Lower interest credit cards</span>
92
  </label>
93
  <label class="flex items-center">
94
- <input type="radio" name="goal" value="other" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
95
- <span class="ml-3 text-sm text-gray-700">Other financial goals</span>
 
 
 
 
 
 
 
 
 
96
  </label>
97
  </div>
98
  </div>
99
 
100
- <div class="mb-4">
101
- <label class="block text-sm font-medium text-gray-700 mb-2">What credit issues are you most concerned about?</label>
102
  <div class="space-y-2">
103
  <label class="flex items-center">
104
- <input type="checkbox" name="issues" value="collections" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
105
- <span class="ml-3 text-sm text-gray-700">Collections accounts</span>
106
  </label>
107
  <label class="flex items-center">
108
- <input type="checkbox" name="issues" value="late-payments" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
109
- <span class="ml-3 text-sm text-gray-700">Late payments</span>
110
  </label>
111
  <label class="flex items-center">
112
- <input type="checkbox" name="issues" value="errors" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
113
- <span class="ml-3 text-sm text-gray-700">Report errors</span>
114
  </label>
115
  <label class="flex items-center">
116
- <input type="checkbox" name="issues" value="identity-theft" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500">
117
- <span class="ml-3 text-sm text-gray-700">Identity theft issues</span>
 
 
 
 
118
  </label>
119
  </div>
120
  </div>
 
121
 
 
 
122
  <div>
123
- <label for="timeline" class="block text-sm font-medium text-gray-700 mb-2">When do you need to see credit improvements?</label>
124
- <select id="timeline" name="timeline" class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
125
- <option value="1-month">Within 1 month</option>
126
- <option value="3-months">Within 3 months</option>
127
- <option value="6-months">Within 6 months</option>
128
- <option value="1-year">Within 1 year</option>
129
- <option value="no-rush">No specific timeline</option>
130
- </select>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
131
  </div>
132
  </div>
133
- <div class="pt-4">
134
- <div class="flex items-center justify-between">
135
- <button type="button" onclick="window.history.back()"
136
- class="text-indigo-600 hover:text-indigo-700 font-medium">
137
- <i data-feather="arrow-left" class="mr-1 w-4 h-4 inline"></i> Back
138
- </button>
139
- <button type="submit"
140
- class="bg-indigo-600 text-white py-3 px-6 rounded-md font-medium hover:bg-indigo-700 transition-all">
141
- Continue to Payment ($99)
142
- </button>
143
- </div>
144
- </div>
145
- <div class="text-center text-sm text-gray-500 mt-6">
146
  <p>By continuing, you agree to our <a href="#" class="text-indigo-600 hover:text-indigo-700">Terms of Service</a>
147
  and <a href="#" class="text-indigo-600 hover:text-indigo-700">Privacy Policy</a></p>
148
- <div class="mt-2 flex items-center justify-center">
149
- <i data-feather="lock" class="text-indigo-500 mr-1 w-4 h-4"></i>
150
- <span class="text-xs text-gray-500">Your information is 100% secure</span>
151
- </div>
152
  </div>
153
- </form>
154
  </div>
155
  </div>
156
  </div>
@@ -175,10 +205,16 @@
175
  </div>
176
  </div>
177
  </footer>
178
-
179
  <script>
180
  // Initialize feather icons
181
  feather.replace();
 
 
 
 
 
 
 
182
  </script>
183
  </body>
184
  </html>
 
53
  <p class="text-gray-600">Complete this simple form to begin your AI-powered credit repair journey</p>
54
  </div>
55
  <form class="space-y-6">
56
+ <div class="space-y-4">
57
+ <h3 class="text-lg font-medium text-gray-900 border-b pb-2">Personal Information</h3>
58
+ <div>
59
+ <label for="full-name" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label>
60
+ <input type="text" id="full-name" name="full-name" required
61
+ class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
62
+ </div>
63
+
64
+ <div>
65
+ <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email Address</label>
66
+ <input type="email" id="email" name="email" required
67
+ class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
68
+ </div>
69
+
70
+ <div>
71
+ <label for="phone" class="block text-sm font-medium text-gray-700 mb-1">Phone Number</label>
72
+ <input type="tel" id="phone" name="phone"
73
+ class="w-full px-4 py-3 rounded-md border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500">
74
+ </div>
75
  </div>
76
 
77
+ <div class="space-y-4">
78
+ <h3 class="text-lg font-medium text-gray-900 border-b pb-2">Your Credit Goals</h3>
79
+ <div>
80
+ <label class="block text-sm font-medium text-gray-700 mb-2">What's your main reason for wanting to improve your credit? (Select all that apply)</label>
 
 
81
  <div class="space-y-2">
82
  <label class="flex items-center">
83
+ <input type="checkbox" name="goals" value="home" class="rounded text-indigo-600 focus:ring-indigo-500">
84
+ <span class="ml-2 text-gray-700">Buying a home</span>
85
  </label>
86
  <label class="flex items-center">
87
+ <input type="checkbox" name="goals" value="car" class="rounded text-indigo-600 focus:ring-indigo-500">
88
+ <span class="ml-2 text-gray-700">Getting a car loan</span>
89
  </label>
90
  <label class="flex items-center">
91
+ <input type="checkbox" name="goals" value="credit-card" class="rounded text-indigo-600 focus:ring-indigo-500">
92
+ <span class="ml-2 text-gray-700">Lower credit card interest rates</span>
93
  </label>
94
  <label class="flex items-center">
95
+ <input type="checkbox" name="goals" value="rental" class="rounded text-indigo-600 focus:ring-indigo-500">
96
+ <span class="ml-2 text-gray-700">Renting an apartment</span>
97
+ </label>
98
+ <label class="flex items-center">
99
+ <input type="checkbox" name="goals" value="employment" class="rounded text-indigo-600 focus:ring-indigo-500">
100
+ <span class="ml-2 text-gray-700">Employment opportunities</span>
101
+ </label>
102
+ <label class="flex items-center">
103
+ <input type="checkbox" name="goals" value="other" class="rounded text-indigo-600 focus:ring-indigo-500">
104
+ <span class="ml-2 text-gray-700">Other (please specify)</span>
105
+ <input type="text" name="other-goal" class="ml-2 px-2 py-1 border rounded hidden" id="other-goal-input">
106
  </label>
107
  </div>
108
  </div>
109
 
110
+ <div>
111
+ <label class="block text-sm font-medium text-gray-700 mb-2">Which best describes your current credit situation?</label>
112
  <div class="space-y-2">
113
  <label class="flex items-center">
114
+ <input type="radio" name="credit-situation" value="excellent" class="text-indigo-600 focus:ring-indigo-500">
115
+ <span class="ml-2 text-gray-700">Excellent (720+ score), just want to optimize</span>
116
  </label>
117
  <label class="flex items-center">
118
+ <input type="radio" name="credit-situation" value="good" class="text-indigo-600 focus:ring-indigo-500">
119
+ <span class="ml-2 text-gray-700">Good (680-719), looking to improve</span>
120
  </label>
121
  <label class="flex items-center">
122
+ <input type="radio" name="credit-situation" value="fair" class="text-indigo-600 focus:ring-indigo-500">
123
+ <span class="ml-2 text-gray-700">Fair (620-679), need significant improvement</span>
124
  </label>
125
  <label class="flex items-center">
126
+ <input type="radio" name="credit-situation" value="poor" class="text-indigo-600 focus:ring-indigo-500">
127
+ <span class="ml-2 text-gray-700">Poor (below 620), urgent need to rebuild</span>
128
+ </label>
129
+ <label class="flex items-center">
130
+ <input type="radio" name="credit-situation" value="unknown" class="text-indigo-600 focus:ring-indigo-500">
131
+ <span class="ml-2 text-gray-700">I don't know my credit score</span>
132
  </label>
133
  </div>
134
  </div>
135
+ </div>
136
 
137
+ <div class="space-y-4">
138
+ <h3 class="text-lg font-medium text-gray-900 border-b pb-2">Credit Concerns</h3>
139
  <div>
140
+ <label class="block text-sm font-medium text-gray-700 mb-2">What specific issues would you like our AI to review? (Select all that apply)</label>
141
+ <div class="space-y-2">
142
+ <label class="flex items-center">
143
+ <input type="checkbox" name="issues" value="collections" class="rounded text-indigo-600 focus:ring-indigo-500">
144
+ <span class="ml-2 text-gray-700">Collections accounts</span>
145
+ </label>
146
+ <label class="flex items-center">
147
+ <input type="checkbox" name="issues" value="late-payments" class="rounded text-indigo-600 focus:ring-indigo-500">
148
+ <span class="ml-2 text-gray-700">Late payments</span>
149
+ </label>
150
+ <label class="flex items-center">
151
+ <input type="checkbox" name="issues" value="bankruptcies" class="rounded text-indigo-600 focus:ring-indigo-500">
152
+ <span class="ml-2 text-gray-700">Bankruptcies</span>
153
+ </label>
154
+ <label class="flex items-center">
155
+ <input type="checkbox" name="issues" value="inquiries" class="rounded text-indigo-600 focus:ring-indigo-500">
156
+ <span class="ml-2 text-gray-700">Unauthorized inquiries</span>
157
+ </label>
158
+ <label class="flex items-center">
159
+ <input type="checkbox" name="issues" value="personal-info" class="rounded text-indigo-600 focus:ring-indigo-500">
160
+ <span class="ml-2 text-gray-700">Incorrect personal information</span>
161
+ </label>
162
+ <label class="flex items-center">
163
+ <input type="checkbox" name="issues" value="all" class="rounded text-indigo-600 focus:ring-indigo-500">
164
+ <span class="ml-2 text-gray-700">Review everything possible</span>
165
+ </label>
166
+ </div>
167
  </div>
168
  </div>
169
+ <div class="pt-2">
170
+ <button type="submit"
171
+ class="w-full bg-indigo-600 text-white py-3 px-4 rounded-md font-medium hover:bg-indigo-700 transition-all">
172
+ Continue to Payment ($99)
173
+ </button>
174
+ </div>
175
+
176
+ <div class="text-center">
177
+ <p class="text-sm text-gray-500">Your answers help us provide the most effective credit repair strategy for your situation.</p>
178
+ </div>
179
+ <div class="text-center text-sm text-gray-500">
 
 
180
  <p>By continuing, you agree to our <a href="#" class="text-indigo-600 hover:text-indigo-700">Terms of Service</a>
181
  and <a href="#" class="text-indigo-600 hover:text-indigo-700">Privacy Policy</a></p>
 
 
 
 
182
  </div>
183
+ </form>
184
  </div>
185
  </div>
186
  </div>
 
205
  </div>
206
  </div>
207
  </footer>
 
208
  <script>
209
  // Initialize feather icons
210
  feather.replace();
211
+
212
+ // Show other goal text input when checkbox is checked
213
+ document.querySelector('input[name="goals"][value="other"]').addEventListener('change', function() {
214
+ const otherInput = document.getElementById('other-goal-input');
215
+ otherInput.classList.toggle('hidden', !this.checked);
216
+ if (this.checked) otherInput.focus();
217
+ });
218
  </script>
219
  </body>
220
  </html>