+
-
+
+
-
-
+
+
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
+
diff --git a/.config/startpages/homepage/index.js b/.config/startpages/homepage/index.js
new file mode 100644
index 0000000..8d5d560
--- /dev/null
+++ b/.config/startpages/homepage/index.js
@@ -0,0 +1,28 @@
+document.onreadystatechange = updateClock();
+
+function updateClock() {
+ const date = new Date()
+ document.getElementById("current-time-text").innerText =
+ date.toLocaleTimeString([], { hour12: false }) + " - " + date.toDateString()
+ const hour = date.getHours()
+}
+
+setInterval(updateClock, 1000)
+
+function doSearch() {
+ const query = document.getElementById('search-input').value
+ window.location.href = `https://www.duckduckgo.com/?q=${query}`
+}
+
+const searchInput = document.getElementById("search-input")
+searchInput.addEventListener("keypress", function onEvent(event) {
+ if (event.key === "Enter") {
+ document.getElementById("search-button").click();
+ }
+})
+
+function getWeatherData(city) {
+ fetch("https://wttr.in/" + city + "?format=%C+%c+%t+%w+%m")
+ .then(response => response.text())
+ .then(data => document.getElementById("weatherData").innerHTML = data)
+}
diff --git a/.config/startpages/homepage/style.css b/.config/startpages/homepage/style.css
old mode 100755
new mode 100644
index 98ef0d1..32eaa37
--- a/.config/startpages/homepage/style.css
+++ b/.config/startpages/homepage/style.css
@@ -1,139 +1,58 @@
-* {
- font-family: 'Hack Nerd Font Mono', monospace;
-}
-
-body {
- background-color: #101010;
- -moz-user-select: none;
- user-select: none;
-}
+@font-face {
+ font-family: 'Hack Nerd Font';
+ font-width: 12px;
+ font-display: swap;
+ }
+body,
.container {
- display: flex;
- width: max-content;
- justify-content: center;
- margin: auto;
-}
-
-/* Uncomment for space between buttons */
-/* .container > * { margin: 0 0 0 10px; } */
-
-#input {
- display: block;
- margin-left: auto;
- margin-right: auto;
- margin-top: 20px;
- min-width: 35%;
- height: 40px;
- font-size: 120%;
- text-align: center;
- outline: none;
- background-color: #252525;
- border: 1px solid #252525;
+ background: #101010;
color: #f7f7f7;
- transition: border-color .4s;
+ font-family: 'Hack Nerd Font';
}
-#input:hover {
- border-color: #252525;
+h3 {
+ color: #999999;
}
-#input:focus {
- border-color: #252525;
-}
-
-#avatar {
- display: block;
- margin-left: auto;
- margin-right: auto;
- margin-top: 150px;
- width: 128px;
- height: 128px;
- border-radius:50%;
- border: 2px solid #252525;
-}
-
-#greeting {
- font-size: 210%;
- opacity: 0;
+a {
color: #f7f7f7;
- margin: auto;
- margin-top: 40px;
- width: 50%;
- text-align: center;
- transition: opacity ease-in .1s;
-}
-
-.dropbtn {
- background-color: #252525;
- color: #f7f7f7;
- width: 150px;
- border: none;
- padding: 10px;
- font-size: 12px;
- outline: none;
- cursor: pointer;
-}
-
-.dropdown {
- position: relative;
- display: inline-block;
-}
-
-.dropdown-content {
- display: none;
- position: absolute;
- background-color: #252525;
- min-width: 160px;
- box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.3);
- z-index: 1;
- transition: opacity ease-in-out 1s;
- transition-delay: 2000ms;
-}
-
-.dropdown-content a {
- display: block;
text-decoration: none;
- color: #f7f7f7;
- padding: 12px 16px;
- font-size: 13px;
-}
-
-.dropdown-content a:hover {
- background-color: #454545;
-}
-
-.dropdown:hover .dropdown-content {
- display: block;
- height: auto;
-}
-
-.dropdown:hover .dropbtn {
- border-bottom: solid 1px #f7f7f7;
- color: #f7f7f7;
- transition: color .3s;
}
-#search-engine-indicator {
- display: block;
- justify-content: center;
- margin: auto;
- text-align: center;
- font-size: 110%;
- transform: translateY(60px);
+h2,
+a:hover {
color: #f7f7f7;
- opacity: 0;
- transition: opacity ease-in-out .2s;
}
-hr {
- display: block;
- justify-content: center;
- margin-top: 0;
- margin-bottom: 0;
- width: 135px;
- padding: 0;
+input {
+ background: #101010;
border: none;
- height: 1px;
- background-color: #f7f7f7;
+ outline: none;
+ color: #f7f7f7;
+ width: 100%;
+}
+
+.btn {
+ color: #f7f7f7;
+ background: #252525;
+}
+
+.btn:hover {
+ background: #999999;
+ color: #f7f7f7;
+}
+
+.date-weather-info {
+ background: #252525;
+}
+
+.main {
+ width: 640px;
+}
+
+.date-weather,
+.search,
+.col {
+ background: #454545;
}
diff --git a/.config/startpages/homepage/assets/ico/coffee-48x48.svg b/.config/startpages/wrk2/assets/ico/coffee-48x48.svg
similarity index 100%
rename from .config/startpages/homepage/assets/ico/coffee-48x48.svg
rename to .config/startpages/wrk2/assets/ico/coffee-48x48.svg
diff --git a/.config/startpages/homepage/assets/ico/coffee-96x96.svg b/.config/startpages/wrk2/assets/ico/coffee-96x96.svg
similarity index 100%
rename from .config/startpages/homepage/assets/ico/coffee-96x96.svg
rename to .config/startpages/wrk2/assets/ico/coffee-96x96.svg
diff --git a/.config/startpages/homepage/assets/img/avatar.png b/.config/startpages/wrk2/assets/img/avatar.png
similarity index 100%
rename from .config/startpages/homepage/assets/img/avatar.png
rename to .config/startpages/wrk2/assets/img/avatar.png
diff --git a/.config/startpages/wrk2/index.html b/.config/startpages/wrk2/index.html
new file mode 100755
index 0000000..b147eac
--- /dev/null
+++ b/.config/startpages/wrk2/index.html
@@ -0,0 +1,74 @@
+
+
+
+
+
+
+
+ Home page
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/.config/startpages/homepage/js/script.js b/.config/startpages/wrk2/js/script.js
similarity index 100%
rename from .config/startpages/homepage/js/script.js
rename to .config/startpages/wrk2/js/script.js
diff --git a/.config/startpages/homepage/js/search.js b/.config/startpages/wrk2/js/search.js
similarity index 100%
rename from .config/startpages/homepage/js/search.js
rename to .config/startpages/wrk2/js/search.js
diff --git a/.config/startpages/homepage/manifest.json b/.config/startpages/wrk2/manifest.json
similarity index 100%
rename from .config/startpages/homepage/manifest.json
rename to .config/startpages/wrk2/manifest.json
diff --git a/.config/startpages/wrk2/style.css b/.config/startpages/wrk2/style.css
new file mode 100755
index 0000000..98ef0d1
--- /dev/null
+++ b/.config/startpages/wrk2/style.css
@@ -0,0 +1,139 @@
+* {
+ font-family: 'Hack Nerd Font Mono', monospace;
+}
+
+body {
+ background-color: #101010;
+ -moz-user-select: none;
+ user-select: none;
+}
+
+.container {
+ display: flex;
+ width: max-content;
+ justify-content: center;
+ margin: auto;
+}
+
+/* Uncomment for space between buttons */
+/* .container > * { margin: 0 0 0 10px; } */
+
+#input {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 20px;
+ min-width: 35%;
+ height: 40px;
+ font-size: 120%;
+ text-align: center;
+ outline: none;
+ background-color: #252525;
+ border: 1px solid #252525;
+ color: #f7f7f7;
+ transition: border-color .4s;
+}
+
+#input:hover {
+ border-color: #252525;
+}
+
+#input:focus {
+ border-color: #252525;
+}
+
+#avatar {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 150px;
+ width: 128px;
+ height: 128px;
+ border-radius:50%;
+ border: 2px solid #252525;
+}
+
+#greeting {
+ font-size: 210%;
+ opacity: 0;
+ color: #f7f7f7;
+ margin: auto;
+ margin-top: 40px;
+ width: 50%;
+ text-align: center;
+ transition: opacity ease-in .1s;
+}
+
+.dropbtn {
+ background-color: #252525;
+ color: #f7f7f7;
+ width: 150px;
+ border: none;
+ padding: 10px;
+ font-size: 12px;
+ outline: none;
+ cursor: pointer;
+}
+
+.dropdown {
+ position: relative;
+ display: inline-block;
+}
+
+.dropdown-content {
+ display: none;
+ position: absolute;
+ background-color: #252525;
+ min-width: 160px;
+ box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.3);
+ z-index: 1;
+ transition: opacity ease-in-out 1s;
+ transition-delay: 2000ms;
+}
+
+.dropdown-content a {
+ display: block;
+ text-decoration: none;
+ color: #f7f7f7;
+ padding: 12px 16px;
+ font-size: 13px;
+}
+
+.dropdown-content a:hover {
+ background-color: #454545;
+}
+
+.dropdown:hover .dropdown-content {
+ display: block;
+ height: auto;
+}
+
+.dropdown:hover .dropbtn {
+ border-bottom: solid 1px #f7f7f7;
+ color: #f7f7f7;
+ transition: color .3s;
+}
+
+#search-engine-indicator {
+ display: block;
+ justify-content: center;
+ margin: auto;
+ text-align: center;
+ font-size: 110%;
+ transform: translateY(60px);
+ color: #f7f7f7;
+ opacity: 0;
+ transition: opacity ease-in-out .2s;
+}
+
+hr {
+ display: block;
+ justify-content: center;
+ margin-top: 0;
+ margin-bottom: 0;
+ width: 135px;
+ padding: 0;
+ border: none;
+ height: 1px;
+ background-color: #f7f7f7;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+