group filter from dashboard. Design improvements of dashboard

Dmitriy Zaporozhets
1 parent 3802ae0c
Showing 5 changed files with 40 additions and 18 deletions Show diff stats
app/assets/javascripts/dashboard.js.coffee
app/assets/stylesheets/sections/dashboard.scss
app/assets/stylesheets/sections/events.scss
app/views/dashboard/_groups.html.haml
app/views/dashboard/_projects.html.haml
@@ -8,15 +8,16 @@ class Dashboard
       @toggleFilter($(event.currentTarget))
       @reloadActivities()
  
-    $(".dash-projects-filter").keyup ->
+    $(".dash-filter").keyup ->
       terms = $(this).val()
+      uiBox = $(this).parents('.ui-box').first()
       if terms == "" || terms == undefined
-        $(".dash-projects-list li").show()
+        uiBox.find(".dash-list li").show()
       else
-        $(".dash-projects-list li").each (index) ->
+        uiBox.find(".dash-list li").each (index) ->
           name = $(this).find(".well-title").text()
  
-          if name.search(terms) == -1
+          if name.toLowerCase().search(terms.toLowerCase()) == -1
             $(this).hide()
           else
             $(this).show()
@@ -7,7 +7,9 @@
     @extend .pull-right;
  
     .ui-box {
-      margin: 3px;
+      margin: 0px;
+      box-shadow: none;
+
       > .title {
         padding: 2px 15px;
       }
@@ -28,7 +30,6 @@
           }
         }
       }
-      @extend .ui-box;
     }
   }
 }
