Skip to content

Commit

Permalink
From now on this wrap will not use the React component. Documentation…
Browse files Browse the repository at this point in the history
… is modified.
  • Loading branch information
Carlos Llatser committed Mar 21, 2024
1 parent 4c10cae commit cef36b2
Show file tree
Hide file tree
Showing 8 changed files with 9,303 additions and 481 deletions.
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,5 @@ venv/
beta/
.idea/
icons/
generate_list.py
generate_list.py
backup/
30 changes: 18 additions & 12 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,6 @@

A Reflex wrapper for [Simple Icons](https://simpleicons.org/), the best library of SVG icons from the most popular brands.

This wrap uses the [react-simple-icons](https://github.com/icons-pack/react-simple-icons)

## Installation

```bash
Expand All @@ -24,6 +22,8 @@ Search for the logo you want to use on [Simple Icons](https://simpleicons.org/)

Use in your Reflex UI:

By default it will have the color of the main text, switching automatically between light and dark mode. The default size is 48px.

```python
simpleicons("python")
```
Expand All @@ -44,26 +44,32 @@ simpleicons("python", color="#5F259F", size=97),

## Example

If you want to use the default HEX color of the brand you can add the property:

```python
brand_color=True
```

```python
import reflex as rx
from reflex_simpleicons import simpleicons


def demo_brands() -> rx.Component:
return rx.el.div(
simpleicons("7zip", color="#000000", size=90),
simpleicons(tag="Dell", color="#007DB8", size=90),
simpleicons(tag="Microsoft", color="#5E5E5E", size=90),
simpleicons(tag="Amazon", color="#FF9900", size=90),
simpleicons(tag="Apple", color="#000000", size=90),
simpleicons(tag="Spotify", color="#1DB954", size=90),
simpleicons(tag="3m", color="#FF0000", size=90),
simpleicons(tag="Taichigraphics", color="#000000", size=90),
simpleicons(tag="Dotenv", color="#ECD53F", size=90),
simpleicons("7zip", brand_color=True, size=90),
simpleicons(tag="Dell", brand_color=True, size=90),
simpleicons(tag="Microsoft", brand_color=True, size=90),
simpleicons(tag="Amazon", brand_color=True, size=90),
simpleicons(tag="Apple", brand_color=True, size=90),
simpleicons(tag="Spotify", brand_color=True, size=90),
simpleicons(tag="3m", brand_color=True, size=90),
simpleicons(tag="bitwarden", brand_color=True, size=90),
simpleicons(tag="Dotenv", brand_color=True, size=90),
class_name="demo-brands"
)
```
![reflex-simpleicons.PNG](img%2Freflex-simpleicons.PNG)
![brands_color.PNG](img%2Fbrands_color.PNG)

## Disclaimer

Expand Down
Empty file.
Loading

0 comments on commit cef36b2

Please sign in to comment.