Merge branch 'master' into '7-7-stable'

Changes from master into 7.7

There are list of changes it will be good to have in 7.7 release like comment improvements and fixes to CI on tags

See merge request !1402

CHANGELOG

@@ -24,6 +24,10 @@ v 7.7.0
   - Trigger GitLab CI when push tags
   - When accept merge request - do merge using sidaekiq job
   - Enable web signups by default
+  - Fixes for diff comments: drag-n-drop images, selecting images
+  - Fixes for edit comments: drag-n-drop images, preview mode, selecting images, save & update 
+  - Remove password strength indicator
+  
 v 7.6.0

app/assets/javascripts/application.js.coffee

@@ -18,7 +18,6 @@
 #= require jquery.turbolinks
 #= require turbolinks
 #= require bootstrap
-#= require password_strength
 #= require select2
 #= require raphael
 #= require g.raphael-min
@@ -109,9 +108,19 @@ window.unbindEvents = ->
   $(document).unbind('scroll')
   $(document).off('scroll')
+window.shiftWindow = ->
+  scrollBy 0, -50
+
 document.addEventListener("page:fetch", unbindEvents)
+# Scroll the window to avoid the topnav bar
+# https://github.com/twitter/bootstrap/issues/1768
+if location.hash
+  setTimeout shiftWindow, 1
+window.addEventListener "hashchange", shiftWindow
+
 $ ->
+
   # Click a .one_click_select field, select the contents
   $(".one_click_select").on 'click', -> $(@).select()

app/assets/javascripts/dispatcher.js.coffee

@@ -33,17 +33,20 @@ class Dispatcher
         GitLab.GfmAutoComplete.setup()
         shortcut_handler = new ShortcutsNavigation()
         new ZenMode()
+        new DropzoneInput($('.issue-form'))
       when 'projects:merge_requests:new', 'projects:merge_requests:edit'
         GitLab.GfmAutoComplete.setup()
         new Diff()
         shortcut_handler = new ShortcutsNavigation()
         new ZenMode()
+        new DropzoneInput($('.merge-request-form'))
       when 'projects:merge_requests:show'
         new Diff()
         shortcut_handler = new ShortcutsIssueable()
         new ZenMode()
       when "projects:merge_requests:diffs"
         new Diff()
+        new ZenMode()
       when 'projects:merge_requests:index'
         shortcut_handler = new ShortcutsNavigation()
       when 'dashboard:show'
@@ -108,6 +111,7 @@ class Dispatcher
             new Wikis()
             shortcut_handler = new ShortcutsNavigation()
             new ZenMode()
+            new DropzoneInput($('.wiki-form'))
           when 'snippets', 'labels', 'graphs'
             shortcut_handler = new ShortcutsNavigation()
           when 'team_members', 'deploy_keys', 'hooks', 'services', 'protected_branches'

app/assets/javascripts/dropzone_input.js.coffee

