move css for #unauthorized to the only places that use it

refs: CNVS-28781

instead of loading this css on every page
I moved it out into its own bundle so it can be
only loaded in the few places that use it

test plan:

* go to these places where you can get an
  "unauthorized, you need to log in" message
* make sure that message is styled like it was before

Change-Id: Id8462f92e4abbf308957a58374b902c32a0657ae
Reviewed-on: https://gerrit.instructure.com/77313
Tested-by: Jenkins
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: Jeremy Putnam <jeremyp@instructure.com>
Product-Review: Ryan Shaw <ryan@instructure.com>
This commit is contained in:
Ryan Shaw 2016-04-15 12:07:27 -06:00
parent 9b6bc47851
commit d3a30e56ff
7 changed files with 44 additions and 40 deletions

View File

@ -0,0 +1,39 @@
#unauthorized_message {
border: 1px solid #000;
margin: 4em auto;
width: 500px;
.ui-state-error, &.ui-state-error {
position: relative;
z-index: 1;
border-style: solid;
border-width: 1px;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 3px 3px -1px rgba(0, 0, 0, 0.25);
&:before {
content: " ";
background: transparent url(/images/warning_36.png) 0 4px no-repeat;
position: absolute;
top: 6px;
left: 22px;
width: 42px;
height: 42px;
}
}
h2, .h2 {
font-size: 1.5em;
&.ui-state-error {
padding: 15px;
margin: -1px;
color: #fff;
height: 60px;
line-height: 60px;
padding: 0 0 0 80px;
}
}
p {
font-size: 1.1em;
padding: 2em 3em;
font-weight: bold;
margin: 0;
}
}

View File

@ -97,46 +97,6 @@
}
}
#unauthorized_message {
border: 1px solid #000;
margin: 4em auto;
width: 500px;
.ui-state-error, &.ui-state-error {
position: relative;
z-index: 1;
border-style: solid;
border-width: 1px;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 3px 3px -1px rgba(0, 0, 0, 0.25);
&:before {
content: " ";
background: transparent url(/images/warning_36.png) 0 4px no-repeat;
position: absolute;
top: 6px;
left: 22px;
width: 42px;
height: 42px;
}
}
h2, .h2 {
font-size: 1.5em;
&.ui-state-error {
padding: 15px;
margin: -1px;
color: #fff;
height: 60px;
line-height: 60px;
padding: 0 0 0 80px;
}
}
p {
font-size: 1.1em;
padding: 2em 3em;
font-weight: bold;
margin: 0;
}
}
.user_content, .mceContentBody {
position: relative;
min-height: 5px;

View File

@ -0,0 +1 @@
@import "bundles/unauthorized_message.scss";

View File

@ -3,6 +3,7 @@
<% end %>
<div id="unauthorized_holder">
<% css_bundle("unauthorized_message") %>
<div id="unauthorized_message">
<h2 class="ui-state-error">
<%= t 'Failed to Log In' %>

View File

@ -4,6 +4,7 @@
%>
<div id="unauthorized_holder">
<% css_bundle("unauthorized_message") %>
<div id="unauthorized_message">
<h2 class="ui-state-error">
<%= t('headings.unauthorized_action', %{Oops youve found a broken link!}) %>

View File

@ -7,6 +7,7 @@
<% @show_left_side = false %>
<% @show_embedded_chat = false %>
<div id="unauthorized_holder">
<% css_bundle("unauthorized_message") %>
<div id="unauthorized_message">
<h2 class="ui-state-error">
<%= t('headings.confirm_email', %{Confirm Your Email Address}) %>

View File

@ -9,6 +9,7 @@
<% @show_left_side = false %>
<% @show_embedded_chat = false %>
<div id="unauthorized_holder">
<% css_bundle("unauthorized_message") %>
<div id="unauthorized_message">
<h2 class="ui-state-error">
<% if @needs_cookies -%>