Depending time theme switch readme

This commit is contained in:
Miguel R. Ávika 2020-10-16 20:28:24 -05:00
parent 857c2392bb
commit 7ed61647e3
2 changed files with 22 additions and 6 deletions

View File

@ -16,6 +16,7 @@
- [Customization](#customization) - [Customization](#customization)
- [Links](#links) - [Links](#links)
- [Colors](#colors) - [Colors](#colors)
- [Theme Depending at the time](#theme-depending-at-the-time)
- [Image Background](#image-background) - [Image Background](#image-background)
- [Greetings](#greetings) - [Greetings](#greetings)
- [Weather Info](#weather-info) - [Weather Info](#weather-info)
@ -57,13 +58,9 @@
You can change the links (and the icons too) in the HTML Code: You can change the links (and the icons too) in the HTML Code:
```html ```html
<a <a href="https://github.com/" target="blank" class="qlink__link qlink__link-1">
href="https://github.com/"
target="blank"
class="qlink__link qlink__link-1"
>
<i class="qlink__icon" data-feather="github"></i> <i class="qlink__icon" data-feather="github"></i>
</a> </a>
``` ```
Change the link in the `href` property with the link you want. (The `target="blank"` makes the link to open a new tab with the link you choose). Change the link in the `href` property with the link you want. (The `target="blank"` makes the link to open a new tab with the link you choose).
@ -96,6 +93,21 @@ In the CSS code you can always change the variables for both themes (Dark and Li
} }
``` ```
### Theme Depending at the time
In the `theme.js` file there's a section about changing the theme depending in the time. You have to 'Uncomment' that section to enable it:
```js
const today = new Date();
const Hr = today.getHours();
if (Hr >= 19 || Hr < 5) {
enableDark();
} else {
disableDark();
}
```
### Image Background ### Image Background
You can set your own background image with the variable `--imgbg` and set the route to the image you want It's disable by default. If you uncomment the variable, it has by default this image: You can set your own background image with the variable `--imgbg` and set the route to the image you want It's disable by default. If you uncomment the variable, it has by default this image:

View File

@ -31,11 +31,15 @@ themeToggle.addEventListener('click', () => {
} }
}); });
// Change the theme with the time
const today = new Date(); const today = new Date();
const Hr = today.getHours(); const Hr = today.getHours();
/*
if (Hr >= 19 || Hr < 5) { if (Hr >= 19 || Hr < 5) {
enableDark(); enableDark();
} else { } else {
disableDark(); disableDark();
} }
*/