Clean up the border-radius example

doc-src/content/examples/compass/css3/border_radius/markup.haml

@@ -1,49 +1,39 @@
+#border-radius.border-radius-example
   %p
     Box with all corners rounded
 
-#border-radius.border-radius-example
-
+#border-radius-top-left.border-radius-example
   %p
     Box with only top left corner rounded
 
-#border-radius-top-left.border-radius-example
-
+#border-radius-top-right.border-radius-example
   %p
     Box with only top right corner rounded
 
-#border-radius-top-right.border-radius-example
-
+#border-radius-bottom-left.border-radius-example
   %p
     Box with only bottom left corner rounded
 
-#border-radius-bottom-left.border-radius-example
-
+#border-radius-bottom-right.border-radius-example
   %p
     Box with only bottom right corner rounded
 
-#border-radius-bottom-right.border-radius-example
-
+#border-radiusTop.border-radius-example
   %p
     Box with top corners rounded
 
-#border-radiusTop.border-radius-example
-
+#border-radius-bottom.border-radius-example
   %p
     Box with bottom corners rounded
 
-#border-radius-bottom.border-radius-example
-
+#border-radius-left.border-radius-example
   %p
     Box with left corners rounded
 
-#border-radius-left.border-radius-example
-
+#border-radius-right.border-radius-example
   %p
     Box with right corners rounded
 
-#border-radius-right.border-radius-example
-
+#border-radius-combo.border-radius-example
   %p
     Box with different roundings for top/bottom and left/right
-
-#border-radius-combo.border-radius-example

doc-src/content/examples/compass/css3/border_radius/stylesheet.sass

@@ -1,40 +1,45 @@
-@import compass/css3
+@import compass/css3, compass/utilities
+
+#demo
+  +clearfix
 
 .border-radius-example
-  width: 40px
-  height: 40px
+  width: 125px
+  height: 125px
   background: red
   margin: 20px
+  float: left
+  padding: 5px
 
 #border-radius
-  +border-radius("10px")
+  +border-radius(25px)
 
 #border-radius-top-left
-  +border-top-left-radius("10px")
+  +border-top-left-radius(25px)
 
 #border-radius-top-right
-  +border-top-right-radius("10px")
+  +border-top-right-radius(25px)
 
 #border-radius-bottom-left
-  +border-bottom-left-radius("10px")
+  +border-bottom-left-radius(25px)
 
 #border-radius-bottom-right
-  +border-bottom-right-radius("10px")
+  +border-bottom-right-radius(25px)
 
 #border-radius-top
-  +border-top-radius("10px")
+  +border-top-radius(25px)
 
 #border-radius-bottom
-  +border-bottom-radius("10px")
+  +border-bottom-radius(25px)
 
 #border-radius-left
-  +border-left-radius("10px")
+  +border-left-radius(25px)
 
 #border-radius-right
-  +border-right-radius("10px")
+  +border-right-radius(25px)
 
 #border-radius-combo
-  +border-corner-radius("top", "left", "20px")
-  +border-corner-radius("top", "right", "5px")
-  +border-corner-radius("bottom", "left", "12px")
-  +border-corner-radius("bottom", "right", "28px")
+  +border-corner-radius(top, left, 40px)
+  +border-corner-radius(top, right, 5px)
+  +border-corner-radius(bottom, left, 15px)
+  +border-corner-radius(bottom, right, 30px)