|
164 | 164 | <p class="text-sm font-medium {toastType === 'success' ? 'text-green-800 dark:text-green-200' : 'text-red-800 dark:text-red-200'}">{toastMessage}</p> |
165 | 165 | </div> |
166 | 166 | <button |
167 | | - on:click={() => showToast = false} |
| 167 | + onclick={() => showToast = false} |
168 | 168 | class="ml-auto -mx-1.5 -my-1.5 rounded-lg p-1.5 {toastType === 'success' ? 'text-green-500 dark:text-green-400 hover:bg-green-100 dark:hover:bg-green-800/30' : 'text-red-500 dark:text-red-400 hover:bg-red-100 dark:hover:bg-red-800/30'}"> |
169 | 169 | <X class="w-4 h-4" /> |
170 | 170 | </button> |
|
241 | 241 | name="name" |
242 | 242 | type="text" |
243 | 243 | bind:value={formData.name} |
244 | | - on:input={handleChange} |
| 244 | + oninput={handleChange} |
245 | 245 | placeholder="Enter account name" |
246 | 246 | required |
247 | 247 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors {errors.name ? 'border-red-500 dark:border-red-400 ring-1 ring-red-500 dark:ring-red-400' : ''}" /> |
|
259 | 259 | id="type" |
260 | 260 | name="type" |
261 | 261 | bind:value={formData.type} |
262 | | - on:change={handleChange} |
| 262 | + onchange={handleChange} |
263 | 263 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors"> |
264 | 264 | {#each data.data.accountTypes as [value, label]} |
265 | 265 | <option value={value}>{label}</option> |
|
276 | 276 | id="industry" |
277 | 277 | name="industry" |
278 | 278 | bind:value={formData.industry} |
279 | | - on:change={handleChange} |
| 279 | + onchange={handleChange} |
280 | 280 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors"> |
281 | 281 | {#each data.data.industries as [value, label]} |
282 | 282 | <option value={value}>{label}</option> |
|
293 | 293 | id="rating" |
294 | 294 | name="rating" |
295 | 295 | bind:value={formData.rating} |
296 | | - on:change={handleChange} |
| 296 | + onchange={handleChange} |
297 | 297 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors"> |
298 | 298 | {#each data.data.ratings as [value, label]} |
299 | 299 | <option value={value}>{label}</option> |
|
310 | 310 | id="accountOwnership" |
311 | 311 | name="accountOwnership" |
312 | 312 | bind:value={formData.accountOwnership} |
313 | | - on:change={handleChange} |
| 313 | + onchange={handleChange} |
314 | 314 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors"> |
315 | 315 | {#each data.data.accountOwnership as [value, label]} |
316 | 316 | <option value={value}>{label}</option> |
|
342 | 342 | name="website" |
343 | 343 | type="url" |
344 | 344 | bind:value={formData.website} |
345 | | - on:input={handleChange} |
| 345 | + oninput={handleChange} |
346 | 346 | placeholder="https://company.com" |
347 | 347 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors {errors.website ? 'border-red-500 dark:border-red-400 ring-1 ring-red-500 dark:ring-red-400' : ''}" /> |
348 | 348 | {#if errors.website} |
|
361 | 361 | name="phone" |
362 | 362 | type="tel" |
363 | 363 | bind:value={formData.phone} |
364 | | - on:input={handleChange} |
| 364 | + oninput={handleChange} |
365 | 365 | placeholder="+1 (555) 123-4567" |
366 | 366 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors {errors.phone ? 'border-red-500 dark:border-red-400 ring-1 ring-red-500 dark:ring-red-400' : ''}" /> |
367 | 367 | {#if errors.phone} |
|
392 | 392 | name="street" |
393 | 393 | type="text" |
394 | 394 | bind:value={formData.street} |
395 | | - on:input={handleChange} |
| 395 | + oninput={handleChange} |
396 | 396 | placeholder="Street address" |
397 | 397 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
398 | 398 | </div> |
|
404 | 404 | name="city" |
405 | 405 | type="text" |
406 | 406 | bind:value={formData.city} |
407 | | - on:input={handleChange} |
| 407 | + oninput={handleChange} |
408 | 408 | placeholder="City" |
409 | 409 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
410 | 410 | </div> |
|
416 | 416 | name="state" |
417 | 417 | type="text" |
418 | 418 | bind:value={formData.state} |
419 | | - on:input={handleChange} |
| 419 | + oninput={handleChange} |
420 | 420 | placeholder="State" |
421 | 421 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
422 | 422 | </div> |
|
428 | 428 | name="postalCode" |
429 | 429 | type="text" |
430 | 430 | bind:value={formData.postalCode} |
431 | | - on:input={handleChange} |
| 431 | + oninput={handleChange} |
432 | 432 | placeholder="Postal code" |
433 | 433 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
434 | 434 | </div> |
|
439 | 439 | id="country" |
440 | 440 | name="country" |
441 | 441 | bind:value={formData.country} |
442 | | - on:change={handleChange} |
| 442 | + onchange={handleChange} |
443 | 443 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors"> |
444 | 444 | {#each data.data.countries as [value, label]} |
445 | 445 | <option value={value}>{label}</option> |
|
472 | 472 | type="number" |
473 | 473 | min="0" |
474 | 474 | bind:value={formData.numberOfEmployees} |
475 | | - on:input={handleChange} |
| 475 | + oninput={handleChange} |
476 | 476 | placeholder="100" |
477 | 477 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors {errors.numberOfEmployees ? 'border-red-500 dark:border-red-400 ring-1 ring-red-500 dark:ring-red-400' : ''}" /> |
478 | 478 | {#if errors.numberOfEmployees} |
|
493 | 493 | min="0" |
494 | 494 | step="0.01" |
495 | 495 | bind:value={formData.annualRevenue} |
496 | | - on:input={handleChange} |
| 496 | + oninput={handleChange} |
497 | 497 | placeholder="1000000" |
498 | 498 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors {errors.annualRevenue ? 'border-red-500 dark:border-red-400 ring-1 ring-red-500 dark:ring-red-400' : ''}" /> |
499 | 499 | {#if errors.annualRevenue} |
|
512 | 512 | name="tickerSymbol" |
513 | 513 | type="text" |
514 | 514 | bind:value={formData.tickerSymbol} |
515 | | - on:input={handleChange} |
| 515 | + oninput={handleChange} |
516 | 516 | placeholder="AAPL" |
517 | 517 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
518 | 518 | </div> |
|
527 | 527 | name="sicCode" |
528 | 528 | type="text" |
529 | 529 | bind:value={formData.sicCode} |
530 | | - on:input={handleChange} |
| 530 | + oninput={handleChange} |
531 | 531 | placeholder="7372" |
532 | 532 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors" /> |
533 | 533 | </div> |
|
550 | 550 | id="description" |
551 | 551 | name="description" |
552 | 552 | bind:value={formData.description} |
553 | | - on:input={handleChange} |
| 553 | + oninput={handleChange} |
554 | 554 | placeholder="Additional notes about this account..." |
555 | 555 | rows="4" |
556 | 556 | class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors resize-vertical"></textarea> |
|
564 | 564 | <div class="flex justify-end gap-4"> |
565 | 565 | <button |
566 | 566 | type="button" |
567 | | - on:click={() => goto('/app/accounts')} |
| 567 | + onclick={() => goto('/app/accounts')} |
568 | 568 | disabled={isSubmitting} |
569 | 569 | class="px-6 py-2 border border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2"> |
570 | 570 | <X class="w-4 h-4" /> |
|
0 commit comments