Merge pull request openedx#160 from ufresh2013/feature-cjq

课程详情添加视频，fix bugs
CrewS · Dec 26, 2018 · c74eae8 · c74eae8
2 parents 81c5903 + d5d6135
commit c74eae8
Show file tree

Hide file tree

Showing 31 changed files with 224 additions and 580 deletions.
diff --git a/lms/templates/professors/index.html b/lms/templates/professors/index.html
@@ -16,6 +16,9 @@ <h2>${_(u"教育的目的")}</h2>
     $.ajax({
         url: '/api/v1/professors/',
         method: 'GET',
+        data: {
+            page_size: 1000,
+        },
         success: function(res){
             var list = res.results;
             var elem = '';

diff --git a/themes/normal-theme/lms/static/images/iconfont.png b/themes/normal-theme/lms/static/images/iconfont.png
diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/course/_about.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/course/_about.scss
@@ -262,10 +262,68 @@
 
 
   // 1.1 课程详情页 课程简介
-  .about-info ul{
-    padding: 0 0 0 20px;
-    margin: 0;
-    list-style: disc;
+  .about-info{
+    ul{
+      padding: 0 0 0 20px;
+      margin: 0;
+      list-style: disc;
+    }
+    h3{
+      margin: 10px 0;
+    }
+    a{
+      cursor: pointer;
+      line-height: 2.3;
+    }
+    a span{
+      vertical-align: middle;
+      margin-left: 10px;
+      transform: scale(0.95)
+    }
+  } 
+
+  .about-video{
+    text-align: center;
+    position: relative;
+    width: 270px;
+    margin: 0 auto;
+    cursor: pointer;
+
+    &:hover{
+      .about-play{
+        background: rgba(0, 117, 180, 1);
+      }
+    }
+
+    img{
+      width: 270px;
+    }
+
+    .about-play{
+      width: 46px;
+      height: 46px;
+      background: rgba(0, 117, 180, 0.65);
+      position: absolute;
+      top: 35px;
+      left: 105px;
+      border-radius: 23px;
+    }
+
+    .fa-my-play{
+      position: relative;
+      top: 13px;
+      left: 1px;
+    }
+  }
+
+  .about-language{
+    border-top: 1px solid #eeeeee;
+    padding-top: 30px;
+    margin-top: 30px !important;
+    img{
+      width: 200px;
+      margin-top: 10px;
+    }
   }
 
   // 1.2 课程性情页 授课老师 
@@ -310,40 +368,43 @@
   // 1.3 课程详情页 大纲
   .about-outline{
     padding-left: 35px;
+
+    h3{
+      position: relative;
+      left: -20px;
+      padding-top: 25px;
+      font-size: 15px;
+      border-top: 2px dashed #eeeeee;
+      margin: 30px 0 10px 0;
+      line-height: 2;
+      &:first-child{
+        border-top: none;
+        margin: 0;
+        padding-top: 10px;
+      }
+      &:before{
+        content: '';
+        display: inline-block;
+        height: 20px;
+        width: 20px;
+        background-size: 300px;
+        background-image: url("/static/normal-theme/images/iconfont.png");
+        background-position: -62px -40px;
+        position: relative;
+        top: 4px;
+        left: -10px;
+        transform: scale(0.8);
+      }
+    }
+
+    p {
+      padding-left: 15px;
+      border-left: 3px solid #eeeeee;
+      margin: 15px 0;
+      line-height: 15px;
+    }
   }
-  .about-outline h3{
-    position: relative;
-    left: -20px;
-    padding-top: 25px;
-    font-size: 15px;
-    border-top: 2px dashed #eeeeee;
-    margin: 30px 0 10px 0;
-    line-height: 2;
-  }
-  .about-outline h3:first-child{
-    border-top: none;
-    margin: 0;
-    padding-top: 10px;
-  }
-  .about-outline h3:before{
-    content: '';
-    display: inline-block;
-    height: 20px;
-    width: 20px;
-    background-size: 300px;
-    background-image: url("/static/normal-theme/images/iconfont.png");
-    background-position: -62px -40px;
-    position: relative;
-    top: 4px;
-    left: -10px;
-    transform: scale(0.8);
-  }
-  .about-outline p {
-    padding-left: 15px;
-    border-left: 3px solid #eeeeee;
-    margin: 15px 0;
-    line-height: 15px;
-  }
+
   .about-outline-indent{
     padding-left: 28px;
   }
@@ -353,6 +414,36 @@
 }
 
 
+// video
+#player-container-id{
+  position: fixed;
+  z-index: 101;
+  top: 50%;
+  left: 50%;
+  margin-top: -225px;
+  margin-left: -400px;
+  width:800px;
+  height: 450px;
+}
+
+.about-cover{
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  background: rgba(0,0,0,0.8);
+  top: 0;
+  left: 0;
+  z-index: 100;
+
+  .fa-my-close{
+    position: absolute;
+    top: 10%;
+    right: 10%;
+    transform: scale(2);
+    cursor: pointer;
+  }
+}
+
 
 
 // h5
@@ -386,6 +477,10 @@
       }
     }
   }
