summaryrefslogtreecommitdiff
path: root/app
diff options
context:
space:
mode:
authorAnnabel Dunstone Gray <annabel.dunstone@gmail.com>2017-07-19 20:26:18 -0500
committerAnnabel Dunstone Gray <annabel.dunstone@gmail.com>2017-07-19 23:25:53 -0500
commitb711e10093f303c2d35aa3ebe9aff1c30c74ae7c (patch)
tree028e047c10463516ea69de41006a5e9b9e246a86 /app
parent49ee81ca12e46a703e999632efcb9f2a5627c930 (diff)
downloadgitlab-ce-b711e10093f303c2d35aa3ebe9aff1c30c74ae7c.tar.gz
Fix JS; make buttons sr accessibile; fix overlay
Diffstat (limited to 'app')
-rw-r--r--app/assets/javascripts/layout_nav.js8
-rw-r--r--app/assets/javascripts/new_sidebar.js6
-rw-r--r--app/assets/stylesheets/new_sidebar.scss2
-rw-r--r--app/views/layouts/nav/_breadcrumbs.html.haml3
-rw-r--r--app/views/layouts/nav/_new_admin_sidebar.html.haml5
-rw-r--r--app/views/layouts/nav/_new_group_sidebar.html.haml5
-rw-r--r--app/views/layouts/nav/_new_profile_sidebar.html.haml5
-rw-r--r--app/views/layouts/nav/_new_project_sidebar.html.haml5
8 files changed, 24 insertions, 15 deletions
diff --git a/app/assets/javascripts/layout_nav.js b/app/assets/javascripts/layout_nav.js
index 1a24c7a6433..6186ffe20b3 100644
--- a/app/assets/javascripts/layout_nav.js
+++ b/app/assets/javascripts/layout_nav.js
@@ -1,5 +1,6 @@
/* eslint-disable func-names, space-before-function-paren, no-var, prefer-arrow-callback, no-unused-vars, one-var, one-var-declaration-per-line, vars-on-top, max-len */
import _ from 'underscore';
+import Cookies from 'js-cookie';
import NewNavSidebar from './new_sidebar';
(function() {
@@ -54,8 +55,11 @@ import NewNavSidebar from './new_sidebar';
}
$(() => {
- var newNavSidebar = new NewNavSidebar();
- newNavSidebar.bindEvents();
+ if (Cookies.get('new_nav') === 'true') {
+ const newNavSidebar = new NewNavSidebar();
+ newNavSidebar.bindEvents();
+ }
+
$(window).on('scroll', _.throttle(applyScrollNavClass, 100));
});
}).call(window);
diff --git a/app/assets/javascripts/new_sidebar.js b/app/assets/javascripts/new_sidebar.js
index 2ab8d764a1d..5f98aff8ced 100644
--- a/app/assets/javascripts/new_sidebar.js
+++ b/app/assets/javascripts/new_sidebar.js
@@ -11,9 +11,9 @@ export default class NewNavSidebar {
}
bindEvents() {
- this.$openSidebar.on('click', e => this.toggleSidebarNav(e, true));
- this.$closeSidebar.on('click', e => this.toggleSidebarNav(e, false));
- this.$overlay.on('click', e => this.toggleSidebarNav(e, false));
+ this.$openSidebar.on('click', () => this.toggleSidebarNav(true));
+ this.$closeSidebar.on('click', () => this.toggleSidebarNav(false));
+ this.$overlay.on('click', () => this.toggleSidebarNav(false));
}
toggleSidebarNav(show) {
diff --git a/app/assets/stylesheets/new_sidebar.scss b/app/assets/stylesheets/new_sidebar.scss
index 0ab5322a7a4..1532ff3940c 100644
--- a/app/assets/stylesheets/new_sidebar.scss
+++ b/app/assets/stylesheets/new_sidebar.scss
@@ -247,7 +247,7 @@ $new-sidebar-width: 220px;
&.mobile-nav-open {
display: block;
- position: absolute;
+ position: fixed;
background-color: $black-transparent;
height: 100%;
width: 100%;
diff --git a/app/views/layouts/nav/_breadcrumbs.html.haml b/app/views/layouts/nav/_breadcrumbs.html.haml
index cef6e022d2b..6ffa1dd97d2 100644
--- a/app/views/layouts/nav/_breadcrumbs.html.haml
+++ b/app/views/layouts/nav/_breadcrumbs.html.haml
@@ -4,7 +4,8 @@
%nav.breadcrumbs{ role: "navigation" }
.breadcrumbs-container{ class: [container_class, @content_class] }
- if defined?(@new_sidebar)
- %button.toggle-mobile-nav
+ = button_tag class: 'toggle-mobile-nav', type: 'button' do
+ %span.sr-only Open sidebar
= icon ('bars')
.breadcrumbs-links.js-title-container
- unless hide_top_links
diff --git a/app/views/layouts/nav/_new_admin_sidebar.html.haml b/app/views/layouts/nav/_new_admin_sidebar.html.haml
index 2b5523f6fad..e58bc66635a 100644
--- a/app/views/layouts/nav/_new_admin_sidebar.html.haml
+++ b/app/views/layouts/nav/_new_admin_sidebar.html.haml
@@ -4,8 +4,9 @@
.avatar-container.s40.settings-avatar
= icon('wrench')
.project-title Admin Area
- %button.close-nav-button
- = icon('times')
+ = button_tag class: 'close-nav-button', type: 'button' do
+ %span.sr-only Close sidebar
+ = icon ('times')
%ul.sidebar-top-level-items
= nav_link(controller: %w(dashboard admin projects users groups jobs runners cohorts), html_options: {class: 'home'}) do
= link_to admin_root_path, title: 'Overview', class: 'shortcuts-tree' do
diff --git a/app/views/layouts/nav/_new_group_sidebar.html.haml b/app/views/layouts/nav/_new_group_sidebar.html.haml
index fdb66d827ec..b8a2a36ef2a 100644
--- a/app/views/layouts/nav/_new_group_sidebar.html.haml
+++ b/app/views/layouts/nav/_new_group_sidebar.html.haml
@@ -5,8 +5,9 @@
= image_tag group_icon(@group), class: "avatar s40 avatar-tile"
.group-title
= @group.name
- %button.close-nav-button
- = icon('times')
+ = button_tag class: 'close-nav-button', type: 'button' do
+ %span.sr-only Close sidebar
+ = icon ('times')
%ul.sidebar-top-level-items
= nav_link(path: ['groups#show', 'groups#activity', 'groups#subgroups'], html_options: { class: 'home' }) do
= link_to group_path(@group), title: 'Home' do
diff --git a/app/views/layouts/nav/_new_profile_sidebar.html.haml b/app/views/layouts/nav/_new_profile_sidebar.html.haml
index ce4eecc6c79..239e6b949e2 100644
--- a/app/views/layouts/nav/_new_profile_sidebar.html.haml
+++ b/app/views/layouts/nav/_new_profile_sidebar.html.haml
@@ -4,8 +4,9 @@
.avatar-container.s40.settings-avatar
= icon('user')
.project-title User Settings
- %button.close-nav-button
- = icon('times')
+ = button_tag class: 'close-nav-button', type: 'button' do
+ %span.sr-only Close sidebar
+ = icon ('times')
%ul.sidebar-top-level-items
= nav_link(path: 'profiles#show', html_options: {class: 'home'}) do
= link_to profile_path, title: 'Profile Settings' do
diff --git a/app/views/layouts/nav/_new_project_sidebar.html.haml b/app/views/layouts/nav/_new_project_sidebar.html.haml
index baf257d06e0..3f5b7caaed9 100644
--- a/app/views/layouts/nav/_new_project_sidebar.html.haml
+++ b/app/views/layouts/nav/_new_project_sidebar.html.haml
@@ -6,8 +6,9 @@
= project_icon(@project, alt: @project.name, class: 'avatar s40 avatar-tile')
.project-title
= @project.name
- %button.close-nav-button
- = icon('times')
+ = button_tag class: 'close-nav-button', type: 'button' do
+ %span.sr-only Close sidebar
+ = icon ('times')
%ul.sidebar-top-level-items
= nav_link(path: ['projects#show', 'projects#activity', 'cycle_analytics#show'], html_options: { class: 'home' }) do
= link_to project_path(@project), title: 'Project', class: 'shortcuts-project' do