Skip to content

G
gitlab-ce
Commit 207d798d authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets
Browse files
Options

Basic UI implememntation of comments in timeline style 

Signed-off-by: default avatarDmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
parent b5cc8136
Hide whitespace changes
Inline Side-by-side
Showing with 126 additions and 63 deletions
app/assets/stylesheets/generic/timeline.scss 0 → 100644
View file @ 207d798d
.timeline {
list-style: none;
padding: 20px 0 20px;
position: relative;
&:before {
top: 0;
bottom: 0;
position: absolute;
content: " ";
width: 3px;
background-color: #eeeeee;
margin-left: 25px;
}
.timeline-entry {
position: relative;
margin-top: 5px;
margin-left: 30px;
margin-bottom: 10px;
clear: both;
.timeline-entry-inner {
position: relative;
margin-left: -20px;
&:before, &:after {
content: " ";
display: table;
}
.timeline-icon {
margin-top: 2px;
background: #fff;
color: #737881;
float: left;
@include border-radius(4px);
@include box-shadow(0 0 0 3px #EEE);
}
.timeline-content {
position: relative;
background: #f5f5f6;
padding: 10px 15px;
margin-left: 60px;
&:after {
content: '';
display: block;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 9px 0;
border-color: transparent #f5f5f6 transparent transparent;
left: 0;
top: 10px;
margin-left: -9px;
}
}
}
}
}
app/assets/stylesheets/sections/notes.scss
View file @ 207d798d
...@@ -55,22 +55,18 @@ ul.notes { ...@@ -55,22 +55,18 @@ ul.notes {
} }
.note { .note {
padding: 8px 0;
overflow: hidden;
display: block; display: block;
position:relative; position:relative;
border-bottom: 1px solid #eee;
p { color: $style_color; } p { color: $style_color; }
.avatar { .avatar {
margin-top: 3px; margin: 0;
} }
.attachment { .attachment {
font-size: 14px; font-size: 14px;
} }
.note-body { .note-body {
@include md-typography; @include md-typography;
margin-left: 43px;
} }
.note-header { .note-header {
padding-bottom: 3px; padding-bottom: 3px;
......
app/views/projects/notes/_note.html.haml
View file @ 207d798d
%li{ id: dom_id(note), class: dom_class(note), data: { discussion: note.discussion_id } } %li.timeline-entry{ id: dom_id(note), class: dom_class(note), data: { discussion: note.discussion_id } }
.note-header .timeline-entry-inner
.note-actions .timeline-icon
= link_to "##{dom_id(note)}", name: dom_id(note) do = image_tag avatar_icon(note.author_email), class: "avatar s32"
%i.icon-link .timeline-content
Link here .note-header
&nbsp; .note-actions
- if(note.author_id == current_user.try(:id)) || can?(current_user, :admin_note, @project) = link_to "##{dom_id(note)}", name: dom_id(note) do
= link_to "#", title: "Edit comment", class: "js-note-edit" do %i.icon-link
%i.icon-edit Link here
Edit &nbsp;
&nbsp; - if(note.author_id == current_user.try(:id)) || can?(current_user, :admin_note, @project)
= link_to project_note_path(@project, note), title: "Remove comment", method: :delete, data: { confirm: 'Are you sure you want to remove this comment?' }, remote: true, class: "danger js-note-delete" do = link_to "#", title: "Edit comment", class: "js-note-edit" do
%i.icon-trash.cred %i.icon-edit
Remove Edit
= image_tag avatar_icon(note.author_email), class: "avatar s32" &nbsp;
= link_to_member(@project, note.author, avatar: false) = link_to project_note_path(@project, note), title: "Remove comment", method: :delete, data: { confirm: 'Are you sure you want to remove this comment?' }, remote: true, class: "danger js-note-delete" do
%span.note-last-update %i.icon-trash.cred
= note_timestamp(note) Remove
= link_to_member(@project, note.author, avatar: false)
%span.note-last-update
= note_timestamp(note)
- if note.upvote? - if note.upvote?
%span.vote.upvote.label.label-success %span.vote.upvote.label.label-success
%i.icon-thumbs-up %i.icon-thumbs-up
\+1 \+1
- if note.downvote? - if note.downvote?
%span.vote.downvote.label.label-danger %span.vote.downvote.label.label-danger
%i.icon-thumbs-down %i.icon-thumbs-down
\-1 \-1
.note-body .note-body
.note-text .note-text
= preserve do = preserve do
= markdown(note.note, {no_header_anchors: true}) = markdown(note.note, {no_header_anchors: true})
.note-edit-form .note-edit-form
= form_for note, url: project_note_path(@project, note), method: :put, remote: true, authenticity_token: true do |f| = form_for note, url: project_note_path(@project, note), method: :put, remote: true, authenticity_token: true do |f|
= f.text_area :note, class: 'note_text js-note-text js-gfm-input turn-on' = f.text_area :note, class: 'note_text js-note-text js-gfm-input turn-on'
.form-actions.clearfix .form-actions.clearfix
= f.submit 'Save changes', class: "btn btn-primary btn-save js-comment-button" = f.submit 'Save changes', class: "btn btn-primary btn-save js-comment-button"
.note-form-option .note-form-option
%a.choose-btn.btn.js-choose-note-attachment-button %a.choose-btn.btn.js-choose-note-attachment-button
%i.icon-paper-clip %i.icon-paper-clip
%span Choose File ... %span Choose File ...
&nbsp; &nbsp;
%span.file_name.js-attachment-filename File name... %span.file_name.js-attachment-filename File name...
= f.file_field :attachment, class: "js-note-attachment-input hidden" = f.file_field :attachment, class: "js-note-attachment-input hidden"
= link_to 'Cancel', "#", class: "btn btn-cancel note-edit-cancel" = link_to 'Cancel', "#", class: "btn btn-cancel note-edit-cancel"
- if note.attachment.url - if note.attachment.url
.note-attachment .note-attachment
- if note.attachment.image? - if note.attachment.image?
= link_to note.attachment.secure_url, target: '_blank' do = link_to note.attachment.secure_url, target: '_blank' do
= image_tag note.attachment.secure_url, class: 'note-image-attach' = image_tag note.attachment.secure_url, class: 'note-image-attach'
.attachment.pull-right .attachment.pull-right
= link_to note.attachment.secure_url, target: "_blank" do = link_to note.attachment.secure_url, target: "_blank" do
%i.icon-paper-clip %i.icon-paper-clip
= note.attachment_identifier = note.attachment_identifier
= link_to delete_attachment_project_note_path(@project, note), = link_to delete_attachment_project_note_path(@project, note),
title: "Delete this attachment", method: :delete, remote: true, data: { confirm: 'Are you sure you want to remove the attachment?' }, class: "danger js-note-attachment-delete" do title: "Delete this attachment", method: :delete, remote: true, data: { confirm: 'Are you sure you want to remove the attachment?' }, class: "danger js-note-attachment-delete" do
%i.icon-trash.cred %i.icon-trash.cred
.clear .clear
app/views/projects/notes/_notes_with_form.html.haml
View file @ 207d798d
%ul#notes-list.notes.main-notes-list %ul#notes-list.notes.main-notes-list.timeline
= render "projects/notes/notes" = render "projects/notes/notes"
.js-notes-busy .js-notes-busy
......
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7