+class @DropzoneInput
+  constructor: (form) ->
+    Dropzone.autoDiscover = false
+    alertClass = "alert alert-danger alert-dismissable div-dropzone-alert"
+    alertAttr = "class=\"close\" data-dismiss=\"alert\"" + "aria-hidden=\"true\""
+    divHover = "<div class=\"div-dropzone-hover\"></div>"
+    divSpinner = "<div class=\"div-dropzone-spinner\"></div>"
+    divAlert = "<div class=\"" + alertClass + "\"></div>"
+    iconPicture = "<i class=\"fa fa-picture-o div-dropzone-icon\"></i>"
+    iconSpinner = "<i class=\"fa fa-spinner fa-spin div-dropzone-icon\"></i>"
+    btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>"
+    project_image_path_upload = window.project_image_path_upload or null
+
+    form_textarea = $(form).find("textarea.markdown-area")
+    form_textarea.wrap "<div class=\"div-dropzone\"></div>"
+
+    form_dropzone = $(form).find('.div-dropzone')
+    form_dropzone.parent().addClass "div-dropzone-wrapper"
+    form_dropzone.append divHover
+    $(".div-dropzone-hover").append iconPicture
+    form_dropzone.append divSpinner
+    $(".div-dropzone-spinner").append iconSpinner
+    $(".div-dropzone-spinner").css
+      "opacity": 0
+      "display": "none"
+
+    # Preview button
+    $(document).off "click", ".js-md-preview-button"
+    $(document).on "click", ".js-md-preview-button", (e) ->
+      ###
+      Shows the Markdown preview.
+
+      Lets the server render GFM into Html and displays it.
+      ###
+      e.preventDefault()
+      form = $(this).closest("form")
+      # toggle tabs
+      form.find(".js-md-write-button").parent().removeClass "active"
+      form.find(".js-md-preview-button").parent().addClass "active"
+
+      # toggle content
+      form.find(".md-write-holder").hide()
+      form.find(".md-preview-holder").show()
+
+      preview = form.find(".js-md-preview")
+      mdText = form.find(".markdown-area").val()
+      if mdText.trim().length is 0
+        preview.text "Nothing to preview."
+      else
+        preview.text "Loading..."
+        $.get($(this).data("url"),
+          md_text: mdText
+        ).success (previewData) ->
+          preview.html previewData
+
+    # Write button
+    $(document).off "click", ".js-md-write-button"
+    $(document).on "click", ".js-md-write-button", (e) ->
+      ###
+      Shows the Markdown textarea.
+      ###
+      e.preventDefault()
+      form = $(this).closest("form")
+      # toggle tabs
+      form.find(".js-md-write-button").parent().addClass "active"
+      form.find(".js-md-preview-button").parent().removeClass "active"
+
+      # toggle content
+      form.find(".md-write-holder").show()
+      form.find(".md-preview-holder").hide()
+
+    dropzone = form_dropzone.dropzone(
+      url: project_image_path_upload
+      dictDefaultMessage: ""
+      clickable: true
+      paramName: "markdown_img"
+      maxFilesize: 10
+      uploadMultiple: false
+      acceptedFiles: "image/jpg,image/jpeg,image/gif,image/png"
+      headers:
+        "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
+
+      previewContainer: false
+
+      processing: ->
+        $(".div-dropzone-alert").alert "close"
+
+      dragover: ->
+        form_textarea.addClass "div-dropzone-focus"
+        form.find(".div-dropzone-hover").css "opacity", 0.7
+        return
+
+      dragleave: ->
+        form_textarea.removeClass "div-dropzone-focus"
+        form.find(".div-dropzone-hover").css "opacity", 0
+        return
+
+      drop: ->
+        form_textarea.removeClass "div-dropzone-focus"
+        form.find(".div-dropzone-hover").css "opacity", 0
+        form_textarea.focus()
+        return
+
+      success: (header, response) ->
+        child = $(dropzone[0]).children("textarea")
+        $(child).val $(child).val() + formatLink(response.link) + "\n"
+        return
+
+      error: (temp, errorMessage) ->
+        checkIfMsgExists = $(".error-alert").children().length
+        if checkIfMsgExists is 0
+          $(".error-alert").append divAlert
+          $(".div-dropzone-alert").append btnAlert + errorMessage
+        return
+
+      sending: ->
+        form_dropzone.find(".div-dropzone-spinner").css
+          "opacity": 0.7
+          "display": "inherit"
+        return
+
+      complete: ->
+        $(".dz-preview").remove()
+        $(".markdown-area").trigger "input"
+        $(".div-dropzone-spinner").css
+          "opacity": 0
+          "display": "none"
+        return
+    )
+
+    child = $(dropzone[0]).children("textarea")
+
+    formatLink = (str) ->
+      "![" + str.alt + "](" + str.url + ")"
+
+    handlePaste = (e) ->
+      e.preventDefault()
+      my_event = e.originalEvent
+
+      if my_event.clipboardData and my_event.clipboardData.items
+        processItem(my_event)
+
+    processItem = (e) ->
+      image = isImage(e)
+      if image
+        filename = getFilename(e) or "image.png"
+        text = "{{" + filename + "}}"
+        pasteText(text)
+        uploadFile image.getAsFile(), filename
+
+      else
+        text = e.clipboardData.getData("text/plain")
+        pasteText(text)
+
+    isImage = (data) ->
+      i = 0
+      while i < data.clipboardData.items.length
+        item = data.clipboardData.items[i]
+        if item.type.indexOf("image") isnt -1
+          return item
+        i++
+      return false
+
+    pasteText = (text) ->
+      caretStart = $(child)[0].selectionStart
+      caretEnd = $(child)[0].selectionEnd
+      textEnd = $(child).val().length
+
+      beforeSelection = $(child).val().substring 0, caretStart
+      afterSelection = $(child).val().substring caretEnd, textEnd
+      $(child).val beforeSelection + text + afterSelection
+      form_textarea.trigger "input"
+
+    getFilename = (e) ->
+      if window.clipboardData and window.clipboardData.getData
+        value = window.clipboardData.getData("Text")
+      else if e.clipboardData and e.clipboardData.getData
+        value = e.clipboardData.getData("text/plain")
+
+      value = value.split("\r")
+      value.first()
+
+    uploadFile = (item, filename) ->
+      formData = new FormData()
+      formData.append "markdown_img", item, filename
+      $.ajax
+        url: project_image_path_upload
+        type: "POST"
+        data: formData
+        dataType: "json"
+        processData: false
+        contentType: false
+        headers:
+          "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
+
+        beforeSend: ->
+          showSpinner()
+          closeAlertMessage()
+
+        success: (e, textStatus, response) ->
+          insertToTextArea(filename, formatLink(response.responseJSON.link))
+
+        error: (response) ->
+          showError(response.responseJSON.message)
+
+        complete: ->
+          closeSpinner()
+
+    insertToTextArea = (filename, url) ->
+      $(child).val (index, val) ->
+        val.replace("{{" + filename + "}}", url + "\n")
+
+    appendToTextArea = (url) ->
+      $(child).val (index, val) ->
+        val + url + "\n"
+
+    showSpinner = (e) ->
+      form.find(".div-dropzone-spinner").css
+        "opacity": 0.7
+        "display": "inherit"
+
+    closeSpinner = ->
+      form.find(".div-dropzone-spinner").css
+        "opacity": 0
+        "display": "none"
+
+    showError = (message) ->
+      checkIfMsgExists = $(".error-alert").children().length
+      if checkIfMsgExists is 0
+        $(".error-alert").append divAlert
+        $(".div-dropzone-alert").append btnAlert + message
+
+    closeAlertMessage = ->
+      form.find(".div-dropzone-alert").alert "close"
+
+    form.find(".markdown-selector").click (e) ->
+      e.preventDefault()
+      $(@).closest('.gfm-form').find('.div-dropzone').click()
+      return
+
+  formatLink: (str) ->
+    "![" + str.alt + "](" + str.url + ")"

