Add Angled Edges To Any Elements – angled-edges

Preview:

Description:

Similar to the josephfusco’s angled-edges, this SASS mixin allows you to create angled edges on elements without the need of SVG element.

How to use it:

Install and import the angled-edges into your project.

# NPM
$ npm install angled-edges --save

Add angled edges to elements. Supported location parameters:

• Top
• Left
• Bottom
• Right
• Both

<div class="angle--top-left">
  element here
</div>

Customize the ‘angled-edges’.

• $angle: The angle in degrees: 1 – 45
• $angle-position-y: The Y position of the angle: top | bottom | both
• $angle-position-x: The X position of the angle: left | right
• $angle-position-bottom-x: The X position of the bottom angle if using ‘both’ for $angle-position-y: left | right
• $fallback: Create a fallback for older browsers: true | false
• $fallback-color: Fallback colour for older browsers: Hex color

Changelog:

10/19/2018

• Bugfix