diff options
author | Phil Hughes <me@iamphill.com> | 2017-01-03 15:41:14 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2017-01-03 15:41:14 +0000 |
commit | 85a329845fa07112fe81aab8c6440490056f4a17 (patch) | |
tree | 23bfb7e438cc4f131d54c8bd44ea94b71681e364 /app/views/projects/boards | |
parent | c67e9bb353dee34a86e072436e13a97e18bf6925 (diff) | |
download | gitlab-ce-85a329845fa07112fe81aab8c6440490056f4a17.tar.gz |
Added animations to issue boards
- Adds animation when opening & closing the sidebar
- Adds an animation when dragging boards to a new position
- Adds animations to dragging issues around
When opening the sidebar it will also animate the scrollLeft property to
make moving to the opened issue less blunt.
Closes #25630
Diffstat (limited to 'app/views/projects/boards')
-rw-r--r-- | app/views/projects/boards/components/_sidebar.html.haml | 43 |
1 files changed, 22 insertions, 21 deletions
diff --git a/app/views/projects/boards/components/_sidebar.html.haml b/app/views/projects/boards/components/_sidebar.html.haml index 2125c3387c4..df7fa9ddaf2 100644 --- a/app/views/projects/boards/components/_sidebar.html.haml +++ b/app/views/projects/boards/components/_sidebar.html.haml @@ -1,23 +1,24 @@ %board-sidebar{ "inline-template" => true, ":current-user" => "#{current_user ? current_user.to_json(only: [:username, :id, :name], methods: [:avatar_url]) : {}}" } - %aside.right-sidebar.right-sidebar-expanded.issue-boards-sidebar{ "v-show" => "showSidebar" } - .issuable-sidebar - .block.issuable-sidebar-header - %span.issuable-header-text.hide-collapsed.pull-left - %strong - {{ issue.title }} - %br/ - %span - = precede "#" do - {{ issue.id }} - %a.gutter-toggle.pull-right{ role: "button", - href: "#", - "@click.prevent" => "closeSidebar", - "aria-label" => "Toggle sidebar" } - = custom_icon("icon_close", size: 15) - .js-issuable-update - = render "projects/boards/components/sidebar/assignee" - = render "projects/boards/components/sidebar/milestone" - = render "projects/boards/components/sidebar/due_date" - = render "projects/boards/components/sidebar/labels" - = render "projects/boards/components/sidebar/notifications" + %transition{ name: "boards-sidebar-slide" } + %aside.right-sidebar.right-sidebar-expanded.issue-boards-sidebar{ "v-show" => "showSidebar" } + .issuable-sidebar + .block.issuable-sidebar-header + %span.issuable-header-text.hide-collapsed.pull-left + %strong + {{ issue.title }} + %br/ + %span + = precede "#" do + {{ issue.id }} + %a.gutter-toggle.pull-right{ role: "button", + href: "#", + "@click.prevent" => "closeSidebar", + "aria-label" => "Toggle sidebar" } + = custom_icon("icon_close", size: 15) + .js-issuable-update + = render "projects/boards/components/sidebar/assignee" + = render "projects/boards/components/sidebar/milestone" + = render "projects/boards/components/sidebar/due_date" + = render "projects/boards/components/sidebar/labels" + = render "projects/boards/components/sidebar/notifications" |