app/assets/javascripts/markdown_area.js.coffee

-formatLink = (str) ->
-  "![" + str.alt + "](" + str.url + ")"
-
-$(document).ready ->
-  alertClass = "alert alert-danger alert-dismissable div-dropzone-alert"
-  alertAttr = "class=\"close\" data-dismiss=\"alert\"" + "aria-hidden=\"true\""
-  divHover = "<div class=\"div-dropzone-hover\"></div>"
-  divSpinner = "<div class=\"div-dropzone-spinner\"></div>"
-  divAlert = "<div class=\"" + alertClass + "\"></div>"
-  iconPicture = "<i class=\"fa fa-picture-o div-dropzone-icon\"></i>"
-  iconSpinner = "<i class=\"fa fa-spinner fa-spin div-dropzone-icon\"></i>"
-  btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>"
-  project_image_path_upload = window.project_image_path_upload or null
-
-  $("textarea.markdown-area").wrap "<div class=\"div-dropzone\"></div>"
-
-  $(".div-dropzone").parent().addClass "div-dropzone-wrapper"
-
-  $(".div-dropzone").append divHover
-  $(".div-dropzone-hover").append iconPicture
-  $(".div-dropzone").append divSpinner
-  $(".div-dropzone-spinner").append iconSpinner
-  $(".div-dropzone-spinner").css
-    "opacity": 0
-    "display": "none"
-
-  # Preview button
-  $(document).off "click", ".js-md-preview-button"
-  $(document).on "click", ".js-md-preview-button", (e) ->
-    ###
-    Shows the Markdown preview.
-
-    Lets the server render GFM into Html and displays it.
-    ###
-    e.preventDefault()
-    form = $(this).closest("form")
-    # toggle tabs
-    form.find(".js-md-write-button").parent().removeClass "active"
-    form.find(".js-md-preview-button").parent().addClass "active"
-
-    # toggle content
-    form.find(".md-write-holder").hide()
-    form.find(".md-preview-holder").show()
-
-    preview = form.find(".js-md-preview")
-    mdText = form.find(".markdown-area").val()
-    if mdText.trim().length is 0
-      preview.text "Nothing to preview."
-    else
-      preview.text "Loading..."
-      $.get($(this).data("url"),
-        md_text: mdText
-      ).success (previewData) ->
-        preview.html previewData
-
-  # Write button
-  $(document).off "click", ".js-md-write-button"
-  $(document).on "click", ".js-md-write-button", (e) ->
-    ###
-    Shows the Markdown textarea.
-    ###
-    e.preventDefault()
-    form = $(this).closest("form")
-    # toggle tabs
-    form.find(".js-md-write-button").parent().addClass "active"
-    form.find(".js-md-preview-button").parent().removeClass "active"
-
-    # toggle content
-    form.find(".md-write-holder").show()
-    form.find(".md-preview-holder").hide()
-
-  dropzone = $(".div-dropzone").dropzone(
-    url: project_image_path_upload
-    dictDefaultMessage: ""
-    clickable: true
-    paramName: "markdown_img"
-    maxFilesize: 10
-    uploadMultiple: false
-    acceptedFiles: "image/jpg,image/jpeg,image/gif,image/png"
-    headers:
-      "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
-
-    previewContainer: false
-
-    processing: ->
-      $(".div-dropzone-alert").alert "close"
-
-    dragover: ->
-      $(".div-dropzone > textarea").addClass "div-dropzone-focus"
-      $(".div-dropzone-hover").css "opacity", 0.7
-      return
-
-    dragleave: ->
-      $(".div-dropzone > textarea").removeClass "div-dropzone-focus"
-      $(".div-dropzone-hover").css "opacity", 0
-      return
-
-    drop: ->
-      $(".div-dropzone > textarea").removeClass "div-dropzone-focus"
-      $(".div-dropzone-hover").css "opacity", 0
-      $(".div-dropzone > textarea").focus()
-      return
-
-    success: (header, response) ->
-      child = $(dropzone[0]).children("textarea")
-      $(child).val $(child).val() + formatLink(response.link) + "\n"
-      return
-
-    error: (temp, errorMessage) ->
-      checkIfMsgExists = $(".error-alert").children().length
-      if checkIfMsgExists is 0
-        $(".error-alert").append divAlert
-        $(".div-dropzone-alert").append btnAlert + errorMessage
-      return
-
-    sending: ->
-      $(".div-dropzone-spinner").css
-        "opacity": 0.7
-        "display": "inherit"
-      return
-
-    complete: ->
-      $(".dz-preview").remove()
-      $(".markdown-area").trigger "input"
-      $(".div-dropzone-spinner").css
-        "opacity": 0
-        "display": "none"
-      return
-  )
-
-  child = $(dropzone[0]).children("textarea")
-
-  formatLink = (str) ->
-    "![" + str.alt + "](" + str.url + ")"
-
-  handlePaste = (e) ->
-    e.preventDefault()
-    my_event = e.originalEvent
-
-    if my_event.clipboardData and my_event.clipboardData.items
-      processItem(my_event)
-
-  processItem = (e) ->
-    image = isImage(e)
-    if image
-      filename = getFilename(e) or "image.png"
-      text = "{{" + filename + "}}"
-      pasteText(text)
-      uploadFile image.getAsFile(), filename
-
-    else
-      text = e.clipboardData.getData("text/plain")
-      pasteText(text)
-
-  isImage = (data) ->
-    i = 0
-    while i < data.clipboardData.items.length
-      item = data.clipboardData.items[i]
-      if item.type.indexOf("image") isnt -1
-        return item
-      i++
-    return false
-
-  pasteText = (text) ->
-    caretStart = $(child)[0].selectionStart
-    caretEnd = $(child)[0].selectionEnd
-    textEnd = $(child).val().length
-
-    beforeSelection = $(child).val().substring 0, caretStart
-    afterSelection = $(child).val().substring caretEnd, textEnd
-    $(child).val beforeSelection + text + afterSelection
-    $(".markdown-area").trigger "input"
-
-  getFilename = (e) ->
-    if window.clipboardData and window.clipboardData.getData
-      value = window.clipboardData.getData("Text")
-    else if e.clipboardData and e.clipboardData.getData
-      value = e.clipboardData.getData("text/plain")
-
-    value = value.split("\r")
-    value.first()
-
-  uploadFile = (item, filename) ->
-    formData = new FormData()
-    formData.append "markdown_img", item, filename
-    $.ajax
-      url: project_image_path_upload
-      type: "POST"
-      data: formData
-      dataType: "json"
-      processData: false
-      contentType: false
-      headers:
-        "X-CSRF-Token": $("meta[name=\"csrf-token\"]").attr("content")
-
-      beforeSend: ->
-        showSpinner()
-        closeAlertMessage()
-
-      success: (e, textStatus, response) ->
-        insertToTextArea(filename, formatLink(response.responseJSON.link))
-
-      error: (response) ->
-        showError(response.responseJSON.message)
-
-      complete: ->
-        closeSpinner()
-
-  insertToTextArea = (filename, url) ->
-    $(child).val (index, val) ->
-      val.replace("{{" + filename + "}}", url + "\n")
-
-  appendToTextArea = (url) ->
-    $(child).val (index, val) ->
-      val + url + "\n"
-
-  showSpinner = (e) ->
-    $(".div-dropzone-spinner").css
-      "opacity": 0.7
-      "display": "inherit"
-
-  closeSpinner = ->
-    $(".div-dropzone-spinner").css
-      "opacity": 0
-      "display": "none"
-
-  showError = (message) ->
-    checkIfMsgExists = $(".error-alert").children().length
-    if checkIfMsgExists is 0
-      $(".error-alert").append divAlert
-      $(".div-dropzone-alert").append btnAlert + message
-
-  closeAlertMessage = ->
-    $(".div-dropzone-alert").alert "close"
-
-  $(".markdown-selector").click (e) ->
-    e.preventDefault()
-    $(@).closest('.gfm-form').find('.div-dropzone').click()
-    return
-
-  return

