Posted By

track02 on 05/18/11

Tagged

Versions (?)

Last Edited at 05/18/11 05:25pm

Statistics

Viewed 644 times

Favorited by 0 user(s)

Related snippets

Round Corners SASS

/ Published in: SASS

SASS, not SCSS

Highlighted TextExpand

!default_rounded_amount ||= 5px

// Round corner at position by amount.
// values for position: "top-left", "top-right", "bottom-left", "bottom-right"
=round-corner(!position, !amount = !default_rounded_amount)
  border-#{!position}-radius= !amount
  -moz-border-#{!position}-radius= !amount
  -webkit-border-#{!position}-radius= !amount

// Round left corners by amount
=round-left-corners(!amount = !default_rounded_amount)
  +round-corner("top-left", !amount)
  +round-corner("bottom-left", !amount)

// Round right corners by amount
=round-right-corners(!amount = !default_rounded_amount)
  +round-corner("top-right", !amount)
  +round-corner("bottom-right", !amount)

// Round top corners by amount
=round-top-corners(!amount = !default_rounded_amount)
  +round-corner("top-left", !amount)
  +round-corner("top-right", !amount)

// Round bottom corners by amount
=round-bottom-corners(!amount = !default_rounded_amount)
  +round-corner("bottom-left", !amount)
  +round-corner("bottom-right", !amount)

// Round all corners by amount
=round-corners(!amount = !default_rounded_amount)
  border-radius: !amount
  -moz-border-radius= !amount
  -webkit-border-radius= !amount

URL: https://gist.github.com/140430

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.