Skip to content

E
edx-platform
Commit 909f78c8 by Galen Frechette
Options

cleans up course info/profile page

parent 4359a254
Showing with 46 additions and 133 deletions
lms/static/sass/_course_info.scss
......@@ -4,8 +4,8 @@
}
header.course-profile {
background: rgb(245,245,245);
//@include background-image(linear-gradient(-90deg, rgb(230,230,230), rgb(245,245,245)));
background: rgb(240,240,240);
@include background-image(linear-gradient(-90deg, rgb(230,230,230), rgb(245,245,245)));
@include box-shadow(0 1px 80px 0 rgba(0,0,0, 0.5));
border-bottom: 1px solid rgb(200,200,200);
@include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1));
......@@ -16,7 +16,7 @@
@include clearfix;
margin: 0 auto;
max-width: 1200px;
padding: 50px 0px 40px;
padding: 40px 0px 40px;
position: relative;
width: flex-grid(12);
......@@ -41,6 +41,8 @@
z-index: 2;
> hgroup {
//@include inline-block;
//padding: 0 30px;
position: relative;
hr {
......@@ -67,9 +69,9 @@
h1 {
font: bold 2.8rem/3.2rem $sans-serif;
@include inline-block;
margin-right: 5px;
margin-bottom: 0px;
text-shadow: 0 1px rgba(255,255,255, 0.6);
//text-align: center;
span {
color: $lighter-base-font-color;
......@@ -79,7 +81,7 @@
}
h2 {
@include inline-block;
//text-align: center;
a {
color: $lighter-base-font-color;
......@@ -92,92 +94,31 @@
}
}
}
.course-dates {
p {
color: $lighter-base-font-color;
@include inline-block;
font: 300 1.2rem/1.6rem $sans-serif;
margin-top: 0px;
margin-right: 20px;
text-transform: uppercase;
&:last-child {
margin: 0;
}
> span {
color: $base-font-color;
font: 300 1.2rem/1.6rem $sans-serif;
margin-left: 5px;
}
}
}
}
.actions {
float: left;
padding-top: 5px;
position: relative;
width: flex-grid(4);
z-index: 2;
&:hover {
.register-wrapper {
@include box-shadow(0 1px 16px 0 rgba($blue, 0.35));
border-color: rgb(180,180,180);
}
}
.register-wrapper {
@include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%));
a.register {
@include button(shiny, $blue);
@include box-sizing(border-box);
@include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1), inset 0 0 0 1px rgba(255,255,255, 0.9));
border: 1px solid rgb(210,210,210);
@include border-radius(4px);
@include transition(all, 0.15s, linear);
padding: 10px;
a.register {
@include button(shiny, $blue);
@include box-sizing(border-box);
@include border-radius(3px);
display: block;
font: italic 1.2rem/1.6rem $serif;
padding: 10px 0px;
position: relative;
text-transform: uppercase;
text-align: center;
width: flex-grid(12);
z-index: 1;
}
@include border-radius(3px);
display: block;
font: italic 1.2rem/1.6rem $serif;
margin-bottom: 10px;
padding: 10px 0px;
text-transform: uppercase;
text-align: center;
width: flex-grid(12);
}
.social-sharing {
padding: 0px 20px;
p {
background: rgb(245,245,245);
@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.075), inset 0 0 0 1px rgba(255,255,255, 0.9));
border: 1px solid rgb(210,210,210);
border-top: 0;
@include border-bottom-radius(4px);
padding: 5px 10px;
margin: 0 auto;
color: $lighter-base-font-color;
font: italic 300 1.2rem/1.6rem $serif;
margin: 0 0 5px 0;
text-align: center;
text-shadow: 0 1px rgba(255,255,255, 0.6);
&:last-child {
margin: 0;
}
> span {
font: normal 1.2rem/1.6rem $sans-serif;
margin-right: 5px;
}
}
background: rgb(230,230,230);
height: 40px;
}
}
}
......@@ -190,7 +131,8 @@
border-bottom: 1px solid rgb(220,220,220);
@include box-sizing(border-box);
@include clearfix;
margin: 40px 0;
margin-bottom: 40px;
//text-align: center;
width: flex-grid(12);
&::after {
......@@ -200,22 +142,14 @@
}
a {
border-bottom: 3px solid transparent;
color: $lighter-base-font-color;
@include inline-block;
font: normal 1.2rem/1.6rem $sans-serif;
margin: 0 15px;
padding: 0px 5px 15px;
padding: 30px 20px;
text-align: center;
text-transform: uppercase;
&:first-child {
margin-left: 0px;
}
&:hover, &.active {
border-color: $pink;
//background: rgb(240,240,240);
background: rgb(240,240,240);
color: $base-font-color;
}
}
......@@ -241,6 +175,8 @@
width: flex-grid(8);
.inner-wrapper {
//padding: 0 60px;
> section {
&::after {
......@@ -306,6 +242,25 @@
background: rgb(245,245,245);
margin-bottom: 20px;
padding: 15px;
&.dates {
p {
border-bottom: 1px solid rgb(220,220,220);
margin-bottom: 15px;
margin-top: 0px;
padding-bottom: 5px;
&:last-child {
border: none;
margin: 0;
padding: 0;
}
> span {
margin-left: 20px;
}
}
}
}
.media {
......@@ -318,53 +273,11 @@
.hero {
height: 180px;
overflow: hidden;
position: relative;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.6), rgba(255,255,255, 0.4)));
@include border-radius(4px);
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.3);
height: 80px;
left: 50%;
margin-top: -40px;
margin-left: -40px;
position: absolute;
top: 50%;
width: 80px;
&::after {
color: $base-font-color;
content: "\25B6";
display: block;
font: normal 3.2rem/3.2rem $sans-serif;
left: 50%;
margin-left: -12px;
margin-top: -17px;
position: absolute;
text-shadow: 0 1px rgba(255,255,255, 0.8);
top: 50%;
}
}
img {
min-width: 100%;
}
}
&:hover {
cursor: pointer;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.7), rgba(255,255,255, 0.5)));
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.4);
&::after {
color: $pink;
}
}
}
}
}
}
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