Fix the following style-lint errors and warnings for ee/app/assets/stylesheets/pages/billings.scss
Problem
Fix the following style-lint errors and warnings for ee/app/assets/stylesheets/pages/billings.scss
21:1 ⚠ ".billing-plans-alert" and "p (ee/app/assets/stylesheets/pages/billings.scss -8:3)" have the same properties. stylelint-gitlab/duplicate-selectors
32:3 ⚠ ".card-header" and ".billing-plan-header (ee/app/assets/stylesheets/pages/billings.scss -1:1)" have the same properties. stylelint-gitlab/duplicate-selectors
78:7 ⚠ Expected ".billing-plans .card .card-body .price-per-month" to have no more than 3 compound selectors selector-max-compound-selectors
88:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
88:9 ⚠ Expected ".billing-plans .card .card-body .price-per-month .billing-conditions" to have no more than 3 compound selectors selector-max-compound-selectors
98:7 ⚠ Expected ".billing-plans .card .card-body .price-per-year" to have no more than 3 compound selectors selector-max-compound-selectors
107:7 ⚠ Expected ".billing-plans .card .card-body .feature-list" to have no more than 3 compound selectors selector-max-compound-selectors
114:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
114:9 ⚠ Expected ".billing-plans .card .card-body .feature-list li" to have no more than 3 compound selectors selector-max-compound-selectors
117:11 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
117:11 ⚠ Expected ".billing-plans .card .card-body .feature-list li:first-child" to have no more than 3 compound selectors selector-max-compound-selectors
121:11 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
121:11 ⚠ Expected ".billing-plans .card .card-body .feature-list li:last-child" to have no more than 3 compound selectors selector-max-compound-selectors
129:11 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
129:11 ⚠ Expected ".billing-plans .card .card-body .feature-list li:last-child:hover" to have no more than 3 compound selectors selector-max-compound-selectors
135:7 ⚠ Expected ".billing-plans .card .card-body .plan-action" to have no more than 3 compound selectors selector-max-compound-selectors
138:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
138:9 ⚠ Expected ".billing-plans .card .card-body .plan-action .btn" to have no more than 3 compound selectors selector-max-compound-selectors
149:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
149:9 ⚠ Expected ".billing-plans .card.current .card-body .price-per-month" to have no more than 3 compound selectors selector-max-compound-selectors
149:9 ⚠ Expected ".billing-plans .card.current .card-body .price-per-year" to have no more than 3 compound selectors selector-max-compound-selectors
161:7 ⚠ Expected ".subscription-table .flex-grid .grid-cell .property-label" to have no more than 3 compound selectors selector-max-compound-selectors
165:7 ⚠ Expected ".subscription-table .flex-grid .grid-cell .btn-help" to have no more than 3 compound selectors selector-max-compound-selectors
165:7 ⚠ ".btn-help" and ".price-per-month, .price-per-year (ee/app/assets/stylesheets/pages/billings.scss -149:9)" have the same stylelint-gitlab/duplicate-selectors
properties.
169:7 ⚠ Expected ".subscription-table .flex-grid .grid-cell .property-value" to have no more than 3 compound selectors selector-max-compound-selectors
172:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
172:9 ⚠ Expected ".subscription-table .flex-grid .grid-cell .property-value.number" to have no more than 3 compound selectors selector-max-compound-selectors
178:7 ⚠ Expected ".subscription-table .flex-grid .grid-cell .icon-wrapper" to have no more than 3 compound selectors selector-max-compound-selectors
182:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
182:9 ⚠ Expected ".subscription-table .flex-grid .grid-cell .icon-wrapper svg" to have no more than 3 compound selectors selector-max-compound-selectors
192:9 ⚠ Expected nesting depth to be no more than 3 max-nesting-depth
192:9 ⚠ Expected ".subscription-table .flex-grid .grid-cell.no-value > *" to have no more than 3 compound selectorsWhat to do
- If possible, replace the CSS class with a utility one, check common.scss and https://getbootstrap.com/docs/4.3/utilities/ for existing ones
- Double check if all the warning have been fixed by running
yarn run stylelint-file ee/app/assets/stylesheets/pages/billings.scss - In the MR, add screenshots of the affected areas before and after the changes, check the first MR as a guideline
- If there are a lot of changes, we recommend to break them into smaller MRs
- Double check the usage of each changed class both in CE and EE
- EE changes should either be backported into CE or moved into
ee/folder. You can read more about how to handle EE code here - Label the MR with CSS cleanup
Edited by 🤖 GitLab Bot 🤖