Oi, Maria! Eu tive a mesma dificuldade, até perceber que eu estava aplicando as tags de forma errada.
O about__breadcrumb realmente seria chamado de &__breadcrumb , porém para começar a incluir as classes que tem como pai a classe breadcrumb (&__img e &__link), você precisa chamar a classe .breadcrumb pura dentro do código, assim:
.about
width: 80%
margin: 0 auto 40px
font-family: Arial, Helvetica, sans-serif
&__title
background-color: $light-grey
text-align: center
padding: 20px
&__h1
font-size: 22px
color: $dark-grey
letter-spacing: 1px
margin-top: 5px
margin-bottom: 10px
margin-left: 0
margin-right: 0
.breadcrumb
display: flex
justify-content: center
align-items: center
&__link
font-size: 12px
text-decoration: none
color: $dark-grey
&:hover
text-decoration: underline
color: $purple
&__img
width: 10px
margin: 8px
Ali, por exemplo, também poderia ser escrito &_ _breadcrumb igual a como você fez, mas precisaria chamar a .breadcrumb do mesmo jeito, mesmo que "vazia", ou seja, apenas com as classes que são filhas dela, igual ela faz em outra aula:
.main
display: flex
justify-content: center
flex-wrap: wrap
font-family: Arial, Helvetica, sans-serif
&__a
text-decoration: none
font-size: 14px
color: $dark-grey
margin-top: 10px
margin-bottom: 10px
&:hover
color: $purple
&__sidebar
width: 25%
padding: 40px 10px
.sidebar
&__top
border: 1px solid $light-grey
padding: 15px 20px
&__title
background-color: $yellow
text-align: center
padding: 10px 20px
margin: 0
letter-spacing: 1.5px
&__posts
@include reset-list
Perceba que ela utiliza o &_ _ sidebar para estilizar a classe main_ _ sidebar, mas depois puxa a .sidebar sozinha apenas para chamas as classes que são filhas.