app/assets/javascripts/notes.js.coffee

@@ -219,6 +219,7 @@ class @Notes
   setupNoteForm: (form) ->
     disableButtonIfEmptyField form.find(".js-note-text"), form.find(".js-comment-button")
     form.removeClass "js-new-note-form"
+    form.find('.div-dropzone').remove()
     # setup preview buttons
     form.find(".js-md-write-button, .js-md-preview-button").tooltip placement: "left"
@@ -233,6 +234,7 @@ class @Notes
     # remove notify commit author checkbox for non-commit notes
     form.find(".js-notify-commit-author").remove()  if form.find("#note_noteable_type").val() isnt "Commit"
     GitLab.GfmAutoComplete.setup()
+    new DropzoneInput(form)
     form.show()
@@ -259,8 +261,10 @@ class @Notes
   Updates the current note field.
   ###
   updateNote: (xhr, note, status) =>
-    note_li = $("#note_" + note.id)
+    note_li = $(".note-row-" + note.id)
     note_li.replaceWith(note.html)
+    note_li.find('.note-edit-form').hide()
+    note_li.find('.note-text').show()
     code = "#note_" + note.id + " .highlight pre code"
     $(code).each (i, e) ->
       hljs.highlightBlock(e)
@@ -276,11 +280,19 @@ class @Notes
     e.preventDefault()
     note = $(this).closest(".note")
     note.find(".note-text").hide()
