Получить значение родительского атрибута в sass

Question

Я пытаюсь создать верхний уровень <a> стиль для моего приложения, используя sass. Большинство ссылок по всему сайту зеленые, поэтому у меня это как стиль. (Я использую компас для функции darken)

a { 
    color: green; 

    &:hover { 
    color: darken(green, 10%); 
    } 
} 

Однако, в некоторых случаях, ссылки не зеленые. В этих случаях мне придется указывать как цвет текста, так и цвет наведения, в противном случае по умолчанию он будет зависать до зеленого. Мне интересно, есть ли способ сделать это DRYer. В идеале я мог бы получить цвет родительских классов, например.

a { 
    color: green; 

    &:hover { 
    color: darken(parent(color), 10%); 
    } 
} 

Таким образом, зависание всегда будет по умолчанию независимо от цвета конкретного. Имеет ли это смысл? Что-то вроде этого возможно? Если нет, каков наилучший способ справиться с этим? Миксин?

Спасибо!

Answer 1

Я хотел бы использовать подмешать:

@mixin link($color) { 
    a { color: $color}; 

    &:hover { color: darken($color, 10%) }; 
} 

.foo { 
    @include link(green); 
} 

Rendered CSS:

.foo a { color: green; } 

.foo a:hover { color: #004d00; } 

Answer 2

Что ты спрашиваешь не представляется возможным с SASS. SASS не создает объектную модель со всеми элементами и свойствами (это невозможно без HTML).

Смесин является подходящим решением для случая многоразового использования, но для случайного случая это перебор.

Просто используйте переменный:

a { 
    $link-color: green; 
    color: $link-color; 

    &:hover { 
    color: darken($link-color, 10%); 
    } 
} 

Обратите внимание, что вы можете переместить переменные в отдельном частичную, где вы храните все ваши переменные.