mirror of
https://github.com/danog/sass-site.git
synced 2024-12-14 02:17:36 +01:00
51 lines
1.1 KiB
SCSS
51 lines
1.1 KiB
SCSS
// ===========================================================================
|
|
// LINKS
|
|
|
|
|
|
|
|
$tappable-size: 44px;
|
|
|
|
@mixin tappable {
|
|
display: inline-block;
|
|
min-width: $tappable-size;
|
|
min-height: $tappable-size;
|
|
line-height: $tappable-size;
|
|
}
|
|
|
|
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// EASY LINK COLORS
|
|
|
|
$link-color: $midnight-blue !default;
|
|
$link-hover-color: darken($link-color, 10%) !default;
|
|
$link-active-color: darken($link-color, 20%) !default;
|
|
|
|
$hover: "&:hover, &:focus";
|
|
|
|
@mixin link($link-setting: $link-color, $hover-setting: $link-hover-color, $active-setting: $link-active-color) {
|
|
|
|
border-color: mix(mix($link-setting, $white), $white);
|
|
|
|
&,
|
|
&:visited { color: $link-setting; }
|
|
|
|
#{$hover} { color: $hover-setting; }
|
|
|
|
&:active { color: $active-setting; }
|
|
}
|
|
|
|
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// LINK STYLES
|
|
|
|
a {
|
|
text-decoration: none;
|
|
padding-bottom: 1px;
|
|
border: {
|
|
bottom-width: 1px;
|
|
bottom-style: solid;
|
|
}
|
|
@include link;
|
|
} |