parent
602e6a4d6b
commit
bda6b363a1
@ -1,4 +1,8 @@
|
||||
let
|
||||
theme = import ./everforest;
|
||||
in
|
||||
{
|
||||
undefined = "#ff00ff";
|
||||
foreground-bright = "#ffffff";
|
||||
} // import ./everforest
|
||||
fg1 = "#ffffff";
|
||||
css = lib: lib.strings.concatStringsSep "\n" (lib.attrValues (lib.mapAttrs (k: v: " --${k}: ${v};") theme.colors));
|
||||
} // theme // theme.colors
|
||||
|
||||
@ -0,0 +1,48 @@
|
||||
{ user, ... }:
|
||||
|
||||
let
|
||||
startpageDir = import ./startpage/dir.nix;
|
||||
startpage = "file:///home/${user}/${startpageDir}/index.html";
|
||||
in
|
||||
{
|
||||
nixpkgs = {
|
||||
config.allowUnfree = true;
|
||||
overlays = [
|
||||
(self: super: {
|
||||
firefox = super.firefox.overrideAttrs (oa: {
|
||||
buildCommand = oa.buildCommand + ''
|
||||
cd lib/firefox
|
||||
mkdir -p defaults/pref
|
||||
cat > defaults/pref/autoconfig.js << 'EOL'
|
||||
//
|
||||
pref("general.config.filename", "autoconfig.cfg");
|
||||
pref("general.config.obscure_value", 0);
|
||||
pref("general.config.sandbox_enabled", false);
|
||||
EOL
|
||||
cat > autoconfig.cfg << 'EOL'
|
||||
//
|
||||
var {classes:Cc,interfaces:Ci,utils:Cu} = Components;
|
||||
|
||||
/* set new tab page */
|
||||
try {
|
||||
Cu.import("resource:///modules/AboutNewTab.jsm");
|
||||
var newTabURL = "${startpage}";
|
||||
AboutNewTab.newTabURL = newTabURL;
|
||||
} catch(e){Cu.reportError(e);} // report errors in the Browser Console
|
||||
EOL
|
||||
'';
|
||||
});
|
||||
})
|
||||
];
|
||||
};
|
||||
|
||||
programs.firefox = {
|
||||
enable = true;
|
||||
profiles.${user} = {
|
||||
isDefault = true;
|
||||
settings = {
|
||||
"browser.startup.homepage" = "${startpage}";
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
# Link in generate colors file for testing
|
||||
# ln -s ~/.startpage/colors.css .
|
||||
colors.css
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
@ -0,0 +1,29 @@
|
||||
{ pkgs, lib, ... }:
|
||||
|
||||
let
|
||||
colors = import ../colors;
|
||||
startpageDir = import ./dir.nix;
|
||||
out = "${startpageDir}.tmp/";
|
||||
in
|
||||
{
|
||||
home.file = {
|
||||
"${out}index.html".source = ./index.html;
|
||||
"${out}colors.css".text = ":root {\n" + (colors.css lib) + "\n}";
|
||||
"${out}style.css".source = ./style.css;
|
||||
"${out}anilist.svg".source = ./anilist.svg;
|
||||
"${out}envelope-regular.svg".source = ./envelope-regular.svg;
|
||||
"${out}git.svg".source = ./git.svg;
|
||||
"${out}jellyfin.svg".source = ./jellyfin.svg;
|
||||
"${out}nyaa.webp".source = ./nyaa.webp;
|
||||
};
|
||||
# Make files not symlinks, this causes issues displaying in Firefox
|
||||
home.activation.startpage = lib.hm.dag.entryAfter["writeBoundary"] ''
|
||||
mkdir -p ${startpageDir}
|
||||
mv ${out}* ${startpageDir}
|
||||
rmdir ${out}
|
||||
cd ${startpageDir}
|
||||
for file in `find -type l`; do
|
||||
cp --remove-destination `readlink $file` $file
|
||||
done
|
||||
'';
|
||||
}
|
||||
@ -0,0 +1 @@
|
||||
".startpage"
|
||||
|
After Width: | Height: | Size: 567 B |
|
After Width: | Height: | Size: 1.9 KiB |
@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="colors.css">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<meta name="viewport" content= "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no; shrink-to-fit=no;">
|
||||
</head>
|
||||
<body>
|
||||
<div id="content">
|
||||
<div id="cards">
|
||||
<a class="blue" href="https://anilist.co" title="AniList"><img src="anilist.svg" alt="AniList"></a>
|
||||
<a class="blue" href="http://elnuhub:8096" title="Jellyfin"><img src="jellyfin.svg" alt="Jellyfin"></a>
|
||||
<a class="blue" href="https:/nyaa.si" title="Nyaa"><img src="nyaa.webp" alt="Nyaa"></a>
|
||||
<a class="yellow" href="https://git.elnu.com" title="Git"><img src="git.svg" alt="Git"></a>
|
||||
<a class="aqua" href="https://mail.proton.me/u/0/inbox" title="ProtonMail"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M64 112c-8.8 0-16 7.2-16 16v22.1L220.5 291.7c20.7 17 50.4 17 71.1 0L464 150.1V128c0-8.8-7.2-16-16-16H64zM48 212.2V384c0 8.8 7.2 16 16 16H448c8.8 0 16-7.2 16-16V212.2L322 328.8c-38.4 31.5-93.7 31.5-132 0L48 212.2zM0 128C0 92.7 28.7 64 64 64H448c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z"/></svg></a>
|
||||
<a class="green" href="http://elnuhub" title="Nextcloud"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M64 32C64 14.3 49.7 0 32 0S0 14.3 0 32v96V384c0 35.3 28.7 64 64 64H256V384H64V160H256V96H64V32zM288 192c0 17.7 14.3 32 32 32H544c17.7 0 32-14.3 32-32V64c0-17.7-14.3-32-32-32H445.3c-8.5 0-16.6-3.4-22.6-9.4L409.4 9.4c-6-6-14.1-9.4-22.6-9.4H320c-17.7 0-32 14.3-32 32V192zm0 288c0 17.7 14.3 32 32 32H544c17.7 0 32-14.3 32-32V352c0-17.7-14.3-32-32-32H445.3c-8.5 0-16.6-3.4-22.6-9.4l-13.3-13.3c-6-6-14.1-9.4-22.6-9.4H320c-17.7 0-32 14.3-32 32V480z"/></svg></a>
|
||||
<a class="red" href="https://youtube.com" title="YouTube"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"/></svg></a>
|
||||
<a class="orange" href="https://reddit.com" title="Reddit"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M440.3 203.5c-15 0-28.2 6.2-37.9 15.9-35.7-24.7-83.8-40.6-137.1-42.3L293 52.3l88.2 19.8c0 21.6 17.6 39.2 39.2 39.2 22 0 39.7-18.1 39.7-39.7s-17.6-39.7-39.7-39.7c-15.4 0-28.7 9.3-35.3 22l-97.4-21.6c-4.9-1.3-9.7 2.2-11 7.1L246.3 177c-52.9 2.2-100.5 18.1-136.3 42.8-9.7-10.1-23.4-16.3-38.4-16.3-55.6 0-73.8 74.6-22.9 100.1-1.8 7.9-2.6 16.3-2.6 24.7 0 83.8 94.4 151.7 210.3 151.7 116.4 0 210.8-67.9 210.8-151.7 0-8.4-.9-17.2-3.1-25.1 49.9-25.6 31.5-99.7-23.8-99.7zM129.4 308.9c0-22 17.6-39.7 39.7-39.7 21.6 0 39.2 17.6 39.2 39.7 0 21.6-17.6 39.2-39.2 39.2-22 .1-39.7-17.6-39.7-39.2zm214.3 93.5c-36.4 36.4-139.1 36.4-175.5 0-4-3.5-4-9.7 0-13.7 3.5-3.5 9.7-3.5 13.2 0 27.8 28.5 120 29 149 0 3.5-3.5 9.7-3.5 13.2 0 4.1 4 4.1 10.2.1 13.7zm-.8-54.2c-21.6 0-39.2-17.6-39.2-39.2 0-22 17.6-39.7 39.2-39.7 22 0 39.7 17.6 39.7 39.7-.1 21.5-17.7 39.2-39.7 39.2z"/></svg></a>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
// Override tabing logic to stay in #cards
|
||||
const cardContainer = document.getElementById("cards");
|
||||
const cards = Array.from(cardContainer.children);
|
||||
document.addEventListener('keydown', e => {
|
||||
if (e.keyCode == 9) {
|
||||
const index = (cards.indexOf(document.activeElement) + (e.shiftKey ? -1 : 1) + cards.length) % cards.length;
|
||||
cards[index].focus();
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
@ -0,0 +1,115 @@
|
||||
:root {
|
||||
--red: #e67e80;
|
||||
--red-bg: #4c3743;
|
||||
--orange: #e69875;
|
||||
--orange-bg: #493b40;
|
||||
--yellow: #dbbc7f;
|
||||
--yellow-bg: #45443c;
|
||||
--green: #a7c080;
|
||||
--green-bg: #3c4841;
|
||||
--aqua: #83c092;
|
||||
--aqua-bg: var(--green-bg);
|
||||
--blue: #7fbbb3;
|
||||
--blue-bg: #384b55;
|
||||
}
|
||||
|
||||
.red {
|
||||
--highlight: var(--red-bg);
|
||||
--outline: var(--red);
|
||||
}
|
||||
|
||||
.orange {
|
||||
--highlight: var(--orange-bg);
|
||||
--outline: var(--orange);
|
||||
}
|
||||
|
||||
.yellow {
|
||||
--highlight: var(--yellow-bg);
|
||||
--outline: var(--yellow);
|
||||
}
|
||||
|
||||
.green {
|
||||
--highlight: var(--green-bg);
|
||||
--outline: var(--green);
|
||||
}
|
||||
|
||||
.aqua {
|
||||
--highlight: var(--aqua-bg);
|
||||
--outline: var(--aqua);
|
||||
}
|
||||
|
||||
.blue {
|
||||
--highlight: var(--blue-bg);
|
||||
--outline: var(--blue);
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--bg1);
|
||||
color: var(--fg0);
|
||||
font-size: 1.5em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#content {
|
||||
width: 40em;
|
||||
max-height: 100vh;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
#cards {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||
grid-auto-rows: 1fr;
|
||||
}
|
||||
|
||||
#cards::before {
|
||||
content: '';
|
||||
width: 0;
|
||||
padding-bottom: 100%;
|
||||
grid-row: 1 / 1;
|
||||
grid-column: 1 / 1;
|
||||
}
|
||||
|
||||
#cards > *:first-child{
|
||||
grid-row: 1 / 1;
|
||||
grid-column: 1 / 1;
|
||||
}
|
||||
|
||||
#cards > * {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: linear-gradient(var(--bg2), var(--bg2), var(--highlight, var(--bg2)));
|
||||
font-size: 2em;
|
||||
outline: 1px solid var(--outline, var(--bg0));
|
||||
border-radius: 2px;
|
||||
transition: 0.25s transform;
|
||||
}
|
||||
|
||||
#cards > * > * {
|
||||
color: white;
|
||||
display: inline;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
#cards > :hover, #cards > :focus {
|
||||
outline-width: 2px;
|
||||
outline-color: var(--outline);
|
||||
}
|
||||
|
||||
#cards > :focus {
|
||||
background: var(--highlight);
|
||||
transform: translateY(-0.25rem);
|
||||
}
|
||||
|
||||
#cards > :hover *, #cards > :focus * {
|
||||
font-size: 1.0625em;
|
||||
}
|
||||
Loading…
Reference in new issue