c1: QA fixes | list views #548
Conversation
|
@coderabbitai review |
WalkthroughThe updates primarily involve the removal of specific styling rules for Changes
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Review Status
Actionable comments generated: 18
Configuration used: CodeRabbit UI
Files selected for processing (11)
- src/app/integrations/intacct/main/dashboard/dashboard.component.scss (1 hunks)
- src/app/integrations/intacct/main/export-log/completed-export-log/completed-export-log.component.scss (1 hunks)
- src/app/integrations/intacct/main/export-log/export-log.component.scss (1 hunks)
- src/app/integrations/intacct/main/export-log/skip-export-log/skip-export-log.component.scss (1 hunks)
- src/app/integrations/qbd/main/dashboard/dashboard.component.scss (1 hunks)
- src/app/shared/components/dashboard/dashboard-accounting-error-dialog/dashboard-accounting-error-dialog.component.scss (1 hunks)
- src/app/shared/components/export-log/export-log-filter/export-log-filter.component.scss (1 hunks)
- src/app/shared/components/export-log/export-log-table/export-log-table.component.scss (1 hunks)
- src/app/shared/components/helper/mapping/generic-mapping-table/generic-mapping-table.component.scss (1 hunks)
- src/assets/themes/fyle/fdl.scss (1 hunks)
- src/styles.scss (1 hunks)
Additional comments: 3
src/assets/themes/fyle/fdl.scss (1)
- 320-326: The addition of custom properties for table styling is a positive step towards standardizing the visual theme. Ensure these properties are well-documented and align with the design system.
src/styles.scss (2)
- 417-419: Ensure the use of
tw-font-nav-link-font-weightin.p-datatable .p-datatable-thead > tr > this consistent with the design system and that such a font weight is defined and appropriate for table headers.- 421-423: The styling for
.p-datatable .p-datatable-tbody > tr > tdusestw-border-tandtw-border-b-0, which ensures top borders for table cells but no bottom borders. Confirm this design choice aligns with UI guidelines for table row separation.
| @apply tw-bg-bg-info-lightest; | ||
| } | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [2-7]
Remove the redundant nested &:hover since the styles are already scoped to the hover state of .clickable-row.
.clickable-row:hover {
@apply tw-cursor-pointer;
- &:hover {
@apply tw-bg-bg-info-lightest;
- }
}| :host ::ng-deep .p-datepicker table td > span.p-highlight { | ||
| @apply tw-text-white tw-bg-mandatory-field-color #{!important}; | ||
| } |
There was a problem hiding this comment.
Review the necessity of #{!important} for overriding styles and ensure it's used as a last resort due to specificity issues.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [4-6]
Ensure #{!important} is necessary for tw-shadow-none to avoid specificity issues.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [7-9]
Check if tw-text-center is correctly applied without #{!important}; consistency in the use of !important should be maintained across similar styles.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-progressbar { | ||
| @apply tw-h-1.5 tw-bg-progress-bar-bg #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [12-14]
Verify the validity of tw-rounded-50; if it's a custom class, ensure it's defined elsewhere or consider using a standard Tailwind CSS class for rounded corners.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [15-17]
Review the necessity of #{!important} for progress bar styles to ensure they are essential for overriding default styles.
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .selectedItem .p-dropdown-trigger { | ||
| @apply tw-hidden #{!important}; |
There was a problem hiding this comment.
Consider creating reusable classes or utilities for dropdown styles to reduce redundancy across components.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .selectedItem .p-dropdown-trigger { | ||
| @apply tw-hidden #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks and was mapped to the diff hunk with the greatest overlap. Original lines [15-17]
Review the necessity of #{!important} for hiding dropdown triggers to ensure it's essential for achieving the desired styling.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-progressbar { | ||
| @apply tw-h-1.5 tw-bg-progress-bar-bg #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [1-3]
Ensure the custom search field styles are consistent with the application's design system and consider using utility classes where possible.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [4-6]
Review the color grey for the search icon; ensure it aligns with the application's color palette or consider using a variable for maintainability.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-progressbar { | ||
| @apply tw-h-1.5 tw-bg-progress-bar-bg #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [1-3]
Ensure the custom search field styles are consistent with the application's design system and consider using utility classes where possible.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [4-6]
Review the color for the search icon; ensure it aligns with the application's color palette or consider using a variable for maintainability.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-progressbar { | ||
| @apply tw-h-1.5 tw-bg-progress-bar-bg #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [1-3]
Ensure the custom search field styles are consistent with the application's design system and consider using utility classes where possible.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [4-6]
Review the color for the search icon; ensure it aligns with the application's color palette or consider using a variable for maintainability.
| :host ::ng-deep .tooltip-return { | ||
| @apply tw-mt-6-px tw-px-4-px tw-py-4-px tw-text-9-px tw-rounded-md tw-bg-placeholder #{!important} | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [4-6]
Consider using utility classes for dropdown widths to ensure consistency across the application.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [7-9]
Review the necessity of #{!important} for disabled button text colors to ensure it's essential for achieving the desired styling.
| @apply tw-w-200-px tw-border-0 #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td { | ||
| @apply tw-text-sub-text-color tw-text-14-px tw-font-400 tw-py-14-px tw-px-22-px tw-border-t tw-border-b-0 tw-border-t-box-color #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-thead > tr > th { | ||
| @apply tw-text-text-primary tw-text-12-px tw-font-500 tw-py-12-px tw-px-22-px tw-border tw-border-box-color tw-bg-disabled-bg-color #{!important} | ||
| } | ||
|
|
||
| :host ::ng-deep .p-datatable .p-datatable-tbody > tr > td > button { | ||
| @apply tw-pl-48-px #{!important}; | ||
| } | ||
|
|
||
| :host ::ng-deep .p-progressbar { | ||
| @apply tw-h-1.5 tw-bg-progress-bar-bg #{!important}; | ||
| } |
There was a problem hiding this comment.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [8-10]
Consider creating reusable classes or utilities for container styles to reduce redundancy across components.
📝 NOTE
This review was outside the diff hunks, and no overlapping diff hunk was found. Original lines [11-13]
Review the necessity of #{!important} for progress bar styles to ensure they are essential for overriding default styles.
* C1: QA Fixes - 4 | Multiselect * fix bg * c1: QA Fixes - Toggle (#538) * C1 qa toast (#540) * c1: QA Fixes - Toggle * c1: Toast * c1: QA fixes | Chips (#542) * fix travelperk btn * c1: QA fixes | list views * c1: QA fixes - Border * c1: QA fixes | list views (#548) * C1 qa borders (#549) * c1: QA fixes | list views * c1: QA fixes - Border * c1: QA fixes - Calendar * fix search * comment out stuffs * fix icon * few more
…ps | LV | Border (#531) * C1: QA Fixes - 3 * fix lint * other fixes * dropdown * dropdown with search * fix lint * C1 dropdown qa fix (#544) white labeling gC1 * C1 qa multiselect | toggle | bg | toast | chips | lv | border (#536) * C1: QA Fixes - 4 | Multiselect * fix bg * c1: QA Fixes - Toggle (#538) * C1 qa toast (#540) * c1: QA Fixes - Toggle * c1: Toast * c1: QA fixes | Chips (#542) * fix travelperk btn * c1: QA fixes | list views (#548) * C1 qa borders (#549) * c1: QA fixes | list views * c1: QA fixes - Border * c1: QA fixes - Calendar (#551) * C1: QA Fixes - 4 | Multiselect * fix bg * c1: QA Fixes - Toggle (#538) * C1 qa toast (#540) * c1: QA Fixes - Toggle * c1: Toast * c1: QA fixes | Chips (#542) * fix travelperk btn * c1: QA fixes | list views * c1: QA fixes - Border * c1: QA fixes | list views (#548) * C1 qa borders (#549) * c1: QA fixes | list views * c1: QA fixes - Border * c1: QA fixes - Calendar * fix search * comment out stuffs * fix icon * few more * fix qbd btn * fix mapping card * fix bamboo * intacct search, calendar --------- Co-authored-by: Dhaarani <[email protected]>
Summary by CodeRabbit