To compile the custom extended theme you would do something like this after changing any scss file
themes/SuiteP/css/CUSTOM/style.scss [COMPILE TO] themes/SuiteP/css/CUSTOM/style.css
What is the top level file for the default layout? For example if I want to compile login.scss?
I tried
sass themes/SuiteP/css/suitep-base/login.scss modules/Users/login.css
But it’s throwing an error Error: Undefined variable.
Which is probably because I shouldn’t be compiling that single file but rather the top level one instead
You should be able to run a Robo command to compile the whole theme in one go if that works better for you? Try running ./vendor/bin/robo build:suite-p.
Let me know how well or if at all this works for you
you can make a backup of your vendor directory (just in case) and then install composer and run this:
composer install
I think the package is produced with a vendor generated with composer install --no-dev, which has less stuff in it.
Warning: never user composer update or composer upgrade unless you really want to run SuiteCRM with untested version of compnents. Always use composer install, which updates only stuff that we asked to be updated.
Is there something else I can try to recompile the login.css file specifically? Or may be I shouldn’t even be going through SASS for that specific file at all?
The second one is included by style.scss and its content ends up bundled in style.css.
The first one is not even scss, so no need to compile it, I guess. It’s possible you can customize it in custom/Users/login.css, but you’re probably better off just adding the styles you need in a custom/themes/yourtheme/css/style.css. Note that for this last file, you don’t need to use a full copy with everything, you can just put in a couple of styles and they are conveniently appended to the main style.css file.
haha yeah i think i’m not even changing the right file
for this specific example, I’m just trying to change the following CSS element
div.p_login .p_login_top a {
This shows to users before they login, so I’m not sure what theme would need to be compiled. Is it Dawn? If the system doesn’t know user’s preferences does it show Dawn theme by default?
I changed the SCSS file in dawn and recompiled the whole thing but it’s not changing the login screen’s CSS
Thank you again for your help! I’d love to make a quick video afterwards to explain to others how this works
You can see in your browser’s console, at the login screen, which file it’s using for the CSS. I just checked and it was from Dawn in mine. but maybe this changes if you change some default in Admin area, I don’t recall.
I added a file called
custom/themes/SuiteP/css/Dawn/style.css
with contents
div.p_login .p_login_top a {
height: 100px!important;
}
then ran a quick rm cache/themes/SuiteP/css/Dawn/style.css just to make sure I am not seeing cached stuff and I was able to mess up my login screen effectively:
It might be worth exploring if there’s a way to place a custom CSS file that would get applied to ALL sub-themes, not just Dawn…
need to be extra careful as PGR mentioned some components are untested, I’m still checking but I suspect it may have resulted in the install getting hacked through phpunit framework