Resolved merge conflicts between main and feature branch

Rakesh9100 · Jun 5, 2024 · 0fabbbb · 0fabbbb
1 parent f918362
commit 0fabbbb
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 11 deletions.
diff --git a/Calculators/Grade-Calculator/index.html b/Calculators/Grade-Calculator/index.html
@@ -18,12 +18,16 @@
     <div id="absolute" class="calculator-container">
         <h2>Absolute Grade Calculator</h2>
 
-        <div class="subjectFields">
+        <div class="subjectFields" id="subjectFields">
             <label for="subject1">Enter marks for Subject 1:</label>
-            <input type="text" id="subject1" class="marks" placeholder="Enter marks (e.g., 85/100)">
+            <div class="subject-container" id="subject-container-1">
+                <input type="text" id="subject1" class="marks" placeholder="Enter marks (e.g., 85/100)">
+                <button type="button" class="remove-subject" onclick="removeSubjectField(1)">X</button>
+            </div>
+
         </div>
 
-        <button onclick="addSubjectField('abs')">Add Another Subject</button>
+        <button onclick="addSubjectField()">Add Another Subject</button>
         <button onclick="calculateAbsGrade()">Calculate Grade</button>
 
         <p class="result"></p>
@@ -32,14 +36,14 @@ <h2>Absolute Grade Calculator</h2>
     <div id="relative" class="calculator-container">
         <h2>Relative Grade Calculator</h2>
 
-        <div class="subjectFields">
-            <label for="subject1">Enter marks for Subject 1:</label>
-            <input type="text" id="subject1" class="marks" placeholder="Enter marks (e.g., 85,100)">
+        <div class="subjectFieldsrelative">
+            <label for="subject1relative">Enter marks for Subject 1:</label>
+            <input type="text" id="subject1relative" class="marks" placeholder="Enter marks (e.g., 85/100)">
 
-            <label for="subject1">Enter mean for Subject 1:</label>
+            <label for="subject1relative">Enter mean for Subject 1:</label>
             <input type="text" id="mean1" class="marks" placeholder="Enter mean">
 
-            <label for="subject1">Enter standard deviation for Subject 1:</label>
+            <label for="subject1relative">Enter standard deviation for Subject 1:</label>
             <input type="text" id="std1" class="marks" placeholder="Enter standard deviation">
         </div>
 

diff --git a/Calculators/Grade-Calculator/script.js b/Calculators/Grade-Calculator/script.js
@@ -11,6 +11,44 @@ function openPage(calcName, element) {
 // Get the element with id="defaultOpen" and click on it
 document.getElementById("defaultOpen").click();
 
+function addSubjectField() {
+    var subjectFields = document.getElementById('subjectFields');
+    var subjectNumber = subjectFields.children.length / 2 + 1;
+
+    var label = document.createElement('label');
+    label.setAttribute('for', 'subject' + subjectNumber);
+    label.textContent = 'Enter marks for Subject ' + subjectNumber + ':';
+
+    var container = document.createElement('div');
+    container.setAttribute('class', 'subject-container');
+    container.setAttribute('id', 'subject-container-' + subjectNumber);
+
+    var input = document.createElement('input');
+    input.setAttribute('type', 'text');
+    input.setAttribute('id', 'subject' + subjectNumber);
+    input.setAttribute('class', 'marks');
+    input.setAttribute('placeholder', 'Enter marks (e.g., 85/100)');
+
+    var removeButton = document.createElement('button');
+    removeButton.setAttribute('type', 'button');
+    removeButton.setAttribute('class', 'remove-subject');
+    removeButton.textContent = 'X';
+    removeButton.onclick = function() {
+        removeSubjectField(subjectNumber);
+    };
+
+    container.appendChild(input);
+    container.appendChild(removeButton);
+
+    subjectFields.appendChild(label);
+    subjectFields.appendChild(container);
+}
+function removeSubjectField(subjectNumber) {
+    var container = document.getElementById('subject-container-' + subjectNumber);
+    var label = container.previousElementSibling;
+    container.remove();
+    label.remove();
+}
 function calculateRelGrade() {
     // Get marks, mean and std for each subject
     let marksInputs = document.querySelectorAll('#relative .marks');
@@ -23,7 +61,7 @@ function calculateRelGrade() {
         return;
     }
 
-    let marks = marksInputs[0].value.split(',').map(function (item) {
+    let marks = marksInputs[0].value.split('/').map(function (item) {
         return parseFloat(item);
     });
 
@@ -72,7 +110,7 @@ function calculateAbsGrade() {
 
     // Calculate total points and total obtained points
     for (var i = 0; i < marksInputs.length; i++) {
-        var marks = marksInputs[i].value.split(',').map(function (item) {
+        var marks = marksInputs[i].value.split('/').map(function (item) {
             return parseFloat(item);
         });
 

diff --git a/Calculators/Grade-Calculator/style.css b/Calculators/Grade-Calculator/style.css
@@ -72,6 +72,8 @@ input {
     padding: 8px;
     box-sizing: border-box;
     width: 100%;
+    margin-top:0rem;
+    margin-left: 2rem;
 }
 
 button {
@@ -145,4 +147,22 @@ p {
         max-width: none;
         /* Removed max-width for smaller screens */
     }
-}
+}
+.subject-container {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+}
+.remove-subject {
+    background-color: rgb(142, 131, 131);
+    color: white;
+    border: none;
+    padding: 5px 10px;
+    cursor: pointer;
+    margin-top: 0rem;
+    margin-right:2rem;
+}
+
+.remove-subject:hover {
+    background-color: rgb(221, 138, 138);
+}