not a support question
propagandalabs
Member
Hi,
1. On mobile, the logo graphic appears to be stretched and very pixellated. We are uploading a graphic through Angular Theme Styling per specs. Testing a larger graphics makes the standard wed logo huge, which we don't want either - we just want small, clean logos on all devices. Please hlep.
2. We have successfully hidden the logo from all pages but home through .logo{}, but this did not effect the mobile version. We cannot seem to find the css for mobile. Please help.
smalltimewine
Member
I can point your in what may be the right direction...
Remember, there is no "mobile" version. Rather the layout flow and styles are dependent on the width of the browser view port. I believe the styles that you are after are in the layout.css beginning around 2304 (may vary depending on your version). Some of the responsive layout also depends on grid.css, but I don't recall any of the .logo styles in there.
I hope this helps based on what I believe you're after.
Devin
Moderator
Hi propagandalabs,
The previous tip was actually correct in what you are looking for. In mobile devices, the css says to use the styles listed around lines 2304. So you will need to add the .logo rules there if you want a mobile device to obey the same rules as larger screens.
As for the pixelation, I'm not sure what could be causing this. Do you have a link where I can see the logo/issue live?
propagandalabs
Member
Hi Devin,
Thanks - yes you can compare it on your mobile device, link below. What appears to be happening is the mobile is actually upscaling/stretching it a bit. The solution should be simple: use a larger graphic so that the mobile has to downscale rather than upscale. That would be great if the standard browser version didn't become ginourmous, so any ideas on how to force a dimensions on the standard version? One idea we have, since we only want the logo on home(s), is to bypassing the angular admin "logo" altogether and displaying a logo via css " background: url()" etc.
propagandalabs
Member
Devin, we have a more pressing issue and you seem to be the most responsive...thanks in advance: http://www.kriesi.at/support/topic/angular-slider-stops-on-click
propagandalabs
Member
Ok here is the very simple solution to hide your logo from everything but the home page on mobile devices - a huge advantage for viewing content when clicked from a thumb. This requires your home page id:
@media only screen and (max-width: 479px) {#top .logo, #top .logo a, #top .logo img {display:none!important;;}
#top.page-id-6 .logo, #top.page-id-6 .logo a, #top.page-id-6 .logo img {display: block!important;} }
You must log in to post.
Please start by registering an account for this forum here
Create a new thread and tell me what problems you are encountering and what you want to know.
There is no step 3 :)
We try to answer all questions within a day, monday-friday.
