Commit e9c440d2215187899ef0515e0e9dd171277b70f1
Exists in
spb-stable
and in
2 other branches
Merge branch 'ui-panel-boxes' into 'master'
UI panel boxes Replace custom ui-box with bootstrap `panels`. No sense to use custom components if we can use bootstrap. UI different is minimal so no screenshots
Showing
38 changed files
with
141 additions
and
289 deletions
Show diff stats
app/assets/javascripts/dashboard.js.coffee
app/assets/stylesheets/generic/lists.scss
app/assets/stylesheets/generic/ui_box.scss
... | ... | @@ -1,173 +0,0 @@ |
1 | -/** | |
2 | - * UI box: | |
3 | - * Block element for separating information on page. | |
4 | - * Used for storing issues lists, grouped data. | |
5 | - * You can have multiple ui boxes on one page | |
6 | - * | |
7 | - * Classes: | |
8 | - * .ui-box - for any block & widgets | |
9 | - * .ui-box.ui-box-small - same but with smaller title | |
10 | - * .ui-box.ui-box-danger - with red title | |
11 | - * | |
12 | - * Ex. 1: List | |
13 | - * .ui-box | |
14 | - * .title | |
15 | - * # title here | |
16 | - * %ul | |
17 | - * # content here | |
18 | - * | |
19 | - * Ex. 2: Block data | |
20 | - * .ui-box | |
21 | - * .title | |
22 | - * # title here | |
23 | - * .body | |
24 | - * # content here | |
25 | - * | |
26 | - */ | |
27 | - | |
28 | -.ui-box { | |
29 | - background: #FFF; | |
30 | - margin-bottom: 20px; | |
31 | - border: 1px solid #DDD; | |
32 | - word-wrap: break-word; | |
33 | - | |
34 | - img { | |
35 | - max-width: 100%; | |
36 | - } | |
37 | - | |
38 | - pre { | |
39 | - code { | |
40 | - background: none !important; | |
41 | - } | |
42 | - } | |
43 | - | |
44 | - ul { | |
45 | - margin: 0; | |
46 | - padding: 0; | |
47 | - } | |
48 | - | |
49 | - .title { | |
50 | - background-color: #EEE; | |
51 | - border-bottom: 1px solid #DDD; | |
52 | - color: #666; | |
53 | - font-size: 16px; | |
54 | - text-shadow: 0 1px 1px #fff; | |
55 | - padding: 0 10px; | |
56 | - font-size: 14px; | |
57 | - line-height: 40px; | |
58 | - font-weight: normal; | |
59 | - margin: 0; | |
60 | - | |
61 | - > a { | |
62 | - text-shadow: 0 1px 1px #fff; | |
63 | - } | |
64 | - | |
65 | - form { | |
66 | - margin-bottom: 0; | |
67 | - margin-top: 0; | |
68 | - } | |
69 | - | |
70 | - .btn { | |
71 | - vertical-align: middle; | |
72 | - padding: 4px 12px; | |
73 | - @include box-shadow(0 0px 1px 1px #f2f2f2); | |
74 | - } | |
75 | - | |
76 | - .nav-pills { | |
77 | - > li { | |
78 | - > a { | |
79 | - padding: 13px; | |
80 | - margin: 0; | |
81 | - font-size: 13px; | |
82 | - } | |
83 | - &.active { | |
84 | - > a { | |
85 | - background: #D5D5D5; | |
86 | - color: $style_color; | |
87 | - @include border-radius(0); | |
88 | - border-radius: 0; | |
89 | - border-left: 1px solid #CCC; | |
90 | - border-right: 1px solid #CCC; | |
91 | - } | |
92 | - } | |
93 | - } | |
94 | - } | |
95 | - } | |
96 | - | |
97 | - .body { | |
98 | - padding: 10px; | |
99 | - } | |
100 | - | |
101 | - &.padded { | |
102 | - h5, .title { | |
103 | - margin: -20px; | |
104 | - margin-bottom: 0; | |
105 | - padding: 5px 20px; | |
106 | - } | |
107 | - } | |
108 | - | |
109 | - .row_title { | |
110 | - font-weight: 500; | |
111 | - color: #444; | |
112 | - &:hover { | |
113 | - color: #444; | |
114 | - text-decoration: underline; | |
115 | - } | |
116 | - } | |
117 | - | |
118 | - .form-holder { | |
119 | - padding-top: 20px; | |
120 | - form { | |
121 | - margin-bottom: 0; | |
122 | - legend { | |
123 | - text-indent: 10px; | |
124 | - } | |
125 | - .form-actions { | |
126 | - margin-bottom: 0; | |
127 | - } | |
128 | - } | |
129 | - } | |
130 | -} | |
131 | - | |
132 | -/* | |
133 | - * Small box | |
134 | - */ | |
135 | -.ui-box.ui-box-small { | |
136 | - margin-bottom: 10px; | |
137 | - | |
138 | - .title { | |
139 | - font-size: 13px; | |
140 | - line-height: 30px; | |
141 | - | |
142 | - a { | |
143 | - color: #666; | |
144 | - &:hover { | |
145 | - text-decoration: underline; | |
146 | - } | |
147 | - } | |
148 | - } | |
149 | -} | |
150 | - | |
151 | -/* | |
152 | - * Danger box | |
153 | - */ | |
154 | -.ui-box.ui-box-danger { | |
155 | - background: #f7f7f7; | |
156 | - border: none; | |
157 | - | |
158 | - .title { | |
159 | - background: #D65; | |
160 | - color: #fff; | |
161 | - text-shadow: none; | |
162 | - font-weight: 500; | |
163 | - } | |
164 | -} | |
165 | - | |
166 | -/* | |
167 | - * Block under tw-bootstrap tabs | |
168 | - */ | |
169 | -.tab-pane { | |
170 | - .ui-box { | |
171 | - margin: 3px 3px 25px 3px; | |
172 | - } | |
173 | -} |
app/assets/stylesheets/gl_bootstrap.scss
... | ... | @@ -221,3 +221,20 @@ ul.breadcrumb { |
221 | 221 | position: relative; |
222 | 222 | white-space: nowrap; |
223 | 223 | } |
224 | + | |
225 | +/** | |
226 | + * Add some extra stuff to panels | |
227 | + * | |
228 | + */ | |
229 | +.panel { | |
230 | + .panel-heading { | |
231 | + font-size: 14px; | |
232 | + line-height: 18px; | |
233 | + | |
234 | + .panel-head-actions { | |
235 | + position: relative; | |
236 | + top: -7px; | |
237 | + float: right; | |
238 | + } | |
239 | + } | |
240 | +} | ... | ... |
app/assets/stylesheets/sections/dashboard.scss
1 | 1 | .dashboard { |
2 | 2 | .side { |
3 | - .ui-box { | |
4 | - margin: 0px; | |
5 | - box-shadow: none; | |
6 | - | |
7 | - .nav-projects-tabs li { padding: 0; } | |
3 | + .panel { | |
4 | + .panel-heading { | |
5 | + background: #EEE; | |
6 | + border-top-left-radius: 0; | |
7 | + } | |
8 | + border-top-left-radius: 0; | |
8 | 9 | } |
9 | 10 | } |
10 | 11 | } |
... | ... | @@ -24,9 +25,7 @@ |
24 | 25 | |
25 | 26 | .dashboard { |
26 | 27 | .dash-filter { |
27 | - margin: 7px 0; | |
28 | - padding: 4px 6px; | |
29 | - width: 220px; | |
28 | + width: 205px; | |
30 | 29 | float: left; |
31 | 30 | height: inherit; |
32 | 31 | } |
... | ... | @@ -34,7 +33,7 @@ |
34 | 33 | |
35 | 34 | @media (max-width: 1200px) { |
36 | 35 | .dashboard .dash-filter { |
37 | - width: 150px; | |
36 | + width: 140px; | |
38 | 37 | } |
39 | 38 | } |
40 | 39 | ... | ... |
app/views/admin/background_jobs/show.html.haml
... | ... | @@ -3,9 +3,9 @@ |
3 | 3 | |
4 | 4 | %hr |
5 | 5 | |
6 | -.ui-box | |
7 | - .title Sidekiq running processes | |
8 | - .body | |
6 | +.panel.panel-default | |
7 | + .panel-heading Sidekiq running processes | |
8 | + .panel-body | |
9 | 9 | - if @sidekiq_processes.empty? |
10 | 10 | %h4.cred |
11 | 11 | %i.icon-warning-sign |
... | ... | @@ -40,5 +40,5 @@ |
40 | 40 | |
41 | 41 | |
42 | 42 | |
43 | -.ui-box | |
43 | +.panel.panel-default | |
44 | 44 | %iframe{src: sidekiq_path, width: '100%', height: 900, style: "border: none"} | ... | ... |
app/views/admin/groups/show.html.haml
... | ... | @@ -7,8 +7,8 @@ |
7 | 7 | %hr |
8 | 8 | .row |
9 | 9 | .col-md-6 |
10 | - .ui-box | |
11 | - .title | |
10 | + .panel.panel-default | |
11 | + .panel-heading | |
12 | 12 | Group info: |
13 | 13 | %ul.well-list |
14 | 14 | %li |
... | ... | @@ -29,8 +29,8 @@ |
29 | 29 | %strong |
30 | 30 | = @group.created_at.stamp("March 1, 1999") |
31 | 31 | |
32 | - .ui-box | |
33 | - .title | |
32 | + .panel.panel-default | |
33 | + .panel-heading | |
34 | 34 | Projects |
35 | 35 | %small |
36 | 36 | (#{@group.projects.count}) |
... | ... | @@ -45,10 +45,10 @@ |
45 | 45 | %span.monospace= project.path_with_namespace + ".git" |
46 | 46 | |
47 | 47 | .col-md-6 |
48 | - .ui-box | |
49 | - .title | |
48 | + .panel.panel-default | |
49 | + .panel-heading | |
50 | 50 | Add user(s) to the group: |
51 | - .body.form-holder | |
51 | + .panel-body.form-holder | |
52 | 52 | %p.light |
53 | 53 | Read more about project permissions |
54 | 54 | %strong= link_to "here", help_page_path("permissions", "permissions"), class: "vlink" |
... | ... | @@ -60,8 +60,8 @@ |
60 | 60 | = select_tag :group_access, options_for_select(UsersGroup.group_access_roles), class: "project-access-select select2" |
61 | 61 | %hr |
62 | 62 | = submit_tag 'Add users into group', class: "btn btn-create" |
63 | - .ui-box | |
64 | - .title | |
63 | + .panel.panel-default | |
64 | + .panel-heading | |
65 | 65 | %strong #{@group.name} |
66 | 66 | Group Members |
67 | 67 | %small | ... | ... |
app/views/admin/hooks/index.html.haml
app/views/admin/projects/index.html.haml
... | ... | @@ -37,10 +37,10 @@ |
37 | 37 | = link_to "Reset", admin_projects_path, class: "btn" |
38 | 38 | |
39 | 39 | .col-md-8 |
40 | - .ui-box | |
41 | - .title | |
40 | + .panel.panel-default | |
41 | + .panel-heading | |
42 | 42 | Projects (#{@projects.total_count}) |
43 | - .pull-right | |
43 | + .panel-head-actions | |
44 | 44 | .dropdown.inline |
45 | 45 | %a.dropdown-toggle.btn{href: '#', "data-toggle" => "dropdown"} |
46 | 46 | %span.light sort: | ... | ... |
app/views/admin/projects/show.html.haml
... | ... | @@ -6,8 +6,8 @@ |
6 | 6 | %hr |
7 | 7 | .row |
8 | 8 | .col-md-6 |
9 | - .ui-box | |
10 | - .title | |
9 | + .panel.panel-default | |
10 | + .panel-heading | |
11 | 11 | Project info: |
12 | 12 | %ul.well-list |
13 | 13 | %li |
... | ... | @@ -75,10 +75,10 @@ |
75 | 75 | = visibility_level_icon(@project.visibility_level) |
76 | 76 | = visibility_level_label(@project.visibility_level) |
77 | 77 | |
78 | - .ui-box | |
79 | - .title | |
78 | + .panel.panel-default | |
79 | + .panel-heading | |
80 | 80 | Transfer project |
81 | - .body | |
81 | + .panel-body | |
82 | 82 | = form_for @project, url: transfer_admin_project_path(@project), method: :put, html: { class: 'form-horizontal' } do |f| |
83 | 83 | .form-group |
84 | 84 | = f.label :namespace_id, "Namespace", class: 'control-label' |
... | ... | @@ -92,8 +92,8 @@ |
92 | 92 | |
93 | 93 | .col-md-6 |
94 | 94 | - if @group |
95 | - .ui-box | |
96 | - .title | |
95 | + .panel.panel-default | |
96 | + .panel-heading | |
97 | 97 | %strong #{@group.name} |
98 | 98 | group members (#{@group.users_groups.count}) |
99 | 99 | .pull-right |
... | ... | @@ -103,8 +103,8 @@ |
103 | 103 | - @group.users_groups.order('group_access DESC').each do |member| |
104 | 104 | = render 'users_groups/users_group', member: member, show_controls: false |
105 | 105 | |
106 | - .ui-box | |
107 | - .title | |
106 | + .panel.panel-default | |
107 | + .panel-heading | |
108 | 108 | Project members |
109 | 109 | %small |
110 | 110 | (#{@project.users.count}) | ... | ... |
app/views/admin/users/index.html.haml
... | ... | @@ -28,10 +28,10 @@ |
28 | 28 | = link_to 'Reset', admin_users_path, class: "btn btn-cancel" |
29 | 29 | |
30 | 30 | .col-md-9 |
31 | - .ui-box | |
32 | - .title | |
31 | + .panel.panel-default | |
32 | + .panel-heading | |
33 | 33 | Users (#{@users.total_count}) |
34 | - .pull-right | |
34 | + .panel-head-actions | |
35 | 35 | = link_to 'New User', new_admin_user_path, class: "btn btn-new" |
36 | 36 | %ul.well-list |
37 | 37 | - @users.each do |user| | ... | ... |
app/views/admin/users/show.html.haml
... | ... | @@ -14,8 +14,8 @@ |
14 | 14 | |
15 | 15 | .row |
16 | 16 | .col-md-6 |
17 | - .ui-box | |
18 | - .title | |
17 | + .panel.panel-default | |
18 | + .panel-heading | |
19 | 19 | Account: |
20 | 20 | .pull-right |
21 | 21 | = image_tag avatar_icon(@user.email, 32), class: "avatar s32" |
... | ... | @@ -118,8 +118,8 @@ |
118 | 118 | |
119 | 119 | .col-md-6 |
120 | 120 | - if @user.users_groups.present? |
121 | - .ui-box | |
122 | - .title Groups: | |
121 | + .panel.panel-default | |
122 | + .panel-heading Groups: | |
123 | 123 | %ul.well-list |
124 | 124 | - @user.users_groups.each do |user_group| |
125 | 125 | - group = user_group.group |
... | ... | @@ -132,8 +132,8 @@ |
132 | 132 | = link_to group_users_group_path(group, user_group), data: { confirm: remove_user_from_group_message(group, @user) }, method: :delete, remote: true, class: "btn-tiny btn btn-remove", title: 'Remove user from group' do |
133 | 133 | %i.icon-remove.icon-white |
134 | 134 | |
135 | - .ui-box | |
136 | - .title Projects (#{@projects.count}) | |
135 | + .panel.panel-default | |
136 | + .panel-heading Projects (#{@projects.count}) | |
137 | 137 | %ul.well-list |
138 | 138 | - @projects.sort_by(&:name_with_namespace).each do |project| |
139 | 139 | - tm = project.team.find_tm(@user.id) | ... | ... |
app/views/dashboard/_groups.html.haml
app/views/dashboard/_projects.html.haml
app/views/groups/_projects.html.haml
1 | -.ui-box | |
2 | - .title | |
1 | +.panel.panel-default | |
2 | + .panel-heading | |
3 | 3 | Projects (#{projects.count}) |
4 | 4 | - if can? current_user, :create_projects, @group |
5 | - %span.pull-right | |
5 | + .panel-head-actions | |
6 | 6 | = link_to new_project_path(namespace_id: @group.id), class: "btn btn-new" do |
7 | 7 | %i.icon-plus |
8 | 8 | New project | ... | ... |
app/views/groups/edit.html.haml
... | ... | @@ -17,8 +17,8 @@ |
17 | 17 | .col-md-10 |
18 | 18 | .tab-content |
19 | 19 | .tab-pane.active#tab-edit |
20 | - .ui-box | |
21 | - .title | |
20 | + .panel.panel-default | |
21 | + .panel-heading | |
22 | 22 | %strong= @group.name |
23 | 23 | group settings: |
24 | 24 | %div.form-holder |
... | ... | @@ -61,8 +61,8 @@ |
61 | 61 | = f.submit 'Save group', class: "btn btn-save" |
62 | 62 | |
63 | 63 | .tab-pane#tab-projects |
64 | - .ui-box | |
65 | - .title | |
64 | + .panel.panel-default | |
65 | + .panel-heading | |
66 | 66 | %strong= @group.name |
67 | 67 | projects: |
68 | 68 | - if can? current_user, :manage_group, @group |
... | ... | @@ -84,9 +84,9 @@ |
84 | 84 | .nothing-here-block This group has no projects yet |
85 | 85 | |
86 | 86 | .tab-pane#tab-remove |
87 | - .ui-box.ui-box-danger | |
88 | - .title Remove group | |
89 | - .body | |
87 | + .panel.panel-default.panel.panel-danger | |
88 | + .panel-heading Remove group | |
89 | + .panel-body | |
90 | 90 | %p |
91 | 91 | Removing group will cause all child projects and resources to be removed. |
92 | 92 | %p | ... | ... |
app/views/groups/members.html.haml
app/views/help/index.html.haml
... | ... | @@ -18,8 +18,8 @@ |
18 | 18 | |
19 | 19 | .row |
20 | 20 | .col-md-4 |
21 | - .ui-box | |
22 | - .title | |
21 | + .panel.panel-default | |
22 | + .panel-heading | |
23 | 23 | Quick help |
24 | 24 | %ul.well-list |
25 | 25 | %li |
... | ... | @@ -34,8 +34,8 @@ |
34 | 34 | = link_to "shortcuts", '#', onclick: "new Shortcuts()" |
35 | 35 | |
36 | 36 | .col-md-8 |
37 | - .ui-box.documentation | |
38 | - .title Documentation | |
37 | + .panel.panel-default.documentation | |
38 | + .panel-heading Documentation | |
39 | 39 | |
40 | 40 | = preserve do |
41 | 41 | - readme_text = File.read(Rails.root.join("doc", "README.md")) | ... | ... |
app/views/profiles/emails/index.html.haml
app/views/profiles/groups/index.html.haml
app/views/profiles/keys/index.html.haml
app/views/profiles/keys/show.html.haml
app/views/projects/compare/show.html.haml
app/views/projects/edit.html.haml
... | ... | @@ -6,7 +6,7 @@ |
6 | 6 | Project settings: |
7 | 7 | %p.light Some settings, such as "Transfer Project", are hidden inside the danger area below |
8 | 8 | %hr |
9 | - .form-holder | |
9 | + .panel-body | |
10 | 10 | = form_for @project, remote: true, html: { class: "edit_project form-horizontal" } do |f| |
11 | 11 | %fieldset |
12 | 12 | .form-group.project_name_holder |
... | ... | @@ -106,13 +106,13 @@ |
106 | 106 | |
107 | 107 | .js-toggle-content.hide |
108 | 108 | - if can? current_user, :archive_project, @project |
109 | - .ui-box.ui-box-danger | |
110 | - .title | |
109 | + .panel.panel-default.panel.panel-danger | |
110 | + .panel-heading | |
111 | 111 | - if @project.archived? |
112 | 112 | Unarchive project |
113 | 113 | - else |
114 | 114 | Archive project |
115 | - .body | |
115 | + .panel-body | |
116 | 116 | - if @project.archived? |
117 | 117 | %p |
118 | 118 | Unarchiving the project will mark its repository as active. |
... | ... | @@ -137,10 +137,10 @@ |
137 | 137 | .nothing-here-block Only the project owner can archive a project |
138 | 138 | |
139 | 139 | - if can?(current_user, :change_namespace, @project) |
140 | - .ui-box.ui-box-danger | |
141 | - .title Transfer project | |
140 | + .panel.panel-default.panel.panel-danger | |
141 | + .panel-heading Transfer project | |
142 | 142 | .errors-holder |
143 | - .form-holder | |
143 | + .panel-body | |
144 | 144 | = form_for(@project, url: transfer_project_path(@project), method: :put, remote: true, html: { class: 'transfer-project form-horizontal' }) do |f| |
145 | 145 | .form-group |
146 | 146 | = f.label :namespace_id, class: 'control-label' do |
... | ... | @@ -157,10 +157,10 @@ |
157 | 157 | - else |
158 | 158 | .nothing-here-block Only the project owner can transfer a project |
159 | 159 | |
160 | - .ui-box.ui-box-danger | |
161 | - .title Rename repository | |
160 | + .panel.panel-default.panel.panel-danger | |
161 | + .panel-heading Rename repository | |
162 | 162 | .errors-holder |
163 | - .form-holder | |
163 | + .panel-body | |
164 | 164 | = form_for(@project, html: { class: 'form-horizontal' }) do |f| |
165 | 165 | .form-group |
166 | 166 | = f.label :path, class: 'control-label' do |
... | ... | @@ -177,9 +177,9 @@ |
177 | 177 | = f.submit 'Rename', class: "btn btn-remove" |
178 | 178 | |
179 | 179 | - if can?(current_user, :remove_project, @project) |
180 | - .ui-box.ui-box-danger | |
181 | - .title Remove project | |
182 | - .body | |
180 | + .panel.panel-default.panel.panel-danger | |
181 | + .panel-heading Remove project | |
182 | + .panel-body | |
183 | 183 | %p |
184 | 184 | Removing the project will delete its repository and all related resources including issues, merge requests etc. |
185 | 185 | %br | ... | ... |
app/views/projects/hooks/index.html.haml
app/views/projects/issues/_issues.html.haml
app/views/projects/merge_requests/_new_submit.html.haml
... | ... | @@ -58,8 +58,8 @@ |
58 | 58 | = f.submit 'Submit merge request', class: "btn btn-create" |
59 | 59 | |
60 | 60 | .mr-compare |
61 | - %div.ui-box | |
62 | - .title | |
61 | + %div.panel.panel-default | |
62 | + .panel-heading | |
63 | 63 | Commits (#{@commits.count}) |
64 | 64 | - if @commits.size > MergeRequestDiff::COMMITS_SAFE_SIZE |
65 | 65 | %ul.well-list | ... | ... |
app/views/projects/merge_requests/index.html.haml
app/views/projects/merge_requests/show/_commits.html.haml
app/views/projects/milestones/_issues.html.haml
app/views/projects/milestones/index.html.haml
app/views/projects/milestones/show.html.haml
... | ... | @@ -84,14 +84,14 @@ |
84 | 84 | .tab-pane#tab-merge-requests |
85 | 85 | .row |
86 | 86 | .col-md-6 |
87 | - .ui-box | |
88 | - .title Open | |
87 | + .panel.panel-default | |
88 | + .panel-heading Open | |
89 | 89 | %ul.well-list |
90 | 90 | - @merge_requests.opened.each do |merge_request| |
91 | 91 | = render 'merge_request', merge_request: merge_request |
92 | 92 | .col-md-6 |
93 | - .ui-box | |
94 | - .title Closed | |
93 | + .panel.panel-default | |
94 | + .panel-heading Closed | |
95 | 95 | %ul.well-list |
96 | 96 | - @merge_requests.closed.each do |merge_request| |
97 | 97 | = render 'merge_request', merge_request: merge_request | ... | ... |
app/views/projects/team_members/_group_members.html.haml
app/views/projects/team_members/_team.html.haml
app/views/shared/_issues.html.haml
1 | 1 | - if @issues.any? |
2 | 2 | - @issues.group_by(&:project).each do |group| |
3 | - .ui-box.ui-box-small | |
3 | + .panel.panel-default.panel.panel-default-small | |
4 | 4 | - project = group[0] |
5 | - .title | |
5 | + .panel-heading | |
6 | 6 | = link_to_project project |
7 | 7 | = link_to 'show all', project_issues_path(project), class: 'pull-right' |
8 | 8 | ... | ... |
app/views/shared/_merge_requests.html.haml
1 | 1 | - if @merge_requests.any? |
2 | 2 | - @merge_requests.group_by(&:target_project).each do |group| |
3 | - .ui-box.ui-box-small | |
3 | + .panel.panel-default.panel.panel-default-small | |
4 | 4 | - project = group[0] |
5 | - .title | |
5 | + .panel-heading | |
6 | 6 | = link_to_project project |
7 | 7 | = link_to 'show all', project_merge_requests_path(project), class: 'pull-right' |
8 | 8 | %ul.well-list.mr-list | ... | ... |
app/views/users/_profile.html.haml