d13g0x
/
dotfiles
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update new startpage

Browse Source
main
diego castillo salazar 4 months ago
parent 562941fb3b
commit 59595f7ffa
11 changed files with 336 additions and 175 deletions
Show Stats Download Patch File Download Diff File

119
.config/startpages/homepage/index.html
Unescape Escape View File

@ -1,74 +1,75 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Startpage</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<title>Home page</title>
</head>
<body>
<div class="container">
<div class="dropdown">
<button class="dropbtn">Work</button>
<div class="dropdown-content">
<a href="https://www.ramajudicial.gov.co/portal/inicio">Rama Judicial</a>
<hr>
<a href="https://www.ramajudicial.gov.co/directorio-cuentas-de-correo-electronico">Correos electrónicos</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-procesos">Consulta de procesos</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-altas-cortes">Jurisprudencia Cortes</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-tribunales">Jurisprudencia Tribunales</a>
<body onload="getWeatherData('Bucaramanga-Colombia')">
<div class="main position-absolute top-50 start-50 translate-middle">
<div class="date-weather my-2 p-3 rounded-3 text-center">
<div class="date-weather-info rounded-3 p-2">
<h2 id="current-time-text"></h1>
<h3 id="weatherData"></h3>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Utilities</button>
<div class="dropdown-content">
<a href="https://drive.google.com/drive/folders/1xVIVArl1b7b_bcW4DYlWzdSgfE_ZAqsb">Google Drive</a>
<hr>
<a href="https://www.ilovepdf.com/">IlovePDF</a>
<hr>
<a href="https://www.iloveimg.com/">IloveIMG</a>
<hr>
<a href="https://www.canva.com/">Canva</a>
<hr>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Emails</button>
<div class="dropdown-content">
<a href="https://www.gmx.es/">Gmx</a>
<hr>
<a href="https://mail.google.com/mail/u/0/#inbox">Gmail</a>
<hr>
<a href="https://account.proton.me/login">Proton mail</a>
<hr>
<a href="https://outlook.live.com/owa/">Outlook</a>
</div>
<div class="search my-2 p-2 rounded-3">
<div class="row">
<div class="search-bar col-10">
<input type="text" placeholder="Search the web..." class="p-2 rounded-3" id="search-input" autofocus>
</div>
<div class="search-button col-2">
<button class="btn rounded-3 p-2" type="button" id="search-button"
onclick="doSearch()">search</button>
</div>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Random</button>
<div class="dropdown-content">
<a href="https://web.telegram.org/z/">Telegram</a>
<hr>
<a href="https://www.reddit.com/">Reddit</a>
<hr>
<a href="https://web.whatsapp.com/">Whatsapp</a>
<div class="container">
<div class="row">
<div class="col me-1 p-2 rounded-3">
<div class="container rounded-3 p-2">
<h3>Trabajo</h3>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/portal/inicio">> Inicio</a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/directorio-cuentas-de-correo-electronico">> Correos</a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/consulta-procesos">> Consulta</a></p>
<p class="mx-3 my-1"><a href="https://procesojudicial.ramajudicial.gov.co/TutelaEnLinea">> Tutelas</a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/web/abogados">> Abogados</a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/registro-nacional-de-abogados">> Regnal</a></p>
</div>
</div>
<div class="col mx-1 p-2 rounded-3">
<div class="container rounded-3 p-2">
<h3>utilidades</h3>
<p class="mx-3 my-1"><a href="https://drive.google.com/drive/folders/1xVIVArl1b7b_bcW4DYlWzdSgfE_ZAqsb">> Drive</a></p>
<p class="mx-3 my-1"><a href="https://www.ilovepdf.com/">> Ilovepdf</a></p>
<p class="mx-3 my-1"><a href="https://www.iloveimg.com/">> Iloveimg</a></p>
<p class="mx-3 my-1"><a href="https://www.canva.com/">> Canva</a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-altas-cortes">> Cortes </a></p>
<p class="mx-3 my-1"><a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-tribunales">> Tribunales</a></p>
</div>
</div>
<div class="col ms-1 p-2 rounded-3">
<div class="container rounded-3 p-2">
<h3>Social</h3>
<p class="mx-3 my-1"><a href="https://www.gmx.es/">> gmx</a></p>
<p class="mx-3 my-1"><a href="https://mail.google.com/mail/u/0/#inbox">> gmail</a></p>
<p class="mx-3 my-1"><a href="https://account.proton.me/login">> Proton</a></p>
<p class="mx-3 my-1"><a href="https://outlook.live.com/owa/">> Outlook</a></p>
<p class="mx-3 my-1"><a href="https://web.telegram.org/z/">> Telegram</a></p>
<p class="mx-3 my-1"><a href="https://web.whatsapp.com/">> Whatsapp</a></p>
</div>
</div>
</div>
</div>
</div>
<img id="avatar" src="assets/img/avatar.png" alt="Your Avatar" data-tooltip="That's you!">
<h1 id="greeting"></h1>
<form id="search-bar" name="search-bar">
<input type="text" id="input" name="input" autocomplete="off" title="Press 'S' to focus!"><br>
</form>
<p id="search-engine-indicator"></p>
<script async type="text/javascript" src="js/script.js"></script>
<script async type="text/javascript" src="js/search.js"></script>
</body>
<script src="index.js"></script>
</html>

