Set up startpage
This commit is contained in:
parent
602e6a4d6b
commit
bda6b363a1
22 changed files with 488 additions and 48 deletions
5
TODO.md
5
TODO.md
|
|
@ -1,3 +1,8 @@
|
|||
### TODO
|
||||
|
||||
- Make startpage fully generic for both Nord and Everforest
|
||||
- Fix rofi transparency issue
|
||||
|
||||
### Needs checking
|
||||
|
||||
- Fix issue where wireless connection dies after suspend, even after restarting NetworkManager: not an issue on T430, still problem on X220?
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -10,10 +10,13 @@
|
|||
};
|
||||
wallpaper = "306286.jpg";
|
||||
|
||||
background = "#1e2326";
|
||||
background-alt = "#272e33";
|
||||
foreground = "#d3c6aa";
|
||||
primary = "#a7c080";
|
||||
alert = "#e67e80";
|
||||
disabled = "#2e383c";
|
||||
colors = {
|
||||
bg0 = "#1e2326";
|
||||
bg1 = "#272e33";
|
||||
bg2 = "#2e383c";
|
||||
fg0 = "#d3c6aa";
|
||||
primary = "#a7c080";
|
||||
alert = "#e67e80";
|
||||
disabled = "#2e383c";
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,10 +7,13 @@
|
|||
};
|
||||
gtkIconTheme = pkgs: null;
|
||||
|
||||
background = "#2e3440";
|
||||
background-alt = "#3b4252";
|
||||
foreground = "#eceff4";
|
||||
primary = "#8fbcbb";
|
||||
alert = "#bf616a";
|
||||
disabled = "#434c5e";
|
||||
colors = {
|
||||
bg0 = "#2e3440";
|
||||
bg1 = "#3b4252";
|
||||
bg2 = "#434c53";
|
||||
fg0 = "#eceff4";
|
||||
primary = "#8fbcbb";
|
||||
alert = "#bf616a";
|
||||
disabled = "#434c5e";
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
# Modified from https://github.com/tonyfettes/fcitx5-nord
|
||||
let
|
||||
colors = import ../colors;
|
||||
background = "${colors.background-alt}80";
|
||||
highlight = "${colors.background}";
|
||||
background = "${colors.bg1}80";
|
||||
highlight = "${colors.bg0}";
|
||||
in
|
||||
''
|
||||
[Metadata]
|
||||
|
|
@ -10,8 +10,8 @@ ScaleWithDPI=True
|
|||
|
||||
[InputPanel]
|
||||
Font=Sans 13
|
||||
NormalColor=${colors.foreground}
|
||||
HighlightCandidateColor=${colors.foreground-bright};
|
||||
NormalColor=${colors.fg0}
|
||||
HighlightCandidateColor=${colors.fg1};
|
||||
HighlightColor=${colors.undefined}
|
||||
HighlightBackgroundColor=${colors.undefined}
|
||||
Spacing=3
|
||||
|
|
@ -42,7 +42,7 @@ Bottom=7
|
|||
|
||||
[Menu]
|
||||
Font=Sans 10
|
||||
NormalColor=${colors.foreground}
|
||||
NormalColor=${colors.fg0}
|
||||
Spacing=3
|
||||
|
||||
[Menu/Background]
|
||||
|
|
|
|||
48
firefox.nix
Normal file
48
firefox.nix
Normal file
|
|
@ -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}";
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
|
|
@ -25,7 +25,6 @@ in
|
|||
}
|
||||
home-manager.nixosModules.home-manager {
|
||||
home-manager = {
|
||||
useGlobalPkgs = true;
|
||||
useUserPackages = true;
|
||||
extraSpecialArgs = { inherit user; };
|
||||
users.${user} = {
|
||||
|
|
@ -52,7 +51,6 @@ in
|
|||
}
|
||||
home-manager.nixosModules.home-manager {
|
||||
home-manager = {
|
||||
useGlobalPkgs = true;
|
||||
useUserPackages = true;
|
||||
extraSpecialArgs = { inherit user; };
|
||||
users.${user} = {
|
||||
|
|
@ -78,7 +76,6 @@ in
|
|||
}
|
||||
home-manager.nixosModules.home-manager {
|
||||
home-manager = {
|
||||
useGlobalPkgs = true;
|
||||
useUserPackages = true;
|
||||
extraSpecialArgs = { inherit user; };
|
||||
users.${user} = {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
{ config, pkgs, ... }:
|
||||
{ config, pkgs, lib, ... }:
|
||||
|
||||
let
|
||||
colors = import ../colors;
|
||||
|
|
|
|||
|
|
@ -5,8 +5,7 @@ let
|
|||
in
|
||||
{
|
||||
imports = [
|
||||
../neovim
|
||||
../ranger.nix
|
||||
../neovim ../ranger.nix
|
||||
../fcitx5
|
||||
../picom.nix
|
||||
../i3.nix
|
||||
|
|
@ -14,6 +13,8 @@ in
|
|||
../rofi
|
||||
../git.nix
|
||||
../terminal.nix
|
||||
../startpage
|
||||
../firefox.nix
|
||||
];
|
||||
|
||||
home.file."./.background-image".source = ../wallpapers/${colors.wallpaper};
|
||||
|
|
@ -71,7 +72,7 @@ in
|
|||
#(pkgs.callPackage ../colors/everforest/gtk.nix {})
|
||||
|
||||
# GUI applications
|
||||
firefox
|
||||
#firefox
|
||||
discord
|
||||
gnome.nautilus
|
||||
gnome.file-roller
|
||||
|
|
|
|||
22
i3.nix
22
i3.nix
|
|
@ -19,8 +19,8 @@ in {
|
|||
showStartupLaunchMessage = false;
|
||||
showHelp = false;
|
||||
showSidePanelButton = false;
|
||||
uiColor = "${colors.background-alt}";
|
||||
contrastUiColor = "${colors.background}";
|
||||
uiColor = "${colors.bg1}";
|
||||
contrastUiColor = "${colors.bg0}";
|
||||
drawColor = "#ffffff";
|
||||
};
|
||||
};
|
||||
|
|
@ -38,23 +38,23 @@ in {
|
|||
};
|
||||
colors = {
|
||||
focused = {
|
||||
border = "${colors.background-alt}";
|
||||
background = "${colors.background-alt}";
|
||||
text = "${colors.foreground}";
|
||||
border = "${colors.bg1}";
|
||||
background = "${colors.bg1}";
|
||||
text = "${colors.fg0}";
|
||||
indicator = "${colors.undefined}";
|
||||
childBorder = "${colors.undefined}";
|
||||
};
|
||||
focusedInactive = {
|
||||
border = "${colors.background-alt}";
|
||||
background = "${colors.background-alt}";
|
||||
text = "${colors.foreground}";
|
||||
border = "${colors.bg1}";
|
||||
background = "${colors.bg1}";
|
||||
text = "${colors.fg0}";
|
||||
indicator = "${colors.undefined}";
|
||||
childBorder = "${colors.undefined}";
|
||||
};
|
||||
unfocused = {
|
||||
border = "${colors.background}";
|
||||
background = "${colors.background}";
|
||||
text = "${colors.foreground}";
|
||||
border = "${colors.bg0}";
|
||||
background = "${colors.bg0}";
|
||||
text = "${colors.fg0}";
|
||||
indicator = "${colors.undefined}";
|
||||
childBorder = "${colors.undefined}";
|
||||
};
|
||||
|
|
|
|||
|
|
@ -22,8 +22,8 @@ in
|
|||
tray-position = "right";
|
||||
font-0 = "Noto Sans Mono;2";
|
||||
font-1 = "Noto Sans CJK JP;2";
|
||||
background = "${colors.background}";
|
||||
foreground = "${colors.foreground}";
|
||||
background = "${colors.bg0}";
|
||||
foreground = "${colors.fg0}";
|
||||
width = "100%";
|
||||
height = "24pt";
|
||||
line-size = "3pt";
|
||||
|
|
@ -52,7 +52,7 @@ in
|
|||
"module/xworkspaces" = {
|
||||
type = "internal/xworkspaces";
|
||||
|
||||
label-active-background = "${colors.background-alt}";
|
||||
label-active-background = "${colors.bg1}";
|
||||
label-active-underline = "${colors.primary}";
|
||||
label-active-padding-right = 1;
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ configuration {
|
|||
|
||||
* {
|
||||
background-color: transparent;
|
||||
highlight: underline bold ${colors.foreground-bright};
|
||||
highlight: underline bold ${colors.fg1};
|
||||
}
|
||||
|
||||
window {
|
||||
|
|
@ -40,16 +40,16 @@ mainbox {
|
|||
}
|
||||
|
||||
message {
|
||||
color: ${colors.background};
|
||||
color: ${colors.bg0};
|
||||
padding: 5;
|
||||
border-color: ${colors.foreground};
|
||||
border-color: ${colors.fg0};
|
||||
border: 0px 2px 2px 2px;
|
||||
}
|
||||
|
||||
inputbar {
|
||||
color: ${colors.foreground};
|
||||
color: ${colors.fg0};
|
||||
padding: 11px;
|
||||
background-color: ${colors.background-alt};
|
||||
background-color: ${colors.bg1};
|
||||
}
|
||||
|
||||
entry, prompt, case-indicator {
|
||||
|
|
@ -64,19 +64,19 @@ prompt {
|
|||
listview {
|
||||
padding: 8px;
|
||||
border: 0;
|
||||
background-color: ${colors.background}e5;
|
||||
background-color: ${colors.bg0}e5;
|
||||
dynamic: false;
|
||||
}
|
||||
|
||||
element {
|
||||
padding: 3px;
|
||||
border-radius: 4px;
|
||||
text-color: ${colors.foreground};
|
||||
text-color: ${colors.fg0};
|
||||
}
|
||||
|
||||
element selected.normal {
|
||||
background-color: ${colors.primary};
|
||||
text-color: ${colors.background};
|
||||
text-color: ${colors.bg0};
|
||||
}
|
||||
|
||||
element-text, element-icon {
|
||||
|
|
|
|||
3
startpage/.gitignore
vendored
Normal file
3
startpage/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
# Link in generate colors file for testing
|
||||
# ln -s ~/.startpage/colors.css .
|
||||
colors.css
|
||||
66
startpage/anilist.svg
Normal file
66
startpage/anilist.svg
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
preserveAspectRatio="xMidYMid"
|
||||
width="135.955"
|
||||
height="102.559"
|
||||
viewBox="0 0 135.955 102.559"
|
||||
version="1.1"
|
||||
id="svg78"
|
||||
sodipodi:docname="anilist.svg"
|
||||
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04, custom)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview80"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="2.4215116"
|
||||
inkscape:cx="38.612245"
|
||||
inkscape:cy="-22.506603"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1048"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="32"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg78" />
|
||||
<defs
|
||||
id="defs70">
|
||||
<style
|
||||
id="style68">
|
||||
.cls-1 {
|
||||
fill: #02a9ff;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2 {
|
||||
fill-rule: evenodd;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #fefefe;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<g
|
||||
id="g76"
|
||||
transform="translate(-18.331,-34.792)">
|
||||
<path
|
||||
d="M 111.322,111.157 V 41.029 c 0,-4.019 -2.217,-6.237 -6.236,-6.237 H 91.365 c -4.019,0 -6.237,2.218 -6.237,6.237 0,0 0,15.308 0,33.304 0,0.938 9.037,5.293 9.273,6.214 6.885,26.902 1.496,48.433 -5.031,49.438 10.672,0.528 11.846,5.659 3.897,2.153 1.216,-14.354 5.961,-14.326 19.602,-0.528 0.117,0.119 2.797,5.741 2.964,5.741 15.337,0 32.217,0 32.217,0 4.019,0 6.236,-2.217 6.236,-6.236 v -13.721 c 0,-4.019 -2.217,-6.237 -6.236,-6.237 z"
|
||||
class="cls-1"
|
||||
id="path72" />
|
||||
<path
|
||||
d="M 54.365,34.792 18.331,137.351 h 27.996 l 6.098,-17.74 h 30.49 l 5.96,17.74 h 27.857 L 80.836,34.792 Z m 4.435,62.09 8.731,-28.412 9.563,28.412 z"
|
||||
class="cls-2"
|
||||
id="path74" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After 
(image error) Size: 2.1 KiB |
29
startpage/default.nix
Normal file
29
startpage/default.nix
Normal file
|
|
@ -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
|
||||
'';
|
||||
}
|
||||
1
startpage/dir.nix
Normal file
1
startpage/dir.nix
Normal file
|
|
@ -0,0 +1 @@
|
|||
".startpage"
|
||||
1
startpage/envelope-regular.svg
Normal file
1
startpage/envelope-regular.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path 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>
|
||||
|
After 
(image error) Size: 567 B |
41
startpage/git.svg
Normal file
41
startpage/git.svg
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="2500"
|
||||
height="2500"
|
||||
viewBox="0 0 256 256"
|
||||
preserveAspectRatio="xMinYMin meet"
|
||||
version="1.1"
|
||||
id="svg4"
|
||||
sodipodi:docname="git.svg"
|
||||
inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs8" />
|
||||
<sodipodi:namedview
|
||||
id="namedview6"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.3484"
|
||||
inkscape:cx="1250"
|
||||
inkscape:cy="1252.8703"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1080"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4" />
|
||||
<path
|
||||
d="M251.172 116.594L139.4 4.828c-6.433-6.437-16.873-6.437-23.314 0l-23.21 23.21 29.443 29.443c6.842-2.312 14.688-.761 20.142 4.693 5.48 5.489 7.02 13.402 4.652 20.266l28.375 28.376c6.865-2.365 14.786-.835 20.269 4.657 7.663 7.66 7.663 20.075 0 27.74-7.665 7.666-20.08 7.666-27.749 0-5.764-5.77-7.188-14.235-4.27-21.336l-26.462-26.462-.003 69.637a19.82 19.82 0 0 1 5.188 3.71c7.663 7.66 7.663 20.076 0 27.747-7.665 7.662-20.086 7.662-27.74 0-7.663-7.671-7.663-20.086 0-27.746a19.654 19.654 0 0 1 6.421-4.281V94.196a19.378 19.378 0 0 1-6.421-4.281c-5.806-5.798-7.202-14.317-4.227-21.446L81.47 39.442l-76.64 76.635c-6.44 6.443-6.44 16.884 0 23.322l111.774 111.768c6.435 6.438 16.873 6.438 23.316 0l111.251-111.249c6.438-6.44 6.438-16.887 0-23.324"
|
||||
fill="#DE4C36"
|
||||
id="path2"
|
||||
style="fill:#ffffff" />
|
||||
</svg>
|
||||
|
After 
(image error) Size: 1.9 KiB |
34
startpage/index.html
Normal file
34
startpage/index.html
Normal file
|
|
@ -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>
|
||||
89
startpage/jellyfin.svg
Normal file
89
startpage/jellyfin.svg
Normal file
|
|
@ -0,0 +1,89 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
|
||||
<svg
|
||||
aria-label="Jellyfin"
|
||||
role="img"
|
||||
viewBox="0 0 399.85056 399.83783"
|
||||
version="1.1"
|
||||
id="svg120"
|
||||
sodipodi:docname="jellyfin.svg"
|
||||
width="399.85056"
|
||||
height="399.83783"
|
||||
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview122"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.5744287"
|
||||
inkscape:cx="462.19836"
|
||||
inkscape:cy="181.04945"
|
||||
inkscape:window-width="1600"
|
||||
inkscape:window-height="868"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="32"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg120" />
|
||||
<defs
|
||||
id="defs110">
|
||||
<path
|
||||
d="m 190.56,329.07 c 8.63,17.3 122.4,17.12 130.93,0 8.52,-17.1 -47.9,-119.78 -65.46,-119.8 -17.57,0 -74.1,102.5 -65.47,119.8 z"
|
||||
id="A" />
|
||||
<linearGradient
|
||||
id="B"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="126.15"
|
||||
y1="219.32001"
|
||||
x2="457.67999"
|
||||
y2="410.73001">
|
||||
<stop
|
||||
offset="0%"
|
||||
stop-color="#aa5cc3"
|
||||
id="stop104" />
|
||||
<stop
|
||||
offset="100%"
|
||||
stop-color="#00a4dc"
|
||||
id="stop106" />
|
||||
</linearGradient>
|
||||
<path
|
||||
d="m 58.75,417.03 c 25.97,52.15 368.86,51.55 394.55,0 C 478.99,365.48 308.93,56.08 256.03,56.08 203.11,56.08 32.78,364.88 58.75,417.03 Z m 68.04,-45.25 c -17.02,-34.17 94.6,-236.5 129.26,-236.5 34.67,0 146.1,202.7 129.26,236.5 -16.83,33.8 -241.5,34.17 -258.52,0 z"
|
||||
id="C" />
|
||||
</defs>
|
||||
<use
|
||||
xlink:href="#A"
|
||||
fill="url(#B)"
|
||||
id="use112"
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
transform="translate(-56.074305,-56.08)" />
|
||||
<use
|
||||
xlink:href="#A"
|
||||
fill-opacity="0"
|
||||
stroke="#000000"
|
||||
stroke-opacity="0"
|
||||
id="use114"
|
||||
transform="translate(-56.074305,-56.08)" />
|
||||
<use
|
||||
xlink:href="#C"
|
||||
fill="url(#B)"
|
||||
id="use116"
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
transform="translate(-56.074305,-56.08)" />
|
||||
<use
|
||||
xlink:href="#C"
|
||||
fill-opacity="0"
|
||||
stroke="#000000"
|
||||
stroke-opacity="0"
|
||||
id="use118"
|
||||
transform="translate(-56.074305,-56.08)" />
|
||||
</svg>
|
||||
|
After 
(image error) Size: 2.6 KiB |
BIN
startpage/nyaa.webp
Normal file
BIN
startpage/nyaa.webp
Normal file
Binary file not shown.
|
After 
(image error) Size: 2.7 KiB |
115
startpage/style.css
Normal file
115
startpage/style.css
Normal file
|
|
@ -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…
Add table
Reference in a new issue