Параметры по умолчанию

link-default

В SIMAI Framework используется декорирование ссылок с помощью дополнительных стилей.

В SIMAI Framework ссылки оформлены по умолчанию как синий текст с подчеркиванием. Это визуально улучшает внешний вид ссылок.

Селектор Значение
a color: var(--sf-color--link);
text-decoration: none;
a:visited color: var(--sf-color--link-visited);
a:hover color: var(--sf-color--link-hover);
a:active color: var(--sf-color--link-active);
a:not([class]),
a[class*=l-],
[class*=l-] ~ a
padding-bottom: var(--sf-size--a-2);
background-repeat: repeat-x;
outline: none;
background-size: 200% var(--sf-link--underline-weight);
background-position: 0 100%;
background-image: linear-gradient(to right, var(--sf-color--link-underline) 50%, transparent 50%);
a:not([class]):visited,
a[class*=l-]:visited,
[class*=l-] ~ a:visited
background-image: linear-gradient(to right, var(--sf-color--link-visited-underline) 50%, transparent 50%);
a:not([class]):hover,
a[class*=l-]:hover,
[class*=l-] ~ a:hover
background-image: linear-gradient(to right, var(--sf-color--link-hover-underline) 50%, transparent 50%);
a:not([class]):active,
a[class*=l-]:active,
[class*=l-] ~ a:active
background-image: linear-gradient(to right, var(--sf-color--link-active-underline) 50%, transparent 50%);

Для модификаторов относящихся к типографике используется префикс {l-}. Например: l-underline, link-inherit.

Изменить статью