-
-
- Practical English Usage
+
+
+
+
+
+
+
+
+
+ Help
+
+
+
Diagnostic Tests
+ Michael Swan | David Baker
+ to accompany
+
+
+
+ Practical English Usage
-
-
-
-
-
'
);
$(".template").removeClass("current").removeClass("template");
}
} else {
if ($rootScope.d.curr < $rootScope.d.size - 1) {
- $(".loader").hide();
- $(".template").append('
Exit test ');
+ $("#iLoader").addClass("d-none");
+ $(".template").append('
Exit test
');
$(".endTest").bind("click", function () {
$rootScope.$apply(function () {
$scope.results($rootScope.fLevel, $rootScope.fIndex);
@@ -113,8 +113,8 @@ app.controller("mainCtrl", function ($rootScope, $scope, $http, $templateRequest
//console.log("level-->" + level);
//console.log("index---->" + index);
$(".summaryWrapper").show();
- $(".loader").show();
- scrollToStart();
+ $("#iLoader").removeClass("d-none");
+
$(".summary").empty();
if (typeof index != "undefined") {
$rootScope.fIndex = index;
@@ -247,9 +247,7 @@ app.controller("mainCtrl", function ($rootScope, $scope, $http, $templateRequest
};
$rootScope.nextExercise = function () {
- scrollToStart();
-
- $(".loader").show();
+ $("#iLoader").removeClass("d-none");
$scope.disable = false;
if ($rootScope.d.curr < $rootScope.d.size - 1) {
$scope.template = "templates/blank.html";
@@ -258,10 +256,9 @@ app.controller("mainCtrl", function ($rootScope, $scope, $http, $templateRequest
setTimeout(function () {
$rootScope.resetData();
$scope.template = "templates/" + $rootScope.d.exercise["template"] + ".html";
- $(".loader").fadeOut(300);
+ $("#iLoader").addClass("d-none");
});
} else {
- scrollToStart();
$scope.activity = true;
$scope.template = "templates/summary.html";
}
@@ -276,13 +273,12 @@ app.controller("mainCtrl", function ($rootScope, $scope, $http, $templateRequest
});
angular.module("myApp.summaryCtrl", []).controller("summaryCtrl", function ($scope, $rootScope, $filter, $timeout, $templateRequest, $compile) {
$(".myApp").css({ height: "500px", position: "relative", overflow: "hidden" });
- $(".loader").show();
+ $("#iLoader").removeClass("d-none");
var tplC = angular.element(".summary"); //template container
var data = $scope.data.exercise,
c = 0;
$rootScope.d.curr = 0;
$rootScope.goInner = function () {
- scrollToStart();
$rootScope.uData = [];
$rootScope.d.curr = 0;
$rootScope.summary = false;
@@ -296,7 +292,7 @@ angular.module("myApp.summaryCtrl", []).controller("summaryCtrl", function ($sco
};
function a() {
- $(".loader").show();
+ $("#iLoader").removeClass("d-none");
$templateRequest("templates/" + data[c].template + ".html").then(function (html) {
$rootScope.d.exercise = data[c];
$rootScope.resetData();
@@ -325,9 +321,9 @@ angular.module("myApp.summaryCtrl", []).controller("summaryCtrl", function ($sco
//console.log("-------------------------");
//console.log("----------All template loaded---------------");
//console.log("-------------------------");
- scrollToStart();
+
$(".myApp").removeAttr("style");
- $(".loader").fadeOut(300);
+ $("#iLoader").addClass("d-none");
$(".radioRow").find(".iconParent").removeClass("clicked");
if (typeof uAnswer[$rootScope.fLevel] != "undefined" && typeof uAnswer[$rootScope.fLevel]["index"] != "undefined") {
$(".radioRow").eq(uAnswer[$rootScope.fLevel]["index"]).find(".iconParent").addClass("clicked");
@@ -347,7 +343,7 @@ angular.module("myApp.summaryCtrl", []).controller("summaryCtrl", function ($sco
$(".tryAgain").click(function () {
//location.reload();
var i = Number($(this).attr("data-index"));
- scrollToStart();
+
if (typeof uAnswer[$rootScope.fLevel] != "undefined") {
uAnswer[$rootScope.fLevel]["desc"] = $(".resultFeedback").text();
uploadUserData($rootScope.fIndex, $rootScope.fLevel, $rootScope.uData);
@@ -1545,13 +1541,13 @@ angular.module("myApp.mRadioTextCtrl", []).controller("mRadioTextCtrl", function
if ((r_Ans == "Wrong" || r_Ans == "W" || r_Ans == "N" || r_Ans == "Y") && typeof q[i].answer[1] != "undefined") {
if (maxW < $(".questionSet").width()) {
var temp = $compile(
- '
'
)($scope);
} else {
var temp = $compile(
- '
'
+ '
'
)($scope);
}
$(this).after(temp);
@@ -1559,7 +1555,6 @@ angular.module("myApp.mRadioTextCtrl", []).controller("mRadioTextCtrl", function
});
$(".textEntry").autogrow({ vertical: true, horizontal: false, flickering: false });
angular.element(".current .radioBtn").unbind();
- scrollToStart();
} else {
$(".current .feedback2").remove();
clicks = 1;
@@ -1759,14 +1754,6 @@ var checkAns = function (uAns, rAns, exact) {
}
return correct_flag;
};
-var scrollToStart = function () {
- var targetOffset = $(".mshell").offset().top - 10;
- //console.log("targetOffset--->" + targetOffset);
- setTimeout(function () {
- $("html, body").animate({ scrollTop: targetOffset }, 500);
- //$(window).scrollTop(targetOffset);
- }, 200);
-};
var updateAtag = function () {
var cLink = "./";
@@ -1776,7 +1763,7 @@ var updateAtag = function () {
temp = "language-terminology";
cLink = "./";
}
- $(this).attr("href", '#');
+ $(this).attr("href", "#");
});
};
var uploadUserData = function (index, level, data) {
@@ -1796,9 +1783,3 @@ var uploadUserData = function (index, level, data) {
uAnswer[level]["exerciseData"] = data;
scormApi.updateUserData(fname, uAnswer, function () {});
};
-
-$(document).ready(function () {
- setTimeout(function () {
- scrollToStart();
- }, 2500);
-});
diff --git a/scripts/filters.js b/scripts/filters.js
index e4337b1..cb5ca79 100644
--- a/scripts/filters.js
+++ b/scripts/filters.js
@@ -50,7 +50,7 @@ angular
}
});
temp = temp.join(
- "
"
+ "
"
);
return temp;
}
diff --git a/styles/style.css b/styles/style.css
index 152044b..8d185c3 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -19,212 +19,196 @@
font-family: Inter, system-ui, sans-serif;
}
+.bi-nav,
+.bi {
+ vertical-align: -0.125em;
+ fill: currentColor;
+}
-.mshell textarea:disabled{
- background-color: #ffffff;
+.active .bi-nav {
+ display: block !important;
}
-.mshell span.cd{
+
+.overlay {
+ position: fixed;
+ left: 50%;
+ top: 50%;
+ -webkit-transform: translate(-50%, -50%);
+ transform: translate(-50%, -50%);
+ background-color: var(--bs-body-bg);
+ z-index: 9999;
+ width: 100%;
+ height: 100%;
+}
+
+.mshell span.cd {
cursor: default;
}
-*{
- -webkit-tap-highlight-color:rgba(0,0,0,0);
+* {
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
-.mshell{
- width: 100%;
- max-width: 960px;
- --bs-gutter-x: 1.5rem;
- --bs-gutter-y: 0;
- padding-right: calc(var(--bs-gutter-x) * .5);
- padding-left: calc(var(--bs-gutter-x) * .5);
- margin-right: auto;
- margin-left: auto;
-
- // position: relative;
- -webkit-user-select:none
-}
-.mshell xref-group{
- //margin-right: 10px;
-}
-.mshell esc{
+
+.mshell esc {
font-variant: small-caps;
}
-.mshell est{
-text-decoration: line-through;
+.mshell est {
+ text-decoration: line-through;
}
-.mshell speaker{
+.mshell speaker {
font-variant: small-caps;
}
-.mshell phon{
- font-family: "Lucida Sans Unicode";
- font-weight:normal;
-
+.mshell phon {
+ font-family: "Lucida Sans Unicode";
+ font-weight: normal;
}
-.mshell .rubricText phon{
+.mshell .rubricText phon {
font-weight: bold;
}
-.mshell .activityArea a{
+.mshell .activityArea a {
position: relative;
margin-left: 10px;
display: inline;
}
-.mshell .fb .a{
+.mshell .fb .a {
display: inline-block;
min-width: 100px;
}
-.mshell .fb .a:before{
- left:-16px;
+.mshell .fb .a:before {
+ left: -16px;
}
-.mshell .input_text{
- font:16px Inter;
- color:#5e61b9;
+.mshell .input_text {
+ color: var(--bs-primary-text);
margin-bottom: 20px;
width: 100%;
}
-.mshell .input_text gap:before{
- content:"...";
+.mshell .input_text gap:before {
+ content: "...";
display: inline-block;
}
-.mshell .mRadioCtrl .input_text{
+.mshell .mRadioCtrl .input_text {
max-width: 75%;
margin-top: 45px;
}
-.mshell .multi_radio_textEntry .input_text{
+.mshell .multi_radio_textEntry .input_text {
max-width: 75%;
}
.mshell li .input_text {
- width:100%;
+ width: 100%;
}
-.mshell .input_text:not(:first-child){
+.mshell .input_text:not(:first-child) {
margin-top: 20px;
}
-.mshell .wrapper{
- box-sizing: border-box;
- font-size: 16px;
- background-color: #ffffff;
- font-family: 'Inter';
-}
+
.mshell .myApp:after {
content: "";
display: block;
clear: both;
}
-.mshell input{
+.mshell input {
-webkit-appearance: none;
border-radius: 0;
}
-.mshell .status{
- height:26px;
- display:inline-block;
+.mshell .status {
+ height: 26px;
+ display: inline-block;
max-width: 26px;
vertical-align: top;
- width:26px;
+ width: 26px;
background-position: center;
background-repeat: no-repeat;
}
-.mshell .status.correct{
- background-image: url('../images/correct.png');
-
+.mshell .status.correct {
+ background-image: url("../images/correct.png");
}
-.mshell .status.incorrect{
- background-image: url('../images/incorrect.png');
-
+.mshell .status.incorrect {
+ background-image: url("../images/incorrect.png");
}
-.mshell .tick{
+.mshell .tick {
position: absolute;
right: -27px;
top: 4px;
}
.mshell .header {
- border-bottom:1px solid #5e61b9;
- padding:6px 20px;
+ border-bottom: 1px solid var(--bs-primary-text);
float: left;
- width:100%;
- box-sizing: border-box;
+ width: 100%;
+
display: none;
}
-.mshell .lvlWrapper{
+.mshell .lvlWrapper {
display: table-cell;
-
}
-.mshell .totalQues_wrap{
- display:table-cell;
+.mshell .totalQues_wrap {
+ display: table-cell;
vertical-align: middle;
- width:70px;
+ width: 70px;
}
-.mshell .header .levelHolder{
+.mshell .header .levelHolder {
bottom: 7px;
float: left;
clear: both;
margin-top: 5px;
position: relative;
font-size: 12px;
- font-family: Inter;
- color: #5e61b9;
-}
-.mshell .topicHeader{
- font: 20px 'open_sanssemibold';
- color: #5e61b9;
- float:left;
+
+ color: var(--bs-primary-text);
}
-.mshell .topicCounter{
+
+.mshell .topicCounter {
background: #f2f2f2;
- color:#5e61b9;
+ color: var(--bs-primary-text);
padding: 3px;
display: inline-block;
float: right;
- font: 15px 'Inter';
}
-.mshell .topicFooter{
- border-top:1px solid #5e61b9;
- padding:6px 20px;
+.mshell .topicFooter {
+ border-top: 1px solid var(--bs-primary-text);
+ padding-top: 10px;
float: left;
- width:100%;
+ width: 100%;
margin-top: 20px;
- box-sizing: border-box;
- font:15px 'Inter';
- color:#5e61b9;
+
+ color: var(--bs-primary-text);
display: none;
}
-.mshell .topicFooter strong{
- font:15px 'open_sansbold';
- color:#5e61b9;
+.mshell .topicFooter strong {
+ color: var(--bs-primary-text);
}
-.mshell .peuLogo{
- background-image: url('../images/peu.png');
- height:18px;
- display:inline-block;
+.mshell .peuLogo {
+ background-image: url("../images/peu.png");
+ height: 18px;
+ display: inline-block;
max-width: 18px;
background-size: 100% auto;
margin-left: 5px;
margin-top: 2px;
vertical-align: top;
- width:26px;
+ width: 26px;
background-position: center;
background-repeat: no-repeat;
}
-.mshell .rubric{
+.mshell .rubric {
margin: 20px 0 20px 0;
- font: 16px 'open_sansbold';
- color: #333333;
- display:table;
+ font-weight: 600;
+ display: table;
}
-.mshell .rubricNo{
- width:26px;
+.mshell .rubricNo {
+ width: 26px;
float: left;
- display:table-cell;
+ display: table-cell;
vertical-align: middle;
}
-.mshell .rubricText{
- display:table-cell;
+.mshell .rubricText {
+ display: table-cell;
vertical-align: middle;
margin-top: 20px;
margin-bottom: 20px;
}
-.mshell .rubricText i{
- // margin-left: 2px;
+.mshell .rubricText i {
+ // margin-left: 2px;
// margin-right: 3px;
}
-.mshell .rwDiv{
+.mshell .rwDiv {
text-align: right;
}
.mshell .rwDiv span {
@@ -233,14 +217,14 @@ text-decoration: line-through;
text-align: center;
margin-left: -20px;
}
-.mshell .status+.status{
+.mshell .status + .status {
display: none !important;
}
-.mshell item{
- font-family: 'open_sansbold';
+.mshell item {
+ font-weight: 900;
}
-.mshell punc{
- font-family: 'open_sansbold';
+.mshell punc {
+ font-family: "open_sansbold";
font-size: 17px;
}
.mshell .radioC {
@@ -249,56 +233,33 @@ text-decoration: line-through;
}
.mshell .radioC .radioBtn:last-child {
margin-right: 22px;
-
-}
-.mshell .loader{
- position: absolute;
- z-index: 99;
- background: url(../images/loader.gif) no-repeat center center #ffffff;
- display: none;
- width: 104%;
- height: 100%;
- left: -7px;
- min-height: 650px;
-}
- .mloader{
- position: fixed;
- z-index: 99;
- background: url(../images/mloader.gif) no-repeat center center rgba(255,255,255,0.5);
- display: block;
- width: 104%;
- height: 100%;
- top:0;
- left: 0px;
-
}
+
.mshell input,
.mshell textarea,
[contenteditable] {
-webkit-user-select: text;
user-select: text;
}
-.mshell .radio{
+.mshell .radio {
border-radius: 50%;
- background-color: #dedee0;
- border: 1px solid #9a9b9d;
+ border: 1px solid var(--bs-body-color);
display: inline-block;
width: 18px;
height: 18px;
- box-shadow: 1px 1px 1px rgba(0,0,0,0.3);
float: left;
margin: -2px 0 0 0;
z-index: 1;
position: relative;
- box-sizing: border-box;
+
}
-.mshell .activityArea{
- color: #333333;
+.mshell .activityArea {
+
padding: 0 20px;
font-size: 16px;
- float:left;
+ float: left;
width: 100%;
- box-sizing: border-box;
+
}
.mshell .activityArea:after {
content: initial;
@@ -306,177 +267,102 @@ text-decoration: line-through;
clear: both;
visibility: hidden;
}
-.mshell .disable{
+.mshell .disable {
cursor: default;
}
-.mshell div.bef:before{
+.mshell div.bef:before {
opacity: 1;
}
-.mshell .btn{
- font: 14px 'Inter';
- height: 30px;
- line-height: 30px;
- text-align: center;
- border-radius: 15px;
- display: inline-block;
- padding: 0 20px;
- cursor: pointer;
- border:1px solid #87b03f;
- background-color: rgba(135,176,63,0.5);
- color: #333333;
- box-sizing: border-box;
-}
-.mshell .skip.btn,.mshell .btn.endTest{
- border:1px solid #5F6979;
- background-color: #D0D0D0;
- color: #333333;
+
+.mshell .skip.btn,
+.mshell .btn.endTest {
margin-top: 15px;
}
-.mshell .btn.skip {
- width: 72px;
- box-sizing: border-box;
-}
-.mshell .btn.endTest{
+
+.mshell .btn.endTest {
display: none;
float: left;
- width: 73px;
- padding: 0;
}
-.mshell .tryAgain.btn,.mshell .btn.tryTest,.mshell .btn.retake{
- border:1px solid #5F6979;
- background-color: #E5EFFA;
- color: #333333;
- margin: 7px 0 0 23px;
- width: 88px;
- padding: 0;
-}
-.mshell .btn.tryTest:hover{
- color: #333333;
- background-color: #464091;
- border:1px solid #464091;
-}
-.mshell .btn.retake:hover,.mshell .tryAgain.btn:hover{
- color: #ffffff;
- background-color: #464091;
- border:1px solid #464091;
-}
.mshell .resultsBtn.btn {
width: 91px;
margin-top: 15px;
text-align: center;
- float:right;
+ float: right;
}
-.mshell .lrnRec{
+.mshell .lrnRec {
float: right;
}
-.mshell .btn.next{
+.mshell .btn.next {
width: 77px;
float: right;
margin-top: 15px;
- margin-right:0px;
+ margin-right: 0px;
display: none;
}
-.mshell .skip.btn:hover,.mshell .btn.endTest:hover{
- color:black;
- background-color: #A0A0A0;
- border:1px solid #5F6979;
-}
-.mshell .btn.tryTest {
- margin: 0;
- width: 120px;
- padding: 0;
- line-height: 26px;
- background: #D0D0D0;
- border: 1px solid #5F6979;
-}
-.mshell .btn.tryTest:hover {
- background: #A0A0A0;
- border: 1px solid #5F6979;
-}
-.mshell .lrnRec {
- float: right;
- width: 150px;
- padding: 0;
-}
-.mshell .checkAns{
- width: 175px;
- margin-top: 15px;
+
+.mshell .checkAns {
+ margin-top: 15px;
display: none;
float: right;
- margin-right:0px;
- box-sizing: border-box;
}
-.mshell .btn:hover{
- font-family: 'open_sansbold';
- border:1px solid #678C0D;
- background-color: rgba(135,176,63,1);
- color: #FFFFFF;
-}
-.mshell input[type="text"],.mshell .freeText_entry {
+
+.mshell input[type="text"],
+.mshell .freeText_entry {
margin: 0 0 0 10px;
padding: 4px;
- font-size: 15px;
- line-height: 20px;
- border: 1px solid rgba(162,162,162,0.9);
- box-shadow: 3px 3px 3px rgba(51,51,51,0.3) inset;
}
-.mshell .multi_radio_textEntry input[type="text"]{
+.mshell .multi_radio_textEntry input[type="text"] {
text-align: center;
min-width: 100px;
- width:100px;
+ width: 100px;
margin-left: 0px;
- float:left;
+ float: left;
}
-.mshell .multi_radio_textEntry .textEntry{
+.mshell .multi_radio_textEntry .textEntry {
min-width: 100px;
max-width: 510px;
- width:90%;
+ width: 90%;
min-height: 29px;
float: left;
}
-.mshell .radioTxtEntry{
+.mshell .radioTxtEntry {
display: inline-block;
// margin-top: 20px;
float: left;
- width:100%;
+ width: 100%;
clear: both;
}
-.mshell input[type="text"].freeText_entry{
+.mshell input[type="text"].freeText_entry {
max-width: 550px;
- width:100%;
+ width: 100%;
margin: 10px 0 10px 0;
padding: 9px 5px;
line-height: 18px;
- box-shadow: 3px 3px 3px rgba(51,51,51,0.3) inset;
- box-sizing: border-box;
+ box-shadow: 3px 3px 3px rgba(51, 51, 51, 0.3) inset;
+
}
-.mshell .linkFeedback{
+.mshell .linkFeedback {
display: block;
clear: both;
margin: 20px 0 0 0;
float: left;
width: 100%;
- box-sizing: border-box;
+
display: none;
}
-.mshell .linkFeedback h4{
- font-family: 'open_sansbold';
- color: #333333;
+.mshell .linkFeedback h4 {
+ font-family: "open_sansbold";
font-size: 16px;
- line-height: 24px;
}
-.mshell .linkFeedback li{
+.mshell .linkFeedback li {
list-style: none;
position: relative;
- color: #333333;
- font-size: 15px;
- line-height: 24px;
- margin: 2px 0 0 9px;
-
+ margin: 10px 0 0 0px;
+ padding-right: 42px;
}
.mshell .activityArea a:before {
- content: '';
+ content: "";
position: absolute;
background: url(../images/arrow.png) no-repeat 0px 5px;
width: 14px;
@@ -484,31 +370,31 @@ text-decoration: line-through;
left: -14px;
}
/* Multi Radio start */
-.mshell .questions{
+.mshell .questions {
counter-reset: listStyle;
float: left;
width: 100%;
position: relative;
font-size: 15px;
- box-sizing: border-box;
+
}
-.mshell .questionSet{
+.mshell .questionSet {
counter-increment: listStyle;
padding-left: 26px;
position: relative;
float: left;
clear: both;
width: 100%;
- box-sizing: border-box;
+
}
-.mshell .questionSet:before{
+.mshell .questionSet:before {
content: counter(listStyle, upper-alpha);
position: absolute;
left: 0;
top: 25px;
line-height: 24px;
}
-.mshell .patch{
+.mshell .patch {
position: absolute;
width: 26px;
height: 26px;
@@ -523,20 +409,20 @@ text-decoration: line-through;
min-height: 26px;
}
.mshell .radioBtn:after {
- content: '\007C';
+ content: "\007C";
margin-left: 15px;
display: none;
- color:grey;
- position:relative;
+ color: grey;
+ position: relative;
}
.mshell span.radioTxt {
line-height: 17px;
margin: 0 0 0 9px;
display: none;
- font-family: Inter;
- position: relative
+ font-weight: normal;
+ position: relative;
}
-.mshell .qTxt[disabled="disabled"]{
+.mshell .qTxt[disabled="disabled"] {
display: none;
}
.mshell .qTxt {
@@ -546,35 +432,35 @@ text-decoration: line-through;
float: left;
}
.mshell .mRadioCtrl .qTxt {
- width:75%;
+ width: 75%;
}
.mshell .mRadioTextCtrl .qTxt {
- max-width:75%;
+ max-width: 75%;
}
-.mshell .mRadioCtrl .questionSet:before{
- content: '';
+.mshell .mRadioCtrl .questionSet:before {
+ content: "";
}
-.mshell .mRadioCtrl .input_text{
+.mshell .mRadioCtrl .input_text {
margin-bottom: 0px;
- //margin-top: 25px;
+ //margin-top: 25px;
}
-.mshell .mRadioCtrl .qTxt:not(:empty):before{
+.mshell .mRadioCtrl .qTxt:not(:empty):before {
content: counter(listStyle, upper-alpha);
position: absolute;
left: 0px;
line-height: 24px;
}
-.mshell .mRadioCtrl .sampleTxt:before{
- content: 'Example';
+.mshell .mRadioCtrl .sampleTxt:before {
+ content: "Example";
position: relative;
font-variant: small-caps;
left: 0px;
line-height: 24px;
margin-right: 5px;
}
-.mshell .summary .sampleTxt:before{
- content: 'Example';
+.mshell .summary .sampleTxt:before {
+ content: "Example";
position: relative;
font-variant: small-caps;
left: 0px;
@@ -583,20 +469,19 @@ text-decoration: line-through;
}
.mshell .sampleSet {
-
padding-left: 26px;
position: relative;
float: left;
clear: both;
width: 100%;
- box-sizing: border-box;
+
}
.mshell .sampleTxt {
margin-bottom: 10px;
margin-top: 25px;
line-height: 24px;
float: left;
- width:75%;
+ width: 75%;
}
.mshell .mRadioTextCtrl span.questionText {
float: left;
@@ -615,35 +500,35 @@ text-decoration: line-through;
height: 14px;
display: block;
opacity: 0;
- background: #a0a0a0;
+ background: var(--bs-primary);
border-radius: 50%;
margin: 1px;
- transform: scale(0);
-webkit-transform: scale(0);
- transition: 0.1s all ease-in;
+ transform: scale(0);
-webkit-transition: 0.1s all ease-in;
+ transition: 0.1s all ease-in;
}
.mshell .selected .radio i {
opacity: 1;
- transform: scale(1);
-webkit-transform: scale(1);
+ transform: scale(1);
}
.mshell .feedback {
float: left;
clear: both;
- background-color: rgba(135,176,63,0.5);
+ background-color: var(--bs-success-border-subtle);
padding: 0 6px;
line-height: 26px;
min-height: 26px;
display: none;
}
-.shud_be should_be{
- background-color:#D0D0D0;
+.shud_be should_be {
+ background-color: #d0d0d0;
}
fb:empty {
float: left;
clear: both;
- background-color: rgba(135,176,63,0.5);
+ background-color: rgba(135, 176, 63, 0.5);
padding: 0 6px;
line-height: 26px;
min-height: 26px;
@@ -652,15 +537,15 @@ fb:empty {
should_be {
float: left;
clear: both;
- background-color: rgba(135,176,63,0.5);
+ background-color: rgba(135, 176, 63, 0.5);
padding: 0 6px;
line-height: 26px;
min-height: 26px;
margin-top: 10px;
}
-.linkFeedback should_be{
+.linkFeedback should_be {
background-color: #ffffff;
- float: none;
+ float: none;
}
should_be:first-child {
margin-top: 0px;
@@ -669,12 +554,12 @@ should_be:parent {
background-color: none;
padding: 0;
}
-.mshell .disabler{
+.mshell .disabler {
width: 100%;
height: 100%;
position: absolute;
z-index: 9;
- top:0px;
+ top: 0px;
}
.mshell div[ng-controller="mRadioCtrl"] .status {
top: -6px;
@@ -687,13 +572,13 @@ should_be:parent {
left: 13px;
top: -4px;
}
-.mshell .mRadioTextCtrl .status.newStatus{
+.mshell .mRadioTextCtrl .status.newStatus {
position: static;
}
-.mshell .mRadioTextCtrl .questionSet .feedback{
+.mshell .mRadioTextCtrl .questionSet .feedback {
margin-top: 0px;
}
-.mshell div[ng-controller="mRadioCtrl"] .questionSet .feedback{
+.mshell div[ng-controller="mRadioCtrl"] .questionSet .feedback {
margin-left: 0px;
}
.mshell div[ng-controller="mRadioTextCtrl"] .questionSet .feedback {
@@ -711,45 +596,39 @@ should_be:parent {
margin-top: 10px;
}*/
.mshell .summary .questionSet:before {
- content: '';
+ content: "";
}
-.mshell .summary .qTxt:before{
+.mshell .summary .qTxt:before {
content: counter(listStyle, upper-alpha);
position: absolute;
left: 0px;
line-height: 24px;
height: 24px;
}
-.mshell .summary .radioC {
+.mshell .summary .radioC {
}
-
-
/*summary multiradio end*/
/* Multi Radio end */
-.mshell .freeText textarea{
+.mshell .freeText textarea {
max-width: 550px;
- width:100%;
+ width: 100%;
margin: 10px 0 10px 0;
padding: 9px 5px;
- color: #333333;
- line-height: 18px;
- box-shadow: 3px 3px 3px rgba(51,51,51,0.3) inset;
- box-sizing: border-box;
resize: none;
overflow: hidden;
- font-family: Inter;
- min-height:41px !important;
+ min-height: 41px !important;
}
-.mshell .freeText .feedback{
+.mshell .freeText .feedback {
margin-left: 1px;
max-width: 550px;
width: 100%;
- box-sizing: border-box;
+
}
-.mshell .freeText .btn.next,.orderSentence .btn.next{
+.mshell .freeText .btn.next,
+.orderSentence .btn.next {
display: block;
}
.mshell .freeText .ques_group {
@@ -767,15 +646,15 @@ should_be:parent {
padding-left: 26px;
}
/* Reorder*/
-.mshell .order_activityArea{
+.mshell .order_activityArea {
overflow: hidden;
position: relative;
}
-.mshell .order_activityArea .feedback{
- margin-left:0px;
- margin-top:10px
+.mshell .order_activityArea .feedback {
+ margin-left: 0px;
+ margin-top: 10px;
}
-.mshell .reorderli {
+.mshell .reorderli {
float: left;
list-style: none;
margin-bottom: 5px;
@@ -783,30 +662,28 @@ should_be:parent {
height: 46px;
width: 50px;
}
-.mshell .orderSentence .reorderli:last-child{
+.mshell .orderSentence .reorderli:last-child {
display: inline;
- width:auto;
+ width: auto;
margin: 0px;
}
-.mshell .quesWrap{
- float:left;
-
+.mshell .quesWrap {
+ float: left;
}
-.mshell .questionSet_orderdnd{
+.mshell .questionSet_orderdnd {
counter-increment: listStyle;
- padding-left:26px;
+ padding-left: 26px;
float: left;
clear: both;
width: 97%;
- box-sizing: border-box;
+
margin-bottom: 10px;
overflow: auto;
-
}
-.mshell .questionSet_orderdnd:not(:empty):before{
+.mshell .questionSet_orderdnd:not(:empty):before {
content: counter(listStyle, upper-alpha);
position: absolute;
- left:0px;
+ left: 0px;
line-height: 42px;
}
.mshell .reorderOptions.ng-enter {
@@ -819,121 +696,106 @@ should_be:parent {
.mshell .reorderOptions.ng-enter[data-direction="right"] {
left: 80px; /* 60px width + 20px marginLeft */
}
-.mshell .reorderOptions{
- float:left;
- padding:10px;
- border:1px solid;
- box-sizing: border-box;
+.mshell .reorderOptions {
+ float: left;
+ padding: 10px;
+ border: 1px solid var(--bs-body-color);
border-radius: 15px;
text-align: center;
list-style: none;
- cursor:pointer;
- font-size: 15px !important;
- font-family: 'Inter' !important;
- font-weight:normal !important;
- color: #333333 !important;
- background-color: white;
-}
-.mshell .reorderQuestion{
+ cursor: pointer;
+ background-color: var(--bs-body-bg);
+}
+.mshell .reorderQuestion {
text-align: left;
margin-left: 2px;
margin-bottom: 2px;
- padding:10px 10px 10px 5px;
+ padding: 10px 10px 10px 5px;
list-style: none;
- float: left
+ float: left;
}
-.mshell .quesWrap:last-child.reorderQuestion{
-
+.mshell .quesWrap:last-child.reorderQuestion {
}
-.mshell .orderSentence .status{
+.mshell .orderSentence .status {
margin: 6px 0 0 -5px;
}
/*-----------------------------------*/
/*------------------------correction start----------------------------------------*/
-.mshell .correctionSample{
- float:left;
+.mshell .correctionSample {
+ float: left;
display: flex;
padding-left: 26px;
display: -webkit-flex;
width: 100%;
margin-bottom: 20px;
- box-sizing: border-box;
-}
+}
.correction .correctionSample:before {
- content: 'Example';
+ content: "Example";
display: inline;
float: left;
font-variant: small-caps;
margin-right: 14px;
}
-.mshell .correctionArrow{
+.mshell .correctionArrow {
padding-left: 5px;
padding-right: 5px;
}
.mshell .correction .rubricText {
margin-bottom: 10px;
}
-.mshell .correction input[type="text"]{
+.mshell .correction input[type="text"] {
margin: 10px 0px;
}
-.mshell .userInput{
- box-shadow: 3px 3px 3px rgba(51,51,51,0.3) inset;;
- border: 1px solid rgba(162,162,162,0.9);
- min-height:29px;
- line-height: 24px;
+.mshell .userInput {
+ min-height: 29px;
display: inline-block;
- color: #333333;
- min-width:250px;
- padding-left: 5px;
- box-sizing: border-box;
- word-break: break-word;
- resize:none;
- font:15px Inter;
+ min-width: 250px;
+ padding-top: 2px;
+ word-break: break-word;
+ resize: none;
text-align: left;
overflow: hidden;
}
-.mshell .correction .questionSet:before{
- content: '';
+.mshell .correction .questionSet:before {
+ content: "";
}
-.mshell .correction .qTxt:not(:empty):before{
+.mshell .correction .qTxt:not(:empty):before {
content: counter(listStyle, upper-alpha);
position: absolute;
- // padding-top: 2px;
left: 0px;
line-height: 24px;
}
-.mshell .correction .questionSet{
+.mshell .correction .questionSet {
margin-bottom: 10px;
margin-top: 20px;
padding-left: 26px;
}
-.mshell .correction .questionSet:first-child{
+.mshell .correction .questionSet:first-child {
margin-top: 0px;
}
-.mshell .correction .questionSet:last-child{
- margin-bottom: 0px
+.mshell .correction .questionSet:last-child {
+ margin-bottom: 0px;
}
-.mshell .correction .questionSet:before{
- top:0px;
+.mshell .correction .questionSet:before {
+ top: 0px;
}
-.mshell .correction .qTxt{
-
- width:95%;
+.mshell .correction .qTxt {
+ width: 95%;
margin-top: 0px;
- margin-bottom: 0px;
- clear:both;
+ margin-bottom: 0px;
+ clear: both;
}
-.mshell .correction .userInput{
+.mshell .correction .userInput {
margin-top: 5px;
- max-width:380px;
+ max-width: 380px;
}
-.mshell .correction .status{
+.mshell .correction .status {
float: left;
margin-right: -30px;
- margin-top:5px;
+ margin-top: 5px;
position: relative;
}
.mshell .correction .feedback {
@@ -943,97 +805,88 @@ should_be:parent {
clear: both;
float: left;
}
-.mshell .correct_ques{
+.mshell .correct_ques {
margin-right: 10px;
- width:100%;
+ width: 100%;
}
-.mshell .correction .feedback+.status {
+.mshell .correction .feedback + .status {
display: none;
}
/*------------------------end correction--------------------------------------------------------*/
/*-------------------------------------gap Fill------------------------------------------------*/
-.mshell .gapFill{
- display: inline-block;
- width:80px;
- box-shadow: 3px 3px 3px rgba(51,51,51,0.3) inset;;
- border: 1px solid rgba(162,162,162,0.9);
- min-height:25px;
- box-sizing: border-box;
+.mshell .gapFill {
+ width: 80px;
+ min-height: 25px;
padding: 0px 3px 0px 3px;
margin: 0px 5px 5px 0px;
text-align: center;
- font: 15px Inter;
resize: none;
overflow: hidden;
float: left;
max-width: 385px;
- line-height: 24px;
}
-.gap .correctionSample_eg:before{
- content: 'Example';
- display: inline;
+.gap .correctionSample_eg:before {
+ content: "Example";
+ display: inline;
vertical-align: top;
min-height: 26px;
line-height: 26px;
float: left;
font-variant: small-caps;
margin-right: 14px;
-
}
-.gap .correctionSample_eg > .ques{
+.gap .correctionSample_eg > .ques {
display: inline;
- width:auto !important;
+ width: auto !important;
}
-.mshell .gap .ques{
+.mshell .gap .ques {
margin-right: 5px;
}
-.mshell .gap .questionSet:before{
- content: '';
+.mshell .gap .questionSet:before {
+ content: "";
}
-.mshell .gap .qTxt:not(:empty):before{
+.mshell .gap .qTxt:not(:empty):before {
content: counter(listStyle, upper-alpha);
position: absolute;
padding-top: 2px;
left: 0px;
line-height: 24px;
}
-.mshell .gap .questionSet{
+.mshell .gap .questionSet {
margin-bottom: 10px;
padding-left: 27px;
}
.mshell .gap .questionSet:last-child {
- margin-bottom: 0px
+ margin-bottom: 0px;
}
-.mshell .gap .qTxt{
+.mshell .gap .qTxt {
margin-top: 0px;
margin-bottom: 0px;
-
}
-.mshell .gap .input_text{
+.mshell .gap .input_text {
margin-right: 10px;
width: 100%;
- display:inline-block;
+ display: inline-block;
margin-bottom: 20px;
}
-.mshell .gap .ques{
- display:inline-block;
+.mshell .gap .ques {
+ display: inline-block;
vertical-align: top;
- min-height:26px;
+ min-height: 26px;
line-height: 26px;
//float: left;
-
}
-.empty{
+.empty {
display: none !important;
}
-.mshell .gap .ques:not(.empty){
+.mshell .gap .ques:not(.empty) {
// min-width: 80px;
}
-.mshell .gap .status{
- float:left;
+.mshell .gap .status {
+ float: left;
}
-.mshell .gap .feedback{
+.mshell .gap .feedback {
clear: none;
float: left;
display: inline-block;
@@ -1067,13 +920,13 @@ should_be:parent {
display: none;
}
.mshell .multi_touch_button .questionSet:before {
- content: '';
+ content: "";
}
-.mshell .multi_touch_button .questionSet:last-child{
+.mshell .multi_touch_button .questionSet:last-child {
margin-bottom: 0px;
}
-.mshell .multi_touch_button .qTxt:before{
+.mshell .multi_touch_button .qTxt:before {
content: counter(listStyle, upper-alpha);
position: absolute;
padding-top: 2px;
@@ -1081,11 +934,10 @@ should_be:parent {
line-height: 24px;
height: 24px;
}
-.mshell .onlyElem:before{
- content:'' !important;
-
+.mshell .onlyElem:before {
+ content: "" !important;
}
-.mshell .summary .multi_touch_button .userInput{
+.mshell .summary .multi_touch_button .userInput {
width: auto !important;
}
.mshell .multi_touch_button .userInput {
@@ -1093,7 +945,7 @@ should_be:parent {
cursor: pointer;
box-shadow: none;
min-width: 80px;
- border: 1px solid #A0A0A0;
+ border: 1px solid var(--bs-border-color);
border-radius: 15px;
min-height: 26px;
line-height: 26px;
@@ -1102,73 +954,65 @@ should_be:parent {
text-align: center;
}
.mshell .multi_touch_button .qTxt .userInput:last-child {
- margin: 0px 3px 0px 0px;
+ margin: 0px 3px 0px 0px;
}
.mshell .multi_touch_button .userInput.selected {
- font-family:'open_sanssemibold';
- box-shadow: 0 0 0 2px #A0A0A0;
- background-color: #D0D0D0;
- border:none;
+ background-color: var(--bs-secondary);
+ color: white;
}
-.mshell .multi_touch_button .feedback{
+.mshell .multi_touch_button .feedback {
clear: none;
float: none;
display: inline-block;
- margin-right: 5px;
+ margin-right: 5px;
min-width: 80px;
text-align: center;
min-height: 28px;
line-height: 28px;
- border-radius: 0;
- border:none;
+ border-radius: 0;
+ border: none;
}
-.mshell .multi_touch_button .linkFeedback{
+.mshell .multi_touch_button .linkFeedback {
margin-top: 15px;
}
-.mshell .multi_touch_button .btn.next{
+.mshell .multi_touch_button .btn.next {
display: block;
}
/* Drag n drop*/
.mshell .dnd .options {
- width: 100%;
- background-color: #d1d8f1;
padding: 10px 10px 0 10px;
- box-sizing: border-box;
- float: left;
min-height: 56px;
transition: 0.3s all;
-webkit-transition: 0.3s all;
text-align: center;
}
-.mshell .dnd .drags{
+.mshell .dnd .drags {
border-radius: 23px;
text-align: center;
padding: 8px 19px;
line-height: 20px;
display: inline-block;
- background-color: #fff;
+ background-color: var(--bs-body-bg);
margin: 0 0px 10px 0;
cursor: pointer;
- border: 1px solid #adadad;
+ border: 1px solid var(--bs-body-color);
font-size: 15px;
}
-.mshell .dnd .tick{
-
+.mshell .dnd .tick {
position: relative;
top: 0px;
-
- right:0;
- height:40px;
- // margin-bottom: 10px;
+ right: 0;
+ height: 40px;
+ // margin-bottom: 10px;
}
-.mshell .dnd .drags.ui-draggable-dragging{
- border: 1px solid #adadad;
+.mshell .dnd .drags.ui-draggable-dragging {
+ border: 1px solid var(--bs-body-color);
}
-.mshell .ui-droppable .drags{
+.mshell .ui-droppable .drags {
border: none;
- height:auto !important;
+ height: auto !important;
}
.mshell ul.q_row {
counter-reset: list;
@@ -1181,9 +1025,9 @@ should_be:parent {
float: left;
clear: both;
padding-bottom: 0px;
- padding-left: 26px
+ padding-left: 26px;
}
-.mshell ul.q_row li:last-child{
+.mshell ul.q_row li:last-child {
padding-bottom: 0px;
}
.mshell ul.q_row .dnd_text:before {
@@ -1192,9 +1036,8 @@ should_be:parent {
clear: both;
height: 40px;
line-height: 40px;
- position:absolute;
- left:0px;
-
+ position: absolute;
+ left: 0px;
}
.mshell .q_row > span.ng-binding {
float: left;
@@ -1204,7 +1047,7 @@ should_be:parent {
//float: left;
//width: 50%;
text-align: center;
- display:inline-block;
+ display: inline-block;
}
.mshell .dragWrap {
display: inline-block;
@@ -1221,7 +1064,7 @@ should_be:parent {
display: inline-block;
vertical-align: middle;
border-radius: 20px;
- border: 1px solid #adadad;
+ border: 1px solid var(--bs-body-color);
//margin: 0 25px;
//margin-right: 0px;
//float: left;
@@ -1235,7 +1078,7 @@ should_be:parent {
float: left;
margin-top: 9px;
margin-bottom: 9px;
- // max-width: 600px;
+ // max-width: 600px;
}
.mshell .q_row li > span.ng-binding:empty {
height: 0px;
@@ -1249,20 +1092,19 @@ should_be:parent {
.mshell .q_row li > span.ng-binding:last-child {
margin-bottom: 0px;
}
-.mshell .dnd .feedback{
+.mshell .dnd .feedback {
clear: none;
- // margin: 0px 0 0 23px;
+ // margin: 0px 0 0 23px;
min-height: 0px;
line-height: none;
padding: 5px 0px;
text-align: center;
- float:none;
+ float: none;
display: inline-block !important;
}
/* Learning records*/
-.mshell .learningRec{
- color: #333333;
+.mshell .learningRec {
overflow: hidden;
display: none;
}
@@ -1270,18 +1112,18 @@ should_be:parent {
float: left;
width: 100%;
padding: 0 20px;
- box-sizing: border-box;
+
}
.mshell .tableTitle {
float: left;
width: 100%;
- box-sizing: border-box;
- border-bottom: 1px solid #dcdcdc;
+
+ border-bottom: 1px solid var(--bs-border-color);
padding: 0 0 10px 260px;
}
.mshell .tableTitle.tabFix {
position: fixed;
- top:0px;
+ top: 0px;
border: none;
background-color: #ffffff;
width: 870px;
@@ -1293,21 +1135,21 @@ should_be:parent {
float: left;
width: 100%;
padding: 11px 0 12px 0;
- border-bottom: 1px solid #dcdcdc;
+ border-bottom: 1px solid var(--bs-border-color);
}
.mshell .tableTitle span {
width: 115px;
display: inline-block;
- font: 12px 'open_sansbold';
+ font: 12px "open_sansbold";
margin: 8px 6px 0 0;
text-align: center;
- color: #333333;
+
}
-.mshell .lrnBtn{
- position:relative;
- color: #333333;
- background-color: rgba(135,176,63,0.5);
- font: 13px 'Inter';
+.mshell .lrnBtn {
+ position: relative;
+
+ background-color: rgba(135, 176, 63, 0.5);
+ font: 13px "Inter";
width: 115px;
display: table-cell;
vertical-align: middle;
@@ -1319,20 +1161,20 @@ should_be:parent {
cursor: pointer;
transition: 0.3s all;
border: 2px solid transparent;
- box-sizing: border-box;
+
}
-.mshell .lrnBtn.results{
- background-color:#ffffff;
- border:2px solid rgba(135,176,63,0.5);
+.mshell .lrnBtn.results {
+ background-color: #ffffff;
+ border: 2px solid rgba(135, 176, 63, 0.5);
}
-.mshell .lrnBtn.hover{
- background-color: #678C0D;
- font-family: 'open_sansbold';
- color: #FFFFFF;
+.mshell .lrnBtn.hover {
+ background-color: #678c0d;
+ font-family: "open_sansbold";
+ color: #ffffff;
border: 2px solid transparent;
}
-.mshell .lrnBtn.cd{
- background-color: #ECEDF2;
+.mshell .lrnBtn.cd {
+ background-color: #ecedf2;
color: #4b6076;
}
.mshell span.lrnTxt {
@@ -1340,7 +1182,7 @@ should_be:parent {
display: inline-block;
float: left;
line-height: 26px;
- box-sizing: border-box;
+
padding-right: 10px;
font-size: 14px;
}
@@ -1354,76 +1196,73 @@ should_be:parent {
margin-right: 0;
}
/* Single radio */
-.mshell .single_radio .questionSet.bef:before{
+.mshell .single_radio .questionSet.bef:before {
opacity: 1;
- font: 16px 'open_sansbold'
+ font-weight: 600;
}
-.mshell .single_radio .linkFeedback{
- margin-top: 23px
+.mshell .single_radio .linkFeedback {
+ margin-top: 23px;
}
.mshell .single_radio .questions {
margin-top: 20px;
counter-reset: none;
}
-.mshell .single_radio .radioBtn:after{
- content:"";
- display: inherit;
+.mshell .single_radio .radioBtn:after {
+ content: "";
+ display: inherit;
}
-.mshell .single_radio .radio{
- margin:0;
+.mshell .single_radio .radio {
+ margin: 0;
display: table-cell;
}
-.mshell .single_radio .rubricText:not(:first-child){
+.mshell .single_radio .rubricText:not(:first-child) {
position: relative;
display: table-cell;
-
-
}
-.mshell .single_radio .rubricText{
+.mshell .single_radio .rubricText {
display: none;
margin-left: 23px;
}
-.mshell .single_radio .questionSet1{
+.mshell .single_radio .questionSet1 {
padding-left: 26px;
position: relative;
float: left;
clear: both;
width: 100%;
- box-sizing: border-box;
+
}
-.mshell .single_radio .radioBtn:before{
+.mshell .single_radio .radioBtn:before {
content: counter(listStyle, upper-alpha);
- margin-left: -26px;
+ margin-left: -26px;
float: left;
- font-family: Inter;
+
}
-.mshell .single_radio .radioBtn{
+.mshell .single_radio .radioBtn {
counter-increment: listStyle;
- clear:both;
+ clear: both;
margin-top: 5px;
margin-bottom: 5px;
- display:table-row;
+ display: table-row;
width: 100%;
}
-.mshell .single_radio .rubric{
- margin-bottom: 0px
+.mshell .single_radio .rubric {
+ margin-bottom: 0px;
}
.mshell .single_radio .radioBtn:last-child {
- margin-bottom: 0px
+ margin-bottom: 0px;
}
.mshell .single_radio .optionSet:before {
-
}
.mshell .single_radio span.radioTxt {
display: table-cell;
- left:9px;
+ left: 9px;
}
.mshell .single_radio .patch {
- top: auto;
- margin-top: -4px;
+ top: auto;
+ margin-top: -4px;
margin-left: -3px;
- left:auto;
+ left: auto;
}
.mshell .single_radio .radioC {
float: none;
@@ -1436,32 +1275,32 @@ should_be:parent {
.mshell .single_radio .radioC:last-child {
margin-bottom: 0px;
}
-.mshell .single_radio .status{
- top: -3px;
+.mshell .single_radio .status {
+ top: -3px;
display: table-cell;
left: 8px;
position: relative;
}
/*Summary*/
-.mshell .summary{
+.mshell .summary {
clear: both;
float: left;
width: 100%;
}
.mshell .summary div[ng-controller] {
- border-bottom: 1px solid #dcdcdc;
+ border-bottom: 1px solid var(--bs-border-color);
padding: 0 0 18px 0;
float: left;
clear: both;
- width:100%;
+ width: 100%;
}
.mshell .emptyDiv {
float: left;
clear: both;
width: 100%;
height: 90px;
- box-sizing: border-box;
- border-bottom: 1px solid #dcdcdc;
+
+ border-bottom: 1px solid var(--bs-border-color);
}
.mshell .noResTitle span.rubricText {
margin: 0;
@@ -1470,12 +1309,12 @@ should_be:parent {
.mshell .noResTitle .rubric {
margin-top: 12px;
margin-bottom: 0px;
- font-family: Inter;
+
}
-.mshell .summary .emptyDiv .btn.tryAgain{
+.mshell .summary .emptyDiv .btn.tryAgain {
margin-top: 10px;
}
-.mshell .summaryBtn{
+.mshell .summaryBtn {
margin: 30px 0 -2px 0;
float: left;
width: 100%;
@@ -1484,44 +1323,32 @@ should_be:parent {
/* tablet css */
@media only screen and (max-width: 928px) {
- .mshell .tableTitle.tabFix{
+ .mshell .tableTitle.tabFix {
width: 730px;
}
}
/* Mobile css */
@media only screen and (max-width: 761px) {
- .main-container {
- padding-left: 6px;
- padding-right: 6px;
- }
- .mshell .wrapper{
- padding: 0 3.5%;
- width: 100%;
- margin: 0;
- }
.mshell .activityArea {
- padding:0px;
+ padding: 0px;
}
- .mshell .tableTitle.tabFix{
- width: 100%;;
+ .mshell .tableTitle.tabFix {
+ width: 100%;
}
- .mshell .header{
- padding-left:0;
+ .mshell .header {
+ padding-left: 0;
padding-right: 0;
}
.mshell .summaryWrapper .topicHeader {
- padding-left:0;
+ padding-left: 0;
padding-right: 0;
}
.mshell .summaryWrapper span {
- padding-left:0;
- padding-right: 0;
- }
- .mshell .topicFooter {
padding-left: 0;
+ padding-right: 0;
}
- .mshell .lrnData{
+ .mshell .lrnData {
padding: 0;
}
.mshell .lrnBtn {
@@ -1533,22 +1360,22 @@ should_be:parent {
.mshell .tableTitle span:last-child {
margin-right: 0;
}
- .mshell span.radioTxt{
+ .mshell span.radioTxt {
display: inline;
}
- .mshell .mRadioCtrl span.radioTxt{
- top:-4px;
+ .mshell .mRadioCtrl span.radioTxt {
+ top: -4px;
}
- .mshell .multi_radio_textEntry span.radioTxt{
- top:-4px;
+ .mshell .multi_radio_textEntry span.radioTxt {
+ top: -4px;
}
- .mshell .radioBtn:after{
+ .mshell .radioBtn:after {
display: inline;
}
.mshell .single_radio .radioBtn:after {
display: inherit;
}
- .mshell div[ng-controller="mRadioCtrl"] .status {
+ .mshell div[ng-controller="mRadioCtrl"] .status {
top: -6px;
right: 3px;
position: absolute;
@@ -1561,7 +1388,7 @@ should_be:parent {
line-height: 24px;
padding: 2px 6px;
}
- .mshell .mRadioTextCtrl .qTxt input{
+ .mshell .mRadioTextCtrl .qTxt input {
margin: 0;
float: left;
clear: both;
@@ -1573,7 +1400,7 @@ should_be:parent {
left: 40px;
}
.mshell .multi_radio_textEntry input[type="text"] {
- float:left;
+ float: left;
margin: 0px;
}
.mshell .mRadioTextCtrl .questionSet .feedback {
@@ -1591,31 +1418,31 @@ should_be:parent {
.mshell div[ng-controller="mRadioCtrl"] .radioC .radioBtn:last-child .status {
right: -24px;
}
- .mshell .radioBtn:last-child:after{
+ .mshell .radioBtn:last-child:after {
display: none;
}
- .mshell div[ng-controller="mRadioCtrl"] .radioBtn:first-child .status{
+ .mshell div[ng-controller="mRadioCtrl"] .radioBtn:first-child .status {
right: 2px;
}
/*.qTxt:not(.correction .qTxt){
float: none;
}*/
- .mshell .rwDiv{
+ .mshell .rwDiv {
display: none;
}
- .mshell .qTxt{
+ .mshell .qTxt {
margin-top: 10px;
- width:100%;
+ width: 100%;
}
.mshell .multi_radio_textEntry .questionSet:before {
- top:10px;
+ top: 10px;
}
.mshell .mRadioCtrl .qTxt {
width: 100%;
}
- .mshell .multi_radio_textEntry .radioTxtEntry{
+ .mshell .multi_radio_textEntry .radioTxtEntry {
float: left;
- clear:both;
+ clear: both;
margin: 0px;
}
.mshell .radioC {
@@ -1625,47 +1452,47 @@ should_be:parent {
float: left;
clear: both;
}
- .mshell .radioC :last-child{
+ .mshell .radioC :last-child {
margin-bottom: 0px;
}
.mshell .radioC .radioBtn:first-child {
margin-right: 22px;
}
- .mshell .mRadioCtrl .input_text{
- margin-bottom: 5px;
- margin-top: 30px;
-}
+ .mshell .mRadioCtrl .input_text {
+ margin-bottom: 5px;
+ margin-top: 30px;
+ }
.mshell .patch {
//margin-left: -22px;
}
/* Drag n drop*/
.mshell .dragC {
//clear: both;
- // width: 100%;
+ // width: 100%;
}
- .mshell .dnd .drags{
+ .mshell .dnd .drags {
margin: 0 0px 10px 0;
}
- .mshell ul.q_row .dnd_text{
- width:100% !important;
+ .mshell ul.q_row .dnd_text {
+ width: 100% !important;
}
.mshell ul.q_row .dnd_text:empty:before {
- top:17px
+ top: 17px;
}
- .mshell ng-drop.ui-droppable{
- // clear: both;
- // margin-left: 23px;
+ .mshell ng-drop.ui-droppable {
+ // clear: both;
+ // margin-left: 23px;
margin-bottom: 5px;
}
- .summary .options:empty{
+ .summary .options:empty {
display: none;
}
/* Drag n drop End*/
/* Learning record*/
- .mshell .lrnBtnC{
+ .mshell .lrnBtnC {
clear: both;
}
- .mshell .tableTitle{
+ .mshell .tableTitle {
padding-left: 0;
}
.mshell span.lrnTxt {
@@ -1676,53 +1503,48 @@ should_be:parent {
/* Learning record End*/
}
@media only screen and (max-width: 430px) {
- .mshell .btn.tryTest{
+ .mshell .btn.tryTest {
float: left;
}
- .mshell .lrnRec{
- // float: left;
- // margin-top: 10px;
- // margin-right:45px;
- }
.mshell .lrnBtn {
width: 93px;
-}
+ }
.mshell .tableTitle span {
width: 93px;
}
}
/* Home CSS sart*/
.mshell .home_h1 span {
- color: #20286D;
- font: 38px 'open_sanssemibold';
+ color: #20286d;
+ font: 38px "open_sanssemibold";
}
.mshell .home_h1 {
margin-top: 15px;
text-align: center;
font-size: 35px;
}
-.mshell .home_h2 span{
- color: #6F6F6F;
- font: 16px 'Inter';
+.mshell .home_h2 span {
+ color: #6f6f6f;
+ font: 16px "Inter";
}
-.mshell .home_h2 span.ff_first:after{
- content: '\007C';
- color: #20286D;
+.mshell .home_h2 span.ff_first:after {
+ content: "\007C";
+ color: #20286d;
margin: 0 0 0 3px;
font-weight: bold;
}
-.mshell .home_h3 span{
- font: 14px 'Inter';
- color:#6F6F6F
+.mshell .home_h3 span {
+ font: 14px "Inter";
+ color: #6f6f6f;
}
-.mshell .pract_eng{
- background: url('../images/home_img.png') no-repeat center right;
+.mshell .pract_eng {
+ background: url("../images/home_img.png") no-repeat center right;
height: 32px;
width: 30px;
display: table-cell;
background-size: 100% 100%;
}
-.mshell .home_h2{
+.mshell .home_h2 {
text-align: center;
font-weight: normal;
margin: 8px 0;
@@ -1754,16 +1576,16 @@ should_be:parent {
font-size: 20px;
line-height: 54px;
font-weight: normal;
- color: #333333;
+
height: 54px;
- background-color: rgba(135,176,63,0.5);
+ background-color: rgba(135, 176, 63, 0.5);
border-radius: 34px;
width: 124px;
margin: 46px auto 0 auto;
cursor: pointer;
}
-.mshell .home_page .mbox h2:hover{
- background-color: #678C0D;
+.mshell .home_page .mbox h2:hover {
+ background-color: #678c0d;
color: #ffffff;
}
.mshell .icon_wrp {
@@ -1792,80 +1614,69 @@ should_be:parent {
text-align: center;
position: relative;
vertical-align: middle;
- border: 1px solid #5F6979;
- background-color: #D0D0D0;
- color: #333333;
- box-sizing: border-box;
+ border: 1px solid #5f6979;
+ background-color: #d0d0d0;
+
+
padding: 0px;
}
-.mshell .home_help:hover{
- background-color: #A0A0A0;
- color:black;
- border: 1px solid #5F6979;
+.mshell .home_help:hover {
+ background-color: #a0a0a0;
+ color: black;
+ border: 1px solid #5f6979;
}
-.mshell .row1{
+.mshell .row1 {
text-align: center;
display: inline-block;
}
-.mshell .peu{
- text-align: center;
- font-size: 22px;
- color: #20286D;
- font-family: open_sanssemibold;
- vertical-align: middle;
- display: table-cell;
- width: 250px;
-}
+
/* Summary Result start */
-.mshell .summaryWrapper{
- box-sizing: border-box;
+.mshell .summaryWrapper {
+
border-bottom: 1px solid #5e61b9;
overflow: hidden;
position: relative;
-
}
.mshell .summaryWrapper .topicHeader {
- font: 20px 'open_sanssemibold';
- color: #5e61b9;
+ font: 20px "open_sanssemibold";
+ color: var(--bs-primary-text);
padding: 0px 20px;
float: left;
display: block;
margin-bottom: 5px;
width: 100%;
}
-.mshell .summaryWrapper span{
+.mshell .summaryWrapper span {
bottom: 7px;
position: relative;
- padding:0px 20px;
- font-size: 12px;
- font-family: Inter;
- color: #5e61b9;}
-.mshell .resultSummary{
+ padding: 0px 20px;
+ color: var(--bs-primary-text);
+}
+.mshell .resultSummary {
position: relative;
min-height: 78px;
- border: 4px solid #D0D0D0;
- overflow:hidden;
- max-width:586px;
- box-sizing: border-box;
+ border: 4px solid var(--bs-secondary);
+ overflow: hidden;
+
top: 8px;
}
.mshell .resultHeader {
- font-size: 15px;
- font-family: open_sanssemibold;
- background: #D0D0D0;
- color: #333333;
- height: 21px;
- line-height: 17px;
- padding-left: 8px;
+ background: var(--bs-secondary);
+ min-height: 21px;
+ padding-left: 9px;
+ padding-bottom: 5px;
+ font-weight: 600;
+ color: #ffffff;
}
-.mshell .resultOption_wrapper{
+.mshell .resultOption_wrapper {
overflow: hidden;
- background: #A0A0A0;}
+ background: #a0a0a0;
+}
.mshell .radioParent {
position: relative;
float: left;
width: 100%;
- background: white;
+ background: var(--bs-body-bg);
margin-bottom: 1px;
}
.mshell .radioRow {
@@ -1879,12 +1690,12 @@ should_be:parent {
display: table;
padding-top: 5px;
padding-bottom: 5px;
- box-sizing: border-box;
+
}
.mshell .iconParent {
position: relative;
float: left;
- border: 1px solid #A0A0A0;
+ border: 1px solid #a0a0a0;
cursor: pointer;
width: 16px;
height: 16px;
@@ -1904,104 +1715,85 @@ should_be:parent {
margin-top: 3px;
}
.mshell .iconParent.clicked .iconChild {
- background: #A0A0A0;
+ background: #a0a0a0;
}
.mshell .radioText {
display: table-cell;
vertical-align: middle;
- font-size: 15px;
line-height: 20px;
- font-family: Inter;
padding-right: 6px;
}
-.mshell .icon_wrap{
+.mshell .icon_wrap {
display: table-cell;
vertical-align: middle;
- width: 5%
+ width: 5%;
}
-.mshell .resulFooter{
+.mshell .resulFooter {
overflow: hidden;
}
-.mshell .resulttfooterHeader{
- padding:4px 8px;
- font: 15px 'open_sanssemibold';
- color:#333333;
+.mshell .resulttfooterHeader {
+ padding: 4px 8px;
}
-.mshell .resultFeedback{
+.mshell .resultFeedback {
margin-left: 8px;
margin-right: 8px;
margin-bottom: 8px;
- padding:5px;
min-height: 78px;
- border:1px solid #A0A0A0;
- line-height: 20px;
+ width: unset;
}
-.mshell .summary .tryAgain.btn{
+.mshell .summary .tryAgain.btn {
margin-top: 18px;
}
/*--------Summary Result end-------------*/
/*--------feed back start-------------*/
-.mshell .feedback_wrapper{
+.mshell .feedback_wrapper {
position: relative;
min-height: 85px;
- border: 3px solid #7684BF;
- overflow:hidden;
- max-width:586px;
- box-sizing: border-box;
+ border: 3px solid var(--bs-purple);
+ overflow: hidden;
}
-.mshell .feedback_header{
- font-size: 15px;
- font-family: open_sansbold;
- background: #7684BF;
+.mshell .feedback_header {
+ background: var(--bs-purple);
+ font-weight: 600;
color: #ffffff;
min-height: 21px;
- line-height: 15px;
padding-left: 9px;
padding-bottom: 5px;
}
-.mshell .feedback_header span{
- font-family: open_sanssemibold;
-}
-.mshell .feedback_wrapper i{
- margin-right: 3px
-}
-.resultFeedback{
- font-size: 15px;
+
+.mshell .feedback_wrapper i {
+ margin-right: 3px;
}
-.resultFeedback span{
+
+.resultFeedback span {
background-color: transparent !important;
- font-size: 15px;
line-height: 20px !important;
}
/*--------feed back end-------------*/
/*-------reponsive----------------*/
-@media screen and (max-width: 928px) and (min-width: 762px){
- .main-container {
- padding-left: 6px;
- padding-right: 6px;
- }
- .mshell .tableTitle.tabFix{
- width: 100%;;
+@media screen and (max-width: 928px) and (min-width: 762px) {
+ .mshell .tableTitle.tabFix {
+ width: 100%;
}
- .mshell .mRadioCtrl span.radioTxt{
+ .mshell .mRadioCtrl span.radioTxt {
top: -4px;
}
- .mshell .multi_radio_textEntry span.radioTxt{
+ .mshell .multi_radio_textEntry span.radioTxt {
top: -4px;
}
- .mshell span.radioTxt{
+ .mshell span.radioTxt {
display: inline;
}
- .mshell .radioBtn:after{
+ .mshell .radioBtn:after {
display: inline;
top: -4px;
}
.mshell .single_radio .radioBtn:after {
display: inherit;
}
- .mshell div[ng-controller="mRadioCtrl"] .status {
+ .mshell div[ng-controller="mRadioCtrl"] .status {
top: -6px;
right: 3px;
position: absolute;
@@ -2014,7 +1806,7 @@ should_be:parent {
line-height: 24px;
padding: 2px 6px;
}
- .mshell .mRadioTextCtrl .qTxt input{
+ .mshell .mRadioTextCtrl .qTxt input {
margin: 0;
float: left;
clear: both;
@@ -2026,7 +1818,7 @@ should_be:parent {
left: 40px;
}
.mshell .multi_radio_textEntry input[type="text"] {
- float:left;
+ float: left;
margin: 0px;
}
.mshell .mRadioTextCtrl .questionSet .feedback {
@@ -2044,31 +1836,31 @@ should_be:parent {
.mshell div[ng-controller="mRadioCtrl"] .radioC .radioBtn:last-child .status {
right: -25px;
}
- .mshell .radioBtn:last-child:after{
+ .mshell .radioBtn:last-child:after {
display: none;
}
- .mshell div[ng-controller="mRadioCtrl"] .radioBtn:first-child .status{
+ .mshell div[ng-controller="mRadioCtrl"] .radioBtn:first-child .status {
right: 2px;
}
/*.qTxt:not(.correction .qTxt){
float: none;
}*/
- .mshell .rwDiv{
+ .mshell .rwDiv {
display: none;
}
- .mshell .qTxt{
+ .mshell .qTxt {
margin-top: 10px;
- width:100%;
+ width: 100%;
}
.mshell .multi_radio_textEntry .questionSet:before {
- top:10px;
+ top: 10px;
}
.mshell .mRadioCtrl .qTxt {
width: 100%;
}
- .mshell .multi_radio_textEntry .radioTxtEntry{
+ .mshell .multi_radio_textEntry .radioTxtEntry {
float: left;
- clear:both;
+ clear: both;
margin: 0px;
}
.mshell .radioC {
@@ -2078,12 +1870,12 @@ should_be:parent {
float: left;
clear: both;
}
- .mshell .radioC :last-child{
+ .mshell .radioC :last-child {
margin-bottom: 0px;
}
//.mshell .radioC .radioBtn:first-child {
- // margin-right: 19px;
- // }
+ // margin-right: 19px;
+ // }
.mshell .radioC .radioBtn {
margin-right: 19px;
}
@@ -2092,78 +1884,73 @@ should_be:parent {
}
/* Drag n drop*/
.mshell .dragC {
- // clear: both;
+ // clear: both;
//width: 100%;
}
- .mshell .dnd .drags{
+ .mshell .dnd .drags {
margin: 0 0px 10px 0;
}
- .mshell ng-drop.ui-droppable{
+ .mshell ng-drop.ui-droppable {
//clear: both;
- // margin-left: 23px;
+ // margin-left: 23px;
//margin-bottom: 10px;
}
- .summary .options:empty{
+ .summary .options:empty {
display: none;
}
/* Drag n drop End*/
/* Learning record*/
- .mshell .lrnBtnC{
+ .mshell .lrnBtnC {
clear: both;
}
-
- }
+}
/*---Overwrite responsive css---*/
-.responsive_entry_center_wrap > #main_column{
- padding:0px !important;
- margin-bottom: 0;
-}
-.main-container {
- padding:0px !important;
+.responsive_entry_center_wrap > #main_column {
+ padding: 0px !important;
+ margin-bottom: 0;
}
+
.responsive_entry_center_wrap {
- padding:0px !important;
+ padding: 0px !important;
}
.responsive_row {
//margin-bottom: 0px;
}
-.responsive_entry_center_right{
+.responsive_entry_center_right {
//margin-bottom: 18px;
}
-.responsive_container{
+.responsive_container {
//margin-bottom: 0px;
}
-@media only screen and (max-width: 350px){
+@media only screen and (max-width: 350px) {
.mshell .gapFill {
- max-width:245px !important
+ max-width: 245px !important;
}
}
-@media only screen and (max-width: 530px){
+@media only screen and (max-width: 530px) {
.mshell .gapFill {
- max-width:350px
+ max-width: 350px;
}
}
-@media only screen and (max-width: 490px){
+@media only screen and (max-width: 490px) {
.mshell .gapFill {
- max-width:225px
+ max-width: 225px;
}
}
-@media screen and (max-width: 761px) and (min-width: 261px){
+@media screen and (max-width: 761px) and (min-width: 261px) {
.mshell .gap .ques {
- width:auto !important;
+ width: auto !important;
}
}
-@media screen and (max-width: 388px)
-{
-.mshell .tableTitle span {
- width: 89px;
-}
-.mshell .lrnBtn {
- width: 87px;
-}
-
+@media screen and (max-width: 388px) {
+ .mshell .tableTitle span {
+ width: 89px;
+ }
+ .mshell .lrnBtn {
+ width: 87px;
+ }
}
/*---Overwrite responsive css end---*/
/*
diff --git a/templates/correction.html b/templates/correction.html
index 0f393d4..8bd995c 100644
--- a/templates/correction.html
+++ b/templates/correction.html
@@ -10,23 +10,23 @@
-
+