FreiChat related discussions
Button on mobile over messenger send button - Humhub 1.8.2

Hello,


we installed the modul "freichat" on our humhub installation. All is find BUT: On mobile the "Chat-bubble" for click open chat is over the "send button" of the internal messenger of humhub, so the message can wrote but not send because the "Chat-Bubble" is over the send button. Can you give me a solution (for sure i am not the only one with this problem) This must define in CSS but in module there are no css settings. The bubble need set 20px higher from bottom then all is good on mobile view. I have a yearly subscription and send a ticket too!


60a2bf87b898d


Hello, we installed the modul "freichat" on our humhub installation. All is find BUT: On mobile the "Chat-bubble" for click open chat is over the "send button" of the internal messenger of humhub, so the message can wrote but not send because the "Chat-Bubble" is over the send button. Can you give me a solution (for sure i am not the only one with this problem) This must define in CSS but in module there are no css settings. The bubble need set 20px higher from bottom then all is good on mobile view. I have a yearly subscription and send a ticket too! ![60a2bf87b898d](serve/attachment&path=60a2bf87b898d)
edited May 17 at 8:24 pm

Open the style.css of your Codoforum theme with a editor like Sublime or Notepad and place the following code on the very bottom:


.FreiChatContainer .FreiChatLauncher {
bottom: 50px;
}

You can play around a bit with the bottom: 50px; pixel amount to fit your needs.


So for example:


bottom: 70px; or bottom: 30px;


I hope it will help you - let me know it please if you need further help.


Kind regards,


Andy smile


Open the **style.css** of your Codoforum **theme** with a editor like **Sublime** or **Notepad** and place the following code on the very bottom: ```` .FreiChatContainer .FreiChatLauncher { bottom: 50px; } ```` You can play around a bit with the _bottom: **50**px;_ pixel amount to fit your needs. So for example: bottom: 70px; or bottom: 30px; I hope it will help you - let me know it please if you need further help. Kind regards, Andy :)
edited May 17 at 11:56 pm

Hello,
i use Humhub and not CodoForum so i can not do this what you wrote.
In Humhub module for FreiChat there is no css or anything what i can change or define!


Hello, _**i use Humhub**_ and not CodoForum so i can not do this what you wrote. In _**Humhub module for FreiChat**_ there is no css or anything what i can change or define!
edited May 19 at 7:28 am

Sorry unfortunately, I misunderstood you and interpreted CodoForum instead of FreiChat - I was probably somewhere else with my thoughts.


But the solution remains roughly the same.


What you can do is call up the CSS in your HumHub theme (design) and add the code in my first answer to it.


Go to the file folder of the HumHub theme you are using and search for theme.css and then just follow the steps I explained above.


Those steps:


Open the theme.css or theme.less of your HumHub theme with a editor like Sublime or Notepad and place the following code on the very bottom, then save and upload it again to your server. Then clear the cache and all should be fine:


.FreiChatContainer .FreiChatLauncher {
bottom: 50px;
}

This should fix your problem smile


If you need further help let me know it and I can try doing it for you.


Kind regards and sorry again,


Andy smile


**Sorry** unfortunately, I misunderstood you and interpreted CodoForum instead of FreiChat - I was probably somewhere else with my thoughts. But the solution remains **roughly the same**. What you can do is call up the **CSS in your HumHub theme** (design) and add the code in my first answer to it. Go to the file folder of the HumHub theme you are using and search for **theme.css** and then just follow the steps I explained above. Those steps: Open the **theme.css** or **theme.less** of your HumHub theme with a editor like **Sublime** or **Notepad** and place the following code on the very bottom, then save and upload it again to your server. Then clear the cache and all should be fine: ```` .FreiChatContainer .FreiChatLauncher { bottom: 50px; } ```` This should fix your problem ;) If you need further help let me know it and I can try doing it for you. Kind regards **and sorry again**, Andy :)
edited May 19 at 7:29 pm

I reply to the ticket .... and did not need what i must do or what you need now from me to fix this problem. and your service chat i everytime noone online


Hello, i have test now in different way and it is not working.
I add it to theme.css of humhub and nothing changed (i cleared caches too (Sytem and Browser))
There must add anything in module for humhub because i can not find a css direct in module
Can you give me modification of modules where this is intergrated with need changes.


Greeeting


I reply to the ticket .... and did not need what i must do or what you need now from me to fix this problem. and your service chat i everytime noone online Hello, i have test now in different way and it is not working. I add it to theme.css of humhub and nothing changed (i cleared caches too (Sytem and Browser)) There must add anything in module for humhub because i can not find a css direct in module Can you give me modification of modules where this is intergrated with need changes. Greeeting
edited May 21 at 9:11 am

@admin and @AdeshRohanDsilva (for some reason your name can not be mentioned) would you be so kind and take a second look at the matter.

All the best for you @sstrasser I hope it will get fixed soon - thanks for your patience.

Kind regards,


Andy smile


@admin and @AdeshRohanDsilva (for some reason your name can not be mentioned) would you be so kind and take a second look at the matter. All the best for you @sstrasser I hope it will get fixed soon - thanks for your patience. Kind regards, Andy ;)
edited May 21 at 4:55 pm

Hi


We have replied to this in email as we need some specific details to give the correct CSS code


Hi We have replied to this in email as we need some specific details to give the correct CSS code
Necessity is the mother of all inventions!

@admin thank you smile

A question please, for personal interest and to learn something new:


I was a bit surprised that my dirty CSS snippet didn't work - I tested it via the CSS input in the browser developer console and it worked well. I have no idea why our user @sstrasser was unfortunately unsuccessful with it - what was wrong?

Kind regards and thanks for your work mates,


Andy smile


@admin thank you :) ### A **question please**, for personal interest and to learn something new: I was a bit surprised that my dirty CSS snippet didn't work - I tested it via the CSS input in the browser developer console and it worked well. I have no idea why our user @sstrasser was unfortunately unsuccessful with it - what was wrong? Kind regards and thanks for your work mates, Andy ;)
edited May 22 at 7:16 pm

Hey @WebCrew

You tested the css via browser developer and that is why it worked.
The reason it didn't work for @sstrasser is because freichat loads itself inside a shadow dom so css styles are not applied directly.
You need to apply them inside the shadow dom.

Hey @WebCrew You tested the css via browser developer and that is why it worked. The reason it didn't work for @sstrasser is because freichat loads itself inside a shadow dom so css styles are not applied directly. You need to apply them inside the shadow dom.
Necessity is the mother of all inventions!

@admin

Wow thanks for the nice explanation, now it makes total sense to me and I've learned something new. Really great, thank you again. smile


Kind regards,


Andy smile


@admin Wow thanks for the nice explanation, now it makes total sense to me and I've learned something new. Really great, **thank you again**. :) Kind regards, Andy :)
92
10
4
live preview
enter atleast 10 characters
WARNING: You mentioned %MENTIONS%, but they cannot see this message and will not be notified
Saving...
Saved
With selected deselect posts show selected posts
All posts under this topic will be deleted ?
Pending draft ... Click to resume editing
Discard draft