StanAngeloff / compass-magick

Dynamic image generation for Compass using ChunkyPNG/PhantomJS.
http://StanAngeloff.github.com/compass-magick/
Other
157 stars 4 forks source link

Shadow generated outside of the canvas #3

Closed lmartins closed 13 years ago

lmartins commented 13 years ago

Im trying to create a small button with the following code:

button background: transparent magick-sprite('addtocart.png', magick-canvas(70px, 25px, magick-fill(magick-linear-gradient(adjust-lightness($bc_accent, 3%), adjust-lightness($bc_accent, -18%))), magick-corners(4px), magick-drop-shadow(90deg, 0px, 5px, black)))

It works as expected except about the shadow part, wich slightly visible behind the rounded part but otherwise outside of the generated png. Is this part of some config or a bug?

StanAngeloff commented 13 years ago

It is not a bug I am afraid, but how drop shadows work. If you fill the entire canvas then there is no room for the shadow. The best option would be to compose a slightly smaller canvas on top of another one which has some padding for the shadow:

magick-canvas(80px, 35px,
  magick-compose(
    magick-canvas(70px, 25px,
      magick-fill(red)
      magick-corners(4px)
    ),
    50%, 50%
  )
  magick-drop-shadow(90deg, 0px, 5px, black)
)
lmartins commented 13 years ago

Hum, i see your point. Thank you so much for your help.