28
.config/startpages/homepage/index.js
Unescape Escape View File

@ -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)
}

151
.config/startpages/homepage/style.css
Unescape Escape View File

@ -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;
}
#input:hover {
border-color: #252525;
font-family: 'Hack Nerd Font';
}
#input:focus {
border-color: #252525;
h3 {
color: #999999;
}
#avatar {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 150px;
width: 128px;
height: 128px;
border-radius:50%;
border: 2px solid #252525;
a {
color: #f7f7f7;
text-decoration: none;
}
#greeting {
font-size: 210%;
opacity: 0;
h2,
a:hover {
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;
input {
background: #101010;
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;
width: 100%;
}
.dropdown:hover .dropbtn {
border-bottom: solid 1px #f7f7f7;
.btn {
color: #f7f7f7;
transition: color .3s;
background: #252525;
}
#search-engine-indicator {
display: block;
justify-content: center;
margin: auto;
text-align: center;
font-size: 110%;
transform: translateY(60px);
.btn:hover {
background: #999999;
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;
.date-weather-info {
background: #252525;
}
.main {
width: 640px;
}
.date-weather,
.search,
.col {
background: #454545;
}

0
.config/startpages/homepage/assets/ico/coffee-48x48.svg → .config/startpages/wrk2/assets/ico/coffee-48x48.svg
Unescape Escape View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 442 B

After

Width:  |  Height:  |  Size: 442 B

0
.config/startpages/homepage/assets/ico/coffee-96x96.svg → .config/startpages/wrk2/assets/ico/coffee-96x96.svg
Unescape Escape View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 442 B

After

Width:  |  Height:  |  Size: 442 B

0
.config/startpages/homepage/assets/img/avatar.png → .config/startpages/wrk2/assets/img/avatar.png
Unescape Escape View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

74
.config/startpages/wrk2/index.html
Unescape Escape View File

@ -0,0 +1,74 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Home page</title>
</head>
<body>
<div class="container">
<div class="dropdown">
<button class="dropbtn">Work</button>
<div class="dropdown-content">
<a href="https://www.ramajudicial.gov.co/portal/inicio">Rama Judicial</a>
<hr>
<a href="https://www.ramajudicial.gov.co/directorio-cuentas-de-correo-electronico">Correos electrónicos</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-procesos">Consulta de procesos</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-altas-cortes">Jurisprudencia Cortes</a>
<hr>
<a href="https://www.ramajudicial.gov.co/consulta-de-jurisprudencia-tribunales">Jurisprudencia Tribunales</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Utilities</button>
<div class="dropdown-content">
<a href="https://drive.google.com/drive/folders/1xVIVArl1b7b_bcW4DYlWzdSgfE_ZAqsb">Google Drive</a>
<hr>
<a href="https://www.ilovepdf.com/">IlovePDF</a>
<hr>
<a href="https://www.iloveimg.com/">IloveIMG</a>
<hr>
<a href="https://www.canva.com/">Canva</a>
<hr>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Emails</button>
<div class="dropdown-content">
<a href="https://www.gmx.es/">Gmx</a>
<hr>
<a href="https://mail.google.com/mail/u/0/#inbox">Gmail</a>
<hr>
<a href="https://account.proton.me/login">Proton mail</a>
<hr>
<a href="https://outlook.live.com/owa/">Outlook</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Random</button>
<div class="dropdown-content">
<a href="https://web.telegram.org/z/">Telegram</a>
<hr>
<a href="https://www.reddit.com/">Reddit</a>
<hr>
<a href="https://web.whatsapp.com/">Whatsapp</a>
</div>
</div>
</div>
<img id="avatar" src="assets/img/avatar.png" alt="Your Avatar" data-tooltip="That's you!">
<h1 id="greeting"></h1>
<form id="search-bar" name="search-bar">
<input type="text" id="input" name="input" autocomplete="off" title="Press 'S' to focus!"><br>
</form>
<p id="search-engine-indicator"></p>
<script async type="text/javascript" src="js/script.js"></script>
<script async type="text/javascript" src="js/search.js"></script>
</body>
</html>

0
.config/startpages/homepage/js/script.js → .config/startpages/wrk2/js/script.js
Unescape Escape View File

0
.config/startpages/homepage/js/search.js → .config/startpages/wrk2/js/search.js
Unescape Escape View File

0
.config/startpages/homepage/manifest.json → .config/startpages/wrk2/manifest.json
Unescape Escape View File

139
.config/startpages/wrk2/style.css
Unescape Escape View File

@ -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;
}
Write Preview
Loading…
Cancel
Save