victory

package.json

@@ -31,6 +31,7 @@
     "react-select": "^5.8.0",
     "react-slick": "^0.30.2",
     "sass": "^1.77.6",
+    "victory": "^37.0.2",
     "yarn": "^1.22.22"
   },
   "devDependencies": {

src/contents/example.tsx

@@ -122,6 +122,40 @@ export function Example() {
             </div>
         </div>
         <hr/>
+        <div className="col exercise">
+            <div className="row align-items-center">
+                <div className="col"><h4>Collapsible</h4></div>
+                <div className="col-1 "><div className="example-medium-tag">Medium</div></div>
+            </div>
+            <i><h6>By </h6></i>
+            <div className="example-exercise">
+            <p> a. Use our Collapsible component to create a collapsible.</p>
+            <p> b. The collapsible should contain three circles with a few words in a row (our Circle component) </p>
+            </div>
+        </div>
+        <hr/> 
+        <div className="col exercise">
+            <div className="row align-items-center">
+                <div className="col"><h4> </h4></div>
+                <div className="col-1 "><div className="example-easy-tag"></div></div>
+            </div>
+            <i><h6>By </h6></i>
+            <div className="example-exercise">
+            <p> </p>
+            </div>
+        </div>
+        <hr/>
+{/*         <div className="col exercise">
+            <div className="row align-items-center">
+                <div className="col"><h4> </h4></div>
+                <div className="col-1 "><div className="example-easy-tag"></div></div>
+            </div>
+            <i><h6>By </h6></i>
+            <div className="example-exercise">
+            <p> </p>
+            </div>
+        </div>
+        <hr/> */}