From 82a671704d02d33beef88b829e74c8bb87ea8928 Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Tue, 23 Jun 2015 21:00:10 -0400 Subject: [PATCH] Show a random Markdown tip in the textarea placeholder --- app/assets/stylesheets/generic/zen.scss | 27 +++------------------ app/helpers/gitlab_markdown_helper.rb | 23 ++++++++++++++++++ app/views/projects/_zen.html.haml | 2 +- spec/helpers/gitlab_markdown_helper_spec.rb | 7 ++++++ 4 files changed, 35 insertions(+), 24 deletions(-) diff --git a/app/assets/stylesheets/generic/zen.scss b/app/assets/stylesheets/generic/zen.scss index 7ab01187a02..7e86a0fe4b9 100644 --- a/app/assets/stylesheets/generic/zen.scss +++ b/app/assets/stylesheets/generic/zen.scss @@ -63,43 +63,24 @@ } } - // Make the placeholder text in the standard textarea the same color as the - // background, effectively hiding it - - .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; - } - // Make the color of the placeholder text in the Zenned-out textarea darker, // so it becomes visible input:checked ~ .zen-backdrop textarea::-webkit-input-placeholder { - color: #999; + color: #A8A8A8; } input:checked ~ .zen-backdrop textarea:-moz-placeholder { - color: #999; + color: #A8A8A8; opacity: 1; } input:checked ~ .zen-backdrop textarea::-moz-placeholder { - color: #999; + color: #A8A8A8; opacity: 1; } input:checked ~ .zen-backdrop textarea:-ms-input-placeholder { - color: #999; + color: #A8A8A8; } } diff --git a/app/helpers/gitlab_markdown_helper.rb b/app/helpers/gitlab_markdown_helper.rb index 9aabe01f60e..eb3f72a307d 100644 --- a/app/helpers/gitlab_markdown_helper.rb +++ b/app/helpers/gitlab_markdown_helper.rb @@ -98,6 +98,29 @@ module GitlabMarkdownHelper end end + MARKDOWN_TIPS = [ + "End a line with two or more spaces for a line-break, or soft-return", + "Inline code can be denoted by `surrounding it with backticks`", + "Blocks of code can be denoted by three backticks ``` or four leading spaces", + "Emoji can be added by :emoji_name:, for example :thumbsup:", + "Notify other participants using @user_name", + "Notify a specific group using @group_name", + "Notify the entire team using @all", + "Reference an issue using a hash, for example issue #123", + "Reference a merge request using an exclamation point, for example MR !123", + "Italicize words or phrases using *asterisks* or _underscores_", + "Bold words or phrases using **double asterisks** or __double underscores__", + "Strikethrough words or phrases using ~~two tildes~~", + "Make a bulleted list using + pluses, - minuses, or * asterisks", + "Denote blockquotes using > at the beginning of a line", + "Make a horizontal line using three or more hyphens ---, asterisks ***, or underscores ___" + ].freeze + + # Returns a random markdown tip for use as a textarea placeholder + def random_markdown_tip + MARKDOWN_TIPS.sample + end + private # Return +text+, truncated to +max_chars+ characters, excluding any HTML diff --git a/app/views/projects/_zen.html.haml b/app/views/projects/_zen.html.haml index cf1c55ecca6..a4e41eeb363 100644 --- a/app/views/projects/_zen.html.haml +++ b/app/views/projects/_zen.html.haml @@ -2,7 +2,7 @@ %input#zen-toggle-comment.zen-toggle-comment{ tabindex: '-1', type: 'checkbox' } .zen-backdrop - classes << ' js-gfm-input markdown-area' - = f.text_area attr, class: classes, placeholder: 'Leave a comment' + = f.text_area attr, class: classes, placeholder: random_markdown_tip = link_to nil, class: 'zen-enter-link', tabindex: '-1' do %i.fa.fa-expand Edit in fullscreen diff --git a/spec/helpers/gitlab_markdown_helper_spec.rb b/spec/helpers/gitlab_markdown_helper_spec.rb index bbb434638ce..a42ccb9b501 100644 --- a/spec/helpers/gitlab_markdown_helper_spec.rb +++ b/spec/helpers/gitlab_markdown_helper_spec.rb @@ -133,4 +133,11 @@ describe GitlabMarkdownHelper do helper.render_wiki_content(@wiki) end end + + describe 'random_markdown_tip' do + it 'returns a random Markdown tip' do + stub_const("#{described_class}::MARKDOWN_TIPS", ['Random tip']) + expect(random_markdown_tip).to eq 'Random tip' + end + end end