Mobile 1987

www/addons/mod/assign/directives/submission.js

@@ -222,7 +222,8 @@ angular.module('mm.addons.mod_assign')
                     originalGrades.applyToAll = true;
                 }
                 if (assign.markingworkflow && scope.grade.gradingStatus) {
-                    scope.workflowStatusTranslationId =  getSubmissionGradingStatusTranslationId(scope.grade.gradingStatus);
+                    scope.workflowStatusTranslationId =
+                        $mmaModAssign.getSubmissionGradingStatusTranslationId(scope.grade.gradingStatus);
                 }
 
                 if (!scope.feedback) {

www/addons/mod/chat/scss/styles.scss

@@ -33,4 +33,14 @@ $mma-chat-notice-badge: "stable" !default;
 
 .mma-chat-reconnect-button, .button.mma-chat-reconnect-button {
   margin: 0;
+}
+
+.mma-mod_chat-users-modal {
+  .item-complex .item-avatar {
+    padding-bottom: 0;
+
+    .tabs {
+      border: 0;
+    }
+  }
 }

www/addons/mod/chat/templates/chat.html

@@ -39,7 +39,7 @@ <h2>{{ message.userfullname }}</h2>
                     </div>
                 </div>
 
-                <div ng-if="!messages || messages.length <= 0">
+                <div class="padding" ng-if="!messages || messages.length <= 0">
                     <p>{{ 'mma.mod_chat.nomessages' | translate}}</p>
                 </div>
             </section>

www/addons/mod/chat/templates/users.html

@@ -3,23 +3,23 @@
       <h1 class="title">{{ 'mma.mod_chat.currentusers' | translate }}</h1>
       <button class="button button-icon ion-close-round" ng-click="closeModal()" aria-label="{{ 'mm.core.close' | translate }}"></button>
     </ion-header-bar>
-    <ion-content padding="true">
+    <ion-content>
         <mm-loading hide-until="usersLoaded">
             <ul class="list">
-                <li ng-repeat="user in chatUsers" class="card">
+                <li ng-repeat="user in chatUsers" class="item-complex">
                     <div class="item item-avatar">
                         <img ng-src="{{user.profileimageurl}}" alt="{{ 'mm.core.pictureof' | translate:{$a: user.fullname} }}" mm-external-content>
                         <mm-format-text>{{user.fullname}}</mm-format-text>
-                    </div>
-                    <div class="item tabs tabs-secondary tabs-icon-left" ng-if="currentUserId != user.id && !isAppOffline()">
-                        <a class="tab-item" ng-click="talkTo(user.fullname)">
-                            <i class="icon ion-chatbox"></i>
-                            {{ 'mma.mod_chat.talk' | translate}}
-                        </a>
-                        <a class="tab-item" ng-click="beepTo(user.id)">
-                            <i class="icon ion-ios-bell"></i>
-                            {{ 'mma.mod_chat.beep' | translate}}
-                        </a>
+                        <div class="item tabs tabs-secondary tabs-icon-left" ng-if="currentUserId != user.id && !isAppOffline()">
+                            <a class="tab-item" ng-click="talkTo(user.fullname)">
+                                <i class="icon ion-chatbox"></i>
+                                {{ 'mma.mod_chat.talk' | translate}}
+                            </a>
+                            <a class="tab-item" ng-click="beepTo(user.id)">
+                                <i class="icon ion-ios-bell"></i>
+                                {{ 'mma.mod_chat.beep' | translate}}
+                            </a>
+                        </div>
                     </div>
                 </li>
             </ul>

www/addons/mod/forum/scss/styles.scss

@@ -13,6 +13,10 @@
     border-style: solid;
 }
 
