Commit 0331fa3f authored by Phil Hughes's avatar Phil Hughes

Restyling on elements in comment form

parent b7f0b22b
#= require autosave
#= require autosize
#= require dropzone
#= require dropzone_input
#= require gfm_auto_complete
......@@ -288,7 +287,6 @@ class @Notes
else
previewButton.removeClass("turn-on").addClass "turn-off"
autosize(textarea)
new Autosave textarea, [
"Note"
form.find("#note_commit_id").val()
......@@ -370,9 +368,6 @@ class @Notes
textarea = form.find("textarea")
textarea.focus()
if isNewForm
autosize(textarea)
# HACK (rspeicher/DouweM): Work around a Chrome 43 bug(?).
# The textarea has the correct value, Chrome just won't show it unless we
# modify it, so let's clear it and re-set it!
......
......@@ -42,7 +42,7 @@ class @ZenMode
$(e.currentTarget).trigger('zen_mode:leave')
$(document).on 'zen_mode:enter', (e) =>
@enter(e.target.parentNode)
@enter($(e.target).closest('.md-area').find('.zen-backdrop'))
$(document).on 'zen_mode:leave', (e) =>
@exit()
......
......@@ -65,6 +65,21 @@
position: relative;
}
.md-header {
.nav-links {
.active {
a {
border-bottom-color: #000;
}
}
a {
padding-top: 0;
line-height: 1;
}
}
}
.referenced-users {
color: #4c4e54;
padding-top: 10px;
......
......@@ -244,7 +244,7 @@ a > code {
* Textareas intended for GFM
*
*/
textarea.js-gfm-input {
.js-gfm-input {
font-family: $monospace_font;
color: $gl-text-color;
}
......
.zennable {
a.js-zen-enter {
color: $gl-gray;
position: absolute;
top: 0;
right: 4px;
line-height: 56px;
}
a.js-zen-leave {
display: none;
color: $gl-text-color;
position: absolute;
top: 10px;
right: 10px;
padding: 5px;
font-size: 36px;
&:hover {
color: #111;
}
}
.zen-backdrop {
&.fullscreen {
background-color: white;
......@@ -47,11 +25,7 @@
margin: 0 auto;
}
a.js-zen-enter {
display: none;
}
a.js-zen-leave {
.zen-control-leave {
display: block;
position: absolute;
top: 0;
......@@ -59,3 +33,21 @@
}
}
}
.zen-cotrol {
color: #555;
line-height: 31px;
}
.zen-control-leave {
display: none;
color: $gl-text-color;
position: absolute;
right: 10px;
padding: 5px;
font-size: 36px;
&:hover {
color: #111;
}
}
/**
* Note Form
*/
.comment-btn {
@extend .btn-create;
}
.reply-btn {
@extend .btn-primary;
margin: 10px $gl-padding;
......@@ -42,18 +38,22 @@
max-width: 100%;
}
.note_text {
width: 100%;
}
.comment-hints {
margin-top: -12px;
}
}
/* loading indicator */
.notes-busy {
margin: 18px;
.note-textarea {
padding-left: 0;
padding-right: 0;
font-family: $regular_font;
border-left: 0;
border-right: 0;
resize: none!important; // TODO: Find a way to remove this !important
&:focus {
outline: 0;
}
}
.note-image-attach {
......@@ -64,11 +64,9 @@
.common-note-form {
margin: 0;
background: #fff;
padding: $gl-padding;
margin-left: -$gl-padding;
margin-right: -$gl-padding;
margin-bottom: -$gl-padding;
border: 1px solid #E5E5E5;
border-radius: $border-radius-base;
}
.note-form-actions {
......
.md-area
.md-header.clearfix
%ul.nav-links
%ul.nav-links.pull-left
%li.active
%a.js-md-write-button(href="#md-write-holder" tabindex="-1")
%a.js-md-write-button{ href: "#md-write-holder" }
Write
%li
%a.js-md-preview-button(href="#md-preview-holder" tabindex="-1")
%a.js-md-preview-button{ href: "#md-preview-holder" }
Preview
.pull-right
%a.zen-cotrol.js-zen-enter{ href: "#" }
Go full screen
%div
.md-write-holder
= yield
.md.md-preview-holder.hide
......
......@@ -2,10 +2,8 @@
.zen-backdrop
- classes << ' js-gfm-input js-autosize markdown-area'
- if defined?(f) && f
= f.text_area attr, class: classes
= f.text_area attr, class: classes, placeholder: "Write a comment or drag your files here..."
- else
= text_area_tag attr, nil, class: classes
%a.js-zen-enter{ tabindex: "-1", href: "#" }
Go full screen
%a.js-zen-leave{ tabindex: "-1", href: "#" }
= text_area_tag attr, nil, class: classes, placeholder: "Write a comment or drag your files here..."
%a.zen-cotrol.zen-control-leave.js-zen-leave{ href: "#" }
= icon('compress')
......@@ -2,7 +2,7 @@
= form_for note, url: namespace_project_note_path(@project.namespace, @project, note), method: :put, remote: true, authenticity_token: true, html: { class: 'edit-note js-quick-submit' } do |f|
= note_target_fields(note)
= render layout: 'projects/md_preview', locals: { preview_class: 'md-preview' } do
= render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text js-task-list-field'
= render 'projects/zen', f: f, attr: :note, classes: 'note-textarea js-note-text js-task-list-field'
= render 'projects/notes/hints'
.note-form-actions.clearfix
......
......@@ -8,7 +8,7 @@
= f.hidden_field :noteable_type
= render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do
= render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text'
= render 'projects/zen', f: f, attr: :note, classes: 'note-textarea js-note-text'
= render 'projects/notes/hints'
.error-alert
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment