diff options
Diffstat (limited to 'demo/src/less/components/links.less')
-rw-r--r-- | demo/src/less/components/links.less | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/demo/src/less/components/links.less b/demo/src/less/components/links.less new file mode 100644 index 00000000..7a62ab40 --- /dev/null +++ b/demo/src/less/components/links.less @@ -0,0 +1,46 @@ +// ========================================================================== +// Links +// ========================================================================== + +// Make a <button> look like an <a> +button.faux-link { + .cancel-button-styles(); + + &:extend(a all); +} + +// Links +a { + position: relative; + border-bottom: 1px dotted currentColor; + transition: all 0.2s ease; + text-decoration: none; + color: @color-link; + font-weight: @font-weight-bold; + + &::after { + content: ''; + position: absolute; + top: 100%; + left: 50%; + transform: translateX(-50%); + width: 0; + height: 1px; + transition: width 0.2s ease; + background: currentColor; + } + + &:hover, + &:focus { + border-bottom-color: transparent; + outline: 0; + + &::after { + width: 100%; + } + } + + &.tab-focus { + .tab-focus(); + } +} |