Skip to content

Latest commit

 

History

History
45 lines (30 loc) · 1.59 KB

README.md

File metadata and controls

45 lines (30 loc) · 1.59 KB
Raw

LESS Long Shadow

This LESS loop mixins generates flat-trendy long shadows for any inline-text, font-icons or block-elements. Looks best if wrapped by square overflow: hidden; block with bold padding and 25% rounded corners. Dont forget about good contrast color palette!

Installation

  1. Make shure that you installed client- or server-side LESS css-preprocessor
  2. Clone git repo or Download and copy long-shadow.less to your e.g. /assets directory
  3. Plug it to project by insert @import "long-shadow.less"; at beginning of main LESS/CSS stylesheet file
  4. Assign mixins to elements. Enjoy!

Usage

.box {
	overflow: hidden;

	.longShadow(@color, @size, @spread);
	.longShadowBox(@color, @size, @spread);
}

Params

  • @color of shadow e.g. #00FFFF, @buttonShadowColor or darken(#00FFFF).
  • @size in pixels that shadow would be.
  • @spread shadow opacity. Greater value - straighter edges. Defaults:
  • longShadow: 100
  • longShadowBox: 1

Issues

Have a bug or a feature request? Please open a new issue. Before opening any issue, please search for existing issues.

Changelog

1.0

  • Initial release

Copyright and license

MIT License