166 lines
4.6 KiB
HTML
166 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>Bento</title>
|
|
<link
|
|
rel=" shortcut icon"
|
|
type="image/png"
|
|
href="assets/icons/favicon.png"
|
|
/>
|
|
<link rel="stylesheet" href="app.css" />
|
|
<script src="https://unpkg.com/feather-icons"></script>
|
|
</head>
|
|
|
|
<body class="">
|
|
<button id="themeButton">
|
|
<i id="themeButton__icon" data-feather="moon"></i>
|
|
</button>
|
|
<div class="container">
|
|
<!-- Clock and Greetings -->
|
|
|
|
<div class="timeBlock">
|
|
<div class="clock">
|
|
<div id="hour" class=""></div>
|
|
<div id="separator" class=""></div>
|
|
<div id="minutes" class=""></div>
|
|
</div>
|
|
<div id="greetings" class=""></div>
|
|
</div>
|
|
|
|
<!-- Date and Weather -->
|
|
|
|
<div class="weatherBlock">
|
|
<div class="weatherBlock__date">
|
|
<div id="month" class=""></div>
|
|
<div id="day" class=""></div>
|
|
</div>
|
|
<div class="weatherBlock__weather">
|
|
<div class="weather-icon">
|
|
<img src="assets/icons/OneDark/unknown.png" />
|
|
</div>
|
|
<div class="temperature-value">
|
|
<p class="">- °<span class="g">c</span></p>
|
|
</div>
|
|
<div class="temperature-description">
|
|
<p class=""></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Buttons Links -->
|
|
|
|
<div class="buttonLink">
|
|
<a
|
|
href="https://github.com/"
|
|
target="blank"
|
|
class="buttonLink__link card buttonLink__link-1"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="github"></i>
|
|
</a>
|
|
<a
|
|
target="blank"
|
|
href="https://outlook.live.com/mail/inbox"
|
|
class="buttonLink__link card buttonLink__link-2"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="mail"></i>
|
|
</a>
|
|
<a
|
|
target="blank"
|
|
href="https://calendar.google.com/calendar/r"
|
|
class="buttonLink__link card buttonLink__link-3"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="calendar"></i>
|
|
</a>
|
|
<a
|
|
target="blank"
|
|
href="https://flipboard.com/"
|
|
class="buttonLink__link card buttonLink__link-4"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="bookmark"></i>
|
|
</a>
|
|
<a
|
|
href="https://columns.app"
|
|
target="blank"
|
|
class="buttonLink__link card buttonLink__link-5"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="trello"></i>
|
|
</a>
|
|
<a
|
|
target="blank"
|
|
href="https://www.youtube.com/"
|
|
class="buttonLink__link card buttonLink__link-6"
|
|
>
|
|
<i class="buttonLink__icon" data-feather="youtube"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Lists -->
|
|
|
|
<div class="card list list__1">
|
|
<i class="list__head" data-feather="music"></i>
|
|
<a
|
|
target="blank"
|
|
href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
|
|
class="list__link"
|
|
>Inspirational</a
|
|
>
|
|
<a
|
|
target="blank"
|
|
href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
|
|
class="list__link"
|
|
>Classic</a
|
|
>
|
|
<a
|
|
target="blank"
|
|
href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
|
|
class="list__link"
|
|
>Oldies</a
|
|
>
|
|
<a
|
|
target="blank"
|
|
href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
|
|
class="list__link"
|
|
>Rock</a
|
|
>
|
|
</div>
|
|
|
|
<div class="card list list__2">
|
|
<i class="list__head" data-feather="coffee"></i>
|
|
<a href="https://www.linkedin.com" target="blank" class="list__link"
|
|
>LinkedIn</a
|
|
>
|
|
<a href="https://dribbble.com/" target="blank" class="list__link"
|
|
>Dribble</a
|
|
>
|
|
<a href="https://www.udemy.com/" target="blank" class="list__link"
|
|
>Udemy</a
|
|
>
|
|
<a
|
|
href="https://www.figma.com/files/recent"
|
|
target="blank"
|
|
class="list__link"
|
|
>Figma</a
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Config -->
|
|
<script src="config.js"></script>
|
|
|
|
<!-- Scripts -->
|
|
<script src="assets/js/time.js"></script>
|
|
<script src="assets/js/theme.js"></script>
|
|
<script src="assets/js/cards.js"></script>
|
|
<script src="assets/js/lists.js"></script>
|
|
<script src="assets/js/greeting.js"></script>
|
|
<script src="assets/js/weather.js"></script>
|
|
<script>
|
|
feather.replace();
|
|
</script>
|
|
</body>
|
|
|
|
<!-- Coded and designed by Miguel R. Ávila: -->
|
|
<!-- https://github.com/migueravila -->
|
|
</html>
|