Commit b6ebcfdd by Galen Frechette

makes logo bigger, imporves footer layout with additin of new links

parent a765bd0b
......@@ -96,70 +96,6 @@
}
}
}
.social-sharing {
@include box-sizing(border-box);
float: left;
height: 44px;
position: relative;
text-align: center;
width: flex-grid(6);
&:hover {
.sharing-message {
opacity: 1;
top: 56px;
}
}
.sharing-message {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
rgba(0,0,0, 0.7) 100%));
border: 1px solid rgba(0,0,0, 0.5);
@include border-radius(4px);
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
@include box-sizing(border-box);
color: rgb(255,255,255);
float: right;
font-family: $serif;
font-size: 0.9em;
font-style: italic;
left: 50%;
margin-left: -110px;
opacity: 0;
padding: 6px 10px;
position: absolute;
text-align: center;
@include transition(all, 0.15s, ease-out);
top: 65px;
width: 220px;
&:hover {
opacity: 0;
}
}
.share {
height: 44px;
@include inline-block;
margin-right: 10px;
opacity: 0.5;
@include transition(all, 0.15s, linear);
width: 44px;
&:hover {
opacity: 1;
}
img {
width: 100%;
}
&:last-child {
margin-right: 0px;
}
}
}
}
.media {
......@@ -307,12 +243,12 @@
border: 1px solid rgb(200,200,200);
border-top: none;
float: left;
padding: 30px 20px;
padding: 20px 20px 30px;
width: flex-grid(4);
header {
margin-bottom: 30px;
padding-bottom: 26px;
padding-bottom: 20px;
position: relative;
text-align: center;
......@@ -324,6 +260,7 @@
position: absolute;
bottom: 0px;
width: 100%;
z-index: 1;
}
a.university-name {
......@@ -341,6 +278,73 @@
color: $lighter-base-font-color;
}
}
.social-sharing {
@include box-sizing(border-box);
float: left;
height: 44px;
position: relative;
text-align: center;
width: flex-grid(12);
z-index: 2;
float: none;
&:hover {
.sharing-message {
opacity: 1;
top: 56px;
}
}
.sharing-message {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
rgba(0,0,0, 0.7) 100%));
border: 1px solid rgba(0,0,0, 0.5);
@include border-radius(4px);
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
@include box-sizing(border-box);
color: rgb(255,255,255);
float: right;
font-family: $serif;
font-size: 0.9em;
font-style: italic;
left: 50%;
margin-left: -110px;
opacity: 0;
padding: 6px 10px;
position: absolute;
text-align: center;
@include transition(all, 0.15s, ease-out);
top: 65px;
width: 220px;
&:hover {
opacity: 0;
}
}
.share {
height: 44px;
@include inline-block;
margin-right: 10px;
opacity: 0.5;
@include transition(all, 0.15s, linear);
width: 44px;
&:hover {
opacity: 1;
}
img {
width: 100%;
}
&:last-child {
margin-right: 0px;
}
}
}
}
.important-dates {
......
......@@ -531,7 +531,7 @@ a:link, a:visited {
height: 1px;
width: 100%; }
.faded-vertical-divider, .vertical-divider, footer nav .copyright a.logo::after, footer nav ol li::after, header.global h1.logo::before, .home > header .title::before, .home .university-partners .partners li.partner::before, .find-courses header.search .inner-wrapper.main-search .logo::after, .find-courses header.search .inner-wrapper.university-search .logo::after, .university-profile header.search .inner-wrapper.main-search .logo::after, .university-profile header.search .inner-wrapper.university-search .logo::after {
.faded-vertical-divider, .vertical-divider, footer nav .top ol li::after, footer nav .top .primary a.logo::after, header.global h1.logo::before, .home > header .title::before, .home .university-partners .partners li.partner::before, .find-courses header.search .inner-wrapper.main-search .logo::after, .find-courses header.search .inner-wrapper.university-search .logo::after, .university-profile header.search .inner-wrapper.main-search .logo::after, .university-profile header.search .inner-wrapper.university-search .logo::after {
background-image: -webkit-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
background-image: -moz-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
background-image: -ms-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
......@@ -1494,26 +1494,54 @@ footer {
box-sizing: border-box;
max-width: 1200px;
margin: 0 auto;
padding: 20px 10px 0;
padding: 30px 10px 0;
width: 100%; }
footer nav .primary-links {
footer nav .top {
border-bottom: 1px solid #c8c8c8;
zoom: 1;
margin-bottom: 30px; }
footer nav .primary-links:before, footer nav .primary-links:after {
padding-bottom: 30px;
width: 100%;
text-align: center; }
footer nav .top:before, footer nav .top:after {
content: "";
display: table; }
footer nav .primary-links:after {
footer nav .top:after {
clear: both; }
footer nav .secondary-links {
padding-bottom: 10px;
text-align: left; }
footer nav .secondary-links a {
footer nav .top ol {
float: right; }
footer nav .top ol li {
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
list-style: none;
padding: 0px 15px;
position: relative;
vertical-align: middle; }
footer nav .top ol li::after {
content: "";
display: block;
height: 30px;
right: 0px;
position: absolute;
top: -5px;
width: 1px; }
footer nav .top ol li a:link, footer nav .top ol li a:visited {
color: #a0a0a0;
letter-spacing: 1px;
margin-right: 20px; }
footer nav .copyright {
float: left;
padding-top: 2px; }
footer nav .copyright a.logo {
padding: 6px 0px; }
footer nav .top .primary {
zoom: 1;
float: left; }
footer nav .top .primary:before, footer nav .top .primary:after {
content: "";
display: table; }
footer nav .top .primary:after {
clear: both; }
footer nav .top .primary a.logo {
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
......@@ -1528,27 +1556,25 @@ footer {
zoom: 1;
*display: inline;
*vertical-align: auto;
float: left;
height: 23px;
height: 22px;
margin-right: 15px;
margin-top: 2px;
padding-right: 15px;
position: relative;
width: 47px;
vertical-align: middle; }
footer nav .copyright a.logo:hover {
footer nav .top .primary a.logo:hover {
background-position: 0 0; }
footer nav .copyright a.logo::after {
footer nav .top .primary a.logo::after {
content: "";
display: block;
height: 30px;
right: 0px;
position: absolute;
top: -2px;
top: -3px;
width: 1px; }
footer nav .copyright p {
footer nav .top .primary a {
color: #a0a0a0;
font-style: italic;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
......@@ -1556,45 +1582,20 @@ footer {
zoom: 1;
*display: inline;
*vertical-align: auto;
margin: 0 auto;
padding-top: 1px;
text-align: center;
letter-spacing: 1px;
margin-right: 20px;
padding-top: 2px;
vertical-align: middle; }
footer nav .copyright p a {
color: #a0a0a0;
font-style: italic;
margin-left: 5px; }
footer nav ol {
footer nav .top .primary a:hover {
color: #3c3c3c;
text-decoration: none; }
footer nav .top .social {
float: right; }
footer nav ol li {
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
list-style: none;
padding: 0px 15px;
position: relative;
vertical-align: middle; }
footer nav ol li::after {
content: "";
display: block;
height: 30px;
right: 0px;
position: absolute;
top: -5px;
width: 1px; }
footer nav ol li a:link, footer nav ol li a:visited {
color: #a0a0a0;
letter-spacing: 1px;
padding: 6px 0px; }
footer nav ol li.social {
footer nav .top .social.social {
border: none;
margin: 0 0 0 5px;
padding: 0; }
footer nav ol li.social a {
footer nav .top .social.social a {
opacity: 0.7;
padding: 0 0 0 10px;
-webkit-transition-property: all;
......@@ -1617,8 +1618,75 @@ footer {
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0; }
footer nav ol li.social a:hover {
footer nav .top .social.social a:hover {
opacity: 1; }
footer nav .bottom {
zoom: 1;
opacity: 0.8;
padding: 10px 0px 30px;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: linear;
-moz-transition-timing-function: linear;
-ms-transition-timing-function: linear;
-o-transition-timing-function: linear;
transition-timing-function: linear;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
width: 100%; }
footer nav .bottom:before, footer nav .bottom:after {
content: "";
display: table; }
footer nav .bottom:after {
clear: both; }
footer nav .bottom:hover {
opacity: 1; }
footer nav .bottom .copyright {
float: left; }
footer nav .bottom .copyright p {
color: #a0a0a0;
font-style: italic;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
margin: 0 auto;
padding-top: 1px;
text-align: center;
vertical-align: middle; }
footer nav .bottom .copyright p a {
color: #a0a0a0;
font-style: italic;
margin-left: 5px; }
footer nav .bottom .copyright p a:hover {
color: #1d9dd9; }
footer nav .bottom .secondary {
float: right;
text-align: left; }
footer nav .bottom .secondary a {
color: #a0a0a0;
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
font-style: italic;
letter-spacing: 1px;
line-height: 1.6em;
margin-left: 20px;
text-transform: lowercase; }
footer nav .bottom .secondary a:hover {
color: #1d9dd9; }
header.global {
border-bottom: 1px solid #bebebe;
......@@ -1651,7 +1719,7 @@ header.global {
clear: both; }
header.global h1.logo {
float: left;
margin: 9px 15px 0px 0px;
margin: 6px 15px 0px 0px;
padding-right: 20px;
position: relative; }
header.global h1.logo::before {
......@@ -1660,7 +1728,7 @@ header.global {
height: 50px;
position: absolute;
right: 1px;
top: -12px;
top: -8px;
width: 1px; }
header.global h1.logo::after {
content: "";
......@@ -1671,16 +1739,16 @@ header.global {
top: -12px;
width: 1px; }
header.global h1.logo a {
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
background-image: url("/static/images/logo.png");
background-image: url("/static/images/header-logo.png");
background-image: url("/static/images/header-logo.png");
background-image: url("/static/images/header-logo.png");
background-image: url("/static/images/header-logo.png");
background-image: url("/static/images/header-logo.png");
background-position: 0 0;
background-repeat: no-repeat;
display: block;
height: 23px;
width: 47px; }
height: 31px;
width: 64px; }
header.global ol.left {
float: left; }
header.global ol.guest {
......@@ -4132,109 +4200,6 @@ nav.course-material {
box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white; }
.course-info header.course-profile .intro-inner-wrapper .intro .main-cta > a.find-courses:hover, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register:hover {
color: white; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
height: 44px;
position: relative;
text-align: center;
width: 48.988%; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing:hover .sharing-message {
opacity: 1;
top: 56px; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .sharing-message {
background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
border: 1px solid rgba(0, 0, 0, 0.5);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: white;
float: right;
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
font-size: 0.9em;
font-style: italic;
left: 50%;
margin-left: -110px;
opacity: 0;
padding: 6px 10px;
position: absolute;
text-align: center;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
top: 65px;
width: 220px; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .sharing-message:hover {
opacity: 0; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .share {
height: 44px;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
margin-right: 10px;
opacity: 0.5;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: linear;
-moz-transition-timing-function: linear;
-ms-transition-timing-function: linear;
-o-transition-timing-function: linear;
transition-timing-function: linear;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
width: 44px; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .share:hover {
opacity: 1; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .share img {
width: 100%; }
.course-info header.course-profile .intro-inner-wrapper .intro .social-sharing .share:last-child {
margin-right: 0px; }
.course-info header.course-profile .intro-inner-wrapper .media {
background: #fff;
border-left: 1px solid #646464;
......@@ -4375,11 +4340,11 @@ nav.course-material {
border: 1px solid #c8c8c8;
border-top: none;
float: left;
padding: 30px 20px;
padding: 20px 20px 30px;
width: 31.984%; }
.course-info .course-sidebar header {
margin-bottom: 30px;
padding-bottom: 26px;
padding-bottom: 20px;
position: relative;
text-align: center; }
.course-info .course-sidebar header::after {
......@@ -4388,7 +4353,8 @@ nav.course-material {
height: 1px;
position: absolute;
bottom: 0px;
width: 100%; }
width: 100%;
z-index: 1; }
.course-info .course-sidebar header a.university-name {
border-right: 1px solid #c8c8c8;
color: #3c3c3c;
......@@ -4407,6 +4373,111 @@ nav.course-material {
padding-right: 15px; }
.course-info .course-sidebar header a.university-name:hover {
color: #a0a0a0; }
.course-info .course-sidebar header .social-sharing {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
height: 44px;
position: relative;
text-align: center;
width: 100%;
z-index: 2;
float: none; }
.course-info .course-sidebar header .social-sharing:hover .sharing-message {
opacity: 1;
top: 56px; }
.course-info .course-sidebar header .social-sharing .sharing-message {
background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
border: 1px solid rgba(0, 0, 0, 0.5);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: white;
float: right;
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
font-size: 0.9em;
font-style: italic;
left: 50%;
margin-left: -110px;
opacity: 0;
padding: 6px 10px;
position: absolute;
text-align: center;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
top: 65px;
width: 220px; }
.course-info .course-sidebar header .social-sharing .sharing-message:hover {
opacity: 0; }
.course-info .course-sidebar header .social-sharing .share {
height: 44px;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
margin-right: 10px;
opacity: 0.5;
-webkit-transition-property: all;
-moz-transition-property: all;
-ms-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.15s;
-moz-transition-duration: 0.15s;
-ms-transition-duration: 0.15s;
-o-transition-duration: 0.15s;
transition-duration: 0.15s;
-webkit-transition-timing-function: linear;
-moz-transition-timing-function: linear;
-ms-transition-timing-function: linear;
-o-transition-timing-function: linear;
transition-timing-function: linear;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-ms-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
width: 44px; }
.course-info .course-sidebar header .social-sharing .share:hover {
opacity: 1; }
.course-info .course-sidebar header .social-sharing .share img {
width: 100%; }
.course-info .course-sidebar header .social-sharing .share:last-child {
margin-right: 0px; }
.course-info .course-sidebar .important-dates {
list-style: none;
margin: 0px;
......
@import 'bourbon/bourbon';
@import 'reset';
@import 'font_face';
@import 'base';
@import 'base_mixins';
@import 'base_extends';
@import 'base_animations';
@import 'base_styles/reset';
@import 'base_styles/font_face';
@import 'base_styles/base';
@import 'base_styles/base_mixins';
@import 'base_styles/base_extends';
@import 'base_styles/base_animations';
@import 'sass_old/base/variables';
//@import 'sass_old/base/base';
@import 'sass_old/base/extends';
//@import 'sass_old/base/font-face';
@import 'sass_old/base/functions';
//@import 'sass_old/base/reset';
@import 'shared_forms';
@import 'shared_footer';
@import 'shared_header';
@import 'shared_list_of_courses';
@import 'shared_course_filter';
@import 'shared_modal';
@import 'shared_styles/shared_forms';
@import 'shared_styles/shared_footer';
@import 'shared_styles/shared_header';
@import 'shared_styles/shared_list_of_courses';
@import 'shared_styles/shared_course_filter';
@import 'shared_styles/shared_modal';
@import 'index';
@import 'home';
@import 'dashboard';
@import 'course';
@import 'find_courses';
@import 'course_info';
@import 'course_object';
@import 'courses';
@import 'course_about';
@import 'jobs';
@import 'about';
@import 'about_pages';
@import 'press_release';
@import 'sass_old/courseware/courseware';
......
......@@ -17,6 +17,7 @@ $yellow: rgb(255, 252, 221);
html, body {
background: rgb(250,250,250);
//background: rgb(77, 82, 99);
font-family: $sans-serif;
font-size: 1em;
line-height: 1em;
......@@ -89,7 +90,6 @@ a:link, a:visited {
}
}
.content-wrapper {
background: rgb(255,255,255);
margin: 0 auto 0;
......
......@@ -15,35 +15,55 @@ footer {
@include box-sizing(border-box);
max-width: 1200px;
margin: 0 auto;
padding: 20px 10px 0;
padding: 30px 10px 0;
width: flex-grid(12);
.primary-links {
.top {
border-bottom: 1px solid rgb(200,200,200);
@include clearfix;
margin-bottom: 30px;
}
padding-bottom: 30px;
width: flex-grid(12);
text-align: center;
.secondary-links {
padding-bottom: 10px;
text-align: left;
ol {
float: right;
a {
li {
@include inline-block;
list-style: none;
padding: 0px 15px;
position: relative;
vertical-align: middle;
&::after {
@extend .faded-vertical-divider;
content: "";
display: block;
height: 30px;
right: 0px;
position: absolute;
top: -5px;
width: 1px;
}
a:link, a:visited {
color: $lighter-base-font-color;
letter-spacing: 1px;
margin-right: 20px;
padding: 6px 0px;
}
}
}
.copyright {
.primary {
@include clearfix;
float: left;
padding-top: 2px;
a.logo {
@include background-image(url('/static/images/logo.png'));
background-position: 0 -24px;
background-repeat: no-repeat;
@include inline-block;
float: left;
height: 23px;
height: 22px;
margin-right: 15px;
margin-top: 2px;
padding-right: 15px;
......@@ -62,55 +82,29 @@ footer {
height: 30px;
right: 0px;
position: absolute;
top: -2px;
top: -3px;
width: 1px;
}
}
p {
a {
color: $lighter-base-font-color;
font-style: italic;
@include inline-block;
margin: 0 auto;
padding-top: 1px;
text-align: center;
letter-spacing: 1px;
margin-right: 20px;
padding-top: 2px;
vertical-align: middle;
a {
color: $lighter-base-font-color;
font-style: italic;
margin-left: 5px;
&:hover {
color: $base-font-color;
text-decoration: none;
}
}
}
ol {
.social {
float: right;
li {
@include inline-block;
list-style: none;
padding: 0px 15px;
position: relative;
vertical-align: middle;
&::after {
@extend .faded-vertical-divider;
content: "";
display: block;
height: 30px;
right: 0px;
position: absolute;
top: -5px;
width: 1px;
}
a:link, a:visited {
color: $lighter-base-font-color;
letter-spacing: 1px;
padding: 6px 0px;
}
&.social {
border: none;
margin: 0 0 0 5px;
......@@ -128,5 +122,60 @@ footer {
}
}
}
.bottom {
@include clearfix;
opacity: 0.8;
padding: 10px 0px 30px;
@include transition(all, 0.15s, linear);
width: flex-grid(12);
&:hover {
opacity: 1;
}
.copyright {
float: left;
p {
color: $lighter-base-font-color;
font-style: italic;
@include inline-block;
margin: 0 auto;
padding-top: 1px;
text-align: center;
vertical-align: middle;
a {
color: $lighter-base-font-color;
font-style: italic;
margin-left: 5px;
&:hover {
color: $blue;
}
}
}
}
.secondary {
float: right;
text-align: left;
a {
color: $lighter-base-font-color;
font-family: $serif;
font-style: italic;
letter-spacing: 1px;
line-height: 1.6em;
margin-left: 20px;
text-transform: lowercase;
&:hover {
color: $blue;
}
}
}
}
}
}
......@@ -19,7 +19,7 @@ header.global {
h1.logo {
float: left;
margin: 9px 15px 0px 0px;
margin: 6px 15px 0px 0px;
padding-right: 20px;
position: relative;
......@@ -30,7 +30,7 @@ header.global {
height: 50px;
position: absolute;
right: 1px;
top: -12px;
top: -8px;
width: 1px;
}
......@@ -46,12 +46,12 @@ header.global {
}
a {
@include background-image(url('/static/images/logo.png'));
@include background-image(url('/static/images/header-logo.png'));
background-position: 0 0;
background-repeat: no-repeat;
display: block;
height: 23px;
width: 47px;
height: 31px;
width: 64px;
}
}
......
......@@ -106,6 +106,24 @@
}
}
//#enroll_error {
//background: rgb(253, 87, 87);
//border: 1px solid rgb(202, 17, 17);
//color: rgb(143, 14, 14);
//margin-bottom: 20px;
//padding: 12px;
//}
//#enroll {
//padding: 0 40px;
//h1 {
//font: normal 1em/1.6em $sans-serif;
//margin-bottom: 10px;
//text-align: left;
//}
//}
form {
margin-bottom: 12px;
padding: 0px 40px;
......
......@@ -9,7 +9,7 @@
<div class="logo">
<img src="${static.url('images/edx_bw.png')}" />
</div>
<h2>Explore courses from universities around the world.</h2>
<h2>Explore courses from leading universities.</h2>
</hgroup>
</div>
</header>
......
......@@ -3,36 +3,34 @@
<footer>
<nav>
<section class="primary-links">
<section class="copyright">
<section class="top">
<section class="primary">
<a href="${reverse('root')}" class="logo"></a>
<p>&copy; 2012 edX, <a href="/t/copyright.html">some rights reserved.</a></p>
</section>
<ol>
<li>
<a href="${reverse('courses')}">Find Courses</a>
</li>
<li>
<a href="/t/about.html">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="/t/jobs.html">Jobs</a>
</li>
<li class="social">
</section>
<section class="social">
<a href="#"><img src="${static.url('images/linkedin.png')}" /></a>
<a href="#"><img src="${static.url('images/facebook.png')}" /></a>
<a href="#"><img src="${static.url('images/twitter.png')}" /></a>
</li>
</ol>
</section>
<section class="secondary-links">
</section>
<section class="bottom">
<section class="copyright">
<p>&copy; 2012 edX, <a href="/t/copyright.html">some rights reserved.</a></p>
</section>
<section class="secondary">
<a href="/t/tos.html">Terms of Service</a>
<a href="/t/privacy.html">Privacy Policy</a>
<a href="/t/honor.html">Honor Code</a>
<a href="/t/help.html">Help</a>
</section>
</section>
</nav>
</footer>
......@@ -18,19 +18,6 @@
<a href="${reverse('enroll', args=[course.id])}" class="register">Register</a>
</div>
<div class="social-sharing">
<div class="sharing-message">Share with friends and family!</div>
<a href="#" class="share">
<img src="${static.url('images/twitter-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/facebook-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/email-sharing.png')}">
</a>
</div>
</section>
<a href="#video-modal" class="media" rel="leanModal">
<div class="hero">
......@@ -111,7 +98,21 @@
<section class="course-sidebar">
<section class="course-summary">
<header>
<a href="#" class="university-name">${course.get_about_section("university")}</a><span>${course.get_about_section("title")}</span>
<!--
-<a href="#" class="university-name">${course.get_about_section("university")}</a><span>${course.get_about_section("title")}</span>
-->
<div class="social-sharing">
<div class="sharing-message">Share with friends and family!</div>
<a href="#" class="share">
<img src="${static.url('images/twitter-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/facebook-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/email-sharing.png')}">
</a>
</div>
</header>
<ol class="important-dates">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment