Readapt the misuse of BEM, Code organization
- -- is only for a modifier, not a child "child". Use master__child without the parent__ in it to make it more readable. https://www.smashingmagazine.com/2016/06/battling-bem-extended-edition-common-problems-and-how-to-avoid-them/ - Redefine atom design components
This commit is contained in:
@@ -50,7 +50,7 @@
|
||||
}
|
||||
|
||||
// Photos
|
||||
.gallery__images--photo {
|
||||
.gallery__photo {
|
||||
&:before {
|
||||
background-color: $color-secondary;
|
||||
}
|
||||
|
||||
@@ -40,26 +40,23 @@
|
||||
}
|
||||
}
|
||||
|
||||
// List
|
||||
&__list {
|
||||
// Category
|
||||
&--category {
|
||||
margin-bottom: 96px;
|
||||
text-align: center;
|
||||
// Category
|
||||
&__category {
|
||||
margin-bottom: 96px;
|
||||
text-align: center;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-bottom: 56px;
|
||||
}
|
||||
dl {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
dt {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
h2 {
|
||||
margin-bottom: 56px;
|
||||
}
|
||||
dl {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
dt {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -124,14 +124,14 @@
|
||||
height: 100%;
|
||||
background-color: $color-tertiary;
|
||||
}
|
||||
}
|
||||
|
||||
// Wrap
|
||||
&--wrap {
|
||||
padding: 0;
|
||||
// Wrap
|
||||
&__wrap {
|
||||
padding: 0;
|
||||
|
||||
@include breakpoint (md) {
|
||||
padding-left: 128px;
|
||||
}
|
||||
@include breakpoint (md) {
|
||||
padding-left: 128px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user