Code review comment for lp:~hatch/juju-gui/1125424-loading-visuals

Reviewers: mp+151081_code.launchpad.net,

Message:
Please take a look.

Description:
Fixed layout issues as per design

https://code.launchpad.net/~hatch/juju-gui/1125424-loading-visuals/+merge/151081

(do not edit description out of merge proposal)

Please review this at https://codereview.appspot.com/7452043/

Affected files:
   A [revision details]
   M app/index.html
   M app/templates/login.handlebars
   M lib/views/stylesheet.less

Index: [revision details]
=== added file '[revision details]'
--- [revision details] 2012-01-01 00:00:00 +0000
+++ [revision details] 2012-01-01 00:00:00 +0000
@@ -0,0 +1,2 @@
+Old revision: <email address hidden>
+New revision: <email address hidden>

Index: app/index.html
=== modified file 'app/index.html'
--- app/index.html 2013-02-21 19:02:43 +0000
+++ app/index.html 2013-02-28 19:27:47 +0000
@@ -43,7 +43,7 @@
              <div class="header">
                <div class="error">
                  <span><i class="sprite alert_icon2"></i>
- Your browser is not fully supported</span>
+ <h4>Your browser is not fully supported</h4></span>
                </div>
              </div>
              <p>

Index: app/templates/login.handlebars
=== modified file 'app/templates/login.handlebars'
--- app/templates/login.handlebars 2013-02-18 17:02:09 +0000
+++ app/templates/login.handlebars 2013-02-28 19:27:47 +0000
@@ -1,4 +1,4 @@
-<div class="centered-column">
+<div class="centered-column in-main">
    <i class="sprite juju_logo" title="Juju GUI"></i>
    <div id="login-form" class="panel">
      <div class="header">

Index: lib/views/stylesheet.less
=== modified file 'lib/views/stylesheet.less'
--- lib/views/stylesheet.less 2013-02-27 14:49:14 +0000
+++ lib/views/stylesheet.less 2013-02-28 19:27:47 +0000
@@ -224,7 +224,7 @@
              &.control {
                  display: none;
              }
-
+
              .landscape-icon {
                  margin: 10px 0 0 16px;
              }
@@ -1514,6 +1514,12 @@
      width: 420px;
      margin-left: -210px;

+ /* This enables us to use the .centered-column
+ class inside of the main application */
+ &.in-main {
+ top: 0;
+ }
+
      div {
          width: 280px;
          text-align: left;
@@ -1596,4 +1602,33 @@
      #loading-spinner {
          height: 100px;
      }
+
+ #loading-message-text {
+ font-family: Ubuntu Medium, Helvetica, Arial;
+ font-size: 10pt;
+ }
+
+ #login-form {
+ .header {
+ font-size: 10pt;
+ font-family: Ubuntu Medium, Helvetica, Arial;
+ }
+ }
+
+ .header .error span {
+ color: #DD4814;
+ i {
+ margin-right: 5px;
+ float: left;
+ }
+ h4 {
+ font-family: Ubuntu Medium, Helvetica, Arial;
+ font-size: 10pt;
+ line-height: 10pt;
+ }
+ }
+
+ p {
+ font-size: 8pt;
+ }
  }