New CSS to make it look better, fetch filters way better now

This commit is contained in:
2023-04-18 18:54:59 -05:00
parent d96f0aef12
commit c0e8935104
3 changed files with 37 additions and 27 deletions

View File

@@ -1,36 +1,46 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset='utf-8'> <meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'> <meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>UT Grade Viewer</title> <title>UT Grade Viewer</title>
<meta name='viewport' content='width=device-width, initial-scale=1'> <meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' type='text/css' media='screen' href='main.css'> <link rel='stylesheet' type='text/css' media='screen' href='main.css'>
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.4.1/papaparse.min.js" <script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.4.1/papaparse.min.js"
integrity="sha512-dfX5uYVXzyU8+KHqj8bjo7UkOdg18PaOtpa48djpNbZHwExddghZ+ZmzWT06R5v6NSk3ZUfsH6FNEDepLx9hPQ==" integrity="sha512-dfX5uYVXzyU8+KHqj8bjo7UkOdg18PaOtpa48djpNbZHwExddghZ+ZmzWT06R5v6NSk3ZUfsH6FNEDepLx9hPQ=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script> crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head> </head>
<body> <body>
<div class="bg"></div> <div class="bg"></div>
<div class="bg-text"> <div class="bg-text">
<p>
Keep course names as close to the
<a href="https://registrar.utexas.edu/schedules">official course name</a>
as possible
</p>
<!-- Data is separated into course number, course prefi;x, and course name--> <!-- Data is separated into course number, course prefi;x, and course name-->
<label for="courseField">Course Field (Ex: "MUS"):</label> <label for="courseField">Course Field (Ex: "MUS"):</label>
<input type="text" id="courseField" name="fname"><br><br> <input type="text" id="courseField" name="fname"><br><br>
<label for="courseNum">Course Number (Ex: "307"):</label> <label for="courseNum">Course Number (Ex: "307"):</label>
<input type="text" id="courseNum" name="fname"><br><br> <input type="text" id="courseNum" name="fname"><br><br>
<label for="courseName">Course Name (Ex: "JAZZ APPRECIATION-WB"):</label> <label for="courseName">Course Name (Ex: "Jazz Appreciation"):</label>
<input type="text" id="courseName" name="fname"><br><br> <input type="text" id="courseName" name="fname"><br><br>
<label for="courseInstructor">Instructor (Optional)</label>
<input type="text" id="courseInstructor" name="fname"><br><br>
<form> <form>
<label for="dropdown">Semester (work in progress):</label> <label for="dropdown">Semester (work in progress):</label>
<select id="dropdown" name="dropdown"> <select id="dropdown" name="dropdown">
<option value="option1">Fall 2022</option> <option value="option1">Fall 2022</option>
<option value="option2">Spring 2022</option> <option value="option2">Spring 2022</option>
<option value="option3">Fall 2021</option> <option value="option3">Fall 2021</option>
</select> </select>
<br><br> <br><br>
</form> </form>
<button type="submit" id = "subBut">Submit</button> <button type="submit" id="subBut">Submit</button>
</div> </div>
<script src='main.js'></script> <script src='main.js'></script>
</body> </body>
</html> </html>

View File

@@ -4,8 +4,8 @@
/* General Styles */ /* General Styles */
body { body {
font-family: 'Helvetica Neue', sans-serif; font-family: 'Helvetica Neue', sans-serif;
background-color: #f7f7f7; background: rgb(27,26,42);
color: #333333; background: linear-gradient(90deg, rgba(27,26,42,1) 0%, rgba(61,87,92,1) 100%);
} }
a { a {
@@ -75,7 +75,7 @@ body {
/* Footer Styles */ /* Footer Styles */
footer { footer {
background-color: #333333; background-color: #2e2d2d;
color: #ffffff; color: #ffffff;
padding: 20px; padding: 20px;
text-align: center; text-align: center;
@@ -110,7 +110,7 @@ body {
/* Position text in the middle of the page/image */ /* Position text in the middle of the page/image */
.bg-text { .bg-text {
background-color: rgb(0,0,0); /* Fallback color */ background-color: rgb(0, 0, 0); /* Fallback color */
background-color: rgba(0,0,0, 0.4); /* opacity/see-through */ background-color: rgba(0,0,0, 0.4); /* opacity/see-through */
color: white; color: white;
font-weight: bold; font-weight: bold;

View File

@@ -33,7 +33,7 @@ async function PapaParse(department, num, name) {
.then(() => { .then(() => {
console.log(cData); console.log(cData);
}); });
const selectedClass = cData.filter(cData => cData["Course Title"] == name); const selectedClass = cData.filter(cData => cData["Course Title"].includes(name.toUpperCase()));
console.log(selectedClass); console.log(selectedClass);
} }