github-migration/compass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compass Example

Browse Source
This commit is contained in:
Chris Eppstein 2008-09-02 00:08:40 -07:00
parent 7c465cc05d
commit 975f06daa1
2 changed files with 66 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
examples/compass/compass.html Normal file
View File

@ -0,0 +1,19 @@
<html>
<head>
<title>Compass Example</title>
<link rel="stylesheet" href="stylesheets/compass.css" type="text/css" media="screen, projection">
</head>
<body>
<div class="compass">
<div class="n"><p>North</p></div>
<div class="n e"><p>North<br/>East</p></div>
<div class="e"><p>East</p></div>
<div class="s e"><p>South<br/>East</p></div>
<div class="s"><p>South</p></div>
<div class="s w"><p>South<br/>West</p></div>
<div class="w"><p>West</p></div>
<div class="n w"><p>North<br/>West</p></div>
</div>
</body>
</html>

47
examples/compass/stylesheets/compass.sass Normal file
View File

@ -0,0 +1,47 @@
=compass(!s)
:position relative
:width= 4 * !s
:height= 4 * !s
:font-size 24px
:font-family "Academy Engraved LET", "Papyrus"
.n, .s, .e, .w
:position absolute
:width= !s
:height= !s
:text-align center
:vertical-align middle
.w
:left 0px
.n.w, .s.w
:left= 0.5 * !s
.n, .s
:left= 1.5 * !s
.n.e, .s.e
:left= 2.5 * !s
.e
:left= 3 * !s
.n
:top 0px
.n.w, .n.e
:top= 0.5 * !s
.w, .e
:top= 1.5 * !s
.s.w, .s.e
:top= 2.5 * !s
.s
:top= 3 * !s
.compass
:margin 1em auto
+compass(4em)
.n, .s, .e, .w
p
:margin
:top 1.5em
:bottom 1.5em
.n.w, .s.w, .n.e, .s.e
p
:margin
:top 1em
:bottom 1em