CHANGES: Added unoptimized progress bar inside <Slider> component

FIXED: Some styles

app/page.tsx

@@ -61,7 +61,7 @@ export default function Page() {
                                 <Button icon={'add'} iconPlace={'right'}>
                                     Label 2
                                 </Button>
-                                <SegmentedButtons>
+                                <SegmentedButtons toggled={true}>
                                     <SegmentButton
                                         fillIcon={1}
                                         icon={'change_history'}
@@ -80,7 +80,26 @@ export default function Page() {
                                     </SegmentButton>
                                 </SegmentedButtons>
                                 <Checkbox />
-                                <Slider />
+                                <Slider
+                                    defaultValue={0}
+                                    max={100}
+                                    min={0}
+                                    options={[0, 10, 20, 100]}
+                                />
+                                <Slider defaultValue={0} max={100} min={0} />
+                                <div>
+                                    <input
+                                        list={'lol'}
+                                        max={100}
+                                        min={0}
+                                        type={'range'}
+                                    />
+                                    <datalist id={'lol'}>
+                                        <option value={0} />
+                                        <option value={50} />
+                                        <option value={100} />
+                                    </datalist>
+                                </div>
                             </div>
                         </CardFooter>
                     </Card>