aboutsummaryrefslogtreecommitdiff
path: root/modules/firefox.home/chrome
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--modules/firefox.home/chrome/globalKeybindings.uc.js28
-rw-r--r--modules/firefox.home/chrome/loadingIndicator.uc.js2
-rw-r--r--modules/firefox.home/chrome/styles/variables.css9
-rw-r--r--modules/firefox.home/chrome/userChrome.css52
-rw-r--r--modules/firefox.home/chrome/userContent.css49
5 files changed, 121 insertions, 19 deletions
diff --git a/modules/firefox.home/chrome/globalKeybindings.uc.js b/modules/firefox.home/chrome/globalKeybindings.uc.js
index 51326fd..1ff868c 100644
--- a/modules/firefox.home/chrome/globalKeybindings.uc.js
+++ b/modules/firefox.home/chrome/globalKeybindings.uc.js
@@ -12,7 +12,7 @@
RELEASE: [
[ctrl(shift(key('J'))), moveSelectedTabBy(+1)],
[ctrl(shift(key('K'))), moveSelectedTabBy(-1)],
- [ctrl(shift(key('B'))), toggleTabSidebar()],
+ [ctrl(shift(key('B'))), sidetabs.toggle()],
[ctrl(alt(key('p'))), togglePassthrough(), { modes: ALL_MODES }],
],
PRESS: [
@@ -40,8 +40,15 @@
const moveSelectedTabBy = incr => () => updateSelectedTabIndex(incr);
const togglePassthrough = () => () => UC.globalKeybindings.updateMode(m => m !== MODE_PASSTHRU ? MODE_PASSTHRU : MODE_NORMAL)
- const getSidebarId = () => [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0];
- const toggleTabSidebar = () => () => SidebarController.toggle(getSidebarId() ?? undefined);
+ const sidetabs = {
+ getExtensionId: () => [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0],
+ ensureOpen: () => !SidebarController.isOpen && SidebarController.show(sidetabs.getExtensionId() ?? undefined),
+ toggle: () => () => {
+ sidetabs.ensureOpen();
+ const sidebar = document.getElementById('sidebar-box');
+ sidebar?.classList.toggle('open');
+ },
+ }
const MODE_PASSTHRU = 'passthru';
const MODE_NORMAL = '';
@@ -96,16 +103,21 @@
handleKeyUpEvent: e => module.evaluateKeybindings(module.keybindings.RELEASE, e),
handleKeyDownEvent: e => module.evaluateKeybindings(module.keybindings.PRESS, e),
+ onWindowReady: (win) => {
+ win.addEventListener('keyup', module.handleKeyUpEvent, true);
+ win.addEventListener('keydown', module.handleKeyDownEvent, true);
+
+ sidetabs.ensureOpen();
+ },
+
init(win) {
- let observe = () => {
+ const observe = () => {
Services.obs.removeObserver(observe, 'browser-window-before-show');
- win.addEventListener('keyup', module.handleKeyUpEvent, true);
- win.addEventListener('keydown', module.handleKeyDownEvent, true);
+ module.onWindowReady(win)
}
if (win.__SSi) {
- win.addEventListener('keyup', module.handleKeyUpEvent, true);
- win.addEventListener('keydown', module.handleKeyDownEvent, true);
+ module.onWindowReady(win)
} else {
Services.obs.addObserver(observe, 'browser-window-before-show');
}
diff --git a/modules/firefox.home/chrome/loadingIndicator.uc.js b/modules/firefox.home/chrome/loadingIndicator.uc.js
index 61ba50b..286376a 100644
--- a/modules/firefox.home/chrome/loadingIndicator.uc.js
+++ b/modules/firefox.home/chrome/loadingIndicator.uc.js
@@ -63,7 +63,7 @@
onProgressStateUpdate: (win, state) => {
/** @type {HTMLElement} */
const urlBar = win.gURLBar.textbox;
- console.log(state, urlBar);
+ // console.log(state, urlBar);
if (!urlBar) return;
// urlBar.style.setProperty('--ff-urlbar-progress', perc);
diff --git a/modules/firefox.home/chrome/styles/variables.css b/modules/firefox.home/chrome/styles/variables.css
new file mode 100644
index 0000000..f002f1f
--- /dev/null
+++ b/modules/firefox.home/chrome/styles/variables.css
@@ -0,0 +1,9 @@
+:root {
+ --ff-accent-color: #4e3aA3;
+ --ff-accent-color-1: #8161ff;
+ --ff-bg-color: #0f0c19;
+ --ff-bg-color-1: #16121f;
+ --ff-bg-color-2: #26222f;
+ --ff-urlbar-height: 28px;
+}
+
diff --git a/modules/firefox.home/chrome/userChrome.css b/modules/firefox.home/chrome/userChrome.css
index e50a3db..4133251 100644
--- a/modules/firefox.home/chrome/userChrome.css
+++ b/modules/firefox.home/chrome/userChrome.css
@@ -1,10 +1,4 @@
-:root {
- --ff-accent-color: #4e3aA3;
- --ff-bg-color: #0f0c19;
- --ff-bg-color-1: #16121f;
- --ff-bg-color-2: #26222f;
- --ff-urlbar-height: 28px;
-}
+@import url('./styles/variables.css');
#navigator-toolbox {
--tab-min-height: 16px;
@@ -12,7 +6,7 @@
--tab-block-margin: 0;
--toolbarbutton-inner-padding: 6px;
--toolbar-bgcolor: var(--ff-bg-color);
- --toolbar-field-background-color: var(--ff-bg-color-2);
+ --toolbar-field-background-color: var(--ff-bg-color-1);
--toolbarbutton-border-radius: 0;
--toolbar-start-end-padding: 2px;
}
@@ -30,6 +24,18 @@ toolbarbutton {
min-height: 0;
}
+/* Rounded browser content window */
+#browser {
+ background-color: var(--ff-bg-color);
+}
+#appcontent {
+ margin: 4px;
+ margin-top: 0;
+ border-radius: 6px;
+ border: 1px solid rgba(255,255,255,0.06);
+ overflow: hidden;
+}
+
/* Tabs */
@@ -112,7 +118,8 @@ toolbarbutton#alltabs-button {
#nav-bar {
border-top: none !important;
- background-color: var(--ff-bg-color-1) !important;
+ background-color: var(--ff-bg-color) !important;
+ padding: 4px 2px !important;
}
#urlbar-container {
@@ -125,6 +132,9 @@ toolbarbutton#alltabs-button {
left: 0 !important;
width: 100% !important;
}
+#navigator-toolbox {
+ border-bottom: none !important;
+}
.urlbar-input-container {
background-color: var(--ff-bg-color-2) !important;
@@ -157,7 +167,27 @@ toolbarbutton#alltabs-button {
#sidebar-splitter {
display: none !important;
}
-
+#sidebar-box {
+ --sidebar-hover-width: 36px;
+ display: grid !important;
+ min-width: var(--sidebar-hover-width) !important;
+ max-width: var(--sidebar-hover-width) !important;
+ overflow: visible !important;
+ height: 100% !important;
+ min-height: 100% !important;
+ max-height: 100% !important;
+}
+#sidebar {
+ height: 100% !important;
+ width: 100% !important;
+ min-width: 0 !important;
+}
+#sidebar-box.open {
+ --sidebar-visible-width: 240px;
+ width: var(--sidebar-visible-width) !important;
+ min-width: var(--sidebar-visible-width) !important;
+ max-width: var(--sidebar-visible-width) !important;
+}
/* URL bar progress indicator */
@@ -190,3 +220,5 @@ toolbarbutton#alltabs-button {
animation: ucLoadingSnimation 2.2s ease-in-out infinite;
border-bottom: 2px solid var(--ff-accent-color);
}
+
+
diff --git a/modules/firefox.home/chrome/userContent.css b/modules/firefox.home/chrome/userContent.css
new file mode 100644
index 0000000..b7361e8
--- /dev/null
+++ b/modules/firefox.home/chrome/userContent.css
@@ -0,0 +1,49 @@
+@import url('./styles/variables.css');
+
+/* @-moz-document domain(moz-extension://292e7676-1ee2-4c2d-8b18-19529d893b17/src/entries/sidebar/sidebar.html) { */
+/* html, body, * { */
+/* border: 5px solid red !important; */
+/* padding: 5rem !important; */
+/* } */
+/* } */
+
+@-moz-document domain(lite.duckduckgo.com) {
+ html, body {
+ background-color: var(--ff-bg-color-1) !important;
+ color: white !important;
+ }
+
+ body {
+ width: 100%;
+ margin: auto;
+ max-width: 900px !important;
+ }
+
+ a {
+ color: var(--ff-accent-color-1) !important;
+ }
+
+ .result-link {
+ font-size: 1rem !important;
+ }
+
+ .did-you-mean {
+ font-size: 0.8rem !important;
+ }
+ .did-you-mean br {
+ display: none !important;
+ }
+
+ select.submit {
+ display: none !important;
+ }
+
+ .link-text {
+ color: #888 !important;
+ }
+
+ .header {
+ font-size: 1rem !important;
+ }
+}
+