diff options
author | André Oliveira <37463445+SpecialAro@users.noreply.github.com> | 2022-05-05 23:28:52 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-05-05 22:28:52 +0000 |
commit | d8e5bd9f4b65ade42e48d47d94d617df77a19a1b (patch) | |
tree | 61b43ca07d7f89409a21fc027e32d0c1f5223dc1 | |
parent | Add documentation to enable webcam and microphone in snap distro (#98) [skip ci] (diff) | |
download | ferdium-app-d8e5bd9f4b65ade42e48d47d94d617df77a19a1b.tar.gz ferdium-app-d8e5bd9f4b65ade42e48d47d94d617df77a19a1b.tar.zst ferdium-app-d8e5bd9f4b65ade42e48d47d94d617df77a19a1b.zip |
Rearrange input fields on Settings screen and add labels for organization (#101)
-rw-r--r-- | src/components/settings/settings/EditSettingsForm.js | 99 |
1 files changed, 52 insertions, 47 deletions
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js index 9fe229f11..2ea9272b0 100644 --- a/src/components/settings/settings/EditSettingsForm.js +++ b/src/components/settings/settings/EditSettingsForm.js | |||
@@ -399,6 +399,7 @@ class EditSettingsForm extends Component { | |||
399 | {/* General */} | 399 | {/* General */} |
400 | {this.state.activeSetttingsTab === 'general' && ( | 400 | {this.state.activeSetttingsTab === 'general' && ( |
401 | <div> | 401 | <div> |
402 | <h2><center>Main</center></h2> | ||
402 | <Toggle field={form.$('autoLaunchOnStart')} /> | 403 | <Toggle field={form.$('autoLaunchOnStart')} /> |
403 | <Toggle field={form.$('runInBackground')} /> | 404 | <Toggle field={form.$('runInBackground')} /> |
404 | <Toggle field={form.$('confirmOnQuit')} /> | 405 | <Toggle field={form.$('confirmOnQuit')} /> |
@@ -407,32 +408,8 @@ class EditSettingsForm extends Component { | |||
407 | <Toggle field={form.$('startMinimized')} /> | 408 | <Toggle field={form.$('startMinimized')} /> |
408 | {isWindows && <Toggle field={form.$('minimizeToSystemTray')} />} | 409 | {isWindows && <Toggle field={form.$('minimizeToSystemTray')} />} |
409 | {isWindows && <Toggle field={form.$('closeToSystemTray')} />} | 410 | {isWindows && <Toggle field={form.$('closeToSystemTray')} />} |
410 | <Select field={form.$('navigationBarBehaviour')} /> | ||
411 | |||
412 | <Hr /> | ||
413 | |||
414 | <Select field={form.$('hibernationStrategy')} /> | ||
415 | <Toggle field={form.$('hibernateOnStartup')} /> | ||
416 | <p | ||
417 | className="settings__message" | ||
418 | style={{ | ||
419 | borderTop: 0, | ||
420 | marginTop: 0, | ||
421 | paddingTop: 0, | ||
422 | marginBottom: '2rem', | ||
423 | }} | ||
424 | > | ||
425 | <span>{intl.formatMessage(messages.hibernateInfo)}</span> | ||
426 | </p> | ||
427 | |||
428 | <Select field={form.$('wakeUpStrategy')} /> | ||
429 | <Select field={form.$('wakeUpHibernationStrategy')} /> | ||
430 | <Toggle field={form.$('wakeUpHibernationSplay')} /> | ||
431 | |||
432 | <Hr /> | ||
433 | 411 | ||
434 | <Toggle field={form.$('keepAllWorkspacesLoaded')} /> | 412 | <Toggle field={form.$('keepAllWorkspacesLoaded')} /> |
435 | <Hr /> | ||
436 | 413 | ||
437 | {!hasAddedTodosAsService && ( | 414 | {!hasAddedTodosAsService && ( |
438 | <> | 415 | <> |
@@ -468,6 +445,7 @@ class EditSettingsForm extends Component { | |||
468 | )} | 445 | )} |
469 | 446 | ||
470 | <Toggle field={form.$('scheduledDNDEnabled')} /> | 447 | <Toggle field={form.$('scheduledDNDEnabled')} /> |
448 | |||
471 | {scheduledDNDEnabled && ( | 449 | {scheduledDNDEnabled && ( |
472 | <> | 450 | <> |
473 | <div | 451 | <div |
@@ -517,20 +495,41 @@ class EditSettingsForm extends Component { | |||
517 | > | 495 | > |
518 | <span>{intl.formatMessage(messages.scheduledDNDInfo)}</span> | 496 | <span>{intl.formatMessage(messages.scheduledDNDInfo)}</span> |
519 | </p> | 497 | </p> |
498 | |||
499 | <Hr /> | ||
500 | |||
501 | <Select field={form.$('navigationBarBehaviour')} /> | ||
502 | |||
503 | <Hr /> | ||
504 | |||
505 | <h2><center>Hibernation</center></h2> | ||
506 | <Select field={form.$('hibernationStrategy')} /> | ||
507 | <Toggle field={form.$('hibernateOnStartup')} /> | ||
508 | <p | ||
509 | className="settings__message" | ||
510 | style={{ | ||
511 | borderTop: 0, | ||
512 | marginTop: 0, | ||
513 | paddingTop: 0, | ||
514 | marginBottom: '2rem', | ||
515 | }} | ||
516 | > | ||
517 | <span>{intl.formatMessage(messages.hibernateInfo)}</span> | ||
518 | </p> | ||
519 | |||
520 | <Select field={form.$('wakeUpStrategy')} /> | ||
521 | <Select field={form.$('wakeUpHibernationStrategy')} /> | ||
522 | <Toggle field={form.$('wakeUpHibernationSplay')} /> | ||
523 | |||
520 | </div> | 524 | </div> |
521 | )} | 525 | )} |
522 | 526 | ||
523 | {/* Appearance */} | 527 | {/* Appearance */} |
524 | {this.state.activeSetttingsTab === 'appearance' && ( | 528 | {this.state.activeSetttingsTab === 'appearance' && ( |
525 | <div> | 529 | <div> |
526 | <Toggle field={form.$('showDisabledServices')} /> | 530 | <h2><center>General UI</center></h2> |
527 | <Toggle field={form.$('showServiceName')} /> | ||
528 | <Toggle field={form.$('showMessageBadgeWhenMuted')} /> | ||
529 | |||
530 | {isMac && <Toggle field={form.$('showDragArea')} />} | 531 | {isMac && <Toggle field={form.$('showDragArea')} />} |
531 | 532 | ||
532 | <Hr /> | ||
533 | |||
534 | <Toggle field={form.$('adaptableDarkMode')} /> | 533 | <Toggle field={form.$('adaptableDarkMode')} /> |
535 | {!isAdaptableDarkModeEnabled && ( | 534 | {!isAdaptableDarkModeEnabled && ( |
536 | <Toggle field={form.$('darkMode')} /> | 535 | <Toggle field={form.$('darkMode')} /> |
@@ -554,8 +553,6 @@ class EditSettingsForm extends Component { | |||
554 | </> | 553 | </> |
555 | )} | 554 | )} |
556 | 555 | ||
557 | <Hr /> | ||
558 | |||
559 | <Toggle field={form.$('splitMode')} /> | 556 | <Toggle field={form.$('splitMode')} /> |
560 | {isSplitModeEnabled && ( | 557 | {isSplitModeEnabled && ( |
561 | <Input | 558 | <Input |
@@ -570,6 +567,21 @@ class EditSettingsForm extends Component { | |||
570 | 567 | ||
571 | <Hr /> | 568 | <Hr /> |
572 | 569 | ||
570 | <Input | ||
571 | placeholder="Accent Color" | ||
572 | onChange={e => this.submit(e)} | ||
573 | field={form.$('accentColor')} | ||
574 | /> | ||
575 | <p> | ||
576 | {intl.formatMessage(messages.accentColorInfo, { | ||
577 | defaultAccentColor: DEFAULT_APP_SETTINGS.accentColor, | ||
578 | })} | ||
579 | </p> | ||
580 | |||
581 | <Hr /> | ||
582 | |||
583 | <h2><center>Sidebar Settings</center></h2> | ||
584 | |||
573 | <Select field={form.$('serviceRibbonWidth')} /> | 585 | <Select field={form.$('serviceRibbonWidth')} /> |
574 | 586 | ||
575 | <Select field={form.$('sidebarServicesLocation')} /> | 587 | <Select field={form.$('sidebarServicesLocation')} /> |
@@ -587,21 +599,14 @@ class EditSettingsForm extends Component { | |||
587 | <Toggle field={form.$('alwaysShowWorkspaces')} /> | 599 | <Toggle field={form.$('alwaysShowWorkspaces')} /> |
588 | 600 | ||
589 | <Hr /> | 601 | <Hr /> |
590 | <Select field={form.$('iconSize')} /> | ||
591 | <Toggle field={form.$('enableLongPressServiceHint')} /> | ||
592 | 602 | ||
593 | <Hr /> | 603 | <h2><center>Service Icons Settings</center></h2> |
594 | 604 | ||
595 | <Input | 605 | <Toggle field={form.$('showDisabledServices')} /> |
596 | placeholder="Accent Color" | 606 | <Toggle field={form.$('showServiceName')} /> |
597 | onChange={e => this.submit(e)} | 607 | <Toggle field={form.$('showMessageBadgeWhenMuted')} /> |
598 | field={form.$('accentColor')} | 608 | <Toggle field={form.$('enableLongPressServiceHint')} /> |
599 | /> | 609 | <Select field={form.$('iconSize')} /> |
600 | <p> | ||
601 | {intl.formatMessage(messages.accentColorInfo, { | ||
602 | defaultAccentColor: DEFAULT_APP_SETTINGS.accentColor, | ||
603 | })} | ||
604 | </p> | ||
605 | </div> | 610 | </div> |
606 | )} | 611 | )} |
607 | 612 | ||
@@ -838,7 +843,7 @@ class EditSettingsForm extends Component { | |||
838 | )} | 843 | )} |
839 | {updateFailed && ( | 844 | {updateFailed && ( |
840 | <Infobox type="danger" icon="alert"> | 845 | <Infobox type="danger" icon="alert"> |
841 | An error occurred (check the console for more details) | 846 | An error occurred (check the console for more details) |
842 | </Infobox> | 847 | </Infobox> |
843 | )} | 848 | )} |
844 | </> | 849 | </> |
@@ -857,7 +862,7 @@ class EditSettingsForm extends Component { | |||
857 | ) : ( | 862 | ) : ( |
858 | <p> | 863 | <p> |
859 | <Icon icon={mdiPowerPlug} /> | 864 | <Icon icon={mdiPowerPlug} /> |
860 | Your services are up-to-date. | 865 | Your services are up-to-date. |
861 | </p> | 866 | </p> |
862 | )} | 867 | )} |
863 | </> | 868 | </> |