New Websites styling issues
Tue, 04/07/2009 - 04:04
Seems to be a lot of various places where this is being discussed. Let's consolidate and use this thread to collect styling issues on the new site.
I will start.
The username text box still runs over the outer background. I am using Firefox 3.0.8 for Mac.
Links in the right column should highlight or be underlined on hover. The hand cursor is not enough.

The Disclaimer link doesn't go anywhere... Nor am I sure what we would want to disclaim.
Hello RKotenko
could you attache an screenshot
thanks
enzo
Well this link was in the origina design, I waiting someone provide the content for this section, or maybe is better remove?
regards
enzo
We should remove this link.
Can't upload issue since I am at work and not on my mac.
More stuff (firefox 2.0.0.12) -
Example site:
1) Header is far too wordy. Beside the Qcubed logo is a title. It is unneeded and far too long. Such as:
Qcubed Examples - 1.1 (QCubed 1.1)
* Reverse Relationships (One-to-One and One-to-Many)
The example screen itself tells us it is Revers Relationships. Don't need the redundancy.
2) The forum, blog, and chat links in the menu from examples.que.be all go to examples.que.be, so they do not work.
3) http://examples.qcu.be/examples/multiple_qform/intro.php - the panels overflow the main part of the page
Link removed
Redundancy removed
Menu Fixed
Example panel fixed
Also I detect some peding issues
Examples Broken
http://examples.qcu.be/examples/qcodo_query/migrating.php
http://examples.qcu.be/examples/image_label/intro.php
Examples with Css hard coded (needs to be fixed)
http://examples.qcu.be/examples/advanced_ajax/drop_zone.php
http://examples.qcu.be/examples/advanced_ajax/resize.php
http://examples.qcu.be/examples/treenav/treenav.php
http://examples.qcu.be/examples/other_controls/image.php
Volunteers.
Please check and put in subversion the examples changes
enzo
Thanks. A few more things:
- Top right link to Updates should point to http://trac.qcu.be/projects/qcubed/timeline
- IE8 rendering of the header on the examples site isn't right- overlaps.
- On the forum pages (like this page: http://qcu.be/content/website-issues), the QCubed logo in the top left should take you to the qcu.be homepage.
Menu updated
IE8: sorry I don't experience with IE8 css fixes
Forums: this is the normal behavior, I can't reproduce that.
Alex you have right to put example changes on subversion?
Regards
I just fixed IE8 rendering myself.
I do have rights to update example changes on subversion, but I'd like to do that when the CSS changes are completely finished.
http://examples.qcu.be/examples/image_label/intro.php fixed
http://examples.qcu.be/examples/treenav/treenav.php fixed
http://examples.qcu.be/examples/advanced_ajax/resize.php fixed
http://examples.qcu.be/examples/advanced_ajax/drop_zone.php fixed, but as a result, product bug opened: http://trac.qcu.be/projects/qcubed/ticket/213
http://examples.qcu.be/examples/other_controls/image.php fixed
http://examples.qcu.be/examples/qcodo_query/migrating.php needs to be removed from the codebase, it makes no sense in the new world.
I've played a little bit with firebug and have a solution for a non-fixed width of the layout. The current layout is limited to 962 px, but I think modern websites should be flexible and adapt to the browser-width.
For this following changes should be made to the css definition:
#wrapper
width: 95%;
#header
width: 100%;
#nav
width: 100%;
#home-tag
width: 100%;
#bar
width: 100%;
.sidebar-right #center
width: 70%;
#sidebar-right
width: 15%;
The only problem left is the image at the #home-tag div. This could be centered with a new css-class
IMG.displayed {display: block;
margin-left: auto;
margin-right: auto }
Then use this class on the img-definiton
<IMG class="displayed" ...The more elegant solution would be to split the image in one left floating image for the QCubed symbol and a right floating image with the "download" image. Between this can be a background image thats flexible.
Maybe this is of use.
P.S: Just want to point again to the great css framework YAML (http://www.yaml.de/en/home.html)
Hello akrohn
Thanks a lot for your help. all your css suggestion was applyied, for the moment the homepage image is center, I will contact to mike to try to get the psd file for this image, I guess with this PSD we could do your suggestion for this part.
Thanks a lot again
regards
enzo
In the examples section when clicking "View Source" the new windows header is there but not visible. I took a look at the CSS with Firebug and the Body is white as is the text in the header. I verified in IE7 as well as Firefox 3.0.
Nice catch-up.
I was working in this fix, when I read you post, now look ok again.
Regards
enzo
Looks great now!
enzo,
There are multiple issues using Firefox 3 and the examples section. Here is a screenshot:
As you can see, the header is not correctly sized. Also, the view source link is not visible because it is the same color as the background (this may be a visited link issue). You can see the Previous link, which is NOT an actual link, but the other two links are also not visible. lastly, the datagrid does not line up with the text above it. Less of an issue, but it would look nicer.
The link colors also apply to IE6, but the header issue does not.
I have fixed these issues in the past - twice, actually. It seems that we've somehow reintroduced them. Enzo, please talk to Mike about how we can set up source control on the examples site.
Another issue.
There needs to be a way to get to subsequent pages of a forum thread at the TOP. Currently, I have to scroll all the way to the bottom to find 1, 2...next. Highly annoying.
I'd just increased pagination limit for forum threads to 100 so that we hopefully won't see pagination at all.
I would rather not have to scroll down to the bottom of 100 message (possibly) to see them all, particularly if I have been following the thread.
If I click on a link under "Comments," it should take me to THAT comment, not the start, which it does I think, but only if the message are one page.
So I guess upping the comment count WOULD solve that. But it also affects load time if a thread becomes very large. So I think I am still for pagination but the comment links need to be fixed to go to the proper page.
Why are we debating the performance implications of this? There is exactly 1 thread on the forum right now that has pagination. On average, I expect 95% of the threads to not have pagination. I think increasing the limit (and waiting a tad longer for that particular thread to load) is a fine solution here. This does automatically save the "links to go to proper page" problem.
Whoa. Settle down. I merely pointed out a possible implication. Geez.
This is not a big deal. But it would be nice to have a forum that performs like nearly every other forum on the internet. Because there could be a time when our site has lots of traffic and posts and future planning is nice.
Hey, sorry - I didn't meant to sound offensive in any way. I just saw that you reverted my change (switching back from 100->25 items per page), and that rubbed me the wrong way. Honestly, I don't care that much - either way, it's fine, even with that small bug, as the number of affected forum topics is negligible.
Feel free to take whichever approach seems best.
I don't have the power to change the site.
So it was not me. :)
Double-sorry then :-)