+    note.find(".note-header").hide()
+    base_form = note.find(".note-edit-form")
+    form = base_form.clone().insertAfter(base_form)
+    form.addClass('current-note-edit-form')
+    form.find('.div-dropzone').remove()
     # Show the attachment delete link
     note.find(".js-note-attachment-delete").show()
+
+    # Setup markdown form
     GitLab.GfmAutoComplete.setup()
-    form = note.find(".note-edit-form")
+    new DropzoneInput(form)
+
     form.show()
     textarea = form.find("textarea")
     textarea.focus()
@@ -295,8 +307,8 @@ class @Notes
     e.preventDefault()
     note = $(this).closest(".note")
     note.find(".note-text").show()
-    note.find(".js-note-attachment-delete").hide()
-    note.find(".note-edit-form").hide()
+    note.find(".note-header").show()
+    note.find(".current-note-edit-form").remove()
   ###
   Called in response to deleting a note of any kind.

app/assets/javascripts/password_strength.js.coffee

-#= require pwstrength-bootstrap-1.2.2
-overwritten_messages =
-  wordSimilarToUsername: "Your password should not contain your username"
-
-overwritten_rules =
-  wordSequences: false
-
-options =
-  showProgressBar: false
-  showVerdicts: false
-  showPopover: true
-  showErrors: true
-  showStatus: true
-  errorMessages: overwritten_messages
-  
-$(document).ready ->
-  profileOptions = {}
-  profileOptions.ui = options
-  profileOptions.rules =
-    activated: overwritten_rules
-
-  deviseOptions = {}
-  deviseOptions.common =
-    usernameField: "#user_username"
-  deviseOptions.ui = options
-  deviseOptions.rules =
-    activated: overwritten_rules
-
-  $("#user_password_profile").pwstrength profileOptions
-  $("#user_password_sign_up").pwstrength deviseOptions
-  $("#user_password_recover").pwstrength deviseOptions

app/assets/javascripts/zen_mode.js.coffee

@@ -10,7 +10,15 @@ class @ZenMode
       if not @active_checkbox
         @scroll_position = window.pageYOffset
-    $('body').on 'change', '.zennable input[type=checkbox]', (e) =>
+    $('body').on 'click', '.zen-enter-link', (e) =>
+      e.preventDefault()
+      $(e.currentTarget).closest('.zennable').find('.zen-toggle-comment').prop('checked', true)
+
+    $('body').on 'click', '.zen-leave-link', (e) =>
+      e.preventDefault()
+      $(e.currentTarget).closest('.zennable').find('.zen-toggle-comment').prop('checked', false)
+
+    $('body').on 'change', '.zen-toggle-comment', (e) =>
       checkbox = e.currentTarget
       if checkbox.checked
         # Disable other keyboard shortcuts in ZEN mode
@@ -32,8 +40,6 @@ class @ZenMode
     @active_zen_area = @active_checkbox.parent().find('textarea')
     @active_zen_area.focus()
     window.location.hash = ZenMode.fullscreen_prefix + @active_checkbox.prop('id')
-    # Disable dropzone in ZEN mode
-    Dropzone.forElement('.div-dropzone').disable()
   exitZenMode: =>
     if @active_zen_area isnt null

app/assets/stylesheets/generic/common.scss

@@ -273,10 +273,6 @@ img.emoji {
   height: 220px;
 }
