hiro/tridactyl
1
0
Fork 0
mirror of https://github.com/vale981/tridactyl synced 2025-03-05 09:31:41 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of https://github.com/cmcaine/tridactyl

Browse source
This commit is contained in:
Babil Golam Sarwar 2018-05-23 18:10:36 +10:00
commit e1f3956c78
24 changed files with 489 additions and 194 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
CHANGELOG.md
View file

@ -292,7 +292,7 @@
- Fix hints on some sites via cleanslate.css (#220)
- Fix new config system (#321)
- followpage now falls back to urlincrement
- `tabopen` now opens tabs to the right of the curent tab
- `tabopen` now opens tabs to the right of the current tab
- Fix floating commandline iframe on some sites (#289)
- Enter insert mode on drop down menus (#281)
- Support hinting on some dodgy old websites (#287)

131
doc/archive.md Normal file
View file

@ -0,0 +1,131 @@
# Some old stuff that used to live in readme.md
Non-objectives for v1:
* insert mode (embedded (n)vim would be good for future)
* caret or visual mode - I'm not good enough at vim to find these easier than selecting with the mouse, and they require text motions, which I would prefer to delegate to vim.
Prior art:
* pentadactyl/vimperator - dying with XUL
* cVim/vimium/saka-key
* vimfx - transitioning to WebExtensions, but no ex commands
* qutebrowser/jumanji - see [standalone.md](doc/standalone.md).
## WebExtensions
What we learnt from these notes has been condensed in [bug-message.md](doc/bug-message.md).
### Evaluating prior art
cVim and vimium implement some kind of vim experience using webextensions. Neither allow you to modify the browser UI.
#### Common issues
1. can't operate on some URLs (chrome store, chrome://, view-source://)
2. can't escape location bar
3. can't hide chrome UI
4. can't suppress all chrome keybinds
5. can't override some browser shortcuts
6. bad js kills the UI (but the same bad js locks up the whole of firefox, so y'know...)
In conclusion, a privileged keyboard webextension will help with #1,2,4,5; #3,#1 (for visual changes) and maybe #2 need a ui API. #1 might not be applicable to ff content scripts.
#### Vimium
https://github.com/philc/vimium
Very lightweight, but what is there is actually really nice. Easily fixable issues: no command mode for the features they do have; some odd default maps; mappings are done by function name rather than key ('map b Vomnibar.activateTabSelection' rather than 'map b T'). Possibly fixable issues: plugin support (source), arbitrary js eval for mappings, marks are per tab, jumplist.
Missing:
* command mode
* jumplist
* :js
* lots more.
Improvements over vimperator:
* regex search
* buffer switch between windows
#### vrome
https://github.com/jinzhu/vrome
Vim mode chromium plugin written at least partly in coffeescript. Source is not documented, but it's not so bad either (at least it's in coffeescript). Default maps are not to my liking, but that's hardly surprising. I don't see how to make new maps, tho. UI appearance is poor, appears to be influenced by context's css.
Missing:
* map!
* sensible default maps
* UI style
* documentation for users or developers
* plugin/eval support
* jumplist, etc
May be worth taking code from, could consider forking it, but would need to review code more carefully for quality issues.
#### cVim
https://github.com/1995eaton/chromium-vim
Written in uncommented javascript. But user experience is pretty good. Autocompletion in command mode is very good and it has a decent chunk of the vimperator features implemented.
Missing:
* decent documentation
* can't map some characters that vimium can
* jumplist
Improvements over vimperator:
* autocompletion is much faster
* allegedly lets you edit with vim
## Architecture
*This is an early draft and may be entirely replaced.*
ex-commands as functions (typed and with helper functions in some other scope):
* open(url)
* scroll(x=+10)
* mark(<elem>)
* map(actions, keys)
* ...
helper functions for actions:
* scroll-x, scroll-y
* jumplist.get/getrelative/store
* undo-tab-deletion
Count and range:
* given as arguments?
* just repeat the call 'count' times?
for default actions, a mapping from key to helper function.
Generated parsers (command and normal mode):
* command mode pretty conventional. Include type checking.
* For auto-complete to work, need to be able to parse partial results sensibly.
* actions will be a slightly weirder grammar:
* More permissive
* Time sensitive
* In vim, actions compose as you write them (d takes a motion as an argument, for example), I can't think of any examples of this in vimperator: actions sometimes take a count or argument, but that argument is never an action.
* If actions did compose, we would have to give them types, as vim does for motions, and the parsing would be less trivial.
Autocomplete functions for commands:
* Split from implementation of command.
* Could perhaps be automatic from command's parameter types?
Some actions have their own interactive mini-mode:
* hints
* searching

57
doc/hinting.md Normal file
View file

@ -0,0 +1,57 @@
## Components
- Iterable of visible links on page
- Algorithm for choosing hint characters for each link
- Mode for controller and excmd to refine and select hints:
- I imagine `:hint` to start
- `:hint j` to refine to only hints starting with j
- `:hint jk` to refine to hints starting with jk
- To make maps easier we can have `:hintaddchar j` and have the state of the current hintstr stored content-side.
## Improvements
Hinting modes should be flexible on both
1. What is hinted (links, anchorpoints, frames, input elements, etc)
2. What is done with the selected link (follow, yank, focus)
## Vimperator hint modes:
`:help` hinttags
```
string(default: //input[not(@type='hidden' or @disabled)] | //xhtml:input[not(@type='hidden')] | //a | //xhtml:a | //area | //xhtml:area | //iframe | //xhtml:iframe | //textarea | //xhtml:textarea | //button | //xhtml:button | //select | //xhtml:select | //\*[@onclick or @onmouseover or @onmousedown or @onmouseup or @oncommand or @role='link'or @role='button' or @role='checkbox' or @role='combobox' or @role='listbox' or @role='listitem' or @role='menuitem' or @role='menuitemcheckbox' or @role='menuitemradio' or @role='option' or @role='radio' or @role='scrollbar' or @role='slider' or @role='spinbutton' or @role='tab' or @role='textbox' or @role='treeitem' or @tabindex])
XPath string of hintable elements activated by f and F
```
Extended hint modes:
```
; Focus hint
? Show information for hint
s Save link
S Save object
a Save link with prompt
A Save object with prompt
f Focus frame
o Follow hint
t Follow hint in a new tab
b Follow hint in a background tab
w Follow hint in a new window
F Open multiple hints in tabs
O Generate an ':open URL' using hint
T Generate a ':tabopen URL' using hint
W Generate a ':winopen URL' using hint
v View hint source
V View hint source in external editor
y Yank hint location
Y Yank hint description
# Yank hint anchor URL
c Open context menu
i Show media object
I Show media object in a new tab
x Show hint's title or alt text
```

2
hooks/post-checkout
View file

@ -9,6 +9,6 @@ file_changed() {
echo "$changed_files" | grep --quiet "$1"
}
if file_changed package.json || file_changed package-lock.json; then
if file_changed package.json; then
npm install
fi

2
hooks/post-merge
View file

@ -9,6 +9,6 @@ file_changed() {
echo "$changed_files" | grep --quiet "$1"
}
if file_changed package.json || file_changed package-lock.json; then
if file_changed package.json; then
npm install
fi

140
readme.md
View file

@ -155,6 +155,14 @@ See `:help bind` for details about this command.
Yes: `set theme dark` or `colors dark`. Thanks to @fugerf.
- How can I pretend that I'm not a 1337 h4x0r?
We cater for you, too! `set theme shydactyl`. Thanks to @atrnh.
- How can I pretend that I'm a 1337 h4x0r?
We cater for you, too! `set theme greenmat`. Thanks to @caputchinefrobles.
- How can I bind keys using the control/alt key modifiers (eg: `ctrl+^`)?
`:bind <C-f> scrollpage 1`. Special keys can be bound too: `:bind <F3> set theme dark` and with modifiers: `:bind <S-F3> set theme default` and with multiple modifiers: `:bind <SA-F3> composite set hintchars 1234567890 | set hintfiltermode vimperator-reflow`
@ -205,7 +213,7 @@ See `:help bind` for details about this command.
- How can I know which mode I'm in/have a status line?
Press `j` and see if you scroll down :) There's no status line yet: see [#210](https://github.com/cmcaine/tridactyl/issues/210).
Press `j` and see if you scroll down :) There's no status line yet: see [#210](https://github.com/cmcaine/tridactyl/issues/210), but we do have a "mode indicator" in the bottom right. It even goes purple when you're in a private window :).
- Does anyone actually use Tridactyl?
@ -291,136 +299,6 @@ Other objectives:
* don't crash - we're the new UI and we shouldn't crash
* be maintainable - code should be well documented, reasoned about and tested.
Non-objectives for v1:
* insert mode (embedded (n)vim would be good for future)
* caret or visual mode - I'm not good enough at vim to find these easier than selecting with the mouse, and they require text motions, which I would prefer to delegate to vim.
Prior art:
* pentadactyl/vimperator - dying with XUL
* cVim/vimium/saka-key
* vimfx - transitioning to WebExtensions, but no ex commands
* qutebrowser/jumanji - see [standalone.md](doc/standalone.md).
## WebExtensions
What we learnt from these notes has been condensed in [bug-message.md](doc/bug-message.md).
### Evaluating prior art
cVim and vimium implement some kind of vim experience using webextensions. Neither allow you to modify the browser UI.
#### Common issues
1. can't operate on some URLs (chrome store, chrome://, view-source://)
2. can't escape location bar
3. can't hide chrome UI
4. can't suppress all chrome keybinds
5. can't override some browser shortcuts
6. bad js kills the UI (but the same bad js locks up the whole of firefox, so y'know...)
In conclusion, a privileged keyboard webextension will help with #1,2,4,5; #3,#1 (for visual changes) and maybe #2 need a ui API. #1 might not be applicable to ff content scripts.
#### Vimium
https://github.com/philc/vimium
Very lightweight, but what is there is actually really nice. Easily fixable issues: no command mode for the features they do have; some odd default maps; mappings are done by function name rather than key ('map b Vomnibar.activateTabSelection' rather than 'map b T'). Possibly fixable issues: plugin support (source), arbitrary js eval for mappings, marks are per tab, jumplist.
Missing:
* command mode
* jumplist
* :js
* lots more.
Improvements over vimperator:
* regex search
* buffer switch between windows
#### vrome
https://github.com/jinzhu/vrome
Vim mode chromium plugin written at least partly in coffeescript. Source is not documented, but it's not so bad either (at least it's in coffeescript). Default maps are not to my liking, but that's hardly surprising. I don't see how to make new maps, tho. UI appearance is poor, appears to be influenced by context's css.
Missing:
* map!
* sensible default maps
* UI style
* documentation for users or developers
* plugin/eval support
* jumplist, etc
May be worth taking code from, could consider forking it, but would need to review code more carefully for quality issues.
#### cVim
https://github.com/1995eaton/chromium-vim
Written in uncommented javascript. But user experience is pretty good. Autocompletion in command mode is very good and it has a decent chunk of the vimperator features implemented.
Missing:
* decent documentation
* can't map some characters that vimium can
* jumplist
Improvements over vimperator:
* autocompletion is much faster
* allegedly lets you edit with vim
## Architecture
*This is an early draft and may be entirely replaced.*
ex-commands as functions (typed and with helper functions in some other scope):
* open(url)
* scroll(x=+10)
* mark(<elem>)
* map(actions, keys)
* ...
helper functions for actions:
* scroll-x, scroll-y
* jumplist.get/getrelative/store
* undo-tab-deletion
Count and range:
* given as arguments?
* just repeat the call 'count' times?
for default actions, a mapping from key to helper function.
Generated parsers (command and normal mode):
* command mode pretty conventional. Include type checking.
* For auto-complete to work, need to be able to parse partial results sensibly.
* actions will be a slightly weirder grammar:
* More permissive
* Time sensitive
* In vim, actions compose as you write them (d takes a motion as an argument, for example), I can't think of any examples of this in vimperator: actions sometimes take a count or argument, but that argument is never an action.
* If actions did compose, we would have to give them types, as vim does for motions, and the parsing would be less trivial.
Autocomplete functions for commands:
* Split from implementation of command.
* Could perhaps be automatic from command's parameter types?
Some actions have their own interactive mini-mode:
* hints
* searching
## Logo acknowledgement
The logo was designed by Jake Beazley using free vector art by <a target="_blank" href="https://www.Vecteezy.com">www.Vecteezy.com</a>

4
scripts/bodgecss.sh
View file

@ -1,6 +1,6 @@
#!/bin/env bash
#!/usr/bin/env bash
imports=$(find src/static/themes/ -name *.css| sed "s/^src\/static\///" | sed "s/^.*$/@import url\('..\/\0'\);/")
imports=$(find src/static/themes/ -name '*.css'| sed "s/^src\/static\///" | sed "s/^.*$/@import url\('..\/\0'\);/")
shopt -s globstar

10
scripts/common
View file

@ -4,12 +4,16 @@ cachedJS() {
git diff --cached --name-only --diff-filter=ACM "*.js" "*.jsx" "*.ts" "*.tsx" | tr '\n' ' '
}
staged() {
git show :"$1"
}
ugly() {
local acc=()
for jsfile in "$@"; do
diff "$jsfile" <($(npm bin)/prettier "$jsfile") >/dev/null || acc+=("$jsfile")
diff <(staged $jsfile) <(staged $jsfile | $(npm bin)/prettier --stdin-filepath $jsfile) >/dev/null || acc+=("$jsfile")
done
echo $acc
echo ${acc[@]}
}
noisy() {
@ -19,5 +23,5 @@ noisy() {
acc+=("jsfile")
fi
done
echo $acc
echo ${acc[@]}
}

19
scripts/pretty
View file

@ -2,8 +2,25 @@
source ./scripts/common
set -e
uglyFiles=$(ugly $(cachedJS))
if [ -n "$uglyFiles" ]; then
prettier --write "$uglyFiles"
for file in "$uglyFiles"; do
if cmp -s <(staged $file) "$file"; then
prettier --write "$file"
git add "$file"
else
echo "WARN: Staged and working file differ: '$file'"
echo "WARN: Moving working file temporarily (this might upset your editor)"
# Get crazy: backup the working copy of the file, paste the staged version in its place, prettify, add, restore backup
backup=$(mktemp -p . $file.XXXXXXXXX)
mv "$file" "$backup"
staged "$file"|prettier --stdin-filepath "$file" > "$file"
git add "$file"
mv "$backup" "$file"
echo "WARN: Working file restored"
fi
done
fi

1
src/config.ts
View file

@ -171,6 +171,7 @@ const DEFAULTS = o({
bdelete: "tabclose",
quit: "tabclose",
q: "tabclose",
qa: "qall",
sanitize: "sanitise",
tutorial: "tutor",
h: "help",

16
src/content.ts
View file

@ -100,9 +100,19 @@ config.getAsync("modeindicator").then(mode => {
: ""
statusIndicator.className =
"cleanslate TridactylStatusIndicator " + privateMode
statusIndicator.textContent = state.mode
dom.appendTo(document.body, statusIndicator)
dom.appendTo(document.head, style)
try {
// On quick loading pages, the document is already loaded
statusIndicator.textContent = state.mode || "normal"
document.body.appendChild(statusIndicator)
document.head.appendChild(style)
} catch (e) {
// But on slower pages we wait for the document to load
window.addEventListener("DOMContentLoaded", () => {
statusIndicator.textContent = state.mode || "normal"
document.body.appendChild(statusIndicator)
document.head.appendChild(style)
})
}
browser.storage.onChanged.addListener((changes, areaname) => {
if (areaname === "local" && "state" in changes) {

12
src/dom.ts
View file

@ -492,15 +492,3 @@ export function setupFocusHandler(): void {
// Handles when the page tries to select an input
hijackPageFocusFunction()
}
export function appendTo(parent, child) {
try {
// On quick loading pages, the document is already loaded
parent.appendChild(child)
} catch (e) {
// But on slower pages we wait for the document to load
window.addEventListener("DOMContentLoaded", () =>
parent.appendChild(child),
)
}
}

6
src/excmds.ts
View file

@ -1531,12 +1531,6 @@ export async function qall() {
windows.map(window => browser.windows.remove(window.id))
}
/** Convenience shortcut for [[qall]]. */
//#background
export async function qa() {
qall()
}
// }}}
// {{{ MISC

37
src/requests.ts
View file

@ -1,5 +1,8 @@
import * as config from "./config"
import * as csp from "csp-serdes"
import Logger from "./logging"
const logger = new Logger("requests")
class DefaultMap extends Map {
constructor(private defaultFactory, ...args) {
@ -7,12 +10,10 @@ class DefaultMap extends Map {
}
get(key) {
let ans = super.get(key)
if (ans === undefined) {
ans = this.defaultFactory(key)
super.set(key, ans)
if (!this.has(key)) {
this.set(key, this.defaultFactory(key))
}
return ans
return super.get(key)
}
}
@ -38,14 +39,30 @@ export function clobberCSP(response) {
() => new Set(),
csp.parse(cspHeader.value),
)
logger.info(
"given CSP",
cspHeader.value,
"parsed CSP",
policy,
"reserialized CSP",
csp.serialize(policy),
)
policy.delete("sandbox")
policy
.get("style-src")
.add("'unsafe-inline'")
.add("'self'")
// policy.get("script-src").add("'unsafe-eval'")
// Loosen style-src directive if it or default-src are present.
if (policy.has("default-src") && !policy.has("style-src")) {
policy.set("style-src", policy.get("default-src"))
}
if (policy.has("style-src")) {
policy
.get("style-src")
.add("'unsafe-inline'")
.add("'self'")
}
// Replace old CSP
cspHeader.value = csp.serialize(policy)
logger.info("new CSP", cspHeader.value, "parsed as", policy)
return { responseHeaders: headers }
} else {
return {}

2
src/static/clippy/tutor.md
View file

@ -25,7 +25,7 @@ The idea behind Tridactyl is to allow you to navigate the web more efficiently w
- You can enter this mode with `:` and exit it with `Escape` or `Enter`.
- Ignore mode
- This mode passes all keypresses through to the web page. It is useful for websites that have their own keybinds, such as games and Gmail.
- You can enter the mode with `I` and leave it with `Shift-Esc`.
- You can toggle the mode with `Shift-Insert`.
Almost all of the modes are controlled by series of keypresses. In this tutorial, a sequence of keys such as `zz` should be entered by pressing the key `z`, letting go, and then pressing the key `z`. There is no need to hold both keys at once, if that were even possible. (`zz` resets the zoom level to the default, so it probably didn't seem to do anything). Sometimes `help` refers to a command that must be entered in command mode; it should hopefully always be clear from context which we mean.

5
src/static/commandline.html
View file

@ -1,4 +1,5 @@
<html>
<!DOCTYPE html>
<html class="TridactylOwnNamespace">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/cleanslate.css">
@ -6,7 +7,7 @@
</head>
<body>
<div id="completions"></div>
<div id="command-line-holder">:<input id="tridactyl-input"></input></div>
<div id="command-line-holder"><span id="tridactyl-colon"></span><input id="tridactyl-input"></input></div>
<script src="../commandline_frame.js"></script>
</body>
</html>

6
src/static/css/commandline.css
View file

@ -27,11 +27,15 @@ input {
background: var(--tridactyl-cmdl-bg);
border: unset;
/* reduce the padding from the colon */
margin-left: -0.25ex;
/* margin-left: -0.25ex; */
/* we currently have a border from the completions */
/* border-top: solid 1px lightgray; */
}
#tridactyl-colon::before{
content: ":"
}
/* COMPLETIONS */
#completions {

3
src/static/css/newtab.css
View file

@ -36,7 +36,8 @@ input[id^="spoiler"] ~ .spoiler {
opacity: 0;
margin: 10px auto 0;
padding: 10px;
background: #eee;
background: var(--tridactyl-highlight-box-bg);
color: var(--tridactyl-highlight-box-fg);
border: 1px solid #ccc;
border-radius: 2px;
transition: all .6s;

3
src/static/newtab.template.html
View file

@ -1,4 +1,5 @@
<html lang="en" style="display: none;">
<!doctype html>
<html lang="en" style="display: none;" class="TridactylOwnNamespace">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/newtab.css">

184
src/static/themes/dark.css
View file

@ -1,27 +1,163 @@
:root.TridactylThemeDark {
--tridactyl-fg: #ccc;
--tridactyl-bg: #111;
/* {{{ photon-colours */
--tridactyl-cmdl-fg: #ccc;
--tridactyl-cmdl-bg: #111;
/* From https://github.com/overdodactyl/ShadowFox/blob/7dbe9343da87bde804e8fb88dd3b5eaaeb4817b2/css/common-files/color_variables.css */
--tridactyl-photon-colours-magenta-50: #ff1ad9;
--tridactyl-photon-colours-magenta-60: #ed00b5;
--tridactyl-photon-colours-magenta-70: #b5007f;
--tridactyl-photon-colours-magenta-80: #7d004f;
--tridactyl-photon-colours-magenta-90: #440027;
--tridactyl-photon-colours-purple-50: #9400ff;
--tridactyl-photon-colours-purple-60: #8000d7;
--tridactyl-photon-colours-purple-70: #6200a4;
--tridactyl-photon-colours-purple-80: #440071;
--tridactyl-photon-colours-purple-90: #25003e;
--tridactyl-photon-colours-blue-40: #45a1ff;
--tridactyl-photon-colours-blue-50: #0a84ff;
--tridactyl-photon-colours-blue-60: #0060df;
--tridactyl-photon-colours-blue-70: #003eaa;
--tridactyl-photon-colours-blue-80: #002275;
--tridactyl-photon-colours-blue-90: #000f40;
--tridactyl-photon-colours-teal-50: #00feff;
--tridactyl-photon-colours-teal-60: #00c8d7;
--tridactyl-photon-colours-teal-70: #008ea4;
--tridactyl-photon-colours-teal-80: #005a71;
--tridactyl-photon-colours-teal-90: #002d3e;
--tridactyl-photon-colours-green-50: #30e60b;
--tridactyl-photon-colours-green-60: #12bc00;
--tridactyl-photon-colours-green-70: #058b00;
--tridactyl-photon-colours-green-80: #006504;
--tridactyl-photon-colours-green-90: #003706;
--tridactyl-photon-colours-yellow-50: #ffe900;
--tridactyl-photon-colours-yellow-60: #d7b600;
--tridactyl-photon-colours-yellow-70: #a47f00;
--tridactyl-photon-colours-yellow-80: #715100;
--tridactyl-photon-colours-yellow-90: #3e2800;
--tridactyl-photon-colours-red-50: #ff0039;
--tridactyl-photon-colours-red-60: #d70022;
--tridactyl-photon-colours-red-70: #a4000f;
--tridactyl-photon-colours-red-80: #5a0002;
--tridactyl-photon-colours-red-90: #3e0200;
--tridactyl-photon-colours-orange-50: #ff9400;
--tridactyl-photon-colours-orange-60: #d76e00;
--tridactyl-photon-colours-orange-70: #a44900;
--tridactyl-photon-colours-orange-80: #712b00;
--tridactyl-photon-colours-orange-90: #3e1300;
--tridactyl-photon-colours-grey-10: #f9f9fa;
--tridactyl-photon-colours-grey-20: #ededf0;
--tridactyl-photon-colours-grey-30: #d7d7db;
--tridactyl-photon-colours-grey-40: #b1b1b3;
--tridactyl-photon-colours-grey-50: #737373;
--tridactyl-photon-colours-grey-60: #4a4a4f;
--tridactyl-photon-colours-grey-70: #38383d;
--tridactyl-photon-colours-grey-80: #2a2a2e;
--tridactyl-photon-colours-grey-90: #0c0c0d;
--tridactyl-photon-colours-code-green: #86de74!important;
--tridactyl-photon-colours-warning-color: #FCE19F;
--tridactyl-photon-colours-warning-background-color: #44391F;
--tridactyl-photon-colours-theme-highlight-green: #86DE74;
--tridactyl-photon-colours-theme-highlight-blue: #75BFFF;
--tridactyl-photon-colours-theme-highlight-purple: #B98EFF;
--tridactyl-photon-colours-theme-highlight-red: #FF7DE9;
--tridactyl-photon-colours-theme-highlight-yellow: #FFF89E;
--tridactyl-photon-colours-theme-highlight-bluegrey: #5e88b0;
--tridactyl-photon-colours-theme-highlight-lightorange: #d99b28;
--tridactyl-photon-colours-theme-highlight-orange: #d96629;
--tridactyl-photon-colours-theme-highlight-pink: #df80ff;
--tridactyl-photon-colours-tone-1: var(--tridactyl-photon-colours-grey-10);
--tridactyl-photon-colours-tone-2: var(--tridactyl-photon-colours-grey-20);
--tridactyl-photon-colours-tone-3: var(--tridactyl-photon-colours-grey-30);
--tridactyl-photon-colours-tone-4: var(--tridactyl-photon-colours-grey-40);
--tridactyl-photon-colours-tone-5: var(--tridactyl-photon-colours-grey-50);
--tridactyl-photon-colours-tone-6: var(--tridactyl-photon-colours-grey-60);
--tridactyl-photon-colours-tone-7: var(--tridactyl-photon-colours-grey-70);
--tridactyl-photon-colours-tone-8: var(--tridactyl-photon-colours-grey-80);
--tridactyl-photon-colours-tone-9: var(--tridactyl-photon-colours-grey-90);
--tridactyl-photon-colours-accent-1: var(--tridactyl-photon-colours-blue-40);
--tridactyl-photon-colours-accent-2: var(--tridactyl-photon-colours-blue-50);
--tridactyl-photon-colours-accent-3: var(--tridactyl-photon-colours-blue-60);
--tridactyl-photon-colours-in-content-page-color: var(--tridactyl-photon-colours-tone-4)!important;
--tridactyl-photon-colours-in-content-page-background: var(--tridactyl-photon-colours-tone-7)!important;
--tridactyl-photon-colours-in-content-text-color: var(--tridactyl-photon-colours-tone-3)!important;
--tridactyl-photon-colours-in-content-selected-text: var(--tridactyl-photon-colours-tone-1)!important;
--tridactyl-photon-colours-in-content-box-background: var(--tridactyl-photon-colours-tone-6)!important;
--tridactyl-photon-colours-in-content-box-background-odd: #f3f6fa;
--tridactyl-photon-colours-in-content-box-background-hover: var(--tridactyl-photon-colours-tone-6)!important;
--tridactyl-photon-colours-in-content-box-background-active: var(--tridactyl-photon-colours-tone-6)!important;
--tridactyl-photon-colours-in-content-box-border-color: var(--tridactyl-photon-colours-tone-5)!important;
--tridactyl-photon-colours-in-content-item-hover: rgba(0,149,221,0.25);
--tridactyl-photon-colours-in-content-item-selected: var(--tridactyl-photon-colours-tone-8)!important;
--tridactyl-photon-colours-in-content-border-highlight: var(--tridactyl-photon-colours-accent-1)!important;
--tridactyl-photon-colours-in-content-border-focus: var(--tridactyl-photon-colours-accent-1)!important;
--tridactyl-photon-colours-in-content-border-color: var(--tridactyl-photon-colours-tone-6)!important;
--tridactyl-photon-colours-in-content-category-outline-focus: 1px dotted #0a84ff;
--tridactyl-photon-colours-in-content-category-text: var(--tridactyl-photon-colours-tone-4)!important;
--tridactyl-photon-colours-in-content-category-text-active: #0c0c0d;
--tridactyl-photon-colours-in-content-category-text-selected: var(--tridactyl-photon-colours-accent-1)!important;
--tridactyl-photon-colours-in-content-category-text-selected-active: #0060df;
--tridactyl-photon-colours-in-content-category-background-hover: rgba(12,12,13,0.1);
--tridactyl-photon-colours-in-content-category-background-active: rgba(12,12,13,0.15);
--tridactyl-photon-colours-in-content-category-background-selected-hover: rgba(12,12,13,0.15);
--tridactyl-photon-colours-in-content-category-background-selected-active: rgba(12,12,13,0.2);
--tridactyl-photon-colours-in-content-tab-color: #424f5a;
--tridactyl-photon-colours-in-content-link-color: var(--tridactyl-photon-colours-accent-1)!important;
--tridactyl-photon-colours-in-content-link-color-hover: var(--tridactyl-photon-colours-accent-2)!important;
--tridactyl-photon-colours-in-content-link-color-active: #003eaa;
--tridactyl-photon-colours-in-content-link-color-visited: #0a8dff;
--tridactyl-photon-colours-in-content-primary-button-background: var(--tridactyl-photon-colours-accent-2)!important;
--tridactyl-photon-colours-in-content-primary-button-background-hover: var(--tridactyl-photon-colours-accent-3)!important;
--tridactyl-photon-colours-in-content-primary-button-background-active: var(--tridactyl-photon-colours-accent-3)!important;
--tridactyl-photon-colours-in-content-table-border-dark-color: var(--tridactyl-photon-colours-tone-7)!important;
--tridactyl-photon-colours-in-content-table-header-background: var(--tridactyl-photon-colours-accent-2)!important;
--tridactyl-photon-colours-theme-selection-background: var(--tridactyl-photon-colours-accent-2)!important;
--tridactyl-photon-colours-theme-selection-background-hover: var(--tridactyl-photon-colours-accent-1)!important;
--tridactyl-photon-colours-in-content-category-header-background: var(--tridactyl-photon-colours-tone-8)!important;
--tridactyl-photon-colours-selected-icon-fill-color: var(--tridactyl-photon-colours-tone-2)!important;
--tridactyl-photon-colours-in-content-dark-header-background: var(--tridactyl-photon-colours-tone-9)!important;
--tridactyl-photon-colours-secure-connection-color: var(--tridactyl-photon-colours-accent-1);
--tridactyl-photon-colours-theme-sidebar-background: #1B1B1D!important;
--tridactyl-photon-colours-cm-background: var(--tridactyl-photon-colours-tone-8)!important;
--tridactyl-photon-colours-cm-selection: #353b48!important;
--tridactyl-photon-colours-cm-marker: #555!important;
--tridactyl-photon-colours-cm-linenumber: #58575c!important;
--tridactyl-photon-colours-cm-cursor: #fff!important;
--tridactyl-photon-colours-cm-active-line-background: rgba(185,215,253,.15)!important;
--tridactyl-photon-colours-cm-matching-bracket: rgba(255,255,255,.25)!important;
--tridactyl-photon-colours-cm-search-background: rgba(24,29,32,1)!important;
--tridactyl-photon-colours-cm-red: #de7474!important;
--tridactyl-photon-colours-start-indicator-for-updater-scripts: black;
--tridactyl-photon-colours-end-indicator-for-updater-scripts: black;
--tridactyl-photon-colours-dummy-variable-for-updater-scripys: black;
/* }}} */
--tridactyl-fg: var(--tridactyl-photon-colours-in-content-page-color);
--tridactyl-bg: var(--tridactyl-photon-colours-in-content-page-background);
--tridactyl-cmdl-fg: var(--tridactyl-photon-colours-in-content-text-color);
--tridactyl-cmdl-bg: var(--tridactyl-photon-colours-in-content-category-header-background);
/* --tridactyl-header-first-bg: var(--tridactyl-photon-colours-in-content-category-header-background); */
/* --tridactyl-header-second-bg: var(--tridactyl-photon-colours-in-content-category-header-background); */
/* --tridactyl-header-third-bg: var(--tridactyl-header-first-bg); */
--tridactyl-header-first-bg: #333;
--tridactyl-header-second-bg: #222;
--tridactyl-header-third-bg: #111;
--tridactyl-cmplt-fg: var(--tridactyl-cmdl-fg);
--tridactyl-cmplt-bg: #474747;
--tridactyl-cmplt-border-top: 1px solid var(--tridactyl-cmdl-bg);
--tridactyl-cmplt-border-top: 1px solid var(--tridactyl-photon-colours-in-content-category-header-background);
--tridactyl-url-fg: var(--tridactyl-cmdl-fg);
--tridactyl-url-bg: var(--tridactyl-header-first-bg);
--tridactyl-url-fg: var(--tridactyl-photon-colours-code-green);
--tridactyl-url-bg: var(--tridactyl-bg);
--tridactyl-of-fg: #FFF;
--tridactyl-of-bg: #204E8A;
--tridactyl-of-fg: var(--tridactyl-photon-colours-warning-color);
--tridactyl-of-bg: var(--tridactyl-photon-colours-warning-background-color);
--tridactyl-hintspan-fg: white;
--tridactyl-hintspan-bg: #204E8A;
/* Hints are not photon coloured. Feel free to experiment with that */
--tridactyl-hintspan-fg: white;
--tridactyl-hintspan-bg: #204E8A;
--tridactyl-hint-active-fg: #333;
--tridactyl-hint-active-bg: #88FF00;
@ -29,8 +165,26 @@
--tridactyl-hint-bg: rgba(13, 31, 54, 0.25);
--tridactyl-hint-outline: 1px solid var(--tridactyl-hintspan-bg);
--tridactyl-highlight-box-bg: var(--tridactyl-photon-colours-in-content-box-background);
--tridactyl-highlight-box-fg: var(--tridactyl-photon-colours-in-content-text-color);
}
:root.TridactylThemeDark #completions table tr td {
color: var(--tridactyl-cmplt-fg);
:root.TridactylThemeDark.TridactylOwnNamespace
input[id^="spoiler"] ~ .spoiler {
border-color: var(--tridactyl-photon-colours-in-content-box-border-color);
}
/* These rules have greater specificity than the rules applying the variables
* above, which causes *issues*. */
/* :root.TridactylThemeDark.TridactylOwnNamespace */
/* a:link { */
/* color: var(--tridactyl-photon-colours-in-content-link-color); */
/* } */
/* :root.TridactylThemeDark.TridactylOwnNamespace */
/* a:link:visited { */
/* --tridactyl-photon-colours-in-content-link-color-visited: #0a8dff; */
/* } */

6
src/static/themes/default.css
View file

@ -44,7 +44,7 @@
/*commandline*/
--tridactyl-cmdl-bg: var(--tridactyl-bg);
--tridactyl-cmdl-fg: var(--tridactyl-fg)
--tridactyl-cmdl-fg: var(--tridactyl-fg);
--tridactyl-cmdl-line-height: 1.5;
--tridactyl-cmdl-font-family: monospace;
--tridactyl-cmdl-font-size: 9pt;
@ -94,4 +94,8 @@
--tridactyl-of-fg: var(--tridactyl-fg);
--tridactyl-of-bg: #FFEC8B;
/*new tab spoiler box*/
--tridactyl-highlight-box-bg: #eee;
--tridactyl-highlight-box-fg: var(--tridactyl-fg);
}

26
src/static/themes/quake.css Normal file
View file

@ -0,0 +1,26 @@
:root.TridactylThemeQuake {
--tridactyl-bg: black;
--tridactyl-fg: lightgreen;
}
:root.TridactylThemeQuake #completions .sectionHeader {
display: none
}
:root.TridactylThemeQuake #tridactyl-colon::before {
content: "] "
}
:root.TridactylThemeQuake #completions .focused, :root.TridactylThemeQuake #completions .focused .url{
background: var(--tridactyl-bg);
text-decoration: underline;
}
:root.TridactylThemeQuake #cmdline_iframe {
position: fixed !important;
bottom: unset;
top: 0% !important;
left: 0% !important;
box-shadow: rgba(0,0,0,0.5) 0px 0px 15px !important;
opacity: 0.9
}

2
src/static/themes/shydactyl.css
View file

@ -12,7 +12,7 @@
:root.TridactylThemeShydactyl #tridactyl-input{
padding: 1rem;
color: var(--tridactyl-fg);
width: 97%;
width: 90%;
font-size: 1.5rem;
line-height: 1.5;
color: black;

7
src/tridactyl.d.ts vendored
View file

@ -54,3 +54,10 @@ declare function html(
declare namespace browser.webRequest {
function filterResponseData(requestId: string): any
}
// Stop typedoc complaining about toBeAll.
declare namespace jest {
interface Matchers<R> {
toBeAll: any
}
}