trinity-devel@lists.pearsoncomputing.net

Message: previous - next
Month: August 2014

Re: [trinity-devel] R: [trinity-devel] New TDEUI proposal

From: "E. Liddell" <ejlddll@...>
Date: Sun, 3 Aug 2014 12:47:33 -0400
On Sun, 3 Aug 2014 10:48:57 -0400
Alexandre <ac586133@...> wrote:

> 
> 
> > Date: Sun, 3 Aug 2014 14:44:30 +0100
> > From: michele.calgaro@...
> > To: trinity-devel@...
> > Subject: RE: [trinity-devel] R: [trinity-devel] New TDEUI proposal
> > 
> > > If someone here can help me to find a way to delimit the band
> > > to start at the end of the left picture and stop at the
> > >beginning of the right picture. 
> > 
> > In tde/main/tdelibs/doc/common you can find the basic pictures to start with. From bottom-right.png you can try to adjust the color to match the new schema.
> > And in tdebase/kcontrol/kcontrol/about the file top-right-kcontrol.png is the picture displayed at the top. We can overwrite that if necessary.
> > 
> > Cheers
> >   Michele
> > 
> Hi,
> 
> I think that we just didn't understood it in the same way :)
> I already have the pictures.
> 
> The top part is made of 3 items:
> -The left part, where there is the TDE logo. This part has a fixed size.
> -The middle part, which is where you see the horizontal stripe on the actual TDEUI. This part has an adaptive size, depending of the screen resolution.
> -The left part, where you can see the rounded part of the ribbon. This part has a fixed size.
> 
> Here is the drawing order of the current TDEUI:
> -The middle part is repeated horizontally across all of the screen width.
> -The left part is drawn on top of the left part.
> -The right part is drawn on top or the right part.
> 
> It causes no problems with the old TDEUI, because these pictures were not transparent at all. So, the left and right parts covers fully the middle part, which would be otherwise displayed all across the width of the window.
> But, with the transparent pictures, the problem is that this horizontal ribbon is still seen all across the screen, which is ugly, as in the attachement...
> 
> What I'd want to do is to find a way to make the middle part be drawn only at the end of the left picture and stop at the beginning of the right picture. Is it possible?
> 
> Also, I tried to transform the Welcome to... bar in a box, but for an unknown the same transparency that works for the box doesn't work for the bar... Which is pretty much going to stay a bar... Except that it can be adjusted to have the same width as the box under it.

That display is just an HTML page, {TDE}/share/apps/konqueror/about/intro.html
(more or less--there's some docbook-related injection, I think, but that's the base).
We're looking at, in part (whitespace collapsed somewhat in the interest of brevity):

    <div ID="header">
      <div ID="headerL"></div>
      <div ID="headerR"></div>
      <div ID="title">Konqueror</div>
      <div ID="tagline">Conquer your Desktop!</div>
    </div>

There are two governing stylesheets for this file (on my system, they're
/usr/kde/3.5/share/apps/kdeui/about/kde_infopage.css and
/usr/kde/3.5/share/apps/konqueror/about/konq.css, but the locations
will be slightly different on a proper Trinity system).  The relevant
bits here are:

#header {
  background-image: url(top-middle.png);
  width: 100%;
  height: 131px;
}

from the first file and

#headerR {
  width: 430px;
  height: 131px;
  background-image: url(top-right-konqueror.png);
}

from the second.

In other words, the stripe continues on through the right side of the header
because it's being displayed as the background of the enclosing element.
The easiest ways to fix this are to 1. provide an opaque background for
the headerR div (possibly not workable for this design) or 2. create a
headerCenter div to display the background.  It's possible that a couple
of other pages from the same directory will need to be edited to match.

Oh, and, in general, I can adjust the header and sidebar in the webpage,
wiki, and bugzilla designs to match this better if we decide we want to
go for it.

E. Liddell