⚡ Improve code config samples
This commit is contained in:
parent
0446f8732f
commit
cf8c74eb9d
109
README.md
109
README.md
@ -85,14 +85,24 @@ To change the default name, the greetings and if you want to have an image backg
|
||||
|
||||
### 📐 Layouts: Bento, Lists and Buttons.
|
||||
|
||||
Bento has three different layouts `bento`, `lists` & `buttons`. It allows you to cutomize your experience giving you more buttons or lists depending on how are you more comfortable. To modify the laout you need to change the following line in the `config.js` file:
|
||||
|
||||
```js
|
||||
// Layout
|
||||
bentoLayout: 'bento', // 'bento', 'lists', 'buttons'
|
||||
|
||||
```
|
||||
|
||||
If you want to customize all your extra buttons and lists go to [🏷️ Buttons & Links](#️-buttons--links) & [📑 Lists & Links](#-lists--links) sections.
|
||||
|
||||

|
||||
|
||||
### 🏷️ Buttons & Links
|
||||
|
||||
To edit the buttons you just need to change the follow list in the `config.js` file by choosing a link, an icon from [Feather icons](https://feathericons.com/) and a name:
|
||||
To edit the buttons you just need to change the follow list in the `config.js` file by choosing a link, an icon from [Lucide icons](https://lucide.dev) and a name. If you're using the `buttons` [layout](#-layouts-bento-lists-and-buttons) you can customize `secondButtonsContainer`
|
||||
|
||||
```js
|
||||
cards: [
|
||||
firstButtonsContainer: [
|
||||
{
|
||||
id: '1',
|
||||
name: 'Github',
|
||||
@ -109,7 +119,7 @@ cards: [
|
||||
id: '3',
|
||||
name: 'Todoist',
|
||||
icon: 'trello',
|
||||
link: 'https://calendar.google.com/calendar/r',
|
||||
link: 'https://todoist.com',
|
||||
},
|
||||
{
|
||||
id: '4',
|
||||
@ -120,7 +130,7 @@ cards: [
|
||||
{
|
||||
id: '5',
|
||||
name: 'Reddit',
|
||||
icon: 'bookmark',
|
||||
icon: 'glasses',
|
||||
link: 'https://reddit.com',
|
||||
},
|
||||
{
|
||||
@ -134,52 +144,55 @@ cards: [
|
||||
|
||||
### 📑 Lists & Links
|
||||
|
||||
The same happens with the list links, you can change the list icon (also using feather icons) and the links:
|
||||
The same happens with the list links, you can change the list icon (also using Lucide icons) and the links. If you're using the `lists` [layout](#-layouts-bento-lists-and-buttons) you can customize `secondListsContainer`, you can find it bellow `firstListsContainer`.
|
||||
|
||||
```js
|
||||
//Icons
|
||||
firstListIcon: 'music',
|
||||
secondListIcon: 'coffee',
|
||||
|
||||
// Links
|
||||
lists: {
|
||||
firstList: [
|
||||
{
|
||||
name: 'Inspirational',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Classic',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Oldies',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Rock',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
],
|
||||
secondList: [
|
||||
{
|
||||
name: 'Linkedin',
|
||||
link: 'https://linkedin.com/',
|
||||
},
|
||||
{
|
||||
name: 'Figma',
|
||||
link: 'https://figma.com/',
|
||||
},
|
||||
{
|
||||
name: 'Dribbble',
|
||||
link: 'https://dribbble.com',
|
||||
},
|
||||
{
|
||||
name: 'Telegram',
|
||||
link: 'https://webk.telegram.org',
|
||||
},
|
||||
],
|
||||
},
|
||||
firstlistsContainer: [
|
||||
{
|
||||
icon: 'music',
|
||||
id: '1',
|
||||
links: [
|
||||
{
|
||||
name: 'Inspirational',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Classic',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Oldies',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Rock',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: 'coffee',
|
||||
id: '2',
|
||||
links: [
|
||||
{
|
||||
name: 'Linkedin',
|
||||
link: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ',
|
||||
},
|
||||
{
|
||||
name: 'Dribbble',
|
||||
link: 'https://www.linkedin.com',
|
||||
},
|
||||
{
|
||||
name: 'Trello',
|
||||
link: 'https://www.trello.com',
|
||||
},
|
||||
{
|
||||
name: 'Slack',
|
||||
link: 'https://www.slack.com',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
```
|
||||
|
||||
### ⛈️ Weather: Api Key, Icons and Unit
|
||||
|
Loading…
x
Reference in New Issue
Block a user