56 lines
1.7 KiB
Plaintext
56 lines
1.7 KiB
Plaintext
!!!
|
|
%html
|
|
%head
|
|
%link(href="stylesheets/fancy-fonts.css" rel="stylesheet" type="text/css")
|
|
%link(href="stylesheets/main.css" rel="stylesheet" type="text/css")
|
|
%link(href="stylesheets/gradient.css" rel="stylesheet" type="text/css")
|
|
%body
|
|
%h1 Compass CSS3 Module
|
|
#container
|
|
.examples
|
|
#background-clip.example
|
|
%h2 Background Clip & Origin
|
|
%pre.padding-box
|
|
%code<>
|
|
+background-clip("padding-box")<br />+background-origin("padding-box")
|
|
%pre.border-box
|
|
%code<>
|
|
+background-clip("border-box")<br />+background-origin("border-box")
|
|
.gutter
|
|
#background-size.example
|
|
%h2 Background Size
|
|
%pre.top-left
|
|
%code<>
|
|
+background-size(50% 50%)
|
|
%pre.centered
|
|
%code<>
|
|
+background-size(50% 50%)<br />background-position: center center
|
|
.gutter
|
|
#gradients.example
|
|
%h2 Gradients
|
|
%pre.horizontal
|
|
%code<>
|
|
+h-gradient(#d92626, #2626d9)
|
|
%pre.vertical
|
|
%code<>
|
|
+v-gradient(#d92626, #2626d9)
|
|
%pre.diagonal
|
|
%code<
|
|
+linear-gradient("left top",
|
|
"right bottom",
|
|
\#d92626, #2626d9)
|
|
%pre.radial
|
|
%code<>
|
|
+radial-gradient(<br /> "center center, 10, center center, 100",<br /> #d92626, #2626d9)
|
|
.examples
|
|
#border-radius.example
|
|
%h2 Border Radius
|
|
.gutter
|
|
#box-shadow.example
|
|
%h2 Box Shadow
|
|
.gutter
|
|
#box-sizing.example
|
|
%h2 Box Sizing
|
|
|
|
|