Hi Christoph, all,
On Sun, Jan 30, 2011 at 6:30 AM, Christoph Noack <email@example.com> wrote:
Hi Ivan, hi all!
Thanks for the CSS (Creating Superior Styles).
Am Samstag, den 29.01.2011, 07:53 +1300 schrieb Ivan M.:
For general highlighting, the green (or blue) style
should be used.
Yep. And by the way, also for the links on the page :-)
You mean blue links? If so, sure! I think they'd add some nice color
variety to the website. Would #1C99E0 be OK (middle blue from color
One option might be to use the relevant colorful box
for pages pertaining to Writer, Calc, Draw, etc, but since they are
shared with other styles (e.g. impress colors are used for an error
notice), this might not be such a good idea from a UX point of view.
Maybe Christoph can weigh in briefly?
I can ... let's start with the criticism :-) I had a look at the styles,
and I consider them a bit dark (low liminance contrast) when it comes to
text vs. background. Is there any chance to make them a bit lighter? I
know, you seem to have use the lightest colors, but ...
I could make them a little lighter (e.g. by putting a 10-20%
transparent white rectangle over the screenshot in an image editor and
taking the new color values)
And one CSS-newby question: is there any chance to apply a vertical
gradient to these boxes, or is a solid color required?
Yes, but no in some cases. That doesn't help, does it? :)
I'll start by noting that one of the advantages of these colorful
styles is that they can be combined with an optional icon. However,
this becomes a disadvantage if we want a vertical gradient.
A few examples of HTML code with the current styles:
<p class="Greenbox">Hello World</p> gives us a green box, and
<p class="Greenbox Tick">HelloWorld</p> gives us a green box with a tick, and
<p class="Tick">HelloWorld</p> gives us a paragraph with only a tick.
For this to work, the background-image CSS property can only be
defined once (i.e., no background image should be specified for
Greenbox, Bluebox, etc) as most browsers (even many recent ones) can
only display a single background image per HTML element. The
background image is reserved for the (optional) icons. That means we
can't achieve a vertical gradient through a background image (which
would be compatible with most browsers) as well as having optional
icons without adding extra HTML elements - e.g. <p
class="Greenbox"><span class="Tick">Hello World</span></p> - this
would be a small pain for content editors. In this example, the
vertical gradient background would be assigned to the <p> element, and
the icon would then be assigned to the <span> element.
It is certainly possible to create a vertical background gradient with
CSS3 , but it would only work in a few (mostly "cutting-edge")
browsers. If you see this as an extra/optional enhancement (that is,
you think the current single background color implementation, which is
compatible with virtually all browsers, is OK), then I have no problem
with adding some nice CSS3 stuff (as we did on the OOo website with
rounded corners for the login box).
Hopefully that made sense :).
Concerning the colors and the applications ... if we would use full
color coding for the applications, we might also run into trouble when
it comes to LibreOffice (the application, either gray or green) and Calc
(green). So if we use slight color coding, then I do see no problems.
How about we lighten the colors (to improve display on older browsers)
and then implement CSS3 gradients as an extra?
For example, having only dark strokes for the applications, or using the
(thanks to Paulo now great looking) document icons, then we don't run
into trouble. In this case, we also differentiate by intensity (intense
= application, slight = new CSS styles).
Oh yes, definitely - I'd like to create some styles with the new
icons. Unfortunately I won't have time to do this until Wednesday (if
anyone wants to step in and do this, by all means go ahead) - but I
hope we can come to a consensus regarding the things discussed above
by then. After that, I'd like to make a second round of improvements
to these new styles and hopefully make them final (for the short term
You remember this?
Of course :). Just as well we didn't implement that, otherwise it
would have become out of date by 2010 (considering the OOo 3.2.1
Unsubscribe instructions: E-mail to firstname.lastname@example.org
List archive: http://listarchives.libreoffice.org/www/website/
*** All posts to this list are publicly archived for eternity ***
Re: [libreoffice-website] CSS Styles for Website (Was: Problem with CSS) · Rimas Kudelis
- Re: [libreoffice-website] CSS Styles for Website (Was: Problem with CSS) (continued)
Impressum (Legal Info)
: Unless otherwise specified, all text and images
on this website are licensed under the
Creative Commons Attribution-Share Alike 3.0 License
This does not include the source code of LibreOffice, which is
licensed under the Mozilla Public License (MPLv2
"LibreOffice" and "The Document Foundation" are
registered trademarks of their corresponding registered owners or are
in actual use as trademarks in one or more countries. Their respective
logos and icons are also subject to international copyright laws. Use
thereof is explained in our trademark policy