Small improvements for events layout

- Better formatting for select a day message - Changing style of arrow for next and previous links - Adding icon for Event in link list block - Dont show horizontal scroll in events list (ActionItem1255)

Small improvements for events layout
- Better formatting for select a day message - Changing style of arrow for next and previous links - Adding icon for Event in link list block - Dont show horizontal scroll in events list (ActionItem1255)
Joenio Costa · Antonio Terceiro
1 parent b741bc26
Showing 5 changed files with 22 additions and 11 deletions Show diff stats
app/helpers/events_helper.rb
app/models/link_list_block.rb
app/views/events/_agenda.rhtml
features/events.feature
public/stylesheets/controller_events.css
 module EventsHelper
  
   def list_events(date, events)
-    return content_tag('em', _("Select a day on the left to display it's events here"), :class => 'no-events') unless date
+    return content_tag('em', _("Select a day on the left to display it's events here"), :class => 'select-a-day') unless date
     title = _('Events for %s') % show_date(date)
     content_tag('h2', title) +
     content_tag('div',
       (events.any? ?
         content_tag('table', events.select { |item| item.public? }.map {|item| display_event_in_listing(item)}.join('')) :
-        content_tag('em', _('No events for this date'))
+        content_tag('em', _('No events for this date'), :class => 'no-events')
       ), :id => 'agenda-items'
     )
   end
@@ -24,7 +24,8 @@ class LinkListBlock &lt; Block
     ['spread', N_('Spread')],
     ['eyes', N_('Eyes')],
     ['photos', N_('Photos')],
-    ['menu-people', N_('Person')]
+    ['menu-people', N_('Person')],
+    ['menu-events', N_('Event')]
   ]
  
   settings_items :links, Array, :default => []
@@ -3,8 +3,8 @@
     <table class='noborder current-month'>
       <caption>
         <h2><%= show_month(params[:year], params[:month]) %></h2>
-        <%= link_to_previous_month(params[:year], params[:month], '&larr; previous') %>
-        <%= link_to_next_month(params[:year], params[:month], 'next &rarr;') %>
+        <%= link_to_previous_month(params[:year], params[:month], '&laquo; previous') %>
+        <%= link_to_next_month(params[:year], params[:month], 'next &raquo;') %>
       </caption>
       <%= render :partial => 'events/month', :locals => {:calendar => @calendar, :abbreviated => true} %>
     </table>
@@ -12,22 +12,22 @@ Feature: events
  
   Scenario: go to next month
     Given I am on /profile/josesilva/events/2009/10
-    When I follow "next →"
+    When I follow "next »"
     Then I should see "November 2009" within ".current-month"
  
   Scenario: go to next month in global agenda
     Given I am on /assets/events?year=2009&month=11
-    When I follow "next →"
+    When I follow "next »"
     Then I should see "December 2009" within ".current-month"
  
   Scenario: go to previous month
     Given I am on /profile/josesilva/events/2009/10
-    When I follow "← previous"
+    When I follow "« previous"
     Then I should see "September 2009" within ".current-month"
  
   Scenario: go to previous month in global agenda
     Given I am on /assets/events?year=2009&month=11
-    When I follow "← previous"
+    When I follow "« previous"
     Then I should see "October 2009" within ".current-month"
  
   Scenario: go to next month by clicking in month name
@@ -107,9 +107,9 @@ Feature: events
   Scenario: provide links to days with events
     Given I am on /profile/josesilva/events/2009/10
     Then I should see "24" link
-    When I follow "next →"
+    When I follow "next »"
     Then I should see "24" link
-    When I follow "next →"
+    When I follow "next »"
     Then I should not see "24" link
  
   Scenario: provide links to all days between start and end date
@@ -74,6 +74,8 @@
 #agenda #events-of-the-day #agenda-items {
   display: block;
   overflow: auto;
+  overflow-x: hidden;
+  height: 90%;
 }
  
 body.noosfero #content .no-boxes a.button.icon-back {
@@ -82,3 +84,11 @@ body.noosfero #content .no-boxes a.button.icon-back {
   border: none;
   opacity: 0.5;
 }
