anchor.diff:                              p Double check the match ID, and try again!
   
                       else if error == "invalid"
  -                        div.alert.alert-block.alert-error.text-left
  -                            h4 Invalid match id!
  -                            p Double check the match ID, and try again!
  +                        div.alert.alert-error <strong>Invalid match id!</strong> Double check the match ID, and try again!
   
                       else if error == "notready"
  -                        div.alert.alert-block.text-left
  -                            h4 Not ready!
  -                            p Sorry!  My back-end isn't ready to fetch new data. Try again in 5 minutes.
  +                        div.alert.text-left <strong>Not ready!</strong> My back-end isn't ready to fetch new data. Try again in 5 minutes.
   
  -                    if replayState == "REPLAY_AVAILABLE"
  -                        div.alert.alert-block.alert-success
  -                            p Aw yis I found the replay for match #{matchid}
  -                            div.input-append
  -                                input.span6(type="text", value= replayUrl)
  -                                a.btn.btn-primary(href= replayUrl)
  -                                    i.icon-download-alt.icon-white
  -                                    span &nbsp;DOWNLOAD
  +                    if replayUrl
  +                        if replayState == "REPLAY_AVAILABLE"
  +                            div.alert.alert-success <strong>Aw yis</strong> I found the replay for match #{matchid}
  +                            -var dlDisabled = ""
   
  -                    else if replayState == "REPLAY_NOT_RECORDED"
  -                        div.alert.alert-block.alert-info
  -                            p No replay was recorded for #{matchid} :(
  -                            input.span7(type="text", disabled, value= replayUrl)
  +                        else if replayState == "REPLAY_NOT_RECORDED"
  +                            div.alert.alert-info No replay was recorded for #{matchid} :(
  +                            -var dlDisabled = "disabled"
   
  -                    else if replayState == "REPLAY_EXPIRED"
  -                        div.alert.alert-block.alert-info
  -                            p The replay for match #{matchid} has expired. :(
  -                            input.span7(type="text", disabled, value= replayUrl)
  +                        else if replayState == "REPLAY_EXPIRED"
  +                            div.alert.alert-info The replay for match #{matchid} has expired. :(
  +                                -var dlDisabled = "disabled"
  +
  +                        div.form-group
  +                            div.input-group
  +                                if dlDisabled
  +                                    input.form-control(type="text", value= replayUrl, disabled)
  +                                    span.input-group-btn
  +                                        a.btn.btn-primary(href= "http://www.youtube.com/watch?v=MIpPfHCe_4w&t=4") I'm disabled
  +                                else
  +                                    input.form-control(type="text", value= replayUrl)
  +                                    span.input-group-btn
  +                                        a.btn.btn-primary(href= replayUrl) DOWNLOAD
  +                            hr
   
                       form
  -                        input(type="text", name="matchid", placeholder="Match ID")
  -                        br
  -                        button.btn(type="submit") I would very much appreciate a download url please.
  -                    div.offset1.span6
  -                        p <strong>The page may take a long time to load</strong> because of how the back-end gathers replay data. If you spam F5 you will be forced to fulfil /u/croatianpride's destiny.
  +                        div.form-group.input-group
  +                            input.form-control(type="text", name="matchid", placeholder="Match ID")
  +                            span.input-group-btn
  +                                button.btn.btn-primary(type="submit") Find replay
   
  +                    p <strong>The page may take a long time to load</strong> because of how the back-end gathers replay data. If you spam F5 you will be forced to fulfil /u/croatianpride's destiny.
  +
  +        script(src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js")
  +        script(src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js")
           script.
               (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
               (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  
positive.code:                         li.nav-header
                              :markdown
                                  © [RJ](https://rjackson.me), PROBABLY
                  div.span8.text-center
                      if error == "timeout"
                          div.alert.alert-block.alert-error.text-left
                              h4 Request took too long!
  
negative.code: html
      head
          title= title
          link(rel='stylesheet', href='//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css')
          meta(name="viewport", content="width=device-width, initial-scale=1.0")
          style.
              // Fack you bootstrap3, nav-list is my favourite list.
              .nav-list {
                  padding-left: 15px;
                  padding-right: 15px;
                  margin-bottom: 0;
              }
              .nav-header {
                  display: block;
                  padding: 3px 15px;
                  font-size: 11px;
                  font-weight: bold;
                  line-height: 20px;
                  color: hsl(0, 0%, 60%);
                  text-shadow: 0 1px 0 hsla(0, 100%, 100%, 0.5);
                  text-transform: uppercase;
              }
              .nav-list>li>a,
              .nav-list .nav-header {
                  margin-left: -15px;
                  margin-right: -15px;
                  text-shadow: 0 1px 0 hsla(0, 100%, 100%, 0.5);
              }
              .nav li+.nav-header {
                  margin-top: 9px;
              }
      body
          div.container
              h1.text-center= title
              hr
              div.row
                  div.col-2
                      ul.nav.nav-list
                          li.nav-header
  
  