From 27f3f824808003722b4f38a6feadfaee48269efb Mon Sep 17 00:00:00 2001 From: Miguel Urbina Date: Fri, 25 Apr 2025 11:01:14 -0600 Subject: [PATCH] Remove @mui/styles reference from readme file --- CHANGELOG.md | 14 +++++++++++--- README.md | 21 ++++++++++----------- 2 files changed, 21 insertions(+), 14 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e051a62..42bade5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog][Keep a Changelog] and this project adheres to [Semantic Versioning][Semantic Versioning]. +## [3.4.3] - *Apr 25 2025* + +### Removed + +* Remove no needed `@mui/styles` reference from README.md. ([@itsmeurbi]) + + ## [3.4.0 - 3.4.2] - *May 28 2022* ### Fixed @@ -42,7 +49,7 @@ The format is based on [Keep a Changelog][Keep a Changelog] and this project adh * Converted makeStyles into using styled helper ([@matyas-igor]) * Updated the file structure to be more readable ([@Learus]) -* **(Breaking)** Added `@mui/system` as peer dependency. +* **(Breaking)** Added `@mui/system` as peer dependency. * *Reason*: The newly added `sx` prop is of type `SxProps` imported from `@mui/system`. ### Removed @@ -61,7 +68,7 @@ This version is unpublished. Its changes are moving to version 3.2.0 among other ## [3.0.0] - *Oct 28 2021* -:fireworks::fire: React Material Ui Carousel has been fully refactored to use more modern react techniques such as hooks, functional components and other cool stuff. :fire::fireworks: +:fireworks::fire: React Material Ui Carousel has been fully refactored to use more modern react techniques such as hooks, functional components and other cool stuff. :fire::fireworks: In general, its usage does not change. ### Changed @@ -215,4 +222,5 @@ In general, its usage does not change. [@8BitAron]: https://github.com/8BitAron [@hamidreza-nateghi]: https://github.com/hamidreza-nateghi [@hajineats]: https://github.com/hajineats -[@aveloso4]: https://github.com/aveloso4 \ No newline at end of file +[@aveloso4]: https://github.com/aveloso4 +[@itsmeurbi]: https://github.com/itsmeurbi \ No newline at end of file diff --git a/README.md b/README.md index df3515b..34f514a 100644 --- a/README.md +++ b/README.md @@ -2,8 +2,8 @@ ## Description -A Generic, extendible Carousel UI component for React using [Material UI](https://material-ui.com/) -It switches between given children using a smooth animation. +A Generic, extendible Carousel UI component for React using [Material UI](https://material-ui.com/) +It switches between given children using a smooth animation. Provides next and previous buttons. Also provides interactible bullet indicators. @@ -24,7 +24,6 @@ You will need to have Material UI installed, in order to use this library/compon ```shell npm install @mui/material npm install @mui/icons-material -npm install @mui/styles ``` ### Other Versions @@ -145,7 +144,7 @@ The `NextIcon` and `PrevIcon` is of type `ReactNode`, meaning it can be any JSX #### Example #2 -Let's now say we don't like the default graphite background of the buttons, nor do we like the fact that it is round. +Let's now say we don't like the default graphite background of the buttons, nor do we like the fact that it is round. We also want to place them under the main Carousel, and finally remove the arrows and have "next" and "prev" accordingly to each button. A very important note here, is that any styles specified by the user **DO NOT OVERRIDE THE EXISTING STYLES**. They work in tandem with them. That means, that if you want to change, or get rid of a CSS attribute you will have to override it or unset it. The [Default styles](#default-styles) are given at the end of this section, and are part of the code. @@ -158,13 +157,13 @@ A very important note here, is that any styles specified by the user **DO NOT OV backgroundColor: 'cornflowerblue', borderRadius: 0 } - }} + }} navButtonsWrapperProps={{ // Move the buttons to the bottom. Unsetting top here to override default style. style: { bottom: '0', top: 'unset' } - }} + }} NextIcon='next' // Change the "inside" of the next button to "next" PrevIcon='prev' // Change the "inside of the prev button to "prev" > @@ -207,7 +206,7 @@ import {Button} from '@mui/material'; * `next`: Boolean value that specifies whether this is the next button. * `prev`: Boolean value that specifies whether this is the prev button. -The prop value must be a function that returns a component. All parameters are optional as far as styling goes (**not functionality**), but it is advised you use them as shown above. +The prop value must be a function that returns a component. All parameters are optional as far as styling goes (**not functionality**), but it is advised you use them as shown above. As implied, any `className`s or `style`s specified in the navButtonsProps will only be used iff you apply the given `className` and `style` parameters. ### Customizing the Indicators @@ -241,10 +240,10 @@ The `IndicatorIcon` works the same way as the `NextIcon` and `PrevIcon` prop. #### Example #2 Let's say we would like to have an array to icons like numbers, to order the elements of my carousel numerically. Let's do this! - + ```jsx -const anArrayOfNumbers = [, - , +const anArrayOfNumbers = [, + , ]; @@ -377,7 +376,7 @@ Giving the default styles in pseudo-code. fontSize: "15px", }, // Applies to the active indicator - active: { + active: { color: "#494949" } }