Merge pull request #17291 from edx/mobile-learner-analytics-modal
Make Learner Analytics Test Modal Mobile Responsive
This commit is contained in:
@@ -21,9 +21,9 @@ export class UpsellExperimentModal extends React.Component {
|
||||
<div className="my-stats-introduction">My Stats introduces new personalized views that help you track your progress towards completing your course!</div>
|
||||
<div className="my-stats-slide-header">With My Stats you will see your:</div>
|
||||
<ul className="upsell-modal-checkmark-group">
|
||||
<li className="upsell-modal-checkmark">Course Activity Streak (log in every week to keep your streak alive)</li>
|
||||
<li className="upsell-modal-checkmark">Grade Progress (see how you're tracking towards a passing grade)</li>
|
||||
<li className="upsell-modal-checkmark">Discussion Forum Engagements (top learners use the forums - how do you measure up?)</li>
|
||||
<li><span className="fa fa-check upsell-modal-checkmark" aria-hidden="true" />Course Activity Streak (log in every week to keep your streak alive)</li>
|
||||
<li><span className="fa fa-check upsell-modal-checkmark" aria-hidden="true" />Grade Progress (see how you're tracking towards a passing grade)</li>
|
||||
<li><span className="fa fa-check upsell-modal-checkmark" aria-hidden="true" />Discussion Forum Engagements (top learners use the forums - how do you measure up?)</li>
|
||||
</ul>
|
||||
</div>),
|
||||
(<div>
|
||||
|
||||
@@ -408,8 +408,12 @@
|
||||
width: 33%;
|
||||
display: block;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
li > button::before {
|
||||
font-size: 15px;
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -426,17 +430,25 @@
|
||||
.upsell-certificate {
|
||||
height: 43px;
|
||||
position: absolute;
|
||||
left: 40%;
|
||||
margin-top: 29px;
|
||||
margin: 0;
|
||||
bottom: -58px;
|
||||
left: 220px;
|
||||
}
|
||||
|
||||
.upsell-modal-checkmark-group {
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
padding-left: 30px;
|
||||
margin-bottom: 15px;
|
||||
|
||||
li {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.upsell-modal-checkmark::before {
|
||||
content: '✔️\00a0\00a0\00a0\00a0';
|
||||
.upsell-modal-checkmark {
|
||||
left: 10px;
|
||||
position: absolute;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.js-carousel-nav {
|
||||
@@ -474,4 +486,10 @@
|
||||
.my-stats-slide-header {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px){
|
||||
.slick-slide.carousel-item {
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user