AtaraxiaDev/Bento
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

✨ Replace feather icons for lucide

Browse Source
This commit is contained in:
Miguel Avila 2021-11-24 07:21:18 -06:00
parent f1d204f8b5
commit bd97a8a137
5 changed files with 13 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app.css
View File

@ -26,12 +26,6 @@
--sfg: #3a3a3a; /* Sceondary Foreground color */
/* Image background */
/* Uncoment this section to get the
image wallpaper. You can also
change the --imgcol value
to make the filter to your own */
--imgbg: url(assets/background.jpg);
--imgcol: linear-gradient(
rgba(255, 255, 255, 0.7),
@ -315,8 +309,11 @@ body {
display: none;
}
.buttonLink {
.buttons {
grid-column: 1 / span 4;
}
.buttonLink {
grid-gap: 3vw;
padding-left: 100px;
padding-right: 100px;

4
assets/js/cards.js
View File

@ -11,9 +11,9 @@ const printCards = () => {
<a
href="${card.link}"
target="${CONFIG.openInNewTab ? '_blank' : ''}"
class="buttonLink__link card buttonLink__link-${card.id}"
class="buttons__link card buttonLink__link-${card.id}"
>
<i class="buttonLink__icon" data-feather="${card.icon}"></i>
<i class="buttonLink__icon" icon-name="${card.icon}"></i>
</a>
`;

4
assets/js/lists.js
View File

@ -4,7 +4,7 @@
// Print the first List
const printFirstList = () => {
let icon = `<i class="list__head" data-feather="${CONFIG.firstListIcon}"></i>`;
let icon = `<i class="list__head" icon-name="${CONFIG.firstListIcon}"></i>`;
const position = 'beforeend';
list_1.insertAdjacentHTML(position, icon);
for (const link of CONFIG.lists.firstList) {
@ -24,7 +24,7 @@ const printFirstList = () => {
// Print the second List
const printSecondList = () => {
let icon = `<i class="list__head" data-feather="${CONFIG.secondListIcon}"></i>`;
let icon = `<i class="list__head" icon-name="${CONFIG.secondListIcon}"></i>`;
const position = 'beforeend';
list_2.insertAdjacentHTML(position, icon);
for (const link of CONFIG.lists.secondList) {

8
assets/js/theme.js
View File

@ -11,16 +11,16 @@ const bodyBackground = document.getElementById('#body');
const enableDark = () => {
document.body.classList.add('darktheme');
localStorage.setItem('darkTheme', 'enabled');
themeToggle.innerHTML = `<i id="themeButton__icon" data-feather="sun"></i>`;
feather.replace();
themeToggle.innerHTML = `<i id="themeButton__icon" icon-name="sun"></i>`;
lucide.createIcons();
};
// Remove Dark theme
const disableDark = () => {
document.body.classList.remove('darktheme');
localStorage.setItem('darkTheme', null);
themeToggle.innerHTML = `<i id="themeButton__icon" data-feather="moon"></i>`;
feather.replace();
themeToggle.innerHTML = `<i id="themeButton__icon" icon-name="moon"></i>`;
lucide.createIcons();
};
//Toggle theme

2
index.html
View File

@ -20,7 +20,7 @@
<body class="">
<button id="themeButton">
<i id="themeIcon" data-feather="moon"></i>
<i id="themeIcon" icon-name="moon"></i>
</button>
<div class="container">
<!-- Clock and Greetings -->