+  .my-theme-course-about #player-container-id{
+    width: 100%;
+    height: auto;
+  }
 }
 
 @media screen and (max-width:576px){

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/footer-page/_contact.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/footer-page/_contact.scss
@@ -42,8 +42,8 @@
 .contact-dec li div strong{   
   display: block;
   line-height: 40px;
-  color: #2E313C;
-  font-size: 20px;
+  color: $title;
+  font-size: 18px;
   // margin-top: 12px;
 }
 .contact-dec li:nth-child(odd){ 

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/footer-page/_join_us.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/footer-page/_join_us.scss
@@ -31,10 +31,11 @@
 
 .join-dec h1{ 
     text-align: center;
-    font-size: 20px;
+    font-size: 18px;
     color: $title;
     line-height: 2;
     margin-bottom: 10px;
+    font-weight: bold;
 }
 .join-dec p{ 
     margin-top: 0;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_base.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_base.scss
@@ -12,7 +12,7 @@
     margin: 0 auto;
     max-width: none;
     width: 100%;
-    flex: 1;
+    flex: 1 0 auto;
     padding: 0;
     box-sizing: border-box;
     background-image: linear-gradient(to bottom, #fff 0%, #fff 45%, #f2f9ff 100%);
@@ -27,7 +27,7 @@
     .container,
     .course-updates
     {
-      max-width: 1220px;
+      max-width: 1200px;
       margin: 0 auto;
       width: 96%;
       box-sizing: border-box;
@@ -37,7 +37,7 @@
   }
 }
 .wrapper-preview-menu{
-  max-width: 1220px;
+  max-width: 1200px;
   margin: 0 auto;
   width: 96%;
   box-sizing: border-box;
@@ -120,10 +120,14 @@ textarea:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="e
 // 底色蓝，字体白按钮
 input[type="submit"], input[type="button"], button, .button{
   -webkit-font-smoothing: unset;
+  box-shadow: none;
+  text-shadow: none;
 }
-button:focus:not(:disabled){
+button:focus:not(:disabled), button:hover:not(:disabled){
   outline: none;
   border: none;
+  background-image: none;
+  background-color: transparent;
 }
 %btn-my-primary{
   display: inline-block;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_dashboard.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_dashboard.scss
@@ -76,11 +76,11 @@
     color: $font;
   }
 }
+
+.wrapper-messages-primary .message.message-upsell .action-upgrade,
+.wrapper-messages-primary .message.message-status .verification-cta .btn,
 .wrapper-messages-primary .message.message-status.course-status-certavailable .actions-primary .action-certificate .btn{
   @extend %btn-my-primary;
-}
-.wrapper-messages-primary .message.message-upsell .action-upgrade{
-  @extend %btn-my-primary;
   background: #40A24D !important;
   border: none;
   line-height: 34px;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_home.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_home.scss
@@ -86,6 +86,11 @@
   .course-image{
     overflow: hidden;
   }
+  @media screen and (min-width:1200px){
+    .course-image{
+      height: 160px;
+    }
+  }
 
   .course-image .cover-image{
     border-radius: 3px;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_iconfont.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_iconfont.scss
@@ -46,7 +46,8 @@ $icon-width: 18px;
 .course-content .bookmark-button::before,
 .fa-floppy-o:before,
 .fa-save:before,
-.fa-arrow-right:before
+.fa-arrow-right:before,
+.fa-exclamation-circle:before
 {
   content: '';
   display: inline-block;
@@ -248,6 +249,9 @@ $icon-width: 18px;
     }
   }
 }
+.fa-exclamation-circle:before{
+  background-position: calcP(8, 3)
+}
 
 
 // 2. 课程详情页的新icon
@@ -297,4 +301,13 @@ $icon-width: 18px;
 }
 .fa-my-arrow{
   background-position: calcP(10, 4)
+}
+.fa-my-play{
+  background-position: calcP(12, 4)
+}
+.fa-my-play-circle{
+  background-position: calcP(13, 4)
+}
+.fa-my-close{
+  background-position: calcP(14, 4)
 }
diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_professor.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_professor.scss
@@ -45,7 +45,7 @@
   background: #fff;
   border-radius: 3px;
   box-shadow: 0px 1px 4px 0px $border;
-  margin: 0 0.7% 30px;
+  margin: 0 0.9% 30px;
   min-width: 280px;
   line-height: 1.5;
   vertical-align: middle;
@@ -55,6 +55,8 @@
   position: absolute;
   top: 10px;
   left: 10px;
+  border-radius: 3px;
+  border: 1px solid #e6e9ed;
 }
 .professor-block .professor-name{
   margin-bottom: 3px;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_profile.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_profile.scss
@@ -3,7 +3,7 @@
   width: 100%;
 }
 .profile.profile-self{ 
-  max-width: 1220px;
+  max-width: 1200px;
   margin: 0 auto;
   box-sizing: border-box;
   padding: 0 20px;

diff --git a/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_search.scss b/themes/normal-theme/lms/static/sass/partials/lms/theme/page/_search.scss
@@ -32,10 +32,14 @@
     @extend %btn-my-primary;
     height: 36px;
     border: none;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+
   }
   .loading-spinner{
     top: 0;
     width: 40%;
+    background: $primary;
   }
 }