The Missing Logo

[marcusbjoerkqvist]

Matthew and I both finally realized what's missing from the new RESPECT! page: the logo. I think it should be placed similarly to its placement on the old site, i.e. top left in the menu black-space. Can this be done, or will that make the logo look strange? If not in the top-level menu, is there anywhere else we could put the logo so that it shows on every page?

[cccs-ip]

Thanks, Marcus. I had actually been thinking about this for the past couple of days. I don't have an answer. To put it in the top left (like the CCCS logo) would make it very small. I suppose we could re-introduce the search and try to write the html for the header in such a way that the logo would occupy two 'lines', but even with this it would be small. [Actually, I now see that by adding in the 'tag line', I forced the menu on the second page and thereby made our request to Paul to remove the search somewhat unnecessary. We can try dropping the tag line and seeing what this does... in a day or two...]

Would it be OK just to place it in the content on a few pages?

[pwhipp]

random thoughts -

• You could make it part of a watermark that appears faint behind everything.
• You could make it part of a background image that surround
• You could put it above the nav bar as a banner like the original site's banner but have the banner scroll off the page and the nav bar 'stick' at the top (Cristi should be able to help with this - it's something I've been thinking of as a cute feature for a while but not got around to trying to do).

[marcusbjoerkqvist]

For now, I've put the logo on every page as a "text separator". I previously had other images to do this (a request from Matthew to make the text look lighter), but I noticed that these did not look good at all on mobile devices. The logo, however, looks great as a text separator on my iPhone at least. This is a temporary measure; I will get Matthew's input on Friday.

Now, a remaining issue: I want to center-align the logos on every page, but no matter how I try it in the editor I can't get it to stay in the middle. How do I do this?

[cccs-ip]

Look for html tutorials. On mobile now but will help to look later. Should
be within a element. Something like align = center
On 30 Jul 2014 14:32, "Marcus Bjoerkqvist" notifications@github.com wrote:

For now, I've put the logo on every page as a "text separator". I
previously had other images to do this (a request from Matthew to make the
text look lighter), but I noticed that these did not look good at all on
mobile devices. The logo, however, looks great as a text separator on my
iPhone at least. This is a temporary measure; I will get Matthew's input on
Friday.

Now, a remaining issue: I want to center-align the logos on every page,
but no matter how I try it in the editor I can't get it to stay in the
middle. How do I do this?

—
Reply to this email directly or view it on GitHub
#10 (comment).

[cccs-ip]

Read this http://www.netmechanic.com/news/vol7/html_no10.htm

Also look into "IMG align=center"
On 30 Jul 2014 15:28, "Aaron Dennis" aaron.dennis@crossculturalconsult.com
wrote:

Look for html tutorials. On mobile now but will help to look later. Should
be within a element. Something like align = center
On 30 Jul 2014 14:32, "Marcus Bjoerkqvist" notifications@github.com
wrote:

For now, I've put the logo on every page as a "text separator". I
previously had other images to do this (a request from Matthew to make the
text look lighter), but I noticed that these did not look good at all on
mobile devices. The logo, however, looks great as a text separator on my
iPhone at least. This is a temporary measure; I will get Matthew's input on
Friday.

Now, a remaining issue: I want to center-align the logos on every page,
but no matter how I try it in the editor I can't get it to stay in the
middle. How do I do this?

—
Reply to this email directly or view it on GitHub
#10 (comment).

[cccs-ip]

Logo looks good, but also maybe we need higher resolution?
On 30 Jul 2014 14:32, "Marcus Bjoerkqvist" notifications@github.com wrote:

For now, I've put the logo on every page as a "text separator". I
previously had other images to do this (a request from Matthew to make the
text look lighter), but I noticed that these did not look good at all on
mobile devices. The logo, however, looks great as a text separator on my
iPhone at least. This is a temporary measure; I will get Matthew's input on
Friday.

Now, a remaining issue: I want to center-align the logos on every page,
but no matter how I try it in the editor I can't get it to stay in the
middle. How do I do this?

—
Reply to this email directly or view it on GitHub
#10 (comment).

[cccs-ip]

I can't get any of the HTML working either. I see it working until the
save, after which it reverts to right align. Maybe assign to Paul?
On 30 Jul 2014 14:32, "Marcus Bjoerkqvist" notifications@github.com wrote:

For now, I've put the logo on every page as a "text separator". I
previously had other images to do this (a request from Matthew to make the
text look lighter), but I noticed that these did not look good at all on
mobile devices. The logo, however, looks great as a text separator on my
iPhone at least. This is a temporary measure; I will get Matthew's input on
Friday.

Now, a remaining issue: I want to center-align the logos on every page,
but no matter how I try it in the editor I can't get it to stay in the
middle. How do I do this?

—
Reply to this email directly or view it on GitHub
#10 (comment).

[marcusbjoerkqvist]

I replaced the logos in an attempt to increase the resolution. Let me know what you think.

[marcusbjoerkqvist]

Re-assigned to Paul. Please help us figure out how to center-align images on Mezzanine!

[cccs-ip]

Logo looking good in higher res, but ultra slow to load. Middle ground
needed.
On 30 Jul 2014 18:00, "Marcus Bjoerkqvist" notifications@github.com wrote:

Re-assigned to Paul. Please help us figure out how to center-align images
on Mezzanine!

—
Reply to this email directly or view it on GitHub
#10 (comment).

[pwhipp]

First, you need to pay attention to what you are centering in. This can create problems with columnar layout if you want to break the column layout for an item. Thus in the case of the logo on the front page we naturally center with respect to the left column (the right column width is not used in the centering calculation - to use it, you would have to break the right column into two - a whole world of hurt).

The tool to use to work this sort of thing out is the "Developer Tools" in Chromium (under the tools menu option). Once this is open, select the magnifying glass and you can interactively examine the CSS and html making up the page.

Using this we can see that the image is full size so the margins have no effect and you need to align the image within its enclosing element.

Next - a little gotcha - The tinymce editor tries to ensure that nobody breaks anything with page content so it filters out a lot of tags and styling. To style the document, we have to change the filtering in the admin settings ("Rich text filtering"). That gives us the rope we need.

I've done this. Looks OK now.