ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Take out k12 styles (return to legacy look/feel) 

fixes: CNVS-21745

This removes all the logic we had around html and styles specifically for k12
so we can return it to the legacy look/feel.

Primarily this is for legacy UI. See note below on new UI.

Test Plan:
- In legacy UI, turn on the k12 flag
- Nothing should change

Note: In k12 theme we primarily touched the navigation and account nav
(aka, course nav) area. So long as those look the same as
Canvas Legacy UI, it's good.

New UI: We will be making another commit that will allow new ui styles to
compile with k12 flag on. Right now turning new UI on will break it (since we
are not including these assets).

Change-Id: I71699ca3f77c508dc704e232c1e06ddf737f7e42
Reviewed-on: https://gerrit.instructure.com/57975
Tested-by: Jenkins
Reviewed-by: Jacob Fugal <jacob@instructure.com>
Reviewed-by: Colleen Palmer <colleen@instructure.com>
Product-Review: Colleen Palmer <colleen@instructure.com>
QA-Review: Adrian Foong <afoong@instructure.com>
This commit is contained in:
Colleen Palmer 2015-07-08 13:16:10 -06:00 committed by Ryan Shaw
parent fee02186e7
commit 6d8251f624
12 changed files with 78 additions and 563 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

226
app/stylesheets/base/_#header.scss
View File

