TD-4322 fixing Mobile View issue

Author: sherif-olaboye

DigitalLearningSolutions.Web/Views/Supervisor/ReviewSelfAssessment.cshtml

@@ -30,8 +30,8 @@
                 <li class="nhsuk-breadcrumb__item"><a class="nhsuk-breadcrumb__link trigger-loader" asp-controller="Supervisor" asp-action="MyStaffList">My Staff</a></li>
                 <li class="nhsuk-breadcrumb__item">
                     <a class="nhsuk-breadcrumb__link trigger-loader" asp-controller="Supervisor"
-                   asp-action="DelegateProfileAssessments"
-                   asp-route-supervisorDelegateId="@ViewContext.RouteData.Values["supervisorDelegateId"]">
+                       asp-action="DelegateProfileAssessments"
+                       asp-route-supervisorDelegateId="@ViewContext.RouteData.Values["supervisorDelegateId"]">
                         @Model.SupervisorDelegateDetail.FirstName @Model.SupervisorDelegateDetail.LastName
                     </a>
                 </li>
@@ -44,15 +44,15 @@
             @if (ViewBag.navigatedFrom)
             {
                 <a class="nhsuk-breadcrumb__backlink" asp-controller="Supervisor"
-           asp-action="Index">
+                   asp-action="Index">
                     Back to Supervisor Dashboard
                 </a>
             }
             else
             {
                 <a class="nhsuk-breadcrumb__backlink" asp-controller="Supervisor"
-           asp-action="DelegateProfileAssessments"
-           asp-route-supervisorDelegateId="@ViewContext.RouteData.Values["supervisorDelegateId"]">
+                   asp-action="DelegateProfileAssessments"
+                   asp-route-supervisorDelegateId="@ViewContext.RouteData.Values["supervisorDelegateId"]">
                     Back to @Model.SupervisorDelegateDetail.FirstName @Model.SupervisorDelegateDetail.LastName
                 </a>
             }
@@ -86,23 +86,23 @@
         @if (!Model.ExportToExcelHide)
         {
             <a class="nhsuk-button nhsuk-button--secondary"
-           asp-route-candidateAssessmentId="@Model.CandidateAssessmentId"
-           asp-route-selfAssessmentName="@Model.DelegateSelfAssessment.RoleName"
-           asp-route-delegateUserID="@Model.DelegateSelfAssessment.DelegateUserID"
-           asp-route-delegateName="@Model.SupervisorDelegateDetail.FirstName @Model.SupervisorDelegateDetail.LastName"
-           asp-action="ExportCandidateAssessment"
-           role="button">
+               asp-route-candidateAssessmentId="@Model.CandidateAssessmentId"
+               asp-route-selfAssessmentName="@Model.DelegateSelfAssessment.RoleName"
+               asp-route-delegateUserID="@Model.DelegateSelfAssessment.DelegateUserID"
+               asp-route-delegateName="@Model.SupervisorDelegateDetail.FirstName @Model.SupervisorDelegateDetail.LastName"
+               asp-action="ExportCandidateAssessment"
+               role="button">
                 Export to Excel
             </a>
         }
 
         @if (ViewBag.CanViewCertificate)
         {
             <a class="nhsuk-button"
-           asp-route-candidateAssessmentId="@Model.CandidateAssessmentId"
-           asp-action="CompetencySelfAssessmentCertificatesupervisor"
-           asp-route-supervisorDelegateId="@Model.SupervisorDelegateDetail.ID"
-           role="button">
+               asp-route-candidateAssessmentId="@Model.CandidateAssessmentId"
+               asp-action="CompetencySelfAssessmentCertificatesupervisor"
+               asp-route-supervisorDelegateId="@Model.SupervisorDelegateDetail.ID"
+               role="button">
                 Certificate
             </a>
         }
