Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Hide the help button on small screens #28951

Merged
merged 3 commits into from Jun 10, 2019
Merged

Hide the help button on small screens #28951

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
19ab884
If the screen is under 970 px in width, hide the help button and merg…
bethanyaconnor Jun 5, 2019
8de856c
Update unit tests
bethanyaconnor Jun 5, 2019
56ec2a9
A little bit of cleanup on hamburger.scss
bethanyaconnor Jun 6, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
16 changes: 12 additions & 4 deletions lib/cdo/hamburger.rb
View file
Open in desktop
Expand Up @@ -3,6 +3,8 @@
# As part of this content, it also provides CSS classes which determine
# responsive visibility for the header itself and the items inside it.

require_relative 'help_header'

class Hamburger
# These are the CSS classes applied to items in the hamburger,
# and to the hamburger itself.
Expand All @@ -22,6 +24,7 @@ def self.get_visibility(options)
show_signed_out_options = HIDE_ALWAYS
show_pegasus_options = HIDE_ALWAYS
show_intl_about = SHOW_MOBILE
show_help_options = SHOW_MOBILE

if options[:level]
# The header is taken over by level-related UI, so we need the hamburger
Expand Down Expand Up @@ -79,7 +82,8 @@ def self.get_visibility(options)
show_student_options: show_student_options,
show_signed_out_options: show_signed_out_options,
show_pegasus_options: show_pegasus_options,
show_intl_about: show_intl_about
show_intl_about: show_intl_about,
show_help_options: show_help_options
}
end

Expand Down Expand Up @@ -177,15 +181,19 @@ def self.get_hamburger_contents(options)

if options[:user_type] == "teacher"
entries = entries.concat teacher_entries.each {|e| e[:class] = visibility[:show_teacher_options]}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_teacher_options], visibility[:show_pegasus_options]), id: "after-teacher"}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_teacher_options], visibility[:show_help_options]), id: "after-teacher"}
elsif options[:user_type] == "student"
entries = entries.concat student_entries.each {|e| e[:class] = visibility[:show_student_options]}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_student_options], visibility[:show_pegasus_options]), id: "after-student"}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_student_options], visibility[:show_help_options]), id: "after-student"}
else
entries = entries.concat signed_out_entries.each {|e| e[:class] = visibility[:show_signed_out_options]}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_signed_out_options], visibility[:show_pegasus_options]), id: "after-signed-out"}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_signed_out_options], visibility[:show_help_options]), id: "after-signed-out"}
end

help_contents = HelpHeader.get_help_contents(options)
entries.concat help_contents.each {|e| e[:class] = visibility[:show_help_options]}
entries << {type: "divider", class: get_divider_visibility(visibility[:show_help_options], visibility[:show_pegasus_options]), id: "after-help"}

# Pegasus options.

entries << {
Expand Down
17 changes: 17 additions & 0 deletions lib/test/test_hamburger.rb
View file
Open in desktop
Expand Up @@ -17,6 +17,7 @@ def test_level_teacher_en
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_level_teacher_nonen
Expand All @@ -27,6 +28,7 @@ def test_level_teacher_nonen
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_level_student_en
Expand All @@ -37,6 +39,7 @@ def test_level_student_en
assert_equal visibility[:show_student_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_level_student_nonen
Expand All @@ -47,6 +50,7 @@ def test_level_student_nonen
assert_equal visibility[:show_student_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_level_nobody_en
Expand All @@ -57,6 +61,7 @@ def test_level_nobody_en
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_level_nobody_nonen
Expand All @@ -67,6 +72,7 @@ def test_level_nobody_nonen
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_teacher_en
Expand All @@ -77,6 +83,7 @@ def test_nonlevel_teacher_en
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_teacher_nonen
Expand All @@ -87,6 +94,7 @@ def test_nonlevel_teacher_nonen
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_student_en
Expand All @@ -97,6 +105,7 @@ def test_nonlevel_student_en
assert_equal visibility[:show_student_options], Hamburger::SHOW_MOBILE
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_student_nonen
Expand All @@ -107,6 +116,7 @@ def test_nonlevel_student_nonen
assert_equal visibility[:show_student_options], Hamburger::SHOW_MOBILE
assert_equal visibility[:show_signed_out_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_nobody_en
Expand All @@ -117,6 +127,7 @@ def test_nonlevel_nobody_en
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::SHOW_MOBILE
assert_equal visibility[:show_pegasus_options], Hamburger::SHOW_MOBILE
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

def test_nonlevel_nobody_nonen
Expand All @@ -127,6 +138,7 @@ def test_nonlevel_nobody_nonen
assert_equal visibility[:show_student_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_signed_out_options], Hamburger::SHOW_MOBILE
assert_equal visibility[:show_pegasus_options], Hamburger::HIDE_ALWAYS
assert_equal visibility[:show_help_options], Hamburger::SHOW_MOBILE
end

# Hamburger content tests.
Expand All @@ -146,6 +158,11 @@ def test_hamburger_content_nolevel
assert_includes_id contents[:entries], "learn"
end

def test_hamburger_content_nolevel
contents = Hamburger.get_hamburger_contents({level: nil, script_level: nil, user_type: nil, language: "en"})
assert_includes_id contents[:entries], "report-bug"
end

def test_hamburger_content_expandable_en
contents = Hamburger.get_hamburger_contents({level: nil, script_level: nil, user_type: nil, language: "en"})
assert contents[:entries].find {|e| e[:type] == "expander"}
Expand Down
22 changes: 21 additions & 1 deletion shared/css/hamburger.scss
View file
Open in desktop
Expand Up @@ -16,6 +16,10 @@
display: none;
}

&.hide-mobile {
display: block;
}

&.show-always {
display: block;
}
Expand All @@ -28,6 +32,10 @@
display: none;
}

.hide-mobile {
display: block;
}

.show-always {
display: block;
}
Expand Down Expand Up @@ -199,9 +207,21 @@
.show-mobile {
display: block;
}
#hamburger-contents, #help-contents {
&.hide-mobile {
display: none;
}
.hide-mobile {
display: none;
}
#hamburger-contents {
font-size: 18px;
}
#hamburger {
padding-left: 0;
}
#help-button {
display: none;
}
}
}

Expand Down
6 changes: 3 additions & 3 deletions shared/haml/hamburger.haml
View file
Open in desktop
Expand Up @@ -29,15 +29,15 @@
#hamburger-icon.clicktag{class: contents[:visibility]}
%span{style: "pointer-events: none"}

#help-button{class: "show-always"}
#help-button{class: "hide-mobile"}
#help-contents.hide-responsive-menu
- help_items.each do |entry|
%div{class: "show-always"}
%div{class: "hide-mobile"}
.item
- target = entry[:target] ? entry[:target] : "_self"
%a{id: entry[:id], href: entry[:url], target: target}= entry[:title]

%i#help-icon.clicktag{class: "fa fa-question-circle show-always"}
%i#help-icon.clicktag{class: "fa fa-question-circle hide-mobile"}
%span{style: "pointer-events: none"}