barecss-power/less/_anchor.less

A classless CSS framework (power) http://barecss.com

@import (reference) "config";


// config
@a-text: inherit;
@a-back: blue;
@a-decor: 0.2;


// normal
a {
  display: inline-block;
  z-index: 1;
  color: @a-text;
  text-decoration: none;
  
  // inside paragraph
  p &:not([btn]) {
    &::before {
      content: "";
      display: inline-block;
      position: absolute;
      z-index: -1;
      width: 100%;
      height: 100%;
      transform: scale3d(1,@a-decor,1);
      transform-origin: bottom;
      opacity: 0.5;
      background: difference(@def-back, @a-back);
    }
    .pri &::before { background: difference(@pri-back, @a-back); }
    .sec &::before { background: difference(@sec-back, @a-back); }
    
    // on hover
    &:hover::before { transform: none; }
  }
}