https://github.com/godiesc/firefox-one

Firefox Theme for Opera One skin Lovers
https://github.com/godiesc/firefox-one

css firefox firefox-one one opera opera-one tema theme theme-css

Last synced: 3 days ago
JSON representation

Firefox Theme for Opera One skin Lovers

• Host: GitHub
• URL: https://github.com/godiesc/firefox-one
• Owner: Godiesc
• License: mpl-2.0
• Created: 2023-07-21T20:05:17.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-10-06T02:05:32.000Z (about 1 month ago)
• Last Synced: 2024-10-30T07:46:16.448Z (14 days ago)
• Topics: css, firefox, firefox-one, one, opera, opera-one, tema, theme, theme-css
• Language: CSS
• Homepage:
• Size: 15.3 MB
• Stars: 310
• Watchers: 7
• Forks: 9
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Firefox-ONE Theme for Opera One skin Lovers 



(ES) Tema para los amantes de la skin de Opera-ONE.

(EN) A theme for Opera-ONE Skin Lovers.



![Light_dark_splash](https://github.com/Godiesc/firefox-one/assets/22057609/dd708561-8227-48a9-b287-64696f8116fb)

## ¿Cómo instalar? - How to install?

(ES) Pasos para configurar el tema:



   
Descarga el tema desde la sección Releases.



   
Descomprime el archivo y copia la carpeta 👉chrome👈 y el archivo 👉user.js👈 dentro de la carpeta de perfil de tu usuario de firefox. Para encontrar el directorio de tu perfil de usuario ve a  about:support or about:profiles.

   
Instala y usa un tema compatible.

   
Reinicia el navegador.



(EN) Steps to configure the theme:



   
Download the theme from the Releases section.
 

   
Unzip the file and copy the 👉chrome👈 folder and the 👉user.js👈 file into your Firefox profile directory. To find out the location of your profile directory go to  about:support or about:profiles.

   
Install and use a compatible theme.

   
Restart the browser.



> 
⚠ Notice: The latest code updated in the repository (code > download zip) may work well only on beta or nightly versions.


## Temas - Themes



Temas Principales - Main Themes: 🧿light/dark adaptive Theme



 Otros Colores - Other Colors:

🔴Fuchsia 🔵Blue 🟢Green🖍 Poison 🎑 Swamp🌈Red-Blur 🌆 Purple-Sky 💜Purple 💚Aquamarine 🦧Orange 💠Cyan 🍏GreenLight 💛Yellow  🗻Gray



   
Temas Claros - Light themes:  ⚪🔴 Fuchsia  ⚪🔵 Waves





   

Here a "Video Explanation" to how switch into light and dark mode if necessary.


## Important Information 💎

Notice:



You can use flexible spaces to create separatos in the tabs-bar.

For Left-sidebar the theme use the bookmarks bar, so it should be always on.

The social extensions used to put in the left-sidebar are: 





















## Optional Features

For the next features you need to create the rules in about:config page.



Left-sidebar disabled


    firefoxone.style_without_leftsidebar

    true

Default colors disabled


    firefoxone.without-default-colors

    true



Tree-tabs-style (e.g. Tab-center-reborn) 


    firefoxone.tree_tabs_style

    true

Tree-tabs-style without Left-sidebar

   

    firefoxone.tree_tabs_style

    true

   

    firefoxone.style_without_leftsidebar

    true


Selected tab gradient border


    firefoxone.selected_tab_gradient_border

    true

Image in menus


    firefoxone.image_in_menus

    true

Main-image


    firefoxone.main-image

    true

 

Rhythm image for tab with sound


    firefoxone.rhythm_sound_tab

    true

   



## Personalizar - Customize

Personalizaciones Varias - Various customizations





The file chrome/components/one_root-personal.css contains very useful and easy to use variables, so it is easier to change:



Wallpaper.

Height of the tabs and toolbar.

Width of the left-sidebar

Wordmark color from the new-tab page.

Hide or show the firefox logo or the search bar in the new-tab page.



Every variable has a description on the right, so you know what to customize without breaking the file.





Fondo Nueva Pestaña - NewTab Wallpaper



   
(Option 1) In the directory: chrome/newtab there are 12 wallpapers (6 for dark theme and 6 for light theme), those images will display in the NewTab options for you to choose, you could rename the images you want with those names and the theme will display them, you can add your own images. You can find more images in: This Gallery.



(Option 2) Editing the code chrome/components/one_root-personal.css lines from 19 to 32. With this method you can change too the accent color for each wallpaper.







Other 'about' pages Wallpaper



   


 For default the wallpaper selected is wallpaper-dark1.png and wallpaper-light1.png In the directory: chrome/newtab, you could rename the image you want with those names and the theme will display them in those pages, you can change the names in the chrome/components/one_root-personal.css file in the line 36 and the line 41 to the image you want.

   



Color Principal - Accent Color



It has manual customization of the accent color for userContent.css (preferences and add-ons page). The file in chrome/components/one_root-personal.css has the variable: --general-color to set the color, you could choose whatever you like. Restarting the browser is required. 



![Captura de pantalla 2022-06-05 155840](https://user-images.githubusercontent.com/22057609/172070426-0de79289-eaa3-4826-ac62-af6230cdf877.png)

## Compatibilidad - Compatibility



Linux - Manjaro KDE (Tested - Probado) ✔ - Preview



Windows 10 (Tested - Probado) ✔ - Preview



Windows 11 (Tested - Probado) ✔ - Preview



Windows 7 (Not tested - No probado) ❌ 

MacOS (Tested - probado) ⚠ - Preview



   


      
Left-sidebar active ❌ 

      
Tree-tab configuration ❌ 

   



>   PD: Tested in Windows 11 and MacOS by: Bali10050

## Known Issues - Problemas Conocidos



Not compatibility for RTL(right-to-left) languages.



## Related Topic - Tema relacionado



## Example of about:support

![120349392-b372f980-c2c3-11eb-904d-b088168fd849](https://user-images.githubusercontent.com/22057609/156908375-824f8679-56a5-4d09-a86f-353a7f61135e.png)