 class Apollos.modal extends Apollos.Component
 
   @register "Apollos.modal"
+
+  vars: -> [
+    desktopDuration: 250
+    mobileDuration: 400
+  ]
 
   events: -> [
     "click [data-dismiss]": @.destroy

      null

  insertDOMElement: (parent, node, before) ->

    width = $(window).width()
    height = $(window).height()

    if width >= 767
      # fade in background
      $(node).appendTo(parent)
        .velocity "fadeIn",
          duration: 250

      # slide in panel from left
      $(node).children('.side-panel')

          translateY: height
          opacity: 1
        ,
          duration: self.mobileDuration.get()
          complete: (elements) ->
            $(node).remove()
            $('html').removeClass 'modal--opened'