@@ -163,50 +163,60 @@
                 {
                     <tr role="row" class="nhsuk-table__row first-row">
                         <td role="cell" rowspan="@competency.AssessmentQuestions.Count()" class="nhsuk-table__cell">
-                            @if(competency.Optional)
-                            {
-                                <partial name="Shared/_TagRow"/>
-                            }
-                            <b> <span class="nhsuk-table-responsive__heading">@competency.Vocabulary </span></b>
-                            <partial name="_CompetencyFlags" model="competency.CompetencyFlags" />
-                            @if (competency.Description != null && !competency.AlwaysShowDescription)
-                            {
-                                <details class="nhsuk-details">
-                                    <summary class="nhsuk-details__summary">
-                                        <h2 class="nhsuk-u-font-size-24 nhsuk-u-margin-bottom-0">
-                                            <span class="nhsuk-details__summary-text">
-                                                @competency.Name
-                                            </span>
+                            <span class="nhsuk-table-responsive__heading">@competency.Vocabulary </span>
+                            <div class="nhsuk-grid-row">
+                                <div class="nhsuk-grid-column-full">
+                                    @if (competency.Optional)
+                                    {
+                                        <partial name="Shared/_TagRow" />
+                                    }
+                                </div>
+                                <div class="nhsuk-grid-column-full">
+                                    <partial name="_CompetencyFlags" model="competency.CompetencyFlags" />
+                                </div>
+                                <div class="nhsuk-grid-column-full">
+
+                                    @if (competency.Description != null && !competency.AlwaysShowDescription)
+                                    {
+                                        <details class="nhsuk-details">
+                                            <summary class="nhsuk-details__summary">
+                                                <h2 class="nhsuk-u-font-size-24 nhsuk-u-margin-bottom-0">
+                                                    <span class="nhsuk-details__summary-text">
+                                                        @competency.Name
+                                                    </span>
+                                                </h2>
+                                            </summary>
+                                            <div class="nhsuk-details__text">
+                                                @(Html.Raw(@competency.Description))
+                                            </div>
+                                        </details>
+                                    }
+                                    else
+                                    {
+                                        <h2 class="nhsuk-u-margin-bottom-0 nhsuk-u-font-size-24">
+                                            @competency.Name
                                         </h2>
-                                    </summary>
-                                    <div class="nhsuk-details__text">
-                                        @(Html.Raw(@competency.Description))
-                                    </div>
-                                </details>
-                            }
-                            else
-                            {
-                                <h2 class="nhsuk-u-margin-bottom-0 nhsuk-u-font-size-24">
-                                    @competency.Name
-                                </h2>
-                                @if (competency.Description != null)
-                                {
-                                    <p class="nhsuk-body-l">
-                                        @(Html.Raw(competency.Description))
-                                    </p>
-                                }
-                            }
+                                        @if (competency.Description != null)
+                                        {
+                                            <p class="nhsuk-body-l">
+                                                @(Html.Raw(competency.Description))
+                                            </p>
+                                        }
+                                    }
+                                </div>
+
+                            </div>
                         </td>
                         <partial name="Shared/_AssessmentQuestionReviewCells"
-                     model="competency.AssessmentQuestions.First()"
-                     view-data="@(new ViewDataDictionary(ViewData) {{ "isSupervisorResultsReviewed", Model.IsSupervisorResultsReviewed }, { "ReviewerCommentsLabel", Model.DelegateSelfAssessment.ReviewerCommentsLabel} } )" />
+                                 model="competency.AssessmentQuestions.First()"
+                                 view-data="@(new ViewDataDictionary(ViewData) {{ "isSupervisorResultsReviewed", Model.IsSupervisorResultsReviewed }, { "ReviewerCommentsLabel", Model.DelegateSelfAssessment.ReviewerCommentsLabel} } )" />
                     </tr>
                     @foreach (var question in competency.AssessmentQuestions.Skip(1))
                     {
                         <tr role="row" class="nhsuk-table__row">
                             <partial name="Shared/_AssessmentQuestionReviewCells"
-                     model="question"
-                     view-data="@(new ViewDataDictionary(ViewData) {{ "isSupervisorResultsReviewed", Model.IsSupervisorResultsReviewed }, { "ReviewerCommentsLabel", Model.DelegateSelfAssessment.ReviewerCommentsLabel} } )" />
+                                     model="question"
+                                     view-data="@(new ViewDataDictionary(ViewData) {{ "isSupervisorResultsReviewed", Model.IsSupervisorResultsReviewed }, { "ReviewerCommentsLabel", Model.DelegateSelfAssessment.ReviewerCommentsLabel} } )" />
                         </tr>
                     }
                 }