@@ -47,7 +48,7 @@
 }
  
 .dashboard {
-  .dash-projects-filter {
+  .dash-filter {
     margin: 0;
     padding: 4px 6px;
     width: 202px;
@@ -58,7 +59,29 @@
 }
  
 @media (max-width: 1200px) {
-  .dashboard .dash-projects-filter {
+  .dashboard .dash-filter {
     width: 132px;
   }
 }
+
+.dash-sidebar-tabs {
+  margin-bottom: 2px;
+  border: none;
+  margin: 0;
+
+  li {
+    &.active {
+      a {
+        @include linear-gradient(#f5f5f5, #eee);
+        border-bottom: 1px solid #EEE !important;
+        &:hover {
+          background: #eee;
+        }
+      }
+    }
+
+    a {
+      border-color: #CCC !important;
+    }
+  }
+}
@@ -51,7 +51,7 @@
     .event-note {
       color: #555;
       margin-top: 5px;
-      margin-left: 40px;
+      margin-left: 35px;
  
       pre {
         border: none;
@@ -95,7 +95,7 @@
     }
   }
   ul {
-    margin-left: 50px;
+    margin-left: 35px;
     margin-bottom: 5px;
     .avatar {
       width: 18px;
 .ui-box
-  %h5.title
-    Groups
-    %span.light
-      (#{groups.count})
+  %h5.title.clearfix
+    = search_field_tag :filter_group, nil, placeholder: 'Filter by name', class: 'dash-filter'
     - if current_user.can_create_group?
       %span.pull-right
-        = link_to new_group_path, class: "btn btn-small" do
+        = link_to new_group_path, class: "btn" do
           %i.icon-plus
           New Group
-  %ul.well-list
+  %ul.well-list.dash-list
     - groups.each do |group|
       %li
         = link_to group_path(id: group.path), class: dom_class(group) do
 .ui-box
   %h5.title.clearfix
-    = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'dash-projects-filter'
+    = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'dash-filter'
     - if current_user.can_create_project?
       %span.pull-right
         = link_to new_project_path, class: "btn" do
           %i.icon-plus
           New Project
  
-  %ul.well-list.dash-projects-list
+  %ul.well-list.dash-list
     - projects.each do |project|
       %li
         = link_to project_path(project), class: dom_class(project) do
...	...	@@ -8,15 +8,16 @@ class Dashboard
8	8	@toggleFilter($(event.currentTarget))
9	9	@reloadActivities()
10	10
11		- $(".dash-projects-filter").keyup ->
	11	+ $(".dash-filter").keyup ->
12	12	terms = $(this).val()
	13	+ uiBox = $(this).parents('.ui-box').first()
13	14	if terms == "" \|\| terms == undefined
14		- $(".dash-projects-list li").show()
	15	+ uiBox.find(".dash-list li").show()
15	16	else
16		- $(".dash-projects-list li").each (index) ->
	17	+ uiBox.find(".dash-list li").each (index) ->
17	18	name = $(this).find(".well-title").text()
18	19
19		- if name.search(terms) == -1
	20	+ if name.toLowerCase().search(terms.toLowerCase()) == -1
20	21	$(this).hide()
21	22	else
22	23	$(this).show()
...	...
...	...	@@ -7,7 +7,9 @@
7	7	@extend .pull-right;
8	8
9	9	.ui-box {
10		- margin: 3px;
	10	+ margin: 0px;
	11	+ box-shadow: none;
	12	+
11	13	> .title {
12	14	padding: 2px 15px;
13	15	}
...	...	@@ -28,7 +30,6 @@
28	30	}
29	31	}
30	32	}
31		- @extend .ui-box;
32	33	}
33	34	}
34	35	}
...	...	@@ -47,7 +48,7 @@
47	48	}
48	49
49	50	.dashboard {
50		- .dash-projects-filter {
	51	+ .dash-filter {
51	52	margin: 0;
52	53	padding: 4px 6px;
53	54	width: 202px;
...	...	@@ -58,7 +59,29 @@
58	59	}
59	60
60	61	@media (max-width: 1200px) {
61		- .dashboard .dash-projects-filter {
	62	+ .dashboard .dash-filter {
62	63	width: 132px;
63	64	}
64	65	}
	66	+
	67	+.dash-sidebar-tabs {
	68	+ margin-bottom: 2px;
	69	+ border: none;
	70	+ margin: 0;
	71	+
	72	+ li {
	73	+ &.active {
	74	+ a {
	75	+ @include linear-gradient(#f5f5f5, #eee);
	76	+ border-bottom: 1px solid #EEE !important;
	77	+ &:hover {
	78	+ background: #eee;
	79	+ }
	80	+ }
	81	+ }
	82	+
	83	+ a {
	84	+ border-color: #CCC !important;
	85	+ }
	86	+ }
	87	+}
...	...
...	...	@@ -51,7 +51,7 @@
51	51	.event-note {
52	52	color: #555;
53	53	margin-top: 5px;
54		- margin-left: 40px;
	54	+ margin-left: 35px;
55	55
56	56	pre {
57	57	border: none;
...	...	@@ -95,7 +95,7 @@
95	95	}
96	96	}
97	97	ul {
98		- margin-left: 50px;
	98	+ margin-left: 35px;
99	99	margin-bottom: 5px;
100	100	.avatar {
101	101	width: 18px;
...	...
1	1	.ui-box
2		- %h5.title
3		- Groups
4		- %span.light
5		- (#{groups.count})
	2	+ %h5.title.clearfix
	3	+ = search_field_tag :filter_group, nil, placeholder: 'Filter by name', class: 'dash-filter'
6	4	- if current_user.can_create_group?
7	5	%span.pull-right
8		- = link_to new_group_path, class: "btn btn-small" do
	6	+ = link_to new_group_path, class: "btn" do
9	7	%i.icon-plus
10	8	New Group
11		- %ul.well-list
	9	+ %ul.well-list.dash-list
12	10	- groups.each do \|group\|
13	11	%li
14	12	= link_to group_path(id: group.path), class: dom_class(group) do
...	...
1	1	.ui-box
2	2	%h5.title.clearfix
3		- = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'dash-projects-filter'
	3	+ = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'dash-filter'
4	4	- if current_user.can_create_project?
5	5	%span.pull-right
6	6	= link_to new_project_path, class: "btn" do
7	7	%i.icon-plus
8	8	New Project
9	9
10		- %ul.well-list.dash-projects-list
	10	+ %ul.well-list.dash-list
11	11	- projects.each do \|project\|
12	12	%li
13	13	= link_to project_path(project), class: dom_class(project) do
...	...