Logo in der Smartphone Ansicht

More
1 week 3 days ago - 1 week 3 days ago #192687 by mistersurvey
Hello, I am using the fruity theme of limesurvey. When I reduce the screen size the logo disappears. Where can I change this? I want to have the logo also visible on smartphones. Maybe I have to make some adjustments to the media-queries, but on which file?

Attachments:
Last edit: 1 week 3 days ago by mistersurvey.

Please Log in or Create an account to join the conversation.

LimeSurvey Partners
More
1 week 3 days ago #192688 by Joffm
Hi,
this is the English part of the forum.
So, please, write in English or use the German part.

Hallo, dies ist der englische Teil des Forums.
Daher schreibe bitte auf Englisch oder nutze den deuteschen Teil.

Joffm


Volunteers are not paid.
Not because they are worthless, but because they are priceless

Please Log in or Create an account to join the conversation.

More
1 week 3 days ago - 1 week 3 days ago #192695 by tpartner
Extend the theme and either...

1) Add something like this to the end of your custom.css file:

@media only screen and (max-width: 767px) {
	.logo-container.hidden-xs {
		display: block !important;
	}
}


2) Edit nav_bar.twig to remove the "hidden-xs" class from the .logo-container element:


Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Attachments:
Last edit: 1 week 3 days ago by tpartner.

Please Log in or Create an account to join the conversation.

More
1 week 9 hours ago - 1 week 9 hours ago #192790 by mistersurvey
Thanks for your help! One design-issue left. Is there any possibility to smaller the size between the logo and the burger button or better make them both inline?



{# Logo option #}
        {% if( aSurveyInfo.options.brandlogo == "on") %}
            <div class="{{ aSurveyInfo.class.navbarbrand }} logo-container"  {{ aSurveyInfo.attr.navbarbrand }}  >
                {{ image(aSurveyInfo.options.brandlogofile, aSurveyInfo.name, {"class": "logo img-responsive"}) }}
            </div>
        {% else %}
            <div class="{{ aSurveyInfo.class.navbarbrand }}"  {{ aSurveyInfo.attr.navbarbrand }} >
                {{ aSurveyInfo.name }}
            </div>
        {% endif %}
Attachments:
Last edit: 1 week 9 hours ago by mistersurvey.

Please Log in or Create an account to join the conversation.

More
1 week 1 hour ago #192802 by tpartner
Try something adding something like this to the end of your custom.css file (untested because I'm responding from my phone):

@media only screen and (max-width: 767px) {
	.logo-container.hidden-xs {
		max-width: 60%;
	}
}

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com

Please Log in or Create an account to join the conversation.

More
4 days 14 hours ago #192835 by mistersurvey
This makes the logo smaller in all screen sizes which I didn't want. Thanks anyway.

Please Log in or Create an account to join the conversation.

More
4 days 11 hours ago #192863 by tpartner
Can you activate a sample survey and give a link here so we can see the styles?

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!