Skip to content

Instantly share code, notes, and snippets.

@merbjedi
Created February 24, 2010 21:35
Show Gist options
  • Save merbjedi/313875 to your computer and use it in GitHub Desktop.
Save merbjedi/313875 to your computer and use it in GitHub Desktop.
// clear rounded
= rounded-clear
-moz-border-radius: 0px
-webkit-border-radius: 0px
border-radius: 0
// round corners (base)
= rounded(!radius = 10)
-moz-border-radius: #{!radius}px
-webkit-border-radius: #{!radius}px
border-radius: #{!radius}px
// top rounded corners
= rounded-top(!radius = 10)
+rounded-top-left(!radius)
+rounded-top-right(!radius)
= rounded-top-left(!radius = 10)
-moz-border-radius-topleft: #{!radius}px
-webkit-border-top-left-radius: #{!radius}px
border-top-left-radius: #{!radius}px
= rounded-top-right(!radius = 10)
-moz-border-radius-topright: #{!radius}px
-webkit-border-top-right-radius: #{!radius}px
border-top-right-radius: #{!radius}px
// bottom rounded corners
= rounded-bottom(!radius = 10)
+rounded-bottom-left(!radius)
+rounded-bottom-right(!radius)
= rounded-bottom-left(!radius = 10)
-moz-border-radius-bottomleft: #{!radius}px
-webkit-border-bottom-left-radius: #{!radius}px
border-bottom-left-radius: #{!radius}px
= rounded-bottom-right(!radius = 10)
-moz-border-radius-bottomright: #{!radius}px
-webkit-border-bottom-right-radius: #{!radius}px
border-bottom-right-radius: #{!radius}px
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment