Merge pull request #3877 from mk84/22023-toolbar-on-forum-and-wiki

[22023] Toolbar on forum and wiki
pull/3901/head v5.0.2
Stefan Botzenhart 9 years ago
commit 3042fd3347
  1. 18
      app/assets/stylesheets/_misc_legacy.sass
  2. 15
      app/assets/stylesheets/content/_buttons.sass
  3. 32
      app/assets/stylesheets/content/_legacy_actions.sass
  4. 3
      app/assets/stylesheets/content/_wiki.sass
  5. 61
      app/assets/stylesheets/layout/_drop_down.sass
  6. 12
      app/assets/stylesheets/layout/_toolbar.sass
  7. 6
      app/helpers/watchers_helper.rb
  8. 4
      app/views/boards/show.html.erb
  9. 34
      app/views/layouts/_action_menu_base.html.erb
  10. 65
      app/views/messages/show.html.erb
  11. 5
      app/views/news/show.html.erb
  12. 4
      app/views/wiki/show.html.erb

@ -214,6 +214,19 @@ div
text-overflow: ellipsis
white-space: nowrap
overflow: hidden
&.message-title
padding-top: 12px
padding-bottom: 19px
white-space: normal
overflow: visible
float: left
&.messages-wrapper
@include clearfix
.toolbar-container
float: right
ul
margin: 0
text-align: right
@ -440,7 +453,7 @@ div.issue hr
margin-bottom: 6px
#content
min-height: 250px
min-height: 300px
h3
margin: 12px 0 6px
@ -557,9 +570,6 @@ th.checkbox img
p.buttons
margin-left: 10px
div.contextual > a.icon, p.buttons > a, ul.action_menu_main > li
padding-right: 10px
strong.related-issues-heading
display: block
margin-top: 10px

@ -131,3 +131,18 @@ a.button
&:before
@extend .icon-pulldown-arrow1:before
// hack around the old watchers_link implementation
a.watcher_link
color: $button--font-color
text-decoration: none
&:before
margin-right: $button--text-icon-spacing
// hack around the old markup (icon class applied on <a>)
// which is used for toolbar-items to add space after icons inside buttons
.toolbar-item
.button[class*='icon-']
&:before
margin-right: $button--text-icon-spacing

@ -45,6 +45,7 @@
ul.legacy-actions-main
@include legacy-actions-defaults
margin-left: 20px
ul.legacy-actions-specific,
.nosidebar ul.legacy-actions-specific
@ -53,33 +54,6 @@ ul.legacy-actions-specific,
p.subtitle + ul.legacy-actions-specific
@include legacy-actions-defaults(-57px)
ul.legacy-actions-more
margin: 0
list-style-type: none
font-size: 0.9rem
position: absolute
top: 23px
right: 0
z-index: 100
white-space: nowrap
padding: 5px 0 5px 0
background: white
border: 1px solid #B7B7B7
box-shadow: 1px 1px 2px #aaa
> li
[class^="icon-"]:before
vertical-align: -1px
a
padding: 2.5px 10px 2.5px 10px
display: block
&:hover
background-color: #F0F0F0
#lower-title-bar ul.legacy-actions-specific
@include legacy-actions-defaults
padding-top: 10px
@ -93,7 +67,9 @@ ul.legacy-actions-more
position: relative
.message-reply-menu
@include contextual(-39px)
@include contextual(-60px)
> .button
margin-right: 0
.legacy-actions--inline-label
@extend .inline-label

@ -169,3 +169,6 @@ blockquote
bottom: 10px
right: 15px
padding: 0 0 0 0
.toolbar-container + .wiki-content
margin-top: -64px

@ -37,12 +37,17 @@
#column-context-menu .menu
margin: 0
.dropdown
.dropdown,
.toolbar .legacy-actions-more
position: absolute
z-index: 9999999
.toolbar .legacy-actions-more
right: 0
.dropdown .dropdown-menu,
.dropdown .dropdown-panel
.dropdown .dropdown-panel,
.toolbar .legacy-actions-more
min-width: 200px
max-width: 360px
list-style: none
@ -95,30 +100,33 @@
max-height: 358px
overflow: auto
.dropdown .dropdown-menu LI
list-style: none
padding: 0
margin: 0
line-height: 18px
.dropdown .dropdown-menu LI > A,
.dropdown .dropdown-menu LABEL
display: block
color: $context-menu-font-color
text-decoration: none
padding: 4px 13px 4px 10px
white-space: nowrap
font-weight: normal
text-overflow: ellipsis
overflow: hidden
.dropdown .dropdown-menu LI > A:hover,
.dropdown .dropdown-menu LABEL:hover
background-color: #F0F0F0
cursor: pointer
.dropdown .dropdown-menu,
.toolbar .legacy-actions-more
LI
list-style: none
padding: 0
margin: 0
line-height: 18px
.dropdown .dropdown-menu LI > A.inactive
color: #999999
.dropdown .dropdown-menu,
.toolbar .legacy-actions-more
LI > A,
LABEL
display: block
color: $context-menu-font-color
text-decoration: none
padding: 4px 13px 4px 10px
white-space: nowrap
font-weight: normal
text-overflow: ellipsis
overflow: hidden
&:hover
background-color: #F0F0F0
cursor: pointer
LI > A.inactive
color: #999999
.dropdown LI > A.dropdown-menu-hasicons
display: block
@ -127,7 +135,6 @@
padding: 3px 10px
white-space: nowrap
.dropdown .dropdown-menu .dropdown-divider
font-size: 1px
border-top: solid 1px #E5E5E5
@ -140,8 +147,6 @@
background-position: 8px center
background-repeat: no-repeat
// extended styles
.wp-create-button li
float: none !important

@ -43,6 +43,7 @@
.toolbar-container
padding: 0
margin-bottom: 12px
min-height: 50px
> .subtitle
font-size: rem-calc(14px)
@ -66,7 +67,8 @@
display: table
.toolbar-items
li
> li,
.toolbar-button-group > li
float: left
&.toolbar-item
margin: 0 5px //$drop-nav-spacing // spacing between nav items
@ -74,6 +76,14 @@
&:last-child
margin-right: 0
// hack around the old watchers_link implementation
// remove once all watcher_links in plugins have no button wrappers anymore
.button .button
background: transparent
border: none
margin: 0
padding: 0
button, .button, input[type=text], input[type=number], select
@include toolbar-element-sizing
border: 1px solid $toolbar-item--border-color

@ -43,7 +43,7 @@ module WatchersHelper
path = send(:"#{(watched ? 'unwatch' : 'watch')}_path", object_type: object.class.to_s.underscore.pluralize,
object_id: object.id,
replace: options.delete('replace'))
html_options[:class] = html_options[:class].to_s + (watched ? ' icon icon-watch-1' : ' icon icon-not-watch')
html_options[:class] = html_options[:class].to_s + (watched ? ' icon-watch-1' : ' icon-not-watch')
method = watched ?
:delete :
@ -53,7 +53,9 @@ module WatchersHelper
l(:button_unwatch) :
l(:button_watch)
link_to(label, path, html_options.merge(remote: true, method: method))
content_tag :div, class: 'button' do
link_to(label, path, html_options.merge(remote: true, method: method))
end
end
# Returns HTML for a list of users watching the given object

@ -61,9 +61,7 @@ See doc/COPYRIGHT.rdoc for more details.
<% end %>
<% unless User.current.anonymous? %>
<li class="toolbar-item">
<div class="button">
<%= watcher_link(@board, User.current) %>
</div>
<%= watcher_link(@board, User.current) %>
</li>
<% end %>
<% end %>

@ -34,20 +34,26 @@ See doc/COPYRIGHT.rdoc for more details.
# THIS HACK NEEDS TO BE REPLACED BY AN ENGINEERS SOLUTION!
@no_clearfix ||= false
%>
<ul class="<%= action_menu_key %> <%= action_menu_key.to_s.gsub('action_menu_', 'legacy-actions-') %>">
<%= content_for action_menu_key %>
<% if content_for?(:action_menu_more) %>
<li class="drop-down">
<a href="javascript:" class="icon icon-arrow-right6-3"
accesskey="<%= OpenProject::AccessKeys.key_for(:more_menu) %>">
<%= l(:more_actions) %>
</a>
<ul class="legacy-actions-more" style="display:none;">
<%= content_for :action_menu_more %>
</ul>
</li>
<% end %>
</ul>
<div class="toolbar-container">
<div class="toolbar">
<ul class="toolbar-items <%= action_menu_key %> <%= action_menu_key.to_s.gsub('action_menu_', 'legacy-actions-') %>">
<%= content_for action_menu_key %>
<% if content_for?(:action_menu_more) %>
<li class="drop-down toolbar-item">
<a href="javascript:" class="button"
accesskey="<%= OpenProject::AccessKeys.key_for(:more_menu) %>">
<span class="button--text"><%= l(:label_more) %></span>
<i class="button--dropdown-indicator"></i>
</a>
<ul class="legacy-actions-more" style="display:none;">
<%= content_for :action_menu_more %>
</ul>
</li>
<% end %>
</ul>
</div>
</div>
<% unless @no_clearfix %>
<div class="clearfix"></div>
<% end %>

@ -33,26 +33,38 @@ See doc/COPYRIGHT.rdoc for more details.
%>
<% content_for :action_menu_specific do %>
<%= watcher_link(@topic, User.current) %>
<%= link_to(l(:button_quote),
{ action: 'quote', id: @topic },
remote: true,
method: 'get',
class: 'icon icon-quote') if !@topic.locked? && authorize_for('messages', 'reply') %>
<%= link_to(l(:button_edit),
edit_topic_path(@topic),
class: 'icon icon-edit',
accesskey: accesskey(:edit)) if @message.editable_by?(User.current) %>
<%= link_to(l(:button_delete),
topic_path(@topic),
method: :delete,
data: { confirm: l(:text_are_you_sure) },
class: 'icon icon-delete') if @message.destroyable_by?(User.current) %>
<li class="toolbar-item">
<%= watcher_link(@topic, User.current) %>
</li>
<li class="toolbar-item">
<% if !@topic.locked? && authorize_for('messages', 'reply') %>
<%= link_to({ action: 'quote', id: @topic }, remote: true, method: 'get', class: 'button') do %>
<i class="button--icon icon-quote"></i>
<span class="button--text"><%= l(:button_quote) %></span>
<% end %>
<% end %>
</li>
<li class="toolbar-item">
<% if @message.editable_by?(User.current) %>
<%= link_to(edit_topic_path(@topic), accesskey: accesskey(:edit), class: 'button') do %>
<i class="button--icon icon-edit"></i>
<span class="button--text"><%= l(:button_edit) %></span>
<% end %>
<% end %>
</li>
<li class="toolbar-item">
<% if @message.destroyable_by?(User.current) %>
<%= link_to(topic_path(@topic), method: :delete, data: { confirm: l(:text_are_you_sure) }, class: 'button') do %>
<i class="button--icon icon-delete"></i>
<span class="button--text"><%= l(:button_delete) %></span>
<% end %>
<% end %>
</li>
<% end %>
<div class="top-page">
<div class="top-page messages-wrapper">
<h2 class="message-title" title="<%= h @topic.subject %>"><%= avatar(@topic.author) %><%=h @topic.subject %></h2>
<%= render partial: 'layouts/action_menu_specific' %>
<h2 title="<%= h @topic.subject %>"><%= avatar(@topic.author) %><%=h @topic.subject %></h2>
</div>
<div class="message">
<p><span class="author"><%= authoring @topic.created_on, @topic.author %></span></p>
@ -75,24 +87,24 @@ See doc/COPYRIGHT.rdoc for more details.
<%= authoring message.created_on, message.author %>
</h4>
<div class="message-reply-menu">
<%= link_to(icon_wrapper('icon-context icon-quote', l(:button_quote)),
<%= link_to(icon_wrapper('icon-quote', l(:button_quote)),
{ action: 'quote', id: message },
remote: true,
method: 'get',
title: l(:button_quote),
class: 'no-decoration-on-hover',
class: 'button -small',
alt: l(:button_quote)) if !@topic.locked? && authorize_for('messages', 'reply') %>
<%= link_to(icon_wrapper('icon-context icon-edit', l(:button_edit)),
<%= link_to(icon_wrapper('icon-edit', l(:button_edit)),
{ action: 'edit', id: message },
title: l(:button_edit),
class: 'no-decoration-on-hover',
class: 'button -small',
alt: l(:button_edit)) if message.editable_by?(User.current) %>
<%= link_to(icon_wrapper('icon-context icon-delete', l(:button_delete)),
<%= link_to(icon_wrapper('icon-delete', l(:button_delete)),
{ action: 'destroy', id: message},
method: :delete,
data: { confirm: l(:text_are_you_sure) },
title: l(:button_delete),
class: 'no-decoration-on-hover',
class: 'button -small',
alt: l(:button_delete)) if message.destroyable_by?(User.current) %>
</div>
<div class="wiki" ng-non-bindable>
@ -105,11 +117,14 @@ See doc/COPYRIGHT.rdoc for more details.
<% end %>
<% if !@topic.locked? && authorize_for('messages', 'reply') %>
<p><%= toggle_link l(:button_reply), "reply", focus: 'reply_content' %></p>
<div class="form--space">
<%= toggle_link l(:button_reply), "reply", {focus: 'reply_content'}, {class: 'button -highlight'} %>
</div>
<div id="reply" style="display:none;">
<hr class="form--separator">
<%= labelled_tabular_form_for @reply,
as: :reply,
url: reply_to_topic_path(@topic),

@ -40,10 +40,7 @@ See doc/COPYRIGHT.rdoc for more details.
</li>
<% end %>
<li class="toolbar-item">
<%# hack around the old watchers_link implementation %>
<div class="button">
<%= watcher_link(@news, User.current) %>
</div>
<%= watcher_link(@news, User.current) %>
</li>
<% if User.current.allowed_to?(:manage_news, @project) %>
<li class="toolbar-item">

@ -30,8 +30,8 @@ See doc/COPYRIGHT.rdoc for more details.
<%= call_hook :wiki_navigation %>
<% content_for :action_menu_main do %>
<% if @editable %>
<%= li_unless_nil(link_to_if_authorized(l(:button_edit), {action: 'edit', id: @page}, class: 'icon icon-edit', accesskey: accesskey(:edit))) if @content.version == @page.content.version %>
<%= li_unless_nil(watcher_link(@page, User.current)) if Setting.notified_events.include?("wiki_content_added") or Setting.notified_events.include?("wiki_content_updated") %>
<%= li_unless_nil(link_to_if_authorized(l(:button_edit), {action: 'edit', id: @page}, class: 'button icon-edit', accesskey: accesskey(:edit)), class: 'toolbar-item') if @content.version == @page.content.version %>
<%= li_unless_nil(watcher_link(@page, User.current), class: 'toolbar-item') if Setting.notified_events.include?("wiki_content_added") or Setting.notified_events.include?("wiki_content_updated") %>
<% end %>
<% end %>
<% content_for :action_menu_more do %>

Loading…
Cancel
Save