• Как оптимизировать запись SCSS?

    sfi0zy
    @sfi0zy Куратор тега CSS
    Creative frontend developer
    Смущает класс ".list__link"

    Если вас смущает повторение list в названии класса, то можно воспользоваться сохранением имени в стиле that=this из javascript:

    .list {
        $b: &;
    
        &__item {
            &:first-child {
                #{$b}__link {
                    // . . .
                }
            }
        }
    }

    Но это сложно назвать более читаемым вариантом.

    Если цель - все же сделать код более удобоваримым, то может иметь смысл просто ограничить вложенность при написании стилей (именно визуальную вложенность кода, а не каскад), как это делают в том же rscss:

    .list {
        &__item {
            // . . .
        }
    
        &__link {
            // . . .
        }
    
        &__item:first-child &__link {
            // . . .
        }
    }
    Ответ написан
    1 комментарий