Course page2 (#36)

* added loader

* Course page merged with main

* fav button fixed

* show less/more

---------

Co-authored-by: Sami Al Saati <sami.alsaati@hotmail.com>
Co-authored-by: Kacper Lisik <lisik@kth.se>

Author: LSKpr

my-app/src/views/CourseView.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import PrerequisiteTree from "./PrerequisiteTree.jsx";
+
 // import {model} from '/src/model.js';
 
 export default function CourseView({ course }) {
@@ -49,12 +50,14 @@ export default function CourseView({ course }) {
                 <p className="text-lg text-slate-700 leading-7">Here would be some reviews of the course...</p>
             </div>
 
+
             {/* Prerequisite Graph Tree Section */}
             <div style={{ display: 'flex', flexDirection: 'column', marginBottom: '20px' }}>
                 <h3 style={{ fontFamily: 'Courier New, monospace', fontSize: '24px' }}>Prerequisite Graph Tree</h3>
                 {/* Placeholder for graph tree */}
                 <PrerequisiteTree />
             </div>
+
         </div>
     );
 }

my-app/src/views/ListView.jsx

@@ -53,7 +53,10 @@ function ListView(props) {
                             {course.description.length > 150 && (
                                 <span
                                     className="text-blue-500 cursor-pointer"
-                                    onClick={() => toggleReadMore(course.code)}
+                                    onClick={(e) => {
+                                        e.stopPropagation();  // Prevent the event from bubbling up.
+                                        toggleReadMore(course.code);
+                                    }}
                                 >
                                     {readMoreState[course.code]
                                         ?