Merge pull request #25 from TartejBrothers/Changes

Added Attendance Page

src/App.js

@@ -1,6 +1,7 @@
 import HomePage from "./components/home";
 import ProjectPage from "./components/project";
 import OdPage from "./components/od";
+import AttendancePage from "./components/attendance";
 import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
 
 function App() {
@@ -10,6 +11,7 @@ function App() {
         <Routes>
           <Route path="/" element={<HomePage />} />
           <Route path="/project" element={<ProjectPage />} />
+          <Route path="/attendance" element={<AttendancePage />} />
           <Route path="/home" element={<HomePage />} />
           <Route path="/od" element={<OdPage />} />
         </Routes>

src/components/attendance.jsx

@@ -0,0 +1,47 @@
+import React from "react";
+import "./styles/global.css";
+import "./styles/attendance.css";
+import { Link } from "react-router-dom";
+export default function AttendancePage() {
+  return (
+    <div className="attendancecontent">
+      <h1>
+        SRM ATTEND<font color="#00ADB5">EASE</font>
+      </h1>
+      <div className="attendancebody">
+        <p>Current Attendance</p>
+        <div className="attendancerecords">
+          <div className="attendanceheader">
+            <div className="attendancecolumns">Subject</div>
+            <div className="attendancecolumns">Attendance</div>
+            <div className="attendancecolumns">Margin</div>
+            <div className="attendancecolumns">Required</div>
+          </div>
+          <div className="attendancerows">
+            <div className="attendancecolumns">Mathematics</div>
+            <div className="attendancecolumns">78%</div>
+            <div className="attendancecolumns">2</div>
+            <div className="attendancecolumns">0</div>
+          </div>
+          <div className="attendancerows">
+            <div className="attendancecolumns">Chemistry</div>
+            <div className="attendancecolumns">89%</div>
+            <div className="attendancecolumns">3</div>
+            <div className="attendancecolumns">3</div>
+          </div>
+          <div className="attendancerows">
+            <div className="attendancecolumns">Physics</div>
+            <div className="attendancecolumns">72%</div>
+            <div className="attendancecolumns">3</div>
+            <div className="attendancecolumns">3</div>
+          </div>
+        </div>
+      </div>
+      <Link to="/projects">
+        <button className="submitbutton calculatebutton">
+          Check Your Atttendance With OD/ML
+        </button>
+      </Link>
+    </div>
+  );
+}