+.mma-forum-reply-edit {
+    padding: $item-padding/2;
+}
+
 .mm-site_mod_forum, .mm-site_mod_forum-discussion {
     .item.item-heading {
         padding-bottom: 2px;

www/addons/mod/forum/templates/newdiscussion.html

@@ -1,9 +1,9 @@
 <ion-view view-title="{{ 'mma.mod_forum.addanewdiscussion' | translate }}">
-    <ion-content padding="true" mm-state-class delegate-handle="mmaModForumNewDiscussion">
+    <ion-content mm-state-class delegate-handle="mmaModForumNewDiscussion">
         <ion-refresher pulling-text="{{ 'mm.core.pulltorefresh' | translate }}" ng-if="groupsLoaded" on-refresh="refreshGroups()">
         </ion-refresher>
         <mm-loading hide-until="groupsLoaded">
-            <form ng-if="showForm" class="list mma-forum-border">
+            <form ng-if="showForm" class="list">
                 <ion-input class="item item-input item-stacked-label">
                     <ion-label>{{ 'mma.mod_forum.subject' | translate }}</ion-label>
                     <input type="text" placeholder="{{ 'mma.mod_forum.subject' | translate }}" ng-model="newDiscussion.subject">

www/addons/mod/survey/templates/index.html

@@ -27,11 +27,11 @@
             </div>
 
             <!-- Survey questions -->
-            <section class="card padding" ng-if="!survey.surveydone && !hasOffline && questions && questions.length">
+            <section ng-if="!survey.surveydone && !hasOffline && questions && questions.length">
                 <div ng-repeat="question in questions">
                     <!-- Parent question (Category header) -->
                     <div ng-if="question.multi && question.multi.length" ng-class="{'mma-mod_survey-padding-top': !$first}">
-                        <h2>{{ question.text }}</h2>
+                        <h3 class="padding-horizontal">{{ question.text }}</h3>
                         <div class="row" ng-if="isTablet">
                             <div class="col col-50">{{ 'mma.mod_survey.responses' | translate }}</div>
                             <div class="col text-center" ng-repeat="option in question.options">
@@ -51,7 +51,7 @@ <h2>{{ question.text }}</h2>
                                 <input type="radio" name="{{question.name}}" ng-model="answers[question.name]" ng-value="$index + 1" aria-labelledby="mma-mod_survey-{{question.name}}">
                             </div>
                             <!-- Phone view: select -->
-                            <div ng-if="!isTablet" class="col-40 text-center item-select">
+                            <div ng-if="!isTablet" class="col-40 item-select">
                                 <select class="mma-mod_survey-select" ng-model="answers[question.name]" ng-options="question.options.indexOf(o)+1 as o for o in question.options" aria-labelledby="mma-mod_survey-{{question.name}}" mm-ios-select-fix>
                                     <option class="mma-mod_survey-defaultoption" value="" disabled selected>{{ 'mm.core.choose' | translate }}</option>
                                 </select>
@@ -78,7 +78,7 @@ <h2>{{ question.text }}</h2>
                         </div>
                     </div>
                 </div>
-                <div>
+                <div class="padding">
                     <button class="button button-block" ng-click="submit()" ng-disabled="!isValidResponse()">{{ 'mma.mod_survey.clicktocontinue' | translate }}</button>
                 </div>
             </section>

www/addons/qtype/match/scss/styles.scss

@@ -1,7 +1,12 @@
 // Style match content a bit.
-.mma-qtype-match-container {
-  select {
+.mma-qtype-match-container .item-select {
+  select,
+  .mm-select-fix {
     padding: 0 36px 0 0;
     max-width: 100%;
+    display: flex;
+    justify-content:center;
+    align-content:center;
+    flex-direction:column;
   }
 }

www/addons/qtype/match/template.html

@@ -2,15 +2,17 @@
     <div class="item item-text-wrap">
         <p><mm-format-text watch="true" component="{{component}}" component-id="{{componentId}}">{{ question.text }}</mm-format-text></p>
     </div>
-	<div class="item item-text-wrap row mm-item-padding" ng-repeat="row in question.rows">
-		<div class="col">
-			<p><mm-format-text watch="true" id="mma-question-{{row.id}}" component="{{component}}" component-id="{{componentId}}">{{ row.text }}</mm-format-text></p>
-		</div>
-		<div class="col text-center item-select" ng-class='{"mm-question-answer-correct": row.isCorrect === 1, "mm-question-answer-incorrect": row.isCorrect === 0}'>
-			<label class="accesshide" for="{{row.id}}" ng-if="row.accessibilityLabel">{{ row.accessibilityLabel }}</label>
-			<select id="{{row.id}}" name="{{row.name}}" ng-disabled="row.disabled" aria-labelledby="mma-question-{{row.id}}" mm-ios-select-fix>
-				<option ng-repeat="o in row.options" value="{{o.value}}" label="{{o.label}}" ng-selected="{{o.selected}}">{{o.label}}</option>
-			</select>
-		</div>
-	</div>
+    <div class="item item-text-wrap row mm-item-padding" ng-repeat="row in question.rows">
+        <div class="col">
+            <p><mm-format-text watch="true" id="mma-question-{{row.id}}" component="{{component}}" component-id="{{componentId}}">{{ row.text }}</mm-format-text></p>
+        </div>
+        <div class="col" ng-class='{"item-select": !row.disabled, "mm-question-answer-correct": row.isCorrect === 1, "mm-question-answer-incorrect": row.isCorrect === 0}'>
+            <label class="accesshide" for="{{row.id}}" ng-if="row.accessibilityLabel">{{ row.accessibilityLabel }}</label>
+            <select id="{{row.id}}" name="{{row.name}}" ng-if="!row.disabled" aria-labelledby="mma-question-{{row.id}}" ng-options="option.label for option in row.options track by option.value" ng-model="row.selected" mm-ios-select-fix>
+            </select>
+            <p class="mm-select-fix" ng-if="row.selected && row.selected.label">
+                {{row.selected.label}}
+            </p>
+        </div>
+    </div>
 </section>

www/core/components/question/services/helper.js

@@ -687,6 +687,7 @@ angular.module('mm.core.question')
                 rowModel.id = select.id;
                 rowModel.name = select.name;
                 rowModel.disabled = select.disabled;
+                rowModel.selected = false;
                 rowModel.options = [];
 
                 // Check if answer is correct.
@@ -702,12 +703,17 @@ angular.module('mm.core.question')
                         log.warn('Aborting because couldn\'t find option value.', question.name);
                         return self.showDirectiveError(scope);
                     }
-
-                    rowModel.options.push({
+                    var opt = {
                         value: option.value,
                         label: option.innerHTML,
                         selected: option.selected
-                    });
+                    };
+
+                    if (opt.selected) {
+                        rowModel.selected = opt;
+                    }
+
+                    rowModel.options.push(opt);
                 });
 
                 // Get the accessibility label.

www/core/scss/styles.scss

@@ -155,14 +155,17 @@ p.item-text-wrap {
 .col-65 {
   @include flex(0, 0, 65%);
   max-width: 65%;
+  width: 65%;
 }
 .col-60 {
   @include flex(0, 0, 60%);
+  width: 60%;
   max-width: 60%;
 }
 .col-40 {
   @include flex(0, 0, 40%);
   max-width: 40%;
+  width: 40%;
 }
 
 // Media item, ideal for icons.
@@ -578,7 +581,7 @@ mm-navigation-bar {
 
 // When using .item and .row in the same element, .row's padding prevails. Use this class to keep .item's padding.
 .item.row.mm-item-padding {
-  padding: $item-padding;
+  padding: $item-padding / 2;
 }
 
 p.mm-error {
@@ -743,6 +746,28 @@ mm-timer {
   }
 }
 
+.item-select .mm-select-fix {
+  // Taken from .item-select select.
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  padding: 0 ($item-padding * 3) 0 $item-padding;
+  max-width: 65%;
+  width: 100%;
+  border: none;
+  background: $item-default-bg;
+  color: #333;
+  text-indent: .01px;
+  white-space: nowrap;
+  font-size: $font-size-base;
+  cursor: pointer;
+  direction: rtl; // right align the select text
+
+  pointer-events: none;
+}
+
+
 .item-input-inset .item-input-wrapper input,
 .item-input .item-input-wrapper input {
   width: 100%;
@@ -920,6 +945,7 @@ mm-timer {
 
   .input-label, .mm-textarea {
     padding-left: $item-padding;
+    padding-top: $item-padding/2;
   }
 }