@ -58,7 +58,7 @@ $masquerade-link-color: $ic-color-alert;
}
#header {
@if $is-k12 or $use_new_styles == false {
@if $use_new_styles == false {
position: relative;
z-index: 11;
background-color: $ic-header-background;
@ -77,48 +77,40 @@ $masquerade-link-color: $ic-color-alert;
}
#topbar {
@if $is-k12 == false {
position: absolute;
top: 0;
right: 0;
width: 100%;
overflow: hidden;
}
position: absolute;
top: 0;
right: 0;
width: 100%;
overflow: hidden;
}
#identity {
@include reset-list;
@if $is-k12 { font-size: 14px; }
@else {
float: right;
font-size: 12px;
margin-right: $right_side_margin;
// make room for the drop shadow
margin-bottom: 4px;
padding: 0 11px;
@if $use_high_contrast {
background-color: #555;
}
@else {
background-color: #31383e;
}
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-top: 0;
float: right;
font-size: 12px;
margin-right: $right_side_margin;
// make room for the drop shadow
margin-bottom: 4px;
padding: 0 11px;
@if $use_high_contrast {
background-color: #555;
}
@else {
background-color: #31383e;
}
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-top: 0;
li {
@if $is-k12 {
margin: 0 0 0 $k12-sp;
padding: 0;
display: inline-block;
}
@else {
color: white;
float: left;
line-height: 1em;
margin: 5px 8px 5px 0;
padding-left: 8px;
}
&.first, &#identity-help-container {
border-left: none;
}
@ -127,26 +119,17 @@ $masquerade-link-color: $ic-color-alert;
}
}
.user_name {
@if $is-k12 == false {
margin-right: 15px;
}
margin-right: 15px;
}
a {
@if $is-k12 {
color: $k12-header-text;
color: $ic-color-light;
@if $use_high_contrast {
text-decoration: none;
&:hover, &:focus {
text-decoration: underline;
}
}
@else {
color: $ic-color-light;
@if $use_high_contrast {
text-decoration: none;
}
&:hover, &:focus {
text-decoration: underline;
}
&:hover, &:focus {
text-decoration: underline;
}
}
.emphasize-name {
@ -173,127 +156,65 @@ $masquerade-link-color: $ic-color-alert;
#menu {
@include pie-clearfix;
@include reset-list;
@if $is-k12 {
display: flex;
flex: 1;
height: $k12-header-primary-height;
}
@else {
padding-top: 3px;
margin-left: $left_side_width;
}
padding-top: 3px;
margin-left: $left_side_width;
}
}
.menu-item {
@if $use_new_styles == false {
position: relative;
@if $is-k12 {
@include border-box;
border-right: 1px solid $brand-k12-dark;
flex: 0 0 ($k12-sp * 10);
display: flex;
@if $use_high_contrast { border-color: darken($brand-k12-dark, 15%); }
@include breakpoint(desktop) { flex: 0 0 ($k12-sp * 14); }
@include breakpoint(wide) { flex: 0 0 ($k12-sp * 16); }
}
@else {
display: block;
float: left;
}
display: block;
float: left;
}
.menu-item-title, .menu-item-no-drop {
position: relative;
text-decoration: none;
@if $use_new_styles == false {
z-index: 100;
@if $is-k12 {
@include border-box;
transition: background 0.2s linear;
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: $k12-header-text;
@include breakpoint(desktop) { flex-direction: row; }
}
@else {
color: #fff;
border: 1px solid transparent;
border-bottom: 0 none;
display: block;
padding: 6px 17px 5px;
height: 29px;
color: #fff;
font-size: 15px;
}
color: #fff;
border: 1px solid transparent;
border-bottom: 0 none;
display: block;
padding: 6px 17px 5px;
height: 29px;
color: #fff;
font-size: 15px;
}
}
.menu-item-no-drop, .menu-item-title {
@if $use_new_styles == false {
&:hover, &:focus { text-decoration: underline; }
}
@if $is-k12 {
&:hover, &:focus {
background: rgba($k12-header-text, 0.15);
@if $use_high_contrast == false {
text-decoration: none;
}
}
&:active {
background: $brand-k12-dark;
box-shadow: inset 0 2px 1px rgba(black, 0.3);
}
}
}
&.hover {
.menu-item-title {
text-shadow: none;
@if $use_new_styles == false {
@if $is-k12 {
background: rgba($k12-header-text, 0.1);
color: $k12-header-text;
@if $use_high_contrast == false {
text-decoration: none;
}
}
@else {
color: $course-dropdown-text-color;
border-top-color: darken($ic-brand-secondary, 12%);
border-left-color: darken($ic-brand-secondary, 12%);
border-right-color: darken($ic-brand-secondary, 12%);
background-color: $courses-dropdown-menu-bg;
}
color: $course-dropdown-text-color;
border-top-color: darken($ic-brand-secondary, 12%);
border-left-color: darken($ic-brand-secondary, 12%);
border-right-color: darken($ic-brand-secondary, 12%);
background-color: $courses-dropdown-menu-bg;
}
}
@if $use_new_styles == false {
// bring it back on screen so you can see it
.menu-item-drop { left: 0; }
.menu-item-drop { left: 0; }
}
}
.menu-item-drop {
font-size: 13px;
// hide off screen, dont do display:none, so screenreaders can see it
overflow: hidden;
position: absolute;
left: -999999px;
@if $is-k12 {
padding: $k12-sp ($k12-sp / 2) ($k12-sp / 2) 0;
z-index: 101;
top: 90%;
// For browsers that support it, offset the dropdown by the height of the triangle shape in .menu-item-drop__inner-content
top: calc(100% - 11px);
}
@else {
background-color: $courses-dropdown-menu-bg;
box-shadow: 0 2px 18px rgba(0, 0, 0, 0.3);
// brings it down by one pixel so it doesn't overlap
top: 41px;
z-index: 99;
}
background-color: $courses-dropdown-menu-bg;
box-shadow: 0 2px 18px rgba(0, 0, 0, 0.3);
// brings it down by one pixel so it doesn't overlap
top: 41px;
z-index: 99;
.menu-item-view-all {
border-bottom: none;
font-size: 12px;
@ -355,15 +276,7 @@ $masquerade-link-color: $ic-color-alert;
white-space: nowrap;
}
&:hover {
@if $is-k12 {
background: #f0f0f0;
&.menu-item-view-all {
background: transparent;
}
}
@else {
background-color: $activeBG;
}
background-color: $activeBG;
.secondary-right, .subtitle {
color: #666;
}
@ -393,9 +306,6 @@ $masquerade-link-color: $ic-color-alert;
@include reset-list;
width: 270px;
li {
@if $is-k12 {
border-top: none;
}
&:hover {
.name {
color: $ic-link-color-hover;
@ -405,19 +315,7 @@ $masquerade-link-color: $ic-color-alert;
display: block;
line-height: 1.2;
text-decoration: none;
@if $is-k12 {
padding: ($k12-sp - 4) $k12-sp;
color: $brand-k12-dark;
&:hover, &:focus {
color: ensure-contrast($brand-k12-dark, #f0f0f0);
.name {
color: ensure-contrast($brand-k12-dark, #f0f0f0);
}
}
}
@else {
padding: 6px 12px;
}
padding: 6px 12px;
}
}
}
@ -473,15 +371,7 @@ $masquerade-link-color: $ic-color-alert;
}
.customListOpen {
font-size: 11px;
@if $is-k12 {
color: ensure-contrast($brand-k12-dark, #f0f0f0);
.name {
color: ensure-contrast($brand-k12-dark, #f0f0f0);
}
}
@else {
color: $ic-link-color;
}
color: $ic-link-color;
}
}

13
app/stylesheets/base/_#left-side.scss
View File

@ -1,17 +1,8 @@
#left-side {
display: none;
@if $use_new_styles == false {
@if $is-k12 {
float: left;
width: $left_side_width - 1;
border-right: 1px solid #ddd;
border-bottom-color: #ddd;
padding-bottom: $k12-sp;
}
@else {
float: left;
width: $left_side_width;
}
float: left;
width: $left_side_width;
}
}

224
app/stylesheets/base/_canvas-header.scss
View File

@ -1,224 +0,0 @@
// This stylesheet contains styles for any NEW markup created for the k-12 header
// K-12 styles for existing markup can be found under the k-12 flag in _#header.scss
@if $is-k12 {
.canvas-header {
@include border-box;
border-bottom: 1px solid #ccc;
}
.canvas-header__secondary,
.canvas-logo-area,
.canvas-user-nav {
@include border-box;
display: flex;
}
.canvas-header__primary {
display: flex;
@if $use_high_contrast { background: darken($brand-k12, 35%); }
@else {
background: $brand-k12;
border-bottom: 1px solid $brand-k12-dark;
}
}
.canvas-header__secondary {
height: $k12-header-secondary-height;
@if $use_high_contrast { background: darken($brand-k12-dark, 30%); }
@else { background: $brand-k12-dark; }
.canvas-logo-area {
align-items: center;
flex: 0 0 $k12-sp*12;
.canvas-logo-area__logo-link {
@include border-box;
transition: all 0.5s $k12-transition;
line-height: 1;
flex: 1;
display: flex;
justify-content: center;
align-content: center;
&:hover {
.svg-logo-canvas__logomark { transform: translate3d(0,0,0) rotate(-180deg); }
}
&:focus { box-shadow: inset 0 0 0 2px $orange; }
}
.svg-canvas-logo {
display: inline-block;
flex: 0 0 114px;
}
.svg-logo-canvas__logomark {
transition: all 0.5s $k12-transition;
transform-origin: center center;
transform: translate3d(0,0,0);
path, circle { fill: $k12-header-text; }
}
.svg-logo-canvas__logotype {
path, circle { fill: $k12-header-text; }
}
}
.canvas-customer-area {
flex: 1;
display: flex;
align-items: center;
color: $k12-header-text;
}
.canvas-customer-area__content {
padding: $k12-sp/4 0 $k12-sp/4 ($k12-sp + 2);
border-left: 1px solid rgba($k12-header-text, 0.5);
}
.canvas-user-nav {
flex: 1.5;
align-items: center;
justify-content: flex-end;
padding-right: $k12-sp*2;
}
}
.canvas-primary-nav {
@include border-box;
// give the primary nav a minimum width of 4 links * the width of each link .menu-item
// will need to adjust if the # of links changes
flex: 1 0 $k12-sp*40;
display: flex;
.menu-item__text {
margin: $k12-sp/3 0 0;
font-size: 14px;
@include breakpoint(desktop) {
font-size: 17px;
margin: 0 0 0 $k12-sp;
}
}
.menu-item {
.menu-item__icon {
width: $k12-sp*3;
// keeps Safari happy when icons are stacked on top of text
max-height: $k12-sp*3;
@include breakpoint(desktop) {
width: $k12-sp*3.5;
max-height: $k12-sp*3.5;
}
&.svg-icon-courses {
width: ($k12-sp*3) + 10;
@include breakpoint(desktop) { width: ($k12-sp*3.5) + 10; }
}
path { fill: $k12-header-text; }
}
// For main courses dropdown, add a slide-up opacity effect
&#courses_menu_item .menu-item-drop__inner-content {
transition: all 0.3s $k12-transition;
transform: translate3d(0,25%,0);
opacity: 0;
}
&.hover {
&#courses_menu_item {
.menu-item-drop__inner-content {
transform: translate3d(0,0,0);
opacity: 1;
}
}
}
.menu-item-drop__inner-content {
background: white;
border: 1px solid #ddd;
border-top: none;
border-left: none;
position: relative;
box-shadow: 3px 3px 2px rgba(black, 0.05);
&:before, &:after {
content: "";
bottom: 100%; left: 62px;
border: solid transparent;
height: 0; width: 0;
position: absolute;
pointer-events: none;
}
&:after {
border-color: rgba(255, 255, 255, 0);
border-bottom-color: white;
border-width: 10px;
margin-left: -10px;
}
}
}
}
.canvas-customer-logo {
@include border-box;
padding: $k12-sp;
flex: 0 0 $k12-sp*13;
height: $k12-header-primary-height;
display: flex;
align-items: center;
justify-content: flex-end;
img {
@include border-box;
display: block;
max-width: 100%;
height: auto;
max-height: $k12-header-primary-height - ($k12-sp*2);
background: white;
padding: $k12-sp/3;
// Customer logos should have a white background by default, except for the placeholder image...
&.canvas-customer-logo__placeholder { background: transparent; }
}
}
.icon-badge-combo { position: relative; }
.icon-badge-combo__badge {
$h: 18px;
@include border-box;
display: inline-block;
line-height: $h;
border-radius: $h;
padding: 0 $k12-sp/2;
position: absolute;
top: -($h/2 - 2); right: -$h/3;
font-size: 13px;
box-shadow: 1px 1px 1px rgba(black, 0.4);
@if $use_high_contrast {
background: white;
color: black;
font-weight: bold;
}
@else { background: $orange; }
}
// HACK for Firefox ignoring transform-origin in %: http://stackoverflow.com/questions/22361088/css-transform-origin-from-center-on-svg-ignored-in-firefox
@-moz-document url-prefix() {
.canvas-header__secondary .canvas-logo-area .svg-logo-canvas__logomark {
transform-origin: 13.5px 13.5px;
}
}
}

16
app/stylesheets/base/_layout.scss
View File

@ -22,8 +22,7 @@ body {
@if $use_new_styles == false { min-width: $min_main_width; }
@if $use_high_contrast { background: white; }
@else {
@if $is-k12 { background: white; }
@else if $use_new_styles {
@if $use_new_styles {
background: $ic-color-light;
font-weight: 300;
}
@ -34,9 +33,6 @@ body {
@if $use_new_styles {
.ic-app-nav-toggle-and-crumbs { display: none; }
}
@if $is-k12 {
.canvas-header { display: none !important; }
}
#footer { display: none; }
#wrapper {
margin: 0;
@ -120,7 +116,7 @@ body {
}
}
@if $use_new_styles == false {
@if $use_new_styles == false {
#wrapper { @include pie-clearfix; }
}
@ -140,10 +136,10 @@ body {
#content {
@if $use_new_styles { padding: $ic-sp*2; }
@else {
padding: 1em;
overflow: hidden;
}
@else {
padding: 1em;
overflow: hidden;
}
}
// **********************************************************************************

22
app/stylesheets/base/_variables.scss
View File

@ -12,7 +12,7 @@
// Canvas Brand Variants
//======================
// This imports the variables needed to support new styles {$use_new_styles}
// accessibility ($use_high_contrast) and k12 ($is-k12).
// accessibility ($use_high_contrast)
// You can also use the sass function that helps ensure color contrast ratio.
// Look in /sass-functions/ for more information on how that is used
@import "variant_variables";
@ -262,23 +262,9 @@ $ic-horizontal-form-offset: $ic-sp*19;
$ic-label-line-height: 1.3;
$ic-radio-checkbox-left-offset: 22px;
//=====================================================
// Canvas K-12 brand color and global spacing variables
//=====================================================
@if $is-k12 {
$brand-k12: #2a89e8;
$brand-k12-dark: darken(desaturate($brand-k12, 21), 15);
$k12-sp: 12px;
$k12-header-primary-height: $k12-sp*8;
$k12-header-secondary-height: $k12-sp*4;
$k12-header-text: white;
$k12-transition: cubic-bezier(0,1,0.5,1);
}
// override bootstrap green buttons
@if $is-k12 { $green: #25bc34; }
@else { $green: #34832b !default; }
// override bootstrap orange color for k-12
@if $is-k12 { $orange: #f55e22; }
$green: #34832b !default;

52
app/stylesheets/components/_components.scss
View File

@ -14,23 +14,11 @@
$ic-brand-course-nav-link--active: $ic-brand-primary;
.list-view {
@if $is-k12 { background-color: white; }
overflow: auto;
& > header,
// oldskool compat
#section-tabs-header {
@if $is-k12 {
background-color: white;
margin: 0;
line-height: 1.1;
font-weight: bold;
padding: $k12-sp;
font-size: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
@else if $use_new_styles {
@if $use_new_styles {
font-size: 14px;
font-weight: 500;
margin: 0 0 $ic-sp/2;
@ -71,28 +59,10 @@ $ic-brand-course-nav-link--active: $ic-brand-primary;
& > li {
padding: 0;
@if $is-k12 { padding: 0 $k12-sp - 4; }
& > a {
display: block;
text-decoration: none;
// K-12 styles
@if $is-k12 {
color: ensure-contrast($gray, $lightBackground);
padding: ($k12-sp - 4) $k12-sp;
border-radius: $k12-sp/2;
@if $use_high_contrast {
&:hover, &:focus {
background: darken($brand-k12-dark, 30%);
color: white;
}
}
@else { &:hover, &:focus { background: #f2f2f2; } }
}
@else if $use_new_styles {
@if $use_new_styles {
color: $ic-color-dark;
font-weight: 300;
border-radius: $baseBorderRadius;
@ -100,7 +70,6 @@ $ic-brand-course-nav-link--active: $ic-brand-primary;
@include breakpoint(short) { padding: $ic-sp/4 $ic-sp; }
&:hover, &:focus { background: lighten($ic-color-neutral, 5%); }
}
// Default UI styles
@else {
color: ensure-contrast($gray, $lightBackground);
@ -139,21 +108,7 @@ $ic-brand-course-nav-link--active: $ic-brand-primary;
}
a.active {
@if $is-k12 {
background-color: $brand-k12;
color: white;
@if $use_high_contrast {
background-color: darken($brand-k12, 35%);
&:hover, &:focus { background-color: darken($brand-k12, 35%); }
}
@else {
background-color: $brand-k12;
&:hover, &:focus { background-color: $brand-k12; }
}
}
@else if $use_new_styles {
@if $use_new_styles {
background-color: $ic-brand-course-nav-link--active;
font-weight: 500;
color: $ic-color-light;
@ -163,7 +118,6 @@ $ic-brand-course-nav-link--active: $ic-brand-primary;
color: $ic-brand-primary;
}
}
@else {
/// active state colors and backgrounds on left sidenav
background: $ic-course-sidenav_list-item--bg-color;

1
app/stylesheets/components/_g_base.scss
View File

@ -2,7 +2,6 @@
@import "base/layout";
@if $use_new_styles { @import "base/ic_app_layout"; }
@import "base/#header";
@if $is-k12 { @import "base/canvas-header"; }
@if $use_new_styles { @import "base/ic_app_header"; }
@import "base/#left-side";
@import "base/#right-side";

8
app/views/external_tools/_global_nav_menu_items.html.erb
View File

@ -1,7 +1,7 @@
<% if @domain_root_account.feature_enabled?(:lor_for_account) || (@current_user && @current_user.feature_enabled?(:lor_for_user)) %>
<% visibility = ContextExternalTool.global_navigation_visibility_for_user(@domain_root_account, @current_user) %>
<% cache([ContextExternalTool.global_navigation_menu_cache_key(@domain_root_account, visibility), k12?, use_new_styles?]) do %>
<% cache([ContextExternalTool.global_navigation_menu_cache_key(@domain_root_account, visibility), use_new_styles?]) do %>
<% tools = ContextExternalTool.global_navigation_tools(@domain_root_account, visibility) %>
<% tools.each do |tool| %>
<li id="<%= tool.asset_string %>_menu_item" class="menu-item <% if use_new_styles? %>ic-app-header__menu-list-item<% end %><% if account_external_tool_path?(request.fullpath)%> ic-app-header__menu-list-item--active<% end %>">
@ -15,13 +15,7 @@
</a>
<% else %>
<a class='menu-item-no-drop' href="<%= account_external_tool_path(@domain_root_account, tool, :launch_type => 'global_navigation') %>">
<% if k12? %>
<%# Hardcoding Commons logo in to help K-12 sales demos, until a way to give the nav items logos is built out %>
<%= render(:partial => 'shared/svg/svg_commons_logo.svg') %>
<div class="menu-item__text">
<% end %>
<%= tool.label_for(:global_navigation, I18n.locale) %>
<% if k12? %></div><% end %>
</a>
<% end %>
</li>

38
app/views/layouts/application.html.erb
View File

@ -46,43 +46,7 @@
<%= render :partial => 'shared/flash_notices' %>
<div id="application" <% if use_new_styles? %>class="ic-app"<% end %>>
<%# Begin alternate markup for K-12 Canvas header %>
<% if k12? %>
<a href="#content" id="skip_navigation_link"><%= t 'links.skip_to_content', "Skip To Content" %></a>
<header id="header" class="canvas-header no-print <%= 'no-user' unless @current_user %>">
<div class="canvas-header__secondary">
<div class="canvas-logo-area">
<a class="canvas-logo-area__logo-link" href="<%= dashboard_url %>">
<span class="screenreader-only"><%= t 'links.dashboard', "My Dashboard" %></span>
<%= render(:partial => 'shared/svg/svg_canvas_logo.svg') %>
</a>
</div>
<div class="canvas-customer-area">
<div class="canvas-customer-area__content">
<%= @domain_root_account.display_name %>
</div>
</div>
<nav class="canvas-user-nav">
<%= render(:partial => "shared/user_header_navigation") %>
</nav>
</div>
<div class="canvas-header__primary">
<%= render(:partial => "shared/keyboard_navigation_hint") if keyboard_navigation %>
<div class="canvas-primary-nav">
<%= render(:partial => "shared/primary_header_navigation") %>
</div>
<div class="canvas-customer-logo">
<% if @domain_root_account.settings[:header_image].present? %>
<img src="<%= @domain_root_account.settings[:header_image] %>" alt="" />
<% else %>
<%= image_tag("k-12-logo-placeholder.png", class: "canvas-customer-logo__placeholder", alt:"") %>
<% end %>
</div>
</div>
</header>
<%# End alternate markup for K-12 Canvas header %>
<% elsif use_new_styles? %>
<% if use_new_styles? %>
<%= render(:partial => 'shared/new_nav_header') %>
<%# Begin default Canvas header %>

8
app/views/shared/_home_menu.html.erb
View File

@ -1,15 +1,10 @@
<% @current_user.set_menu_data(session[:enrollment_uuid]) %>
<a href="<%= courses_path %>" class="menu-item-title">
<% if k12? %>
<%= render(:partial => 'shared/svg/svg_icon_courses.svg') %>
<div class="menu-item__text">
<% end %>
<%= @current_user.menu_data[:group_memberships_count].zero? ? t('links.courses', "Courses") : t('links.courses_and_groups', "Courses & Groups") -%>
<span class="menu-item-title-icon"></span> <i class="icon-mini-arrow-down"></i>
<% if k12? %></div><% end %>
</a>
<div class="menu-item-drop">
<% if k12? %><div class="menu-item-drop__inner-content"><% end %>
<table cellspacing="0">
<tr>
<%= render(:partial => "shared/menu_courses", :locals => menu_courses_locals) %>
@ -17,5 +12,4 @@
<%= render(:partial => "shared/menu_section", :locals => menu_accounts_locals) %>
</tr>
</table>
<% if k12? %></div><% end %>
</div>

3
app/views/shared/_identity.html.erb
View File

@ -13,8 +13,6 @@
<li class="user_name"><%= link_to @current_user.short_name, user_profile_path(@current_user) %></li>
<% end %>
<% unless @current_user.fake_student? %>
<%# K-12 header moves Inbox to main navigation, so only show it here if K-12 feature flag is disabled %>
<% if !k12? %>
<li class="first inbox">
<a href="<%= conversations_path %>">
<span><%= t 'links.inbox', "Inbox" %></span>
@ -26,7 +24,6 @@
<% end %>
</a>
</li>
<% end %>
<li><%= link_to t('links.settings', "Settings"), settings_profile_path %></li>
<% end %>
<li class="user_id" style="display: none;"><%= @current_user.id %></li>

30
app/views/shared/_primary_header_navigation.html.erb
View File

@ -1,6 +1,6 @@
<% if @current_user %>
<ul role="navigation" id="menu" aria-label="<%= t('navigation.main', 'Main Navigation') %>">
<%- cache([@current_user, k12?, 'home-menu-15m'], :expires_in => 15.minutes) do -%>
<%- cache([@current_user, 'home-menu-15m'], :expires_in => 15.minutes) do -%>
<li id="courses_menu_item" class="menu-item">
<%= render(:partial => 'shared/home_menu') %>
@ -8,40 +8,14 @@
<%- end -%>
<li id="grades_menu_item" class="menu-item">
<a href="<%= grades_path %>" class="menu-item-no-drop">
<% if k12? %><%= render(:partial => 'shared/svg/svg_icon_grades.svg') %><% end %>
<% if k12? %><div class="menu-item__text"><% end %>
<%= t('menu.grades', 'Grades') %>
<% if k12? %></div><% end %>
</a>
</li>
<li id="calendar_menu_item" class="menu-item">
<a href="<%= calendar_path %>" class="menu-item-no-drop">
<% if k12? %><%= render(:partial => 'shared/svg/svg_icon_calendar.svg') %><% end %>
<% if k12? %><div class="menu-item__text"><% end %>
<%= t('menu.calendar', 'Calendar') %>
<% if k12? %></div><% end %>
</a>
</li>
<%# Inbox menu item currently only for K-12 and new styles %>
<% if k12? %>
<% unless @current_user.fake_student? %>
<li id="inbox_menu_item" class="menu-item">
<a href="<%= conversations_path %>" class="menu-item-no-drop">
<% if k12? %>
<div class="icon-badge-combo">
<div class="icon-badge-combo__icon"><%= render(:partial => 'shared/svg/svg_icon_mail.svg') %></div>
<% unless @current_user.disabled_inbox? %>
<% unread = @current_user.unread_conversations_count %>
<span class="icon-badge-combo__badge" <% if unread == 0 %> style="display: none;"<% end %>><%= unread %></span>
<% end %>
</div>
<% end %>
<div class="menu-item__text"><%= t 'links.inbox', "Inbox" %></div>
</a>
</li>
<% end %>
<% end %>
<%= render(:partial => 'external_tools/global_nav_menu_items') %>
</ul>
<% end %>
<% end %>