removed deprecated text shadows from example files and improved text shadow example and box shadow example markup

This commit is contained in:
Brandon Mathis 2010-12-17 22:49:19 -06:00
parent 30f446daa0
commit 4abe386847
8 changed files with 30 additions and 24 deletions

View File

@ -14,7 +14,7 @@ GIT
PATH PATH
remote: .. remote: ..
specs: specs:
compass (0.11.alpha.4.2da5502) compass (0.11.alpha.4.30f446d)
chunky_png (~> 0.10.3) chunky_png (~> 0.10.3)
sass (>= 3.1.0.alpha.50) sass (>= 3.1.0.alpha.50)

View File

@ -5,7 +5,7 @@
background-color: blue background-color: blue
border: 10px solid rgba(255, 0, 0, 0.5) border: 10px solid rgba(255, 0, 0, 0.5)
color: white color: white
+text-shadow(darken(#00f, 50%), 2px, 2px) +text-shadow(darken(#00f, 50%) 2px 2px)
padding: 3px padding: 3px
text-align: center text-align: center
margin-bottom: 2em margin-bottom: 2em

View File

@ -9,7 +9,7 @@
position: top left position: top left
border: 10px solid rgba(255, 0, 0, 0.5) border: 10px solid rgba(255, 0, 0, 0.5)
color: white color: white
+text-shadow(darken(#00f, 50%), 2px, 2px) +text-shadow(darken(#00f, 50%) 2px 2px)
padding: 1em padding: 1em
text-align: center text-align: center
margin-bottom: 2em margin-bottom: 2em

View File

@ -9,7 +9,7 @@
position: top left position: top left
border: 10px solid rgba(255, 0, 0, 0.5) border: 10px solid rgba(255, 0, 0, 0.5)
color: black color: black
+text-shadow(#fff, 1px, 1px, 4px) +text-shadow(#fff 1px 1px 4px)
padding: 1em padding: 1em
text-align: center text-align: center
margin-bottom: 2em margin-bottom: 2em

View File

@ -1,3 +1,4 @@
#box-shadow-default.box-shadow-example .box-shadow-example
#box-shadow-default
#box-shadow-custom.box-shadow-example #box-shadow-custom
#box-shadow-custom-multiple

View File

@ -1,15 +1,19 @@
@import compass/css3 @import compass/css3
.box-shadow-example .box-shadow-example div
width: 40px width: 40px
height: 40px height: 40px
background: #EEE background: #EEE
margin: 20px margin: 20px
float: left
// Default box shadow // Default single box shadow
#box-shadow-default #box-shadow-default
+box-shadow +single-box-shadow
// Box shadow with custom settings // Box shadow with custom settings
#box-shadow-custom #box-shadow-custom
+box-shadow(red, 2px, 2px, 10px) +box-shadow(red 2px 2px 10px)
#box-shadow-custom-multiple
+box-shadow(rgba(blue, .4) 0 0 25px, rgba(green, .2) 0 0 3px 1px inset)

View File

@ -1,8 +1,3 @@
#p %div this text has no shadow
this text has no shadow .has-single-shadow this text has a shadow
.has-custom-shadow this text has a custom shadow
#p
%span(class="has-shadow") this text has a shadow
#p
%span(class="has-custom-shadow") this text has a custom shadow

View File

@ -1,7 +1,13 @@
$default-text-shadow-color: rgba(red, .6)
$default-text-shadow-blur: 3px
$default-text-shadow-v-offset: 1px
@import compass/css3 @import compass/css3
.has-shadow // Uses defaults set before the import above
+text-shadow .has-single-shadow
+single-text-shadow
// Can output up to ten text shadows
.has-custom-shadow .has-custom-shadow
+text-shadow(red, 3px, 3px, 0) +text-shadow(rgba(blue, .2) 1px 1px 0, rgba(blue, .2) 2px 2px 0, rgba(blue, .2) 3px 3px 0)