-.navless-container {
-  margin-top: 68px;
-}
-
 .description-block {
   @extend .light-well;
   @extend .light;

app/assets/stylesheets/generic/forms.scss

@@ -97,136 +97,3 @@ label {
 .wiki-content {
   margin-top: 35px;
 }
-
-.zennable {
-  position: relative;
-
-  input {
-    display: none;
-  }
-
-  .collapse {
-    display: none;
-    opacity: 0.5;
-
-    &:before {
-      content: '\f066';
-      font-family: FontAwesome;
-      color: #000;
-      font-size: 28px;
-      position: relative;
-      padding: 30px 40px 0 0;
-    }
-
-    &:hover {
-      opacity: 0.8;
-    }
-  }
-
-  .expand {
-    opacity: 0.5;
-
-    &:before {
-      content: '\f065';
-      font-family: FontAwesome;
-      color: #000;
-      font-size: 14px;
-      line-height: 14px;
-      padding-right: 20px;
-      position: relative;
-      vertical-align: middle;
-    }
-
-    &:hover {
-      opacity: 0.8;
-    }
-  }
-
-  input:checked ~ .zen-backdrop .expand {
-    display: none;
-  }
-
-  input:checked ~ .zen-backdrop .collapse {
-    display: block;
-    position: absolute;
-    top: 0;
-  }
-
-  label {
-    position: absolute;
-    top: -26px;
-    right: 0;
-    font-variant: small-caps;
-    text-transform: uppercase;
-    font-size: 10px;
-    padding: 4px;
-    font-weight: 500;
-    letter-spacing: 1px;
-
-    &:before {
-      display: inline-block;
-      width: 10px;
-      height: 14px;
-    }
-  }
-
-  input:checked ~ .zen-backdrop {
-    background-color: white;
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    z-index: 1031;
-
-    textarea {
-      border: none;
-      box-shadow: none;
-      border-radius: 0;
-      color: #000;
-      font-size: 20px;
-      line-height: 26px;
-      padding: 30px;
-      display: block;
-      outline: none;
-      resize: none;
-      height: 100vh;
-      max-width: 900px;
-      margin: 0 auto;
-    }
-  }
-
-  .zen-backdrop textarea::-webkit-input-placeholder {
-    color: white;
-  }
-
-  .zen-backdrop textarea:-moz-placeholder {
-    color: white;
-  }
-
-  .zen-backdrop textarea::-moz-placeholder {
-    color: white;
-  }
-
-  .zen-backdrop textarea:-ms-input-placeholder {
-    color: white;
-  }
-
-  input:checked ~ .zen-backdrop textarea::-webkit-input-placeholder {
-    color: #999;
-  }
-
-  input:checked ~ .zen-backdrop textarea:-moz-placeholder {
-    color: #999;
-    opacity: 1;
-  }
-
-  input:checked ~ .zen-backdrop textarea::-moz-placeholder {
-    color: #999;
-    opacity: 1;
-  }
-
-  input:checked ~ .zen-backdrop textarea:-ms-input-placeholder {
-    color: #999;
-  }
-}

app/assets/stylesheets/generic/zen.scss

+.zennable {
+  position: relative;
+
+  input {
+    display: none;
+  }
+
+  .zen-enter-link {
+    color: #888;
+    position: absolute;
+    top: -26px;
+    right: 4px;
+  }
+
+  .zen-leave-link {
+    display: none;
+    color: #888;
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    padding: 5px;
+    font-size: 36px;
+
+    &:hover {
+      color: #111;
+    }
+  }
+
+  input:checked ~ .zen-backdrop .zen-enter-link {
+    display: none;
+  }
+
+  input:checked ~ .zen-backdrop .zen-leave-link {
+    display: block;
+    position: absolute;
+    top: 0;
+  }
+
+  input:checked ~ .zen-backdrop {
+    background-color: white;
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 1031;
+
+    textarea {
+      border: none;
+      box-shadow: none;
+      border-radius: 0;
+      color: #000;
+      font-size: 20px;
+      line-height: 26px;
+      padding: 30px;
+      display: block;
+      outline: none;
+      resize: none;
+      height: 100vh;
+      max-width: 900px;
+      margin: 0 auto;
+    }
+  }
+
+  .zen-backdrop textarea::-webkit-input-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea:-moz-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea::-moz-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea:-ms-input-placeholder {
+    color: white;
+  }
+
+  input:checked ~ .zen-backdrop textarea::-webkit-input-placeholder {
+    color: #999;
+  }
+
+  input:checked ~ .zen-backdrop textarea:-moz-placeholder {
+    color: #999;
+    opacity: 1;
+  }
+
+  input:checked ~ .zen-backdrop textarea::-moz-placeholder {
+    color: #999;
+    opacity: 1;
+  }
+
+  input:checked ~ .zen-backdrop textarea:-ms-input-placeholder {
+    color: #999;
+  }
+}

app/assets/stylesheets/main/layout.scss

@@ -2,6 +2,10 @@ html {
   overflow-y: scroll;
   &.touch .tooltip { display: none !important; }
+
+  body {
+    padding-top: 47px;
+  }
 }
 .container {
@@ -13,3 +17,6 @@ html {
   margin: 0 0;
 }
+.navless-container {
+  margin-top: 30px;
+}

app/assets/stylesheets/main/mixins.scss

@@ -65,10 +65,6 @@
     max-width: 100%;
   }
-  *:first-child {
-    margin-top: 0;
-  }
-
   code { padding: 0 4px; }
   h1 {

app/assets/stylesheets/sections/header.scss

@@ -8,8 +8,6 @@ header {
     margin-bottom: 0;
     min-height: 40px;
     border: none;
-    position: fixed;
-    top: 0;
     width: 100%;
     .navbar-inner {

app/assets/stylesheets/sections/markdown_area.scss

+.markdown-area {
+  background: #FFF;
+  border: 1px solid #ddd;
+  min-height: 100px;
+  padding: 5px;
+  font-size: 14px;
+  box-shadow: none;
+  width: 100%;
+}

app/assets/stylesheets/sections/sidebar.scss → app/assets/stylesheets/sections/nav_sidebar.scss

@@ -12,7 +12,6 @@
   width: 100%;
   padding: 15px;
   background: #FFF;
-  margin-top: 48px;
 }
 .nav-sidebar {
@@ -159,3 +158,4 @@
   @include expanded-sidebar;
 }
+

app/assets/stylesheets/sections/note_form.scss

+/**
+ * Note Form
+ */
+
+.comment-btn {
+  @extend .btn-create;
+}
+.reply-btn {
+  @extend .btn-primary;
+}
+.diff-file .diff-content {
+  tr.line_holder:hover {
+    &> td.line_content {
+      background: $hover !important;
+      border-color: darken($hover, 10%) !important;
+    }
+    &> td.new_line,
+    &> td.old_line {
+      background: darken($hover, 4%) !important;
+      border-color: darken($hover, 10%) !important;
+    }
+  }
+
+  tr.line_holder:hover > td .line_note_link {
+    opacity: 1.0;
+    filter: alpha(opacity=100);
+  }
+}
+.diff-file,
+.discussion {
+  .new_note {
+    margin: 0;
+    border: none;
+  }
+}
+.new_note {
+  display: none;
+}
+
+.new_note, .edit_note {
+  .buttons {
+    float: left;
+    margin-top: 8px;
+  }
+  .clearfix {
+    margin-bottom: 0;
+  }
+
+  .note-preview-holder {
+    > p {
+      overflow-x: auto;
+    }
+  }
+
+  .note_text {
+    width: 100%;
+  }
+}
+
+/* loading indicator */
+.notes-busy {
+  margin: 18px;
+}
+
+.note-image-attach {
+  @extend .col-md-4;
+  @extend .thumbnail;
+  margin-left: 45px;
+  float: none;
+}
+
+.common-note-form {
+  margin: 0;
+  background: #F9F9F9;
+  padding: 5px;
+  border: 1px solid #DDD;
+}
+
+.note-form-actions {
+  background: #F9F9F9;
+  height: 45px;
+
+  .note-form-option {
+    margin-top: 8px;
+    margin-left: 30px;
+    @extend .pull-left;
+  }
+
+  .js-notify-commit-author {
+    float: left;
+  }
+
+  .write-preview-btn {
+    // makes the "absolute" position for links relative to this
+    position: relative;
+
+    // preview/edit buttons
+    > a {
+      position: absolute;
+      right: 5px;
+      top: 8px;
+    }
+  }
+}
+
+.note-edit-form {
+  display: none;
+  font-size: 13px;
+
+  .form-actions {
+    padding-left: 20px;
+
+    .btn-save {
+      float: left;
+    }
+
+    .note-form-option {
+      float: left;
+      padding: 2px 0 0 25px;
+    }
+  }
+}
+
+.js-note-attachment-delete {
+  display: none;
+}
+
+.parallel-comment {
+  padding: 6px;
+}
+
+.error-alert > .alert {
+  margin-top: 5px;
+  margin-bottom: 5px;
+}
+
+.discussion-body,
+.diff-file {
+  .notes .note {
+    border-color: #ddd;
+    padding: 10px 15px;
+  }
+
+  .discussion-reply-holder {
+    background: #f9f9f9;
+    padding: 10px 15px;
+    border-top: 1px solid #DDD;
+  }
+}
+
+.discussion-notes-count {
+  font-size: 16px;
+}
+
+.edit_note {
+  .markdown-area {
+    min-height: 140px;
+  }
+  .note-form-actions {
+    background: transparent;
+  }
+}
+
+.comment-hints {
+  color: #999;
+  background: #FFF;
+  padding: 5px;
+  margin-top: -7px;
+  border: 1px solid #DDD;
+  font-size: 13px;
+}

app/assets/stylesheets/sections/notes.scss

@@ -190,169 +190,3 @@ ul.notes {
   }
 }
-/**
- * Note Form
- */
-
-.comment-btn {
-  @extend .btn-create;
-}
-.reply-btn {
-  @extend .btn-primary;
-}
-.diff-file .diff-content {
-  tr.line_holder:hover {
-    &> td.line_content {
-      background: $hover !important;
-      border-color: darken($hover, 10%) !important;
-    }
-    &> td.new_line,
-    &> td.old_line {
-      background: darken($hover, 4%) !important;
-      border-color: darken($hover, 10%) !important;
-    }
-  }
-
-  tr.line_holder:hover > td .line_note_link {
-    opacity: 1.0;
-    filter: alpha(opacity=100);
-  }
-}
-.diff-file,
-.discussion {
-  .new_note {
-    margin: 0;
-    border: none;
-  }
-}
-.new_note {
-  display: none;
-  .buttons {
-    float: left;
-    margin-top: 8px;
-  }
-  .clearfix {
-    margin-bottom: 0;
-  }
-
-  .note_text {
-    background: #FFF;
-    border: 1px solid #ddd;
-    min-height: 100px;
-    padding: 5px;
-    font-size: 14px;
-    box-shadow: none;
-  }
-
-  .note-preview-holder {
-    > p {
-      overflow-x: auto;
-    }
-  }
-
-  .note_text {
-    width: 100%;
-  }
-}
-
-/* loading indicator */
-.notes-busy {
-  margin: 18px;
-}
-
-.note-image-attach {
-  @extend .col-md-4;
-  @extend .thumbnail;
-  margin-left: 45px;
-  float: none;
-}
-
-.common-note-form {
-  margin: 0;
-  background: #F9F9F9;
-  padding: 5px;
-  border: 1px solid #DDD;
-}
-
-.note-form-actions {
-  background: #F9F9F9;
-  height: 45px;
-
-  .note-form-option {
-    margin-top: 8px;
-    margin-left: 30px;
-    @extend .pull-left;
-  }
-
-  .js-notify-commit-author {
-    float: left;
-  }
-
-  .write-preview-btn {
-    // makes the "absolute" position for links relative to this
-    position: relative;
-
-    // preview/edit buttons
-    > a {
-      position: absolute;
-      right: 5px;
-      top: 8px;
-    }
-  }
-}
-
-.note-edit-form {
-  display: none;
-
-  .note_text {
-    border: 1px solid #DDD;
-    box-shadow: none;
-    font-size: 14px;
-    height: 80px;
-    width: 100%;
-  }
-
-  .form-actions {
-    padding-left: 20px;
-
-    .btn-save {
-      float: left;
-    }
-
-    .note-form-option {
-      float: left;
-      padding: 2px 0 0 25px;
-    }
-  }
-}
-
-.js-note-attachment-delete {
-  display: none;
-}
-
-.parallel-comment {
-  padding: 6px;
-}
-
-.error-alert > .alert {
-  margin-top: 5px;
-  margin-bottom: 5px;
-}
-
-.discussion-body,
-.diff-file {
-  .notes .note {
-    border-color: #ddd;
-    padding: 10px 15px;
-  }
-
-  .discussion-reply-holder {
-    background: #f9f9f9;
-    padding: 10px 15px;
-    border-top: 1px solid #DDD;
-  }
-}
-
-.discussion-notes-count {
-  font-size: 16px;
-}

app/assets/stylesheets/sections/profile.scss

@@ -111,20 +111,3 @@
     height: 50px;
   }
 }
-
-//CSS for password-strength indicator
-#password-strength {
-  margin-bottom: 0;
-}
-
-.has-success input {
-  background-color: #D6F1D7 !important;
-}
-
-.has-error input {
-  background-color: #F3CECE !important;
-}
-
-.has-warning input {
-  background-color: #FFE9A4 !important;
-}

app/views/devise/passwords/edit.html.haml

@@ -6,8 +6,8 @@
       .devise-errors
         = devise_error_messages!
       = f.hidden_field :reset_password_token
-      .form-group#password-strength
-        = f.password_field :password, class: "form-control top", id: "user_password_recover", placeholder: "New password", required: true
+      %div
+        = f.password_field :password, class: "form-control top", placeholder: "New password", required: true
       %div
         = f.password_field :password_confirmation, class: "form-control bottom", placeholder: "Confirm new password", required: true
       .clearfix.append-bottom-10