update
This commit is contained in:
Bram Kelchtermans
parent
e65706921b
commit
7f0f2d27bc
15
README.md
15
README.md
|
|
@ -10,7 +10,6 @@ I didn't make any editions at Userchrome.css and I didn't find any way to export
|
|||
#### Step 1 - Install addons and resources ⬇️:
|
||||
- [Sidebery](https://addons.mozilla.org/pt-BR/firefox/addon/sidebery/) to sidebar
|
||||
- [Tabliss](https://addons.mozilla.org/pt-BR/firefox/addon/tabliss/) to "new tab" page
|
||||
- [Firefox Color](https://addons.mozilla.org/en-US/firefox/addon/firefox-color/) to color
|
||||
- [DM Sans](https://fonts.google.com/specimen/DM+Sans) to font
|
||||
|
||||
#### Step 2 - Configure Floorp Browser and extensions:
|
||||
|
|
@ -22,15 +21,15 @@ I didn't make any editions at Userchrome.css and I didn't find any way to export
|
|||
- Design `about:preferences#design` -> Bookmarks Toolbar -> Hide the Bookmarks Toolbar unless hovering over the navigation bar (Optional, you can simply choose to hide the favorite bar always)
|
||||
- Design `about:preferences#design` -> Other Preferences -> Round the corners of pages
|
||||
- Navigate to Sidebery Settings ⚙️:
|
||||
- Sidebery Settings -> Help -> Import addon data -> Import the settings I left in Github
|
||||
- Sidebery Settings -> Help -> Import addon data -> Import the settings I left in the repo
|
||||
|
||||
#### Step 3 (Last Step) - Customize Themes 🎨:
|
||||
- Go to [Firefox Color](https://color.firefox.com/?fromAddon=true) (extension needed) and color according to your preferences or install [Darker Leo's](https://addons.mozilla.org/addon/darker-leo-s/) theme.
|
||||
- Go to new tab (tabliss needs to be installed!) settings
|
||||
- Background -> Upload Images -> Upload the image of your choice (I used this [site](https://www.sightunseen.com/2018/08/spanish-artist-ana-montiel-color-field-paintings-digital-art/), this [image](https://www.sightunseen.com/wordpress/wp-content/uploads/2018/08/Fields26-AllRealitiesCoExistingEverywhereForever.jpg))
|
||||
- Widgets -> Remove all widgets and add Literature Clock
|
||||
- Go to Customize Toolbar (By clicking on an empty place of the Firefox title bar)
|
||||
- Add 5 Flexible Space to the left and right of the search bar.
|
||||
- Copy the contents of the `userChrome.css` in this repo
|
||||
- Open the `userChrome.css` file 📁:
|
||||
- Floorp options -> Help -> More troubleshooting information -> Under 'Profile Directory' click on 'Open Directory'
|
||||
- Navigate to the chrome folder and open the `userChrome.css` file
|
||||
- Paste the contents of the file
|
||||
- Restart Floorp
|
||||
|
||||
#### Bonus: Other things
|
||||
- If you want to use SplitView along with Sidebery, just add as a shortcut:
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,64 @@
|
|||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userChrome.css" is a custom CSS file that can be used to specify CSS style rules for Floorp's interface (NOT internal site) using "chrome" privileges.
|
||||
For instance, if you want to hide the tab bar, you can use the following CSS rule:
|
||||
|
||||
**************************************
|
||||
#TabsToolbar { *
|
||||
display: none !important; *
|
||||
} *
|
||||
**************************************
|
||||
|
||||
NOTE: You can use the userChrome.css file without change preferences (about:config)
|
||||
|
||||
Quote: https://userChrome.org | https://github.com/topics/userchrome
|
||||
|
||||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
@-moz-document url(chrome://browser/content/browser.xhtml)
|
||||
{
|
||||
#sidebar-box {
|
||||
--bar-width: 54px;
|
||||
position: relative !important;
|
||||
overflow-x: hidden !important;
|
||||
/* margin-right: calc(10px * -1) !important; */
|
||||
/* left: var(--bar-width) !important; */
|
||||
min-width: var(--bar-width) !important;
|
||||
max-width: var(--bar-width) !important;
|
||||
border-right: 1px solid var(--sidebar-border-color);
|
||||
z-index: 1;
|
||||
transition: all 0.1s;
|
||||
}
|
||||
|
||||
#sidebar-box:hover {
|
||||
--expanded-width: 250px;
|
||||
margin-right: calc(
|
||||
calc(var(--expanded-width) - var(--bar-width)) * -1
|
||||
) !important;
|
||||
/* left: var(--expanded-width) !important; */
|
||||
min-width: var(--expanded-width) !important;
|
||||
max-width: var(--expanded-width) !important;
|
||||
}
|
||||
|
||||
#sidebar-box:hover #sidebar-header {
|
||||
min-width: var(--expanded-width) !important;
|
||||
max-width: var(--expanded-width) !important;
|
||||
}
|
||||
|
||||
/* #sidebar-header is hidden by default, change "none" to "inherit" to restore it. */
|
||||
#sidebar-header {
|
||||
min-width: var(--bar-width) !important;
|
||||
max-width: var(--bar-width) !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
/* #sidebar-splitter styles the divider between the sidebar and the rest of the browser. */
|
||||
#sidebar-splitter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.browserStack {
|
||||
background-color: var(--toolbar-bgcolor) !important;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue