Class should be nested within its parent Class Open
.ck.ck-balloon-panel {
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}
Class should be nested within its parent Class Open
.layout-node-form .layout-region--node-main .layout-region__content,
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}
Property gap
appears to be spelled incorrectly Open
gap: 40px;
- Read upRead up
- Exclude checks
No Misspelled Properties
Rule no-misspelled-properties
will enforce the correct spelling of CSS properties and prevent the use of unknown CSS properties.
Options
-
extra-properties
:[array of extra properties to check spelling against]
(defaults to empty array[]
).
Examples
When enabled, the following are disallowed:
// incorrect spelling
.foo {
borders: 0;
}
// unknown property
.bar {
border-right-left: 0;
}
// incorrect spelling
.baz {
-webkit-transit1on: width 2s;
}
When extra-properties
contains a property value of transit1on
as show below:
no-misspelled-properties:
- 1
-
'extra-properties':
- 'transit1on'
The following would now be allowed:
// incorrect spelling now whitelisted
.baz {
-webkit-transit1on: width 2s;
}
// incorrect spelling now whitelisted
.quz {
transit1on: width 2s;
}
While the following would remain disallowed:
// incorrect spelling
.foo {
borders: 0;
}
// unknown property
.bar {
border-right-left: 0;
}
Type-selector should be nested within its parent Class Wontfix
.lpb-component-list__item a {
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}
!important not allowed Open
z-index: 1300 !important;
- Read upRead up
- Exclude checks
No Important
Rule no-important
will enforce that important declarations are not allowed to be used.
Examples
When enabled, the following are disallowed:
.foo {
content: 'bar' !important;
}
Class should be nested within its parent Class Open
.ds-entity--paragraph .su-media .su-media__caption {
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}
Type-selector should be nested within its parent Class Wontfix
.choose-layout-field legend,
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}
!important not allowed Open
display: grid !important;
- Read upRead up
- Exclude checks
No Important
Rule no-important
will enforce that important declarations are not allowed to be used.
Examples
When enabled, the following are disallowed:
.foo {
content: 'bar' !important;
}
Class should be nested within its parent Class Open
.layout-node-form .layout-region--node-footer .layout-region__content {
- Read upRead up
- Exclude checks
Force Element Nesting
Rule force-element-nesting
will enforce the nesting of elements
Examples
When enabled, the following are disallowed:
div p {
content: '';
}
.parent {
&__child h1 {
content: '';
}
}
a[target="_blank"] span {
content: '';
}
When enabled, the following are allowed:
div {
p {
content: '';
}
}
.parent {
&__child {
h1 {
content: '';
}
}
}
a[target="_blank"] {
span {
content: '';
}
}