ECOM-1339 minor CSS tweaks for the footer. It now extends the full width of the…

ECOM-1339 minor CSS tweaks for the footer. It now extends the full width of the browser and fixes issues with link hover states.

lms/static/sass/shared/_footer-edx.scss

@@ -14,11 +14,14 @@ $edx-footer-bg-color: rgb(252,252,252);
 // sites so the scope has to be aggressive to override default
 // CMS styles
 footer#footer-edx-v3 {
-  @include outer-container;
-  @include box-sizing(border-box);
   background: $edx-footer-bg-color;
   padding: 20px;
 
+  .footer-content-wrapper {
+    @include outer-container;
+    @include box-sizing(border-box);
+  }
+
   p {
     @include font-size(14);
     @include line-height(14);
@@ -36,6 +39,11 @@ footer#footer-edx-v3 {
       &:last-of-type {
         @include margin-right(0);
       }
+
+      &:hover,
+      &:focus {
+        border: none;
+      }
     }
   }
 
@@ -59,8 +67,8 @@ footer#footer-edx-v3 {
   }
 
   .openedx-link {
+    @include margin(10px, 0, 30px, -8px);
     width: 141px;
-    margin-bottom: 30px;
 
     a {
       display: inline-block;
@@ -82,10 +90,10 @@ footer#footer-edx-v3 {
 
   a.sm-link {
     @include float(left);
-    @include margin(0, 0, 10px, 12px);
+    @include margin(0, 0, 10px, 7px);
     @include font-size(28);
     @include line-height(28);
-    width: 30px;
+    width: 35px;
     height: 30px;
     line-height: 1;
     position: relative;
@@ -97,8 +105,10 @@ footer#footer-edx-v3 {
       @include margin-left(0);
     }
 
-    &:hover {
+    &:hover,
+    &:focus {
       opacity: 0.7;
+      border: none;
     }
 
     .icon {

lms/templates/footer-edx-v3.html

@@ -16,7 +16,7 @@
   % endif
 >
     <h2 class="sr footer-about-title">${_("About edX")}</h2>
-
+    <div class="footer-content-wrapper">
       <div class="footer-logo">
           <img alt="edX logo" src="${footer['logo_image']}">
       </div>
@@ -63,6 +63,7 @@
           % endfor
         </div>
       </div>
+    </div>
 </footer>
 % if include_dependencies:
   <%static:js group='base_vendor'/>