Merge pull request #270 from sas-fossdev/fix-center-category

fixed css for category weighting

Author: Suhas Hariharan

src/js/components/CategoryWeighting.vue

@@ -61,7 +61,7 @@
                 </tr>
             </tbody>
         </table>
-        <button style="margin-left: 1.6%" @click="addCategory();">
+        <button style="margin-left: 20px" @click="addCategory();">
             Add Category
         </button>
         <label v-if="categorySum != 100">Category weightings do not sum to 100%</label>
@@ -71,8 +71,8 @@
         >
             Save Weighting
         </button>
-        <h2 v-if="categorySum==100">{{ hypo.grade }} ({{ hypo.fp }})</h2>
-        <br><br>
+        <h2 v-if="categorySum==100">{{ hypo.grade }} ({{ hypo.fp }})<br></h2>
+        <div v-if="categorySum!=100"><br></div>
         <p>Note: Since teachers can adjust the weighting of each assignment as well, this number is not necessarily accurate. In addition, early in the year some categories(i.e the exam category) may contain no grades and the percentages would need to be adjusted accordingly.</p>
     </div>
 </template>

src/js/saspowerschoolff.js

@@ -121,7 +121,7 @@ function class_page () {
     addHypoAssignment(number);
     addVueGrades();
 
-    document.querySelector('div.box-round').insertAdjacentHTML('afterend', `<select id='hypo-select'><option value='none'>Hypothetical Assigment Mode</option><option value='single'>Add Single Assignment</option><option value='category'>Category Weighting (beta)</option></select>`);
+    document.querySelector('div.box-round').insertAdjacentHTML('afterend', `<select style="margin-left:20px; text-align-last: center; border-radius: 4px;" id='hypo-select'><option value='none'>Hypothetical Assigment Mode</option><option value='single'>Add Single Assignment</option><option value='category'>Category Weighting (beta)</option></select>`);
     gt.setCategoryWeighting(false);
     document.getElementById('saspes-hypo-assignment').style.display = "none";
     document.getElementById('saspes-categories').style.display = "none";