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

Change commandline and completions to look more like Vimperator

Browse source
This commit is contained in:
Oliver Blanthorn 2017-10-22 11:08:43 +01:00
parent b78be56273
commit 242fcce1c3
No known key found for this signature in database
GPG key ID: 2BB8C36BB504BFF3
3 changed files with 27 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/commandline_content.ts
View file

@ -25,13 +25,17 @@ function init(){
// every time. // every time.
init() init()
// The CSS in this file should probably go in static/
export function show(){ export function show(){
cmdline_iframe.setAttribute("style", "position: fixed; bottom: 0; left: 0; z-index: 10000; width: 100%; height: 36px; border: 0; padding: 0; margin: 1;"); // I don't understand how CSS works - but this ensures that the commandline is always at the bottom of the page.
cmdline_iframe.setAttribute("style", "position: fixed; bottom: 0; left: 0; z-index: 10000; width: 100%; height: 24px; border: 0; padding: 0; margin: 0;");
const height = cmdline_iframe.contentWindow.document.body.offsetHeight + 'px'
cmdline_iframe.setAttribute("style", `position: fixed; bottom: 0; left: 0; z-index: 10000; width: 100%; height: ${height}; border: 0; padding: 0; margin: 0;`);
} }
export function resize() { export function resize() {
const height = cmdline_iframe.contentWindow.document.body.offsetHeight + 'px' const height = cmdline_iframe.contentWindow.document.body.offsetHeight + 'px'
cmdline_iframe.setAttribute("style", `position: fixed; bottom: 0; left: 0; z-index: 10000; width: 100%; height: ${height}; border: 0; padding: 0; margin: 1;`); cmdline_iframe.setAttribute("style", `position: fixed; bottom: 0; left: 0; z-index: 10000; width: 100%; height: ${height}; border: 0; padding: 0; margin: 0;`);
} }
export function hide(){ export function hide(){

2
src/excmds.ts
View file

@ -454,7 +454,7 @@ function formatTab(tab: browser.tabs.Tab, prev?: boolean) {
else if (prev) formatted += "#" else if (prev) formatted += "#"
if (tab.pinned) formatted += "@" if (tab.pinned) formatted += "@"
formatted = formatted.padEnd(9) formatted = formatted.padEnd(9)
// TODO: Dynamically set favicon dimensions. // TODO: Dynamically set favicon dimensions. Should be able to use em.
formatted += tab.favIconUrl formatted += tab.favIconUrl
? `<img src="${tab.favIconUrl}" height="10px" width="10px"> ` ? `<img src="${tab.favIconUrl}" height="10px" width="10px"> `
: `<img src="${DEFAULT_FAVICON}" height="10px" width="10px"> ` : `<img src="${DEFAULT_FAVICON}" height="10px" width="10px"> `

28
src/static/commandline.css
View file

@ -6,27 +6,32 @@ body {
input { input {
width: 100%; width: 100%;
padding: 0; padding: 0;
font-family: mono; font-family: "mono", "monospace", "Courier New";
font-size: 8pt; font-size: 10pt;
color: black;
border: unset;
/* we currently have a border from the completions */
/* border-top: solid 1px lightgray; */
padding-left: 0.5ex;
} }
#completions { #completions {
background: black; background: white;
color: white; color: black;
display: inline-block; display: inline-block;
font-family: mono; font-family: mono;
font-size: 8pt; font-size: 10pt;
height: auto; height: auto;
line-height: 1.5em; /* line-height: 1.5em; */
overflow: hidden; overflow: hidden;
bottom: 36px;
white-space: pre; white-space: pre;
width: 100%; width: 100%;
z-index: 9998; z-index: 9998;
border-top: 1px solid lightgray;
} }
.url, a.url, a.url:link, a.url:visited { .url, a.url, a.url:link, a.url:visited {
background: black; background: white;
color: #d0ffd0 !important; color: #d0ffd0 !important;
display: inline; display: inline;
left: 50%; left: 50%;
@ -37,6 +42,13 @@ input {
z-index: 9999; z-index: 9999;
} }
/* Hide the URLs if the screen is small */
@media all and (max-width: 980px) {
.url, a.url, a.url:link, a.url:visited {
display: none;
}
}
a.url:hover { a.url:hover {
cursor: pointer; cursor: pointer;
text-decoration: underline !important; text-decoration: underline !important;