[MIG] web_dark_mode: Migration to 18.0 #3324
Conversation
|
Thanks, it works for me. Did you test the dashboard? The background is white. |
- wait after PR OCA#3324 Liam Noonan <[email protected]>
The dashboard is, unfortunately, mostly canvas elements that I presume are rendered by JavaScript somewhere. I didn't look into it too much this time, but hopefully I'll be able to get it sorted later. |
|
FWIW, I have this in .app-menu-container {
background-image: url(/lambdao_web/static/src/img/logo_grey.svg) !important;
background-position: bottom right !important;
background-repeat: no-repeat !important;
background-size: 10% !important;
background-color: #899499 !important;
}and this in .app-menu-container {
background-color: #213330 !important;
}in any case, you don't need any JS to fix that. I had put a bunch of theme fixes for all the things I found egregious, this one being the worst offender :-) |
|
@len-foss |
|
@len-foss, Now, I am not very good with javascript, but it does seem that this is all being rendered in o_spreadsheet.js and the styles that are controlled by SCSS are deliberately set to stay in light mode even when dark mode is active in o_spreadsheet_extended.dark.scss the first lines of which contain a comment mentioning that odoo does not currently have an adequate toolchain to support darkmode in spreadsheet. |
|
Oh sorry for the confusion. After the previous message I saw that I had a bunch of "fixes" to the dark mode, but without proper doc on chat it was. I agree with your analysis 👍 |
Currently translated at 100.0% (4 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/es_AR/
Currently translated at 100.0% (4 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/hr/
Currently translated at 100.0% (4 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/tr/
Currently translated at 100.0% (4 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/es/
Currently translated at 50.0% (2 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/fr/
Currently translated at 100.0% (4 of 4 strings) Translation: web-16.0/web-16.0-web_dark_mode Translate-URL: https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_dark_mode/it/
Also, change asset bundle loading from 'prepend' to 'before' This is in line with Odoo's own way of doing it.
Also get rid of the bottom border.
If you go to any activity view and hover over an empty cell you will notice that without this fix the the on hover background of empty cells (.o_activity_empty_cell) set by $component-active-bg which is itself set as mix($o-action, $o-gray-100, 20%) through $o-component-active-bg completely ignores the overrides we set in primary_variables.dark.scss. This is because the assets for that view are lazy loaded, so we need to include our override bundles in the lazy bundle.
Just general customizations of BS variables to bring them in line with our style
Add secondary_variables override to get rid of colors that don't jive well with the dark background. Unfortunately this does introduce an issue where if you have many calendar users, you can run out of colors This issue exists in the enterprise dark mode as well, so hopefully it will be fixed.
Set the background color to be darker and tone down the border around it. The styling for the border is borrwed from the style of .o-mail-Composer-bg
Set attachment image background to white and fix the column background when hovering with a draggable card
…in forms It was being set to $o-form-lightsecondary which I set lighter, so this tones it down a bit.
I don't want to but my email on a public repo, so I just linked my github page instead. I could not find any guideline against this, but please correct me if there is.
7f977b2 to
a62a759
Compare
This PR includes and supersedes #3267 with the permission of @len-foss.
Migrates
web_dark_modefrom 16 to 18 and overhauls the SCSS not only to look better, but also to correspond to Odoo's native structure as seen in thewebmodule.As with the previous version, its scope is limited to the backend, and so has no effect on POS or website.
Also, I have submitted #3322 to make
web_theme_classicget along with this dark mode hope to do the same forweb_responsivesoon.Looking forward to any feedback!