Skip to content

Instantly share code, notes, and snippets.

@felixhageloh
Created August 26, 2014 07:09
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save felixhageloh/4c54a2a69b5a08b9f644 to your computer and use it in GitHub Desktop.
Übersicht widget with blur filter
command: "echo blurz"
refreshFrequency: 1000000000
style: """
top: 30%
left: 50%
width: 200px
height: 125px
margin-left: -(@width / 2)
overflow: hidden
.content
border-radius: 2px
background: rgba(#fff, 0.5)
color: #152033
font-size: 40px
line-height: @height
font-family: Ubuntu
text-align: center
bg-blur = 10px
.bg-slice
position: absolute
top: -(bg-blur)
left: -(bg-blur)
width: 100% + 2*bg-blur
height: 100% + 2*bg-blur
-webkit-filter: blur(bg-blur)
"""
render: (output) -> """
<canvas class='bg-slice'></canvas>
<div class='content'>#{output}</div>
"""
afterRender: (domEl) ->
uebersicht.makeBgSlice(el) for el in $(domEl).find '.bg-slice'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment