Custom CSS in BBB v2.5

[Jerome Loubens]

Hello, I have a problem with the new version 2.5.2.
We had a custon.css file in the folder
/var/www/bigbluebutton-default/
In our NGINX it is well called.
On version 2.4 everything was OK.
On version 2.5.1 it worked.
This WE I updated my 10 servers to version 2.5.2 and since then my CSS is no longer called.
Do you have any idea what could be stuck?
Thanks

[Jerome Loubens]

Hello
Small information, we are in a modal on our site.
I changed
CustomStyleurl: https://my.domain.com/mycustom.css
In the /usr/share/meteor/bundle/Programs/Server/assets/app/config/settings.yml file
It works when a teacher and a student award a meeting.
When the teacher leaves the meeting, it cuts it and everyone is informed that it is finished.
Unfortunately the student has a request to press a button that redirects it to the site in the modal and does not close it.
On previous versions 2.4 and 2.5.1 We did not have this concern.
Someone to help me?
Thanks

[Jerome Loubens]

Hello
Anyone to give me a hand?
@fred?

[Fred Dixon]

Hi Jerome,

I would start looking first to see if there are any requests in the nginx log files

  /var/log/nginx/bigbluebutton.access.log

  /var/log/nginx/error.log

when your custom CSS is called to load. This will confirm that (a) the request came through for the custom CSS, and (b) whether the CSS file was located or not.

Regards,... Fred

--
You received this message because you are subscribed to the Google Groups "BigBlueButton-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bigbluebutton-...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bigbluebutton-dev/73475f4a-d09c-4a69-80a5-77eff04cca27n%40googlegroups.com.

--

BigBlueButton Developer

http://bigbluebutton.org/

Like BigBlueButton?  Tweet us at @bigbluebutton

[Jerome Loubens]

Thanks Fred.
my CSS is indeed called when the teacher starts the meeting, but when he leaves it, the CSS is no longer called.
It disappears from calls from participants.
What should I look for in the Logs? Because I can't find any errors, since my CSS is well called.

[Fred Dixon]

Hi Jerome,

Can you post a "hello world" version of your CSS with steps on how to add it to BigBlueButton.  Make it specific enough so that a developer could replicate this in 2.4 (see it work) and 2.5 (see it not work).

This will make it much easier for someone else to help pinpoint why it's not working in 2.5.

Regards,... Fred

To view this discussion on the web visit https://groups.google.com/d/msgid/bigbluebutton-dev/96e8102b-5cb2-4aa4-8b46-645bd8edbb43n%40googlegroups.com.

[Jerome Loubens]

OK
so we created a custom.css file with that

body > div[id="default-dropdown-menu"] ul.MuiMenu-list hr~li,
body > div[id="default-dropdown-menu"] ul.MuiMenu-list hr,
h1[data-test="meetingEndedModalTitle"] + div {
        display: none;
}

Which I put in /var/www/bigbluebutton-default/

I modified my NGINX server with the following line:

        location /custom.css {
          root /var/www/bigbluebutton-default;
          index index.html index.htm;
          exhale 1m;
        }

I also modified the file /usr/share/bigbluebutton/nginx/bbb-html5.nginx

with that :

################################################# #################
#
# proxy content must not be gzipped for this to work
proxy_set_header Accept-Encoding "";

# all types of content
sub_filter_types*;

# replace all instances
sub_filter_once off;

# add another stylesheet after the main style in the head-section
sub_filter '</head>' '<link rel="stylesheet" type="text/css" href="/custom.css"></head>';

# Removed PROF = 'end meeting' and PROF + HIGH = 'Leave meeting' buttons

# html5 v2.3.0 bbb client:
#
# sub_filter '</head>' '<style type="text/css">
# header[class^="navbar"] > div[class^="navbar"] > div[class^="top"] > div[class^="right"] > div[class^="dropdown"] li[class^="separator"] ~ li,
# header[class^="navbar"] > div[class^="navbar"] > div[class^="top"] > div[class^="right"] > div[class^="dropdown"] li[class^="separator"],
# div[class^="modal--"] > div[class^="content--"] > h1[data-test="meetingEndedModalTitle"] + div {
# display: none;
# }
# </style></head>';
#########################################
# html5 v2.4.0 bbb client:

sub_filter '</head>' '<style type="text/css">
div#default-dropdown-menu ul.MuiMenu-list > li[data-test="list-item-shortcuts"]~*,
> h1[data-test="meetingEndedModalTitle"] + div {
display: none;
}
</style></head>';


# examples:
#
# add an x ​​after the body tag
# sub_filter '<body>' '<body>x';
#
# replace all BigBlueButton with SmallRedHering
# sub_filter 'BigBlueButton' 'SmallRedHering';
# just kidding - this filter will break the HTML5 client
#
################################################# #################

We had to adapt after the switch from V2.3 to V2.4, but for BigBlueButton v2.5, it's something else again.

We have followed this information, adapting it:
https://github.com/bigbluebutton/bigbluebutton/issues/5836