+
+#agenda #events-of-the-day .select-a-day {
+  font-size: 14px;
+  font-style: normal;
+  font-weight: bold;
+  display: block;
+  margin-top: 10px;
+}
1	1	module EventsHelper
2	2
3	3	def list_events(date, events)
4		- return content_tag('em', _("Select a day on the left to display it's events here"), :class => 'no-events') unless date
	4	+ return content_tag('em', _("Select a day on the left to display it's events here"), :class => 'select-a-day') unless date
5	5	title = _('Events for %s') % show_date(date)
6	6	content_tag('h2', title) +
7	7	content_tag('div',
8	8	(events.any? ?
9	9	content_tag('table', events.select { \|item\| item.public? }.map {\|item\| display_event_in_listing(item)}.join('')) :
10		- content_tag('em', _('No events for this date'))
	10	+ content_tag('em', _('No events for this date'), :class => 'no-events')
11	11	), :id => 'agenda-items'
12	12	)
13	13	end
...	...
...	...	@@ -24,7 +24,8 @@ class LinkListBlock < Block
24	24	['spread', N_('Spread')],
25	25	['eyes', N_('Eyes')],
26	26	['photos', N_('Photos')],
27		- ['menu-people', N_('Person')]
	27	+ ['menu-people', N_('Person')],
	28	+ ['menu-events', N_('Event')]
28	29	]
29	30
30	31	settings_items :links, Array, :default => []
...	...
...	...	@@ -3,8 +3,8 @@
3	3	<table class='noborder current-month'>
4	4	<caption>
5	5	<h2><%= show_month(params[:year], params[:month]) %></h2>
6		- <%= link_to_previous_month(params[:year], params[:month], '← previous') %>
7		- <%= link_to_next_month(params[:year], params[:month], 'next →') %>
	6	+ <%= link_to_previous_month(params[:year], params[:month], '« previous') %>
	7	+ <%= link_to_next_month(params[:year], params[:month], 'next »') %>
8	8	</caption>
9	9	<%= render :partial => 'events/month', :locals => {:calendar => @calendar, :abbreviated => true} %>
10	10	</table>
...	...
...	...	@@ -12,22 +12,22 @@ Feature: events
12	12
13	13	Scenario: go to next month
14	14	Given I am on /profile/josesilva/events/2009/10
15		- When I follow "next →"
	15	+ When I follow "next »"
16	16	Then I should see "November 2009" within ".current-month"
17	17
18	18	Scenario: go to next month in global agenda
19	19	Given I am on /assets/events?year=2009&month=11
20		- When I follow "next →"
	20	+ When I follow "next »"
21	21	Then I should see "December 2009" within ".current-month"
22	22
23	23	Scenario: go to previous month
24	24	Given I am on /profile/josesilva/events/2009/10
25		- When I follow "← previous"
	25	+ When I follow "« previous"
26	26	Then I should see "September 2009" within ".current-month"
27	27
28	28	Scenario: go to previous month in global agenda
29	29	Given I am on /assets/events?year=2009&month=11
30		- When I follow "← previous"
	30	+ When I follow "« previous"
31	31	Then I should see "October 2009" within ".current-month"
32	32
33	33	Scenario: go to next month by clicking in month name
...	...	@@ -107,9 +107,9 @@ Feature: events
107	107	Scenario: provide links to days with events
108	108	Given I am on /profile/josesilva/events/2009/10
109	109	Then I should see "24" link
110		- When I follow "next →"
	110	+ When I follow "next »"
111	111	Then I should see "24" link
112		- When I follow "next →"
	112	+ When I follow "next »"
113	113	Then I should not see "24" link
114	114
115	115	Scenario: provide links to all days between start and end date
...	...
...	...	@@ -74,6 +74,8 @@
74	74	#agenda #events-of-the-day #agenda-items {
75	75	display: block;
76	76	overflow: auto;
	77	+ overflow-x: hidden;
	78	+ height: 90%;
77	79	}
78	80
79	81	body.noosfero #content .no-boxes a.button.icon-back {
...	...	@@ -82,3 +84,11 @@ body.noosfero #content .no-boxes a.button.icon-back {
82	84	border: none;
83	85	opacity: 0.5;
84	86	}
	87	+
	88	+#agenda #events-of-the-day .select-a-day {
	89	+ font-size: 14px;
	90	+ font-style: normal;
	91	+ font-weight: bold;
	92	+ display: block;
	93	+ margin-top: 10px;
	94	+}
...	...