threads / discuss / 24332

gitweb.css

Subject: gitweb.css

## tl;dr

7 messages between Jul 8, 2010 and Jul 8, 2010.

replies: 6people: 2as markdown or json

Eli Barzilay· Jul 8, 2010, 02:43 UTC · lore

I've been customizing a gitweb server to fit with the rest of our project pages (the result is http://git.racket-lang.org/). This was relatively easy to do except for a few places where gitweb.css specifies formatting for generic tags like `body', `table', and `td', which messed up our header.

Maybe it makes sense to localize these styles to to gitweb specific classes? (I know that I can just use my own css, but the file is big enough that I prefer avoiding manually merging in updates.)

-- 
          ((lambda (x) (x x)) (lambda (x) (x x)))          Eli Barzilay:
                    http://barzilay.org/                   Maze is Life!
Jakub Narebski· Jul 8, 2010, 16:07 UTC · re: Eli Barzilay · lore

Re: gitweb.css

Eli Barzilay <eli@barzilay.org> writes:
Show 9 quoted lines
> I've been customizing a gitweb server to fit with the rest of our
> project pages (the result is http://git.racket-lang.org/).  This was
> relatively easy to do except for a few places where gitweb.css
> specifies formatting for generic tags like `body', `table', and `td',
> which messed up our header.
> 
> Maybe it makes sense to localize these styles to to gitweb specific
> classes?  (I know that I can just use my own css, but the file is big
> enough that I prefer avoiding manually merging in updates.)

Can't you just override gitweb's CSS by your own CSS? Later CSS wins. You can have more than one stylesheet in gitweb (@stylesheets).

We could give class to `body' element, and the use it for other class-less selectors (`'table', `'td', `a'), but I don't know if this solution would be enought for you. It means replacing 'body' selector by e.g. '.gitweb_body' selector, and e.g. 'a' selector by '.gitweb_body a' selector.

I'd rather not add 'gitweb' class (or similar) to every element just to have common style for all links, tables, table header cells, table cells.

P.S. while changing static/gitweb.css we could optimize it by removing unnecessary parts of selector. Contrary to what I thought more detailed selector decreases rather than improves performance.

-- 
Jakub Narebski
Poland
ShadeHawk on #git
Eli Barzilay· Jul 8, 2010, 17:42 UTC · re: Jakub Narebski · lore

Re: gitweb.css

On Jul  8, Jakub Narebski wrote:
Show 15 quoted lines
> Eli Barzilay <eli@barzilay.org> writes:
> 
> > I've been customizing a gitweb server to fit with the rest of our
> > project pages (the result is http://git.racket-lang.org/).  This was
> > relatively easy to do except for a few places where gitweb.css
> > specifies formatting for generic tags like `body', `table', and `td',
> > which messed up our header.
> > 
> > Maybe it makes sense to localize these styles to to gitweb specific
> > classes?  (I know that I can just use my own css, but the file is big
> > enough that I prefer avoiding manually merging in updates.)
> 
> Can't you just override gitweb's CSS by your own CSS?  Later CSS
> wins.  You can have more than one stylesheet in gitweb
> (@stylesheets).

I know -- and I'm using that. The problem is if there's a property that we're not defining, then it won't get overridden -- and doing so requires knowing what the default value is, and keeping our css updated for future extensions (eg, if tomorrow you make add `font-family' to the `table' entry, we'll need to add one too, etc). And still, this means overriding your settings, which were probably done for a reason...

> [...]
> I'd rather not add 'gitweb' class (or similar) to every element just
> to have common style for all links, tables, table header cells,
> table cells.

Why not add just a <div class=".gitweb"> container for all gitweb content, then have css for ".gitweb foo" for anything you want?

-- 
          ((lambda (x) (x x)) (lambda (x) (x x)))          Eli Barzilay:
                    http://barzilay.org/                   Maze is Life!
Jakub Narebski· Jul 8, 2010, 18:49 UTC · re: Eli Barzilay · lore

Re: gitweb.css

On Thu, 8 Jul 2010, Eli Barzilay wrote:
Show 24 quoted lines
> On Jul 8 Jakub Narebski wrote:
>> Eli Barzilay <eli@barzilay.org> writes:
>> 
>>> I've been customizing a gitweb server to fit with the rest of our
>>> project pages (the result is http://git.racket-lang.org/). This was
>>> relatively easy to do except for a few places where gitweb.css
>>> specifies formatting for generic tags like `body' `table' and `td' 
>>> which messed up our header.
>>> 
>>> Maybe it makes sense to localize these styles to to gitweb specific
>>> classes? (I know that I can just use my own css but the file is big
>>> enough that I prefer avoiding manually merging in updates.)
>> 
>> Can't you just override gitweb's CSS by your own CSS? Later CSS
>> wins. You can have more than one stylesheet in gitweb
>> (@stylesheets).
> 
> I know -- and I'm using that. The problem is if there's a property
> that we're not defining then it won't get overridden -- and doing so
> requires knowing what the default value is and keeping our css
> updated for future extensions (eg if tomorrow you make add
> `font-family' to the `table' entry we'll need to add one too etc).
> And still this means overriding your settings which were probably
> done for a reason...
Ah, all right.  I think I understand your problem, then.
 
The problem is that in included GITWEB_SITE_HEADER, GITWEB_HOMETEXT
and GITWEB_SITE_FOOTER gitweb style applies to links and tables, and
you want to have own style based on default HTML style values, isn't
it?
 
Show 7 quoted lines
>> [...]
>> I'd rather not add 'gitweb' class (or similar) to every element just
>> to have common style for all links tables table header cells 
>> table cells.
> 
> Why not add just a <div class=".gitweb"> container for all gitweb
> content then have css for ".gitweb foo" for anything you want?
First, I dislike this solution.

Second, similar solution would be beter, namely consistent division of page into gitweb_header, gitweb_body and gitweb_footer, moving style of 'body' to gitweb_*, and 'table' etc. to '.gitweb_body table'. The problem is with the way CSS is structured currently: I had problems with some elements losing their margin, and some elements having double margin.

-- 
Jakub Narebski
Poland
Eli Barzilay· Jul 8, 2010, 18:57 UTC · re: Jakub Narebski · lore

Re: gitweb.css

On Jul  8, Jakub Narebski wrote:
Show 6 quoted lines
> Ah, all right.  I think I understand your problem, then.
>  
> The problem is that in included GITWEB_SITE_HEADER, GITWEB_HOMETEXT
> and GITWEB_SITE_FOOTER gitweb style applies to links and tables, and
> you want to have own style based on default HTML style values, isn't
> it?

Yes, sorry for not clarifying that I'm using the header/footer feature.

Show 9 quoted lines
> >> [...]
> >> I'd rather not add 'gitweb' class (or similar) to every element just
> >> to have common style for all links tables table header cells 
> >> table cells.
> > 
> > Why not add just a <div class=".gitweb"> container for all gitweb
> > content then have css for ".gitweb foo" for anything you want?
> 
> First, I dislike this solution.

I don't like it either -- but having similar problems in the past it looked like the most convenient way to deal with such problems. (Specifically, it doesn't require changing all elements in the page.)

Show 6 quoted lines
> Second, similar solution would be beter, namely consistent division
> of page into gitweb_header, gitweb_body and gitweb_footer, moving
> style of 'body' to gitweb_*, and 'table' etc. to '.gitweb_body
> table'.  The problem is with the way CSS is structured currently: I
> had problems with some elements losing their margin, and some
> elements having double margin.
This is similar enough that I don't see any difference :)

As for the `gitweb_header' and `gitweb_footer' -- do you mean the user included files? If so, it doesn't sounds like something that is needed, since users can do any formatting that they want there, including using some of the gitweb classes. Another point to consider here: I found it convenient that the header/footer are included as is, we have a bunch of stuff in the header -- and our footer is "</div>", so wrapping them with some div will break this use.

-- 
          ((lambda (x) (x x)) (lambda (x) (x x)))          Eli Barzilay:
                    http://barzilay.org/                   Maze is Life!
Jakub Narebski· Jul 8, 2010, 19:25 UTC · re: Eli Barzilay · lore

Re: gitweb.css

On Thu, 8 July 2010, Eli Barzilay wrote:
> On Jul 8 Jakub Narebski wrote:
Show 13 quoted lines
>>>> [...]
>>>> I'd rather not add 'gitweb' class (or similar) to every element just
>>>> to have common style for all links tables table header cells 
>>>> table cells.
>>> 
>>> Why not add just a <div class=".gitweb"> container for all gitweb
>>> content then have css for ".gitweb foo" for anything you want?
>> 
>> First I dislike this solution.
> 
> I don't like it either -- but having similar problems in the past it
> looked like the most convenient way to deal with such problems.
> (Specifically it doesn't require changing all elements in the page.)

I like the variant described below significantly more, even if it is similar.

Show 16 quoted lines
>> Second similar solution would be beter namely consistent division
>> of page into gitweb_header gitweb_body and gitweb_footer moving
>> style of 'body' to gitweb_* and 'table' etc. to '.gitweb_body
>> table'. The problem is with the way CSS is structured currently: I
>> had problems with some elements losing their margin and some
>> elements having double margin.
> 
> This is similar enough that I don't see any difference :)
> 
> As for the `gitweb_header' and `gitweb_footer' -- do you mean the user
> included files? If so it doesn't sounds like something that is
> needed since users can do any formatting that they want there 
> including using some of the gitweb classes. Another point to consider
> here: I found it convenient that the header/footer are included as is 
> we have a bunch of stuff in the header -- and our footer is "</div>" 
> so wrapping them with some div will break this use.

No, what I meant here is that the structure of gitweb page should look like the following, in pseudocode:

  <body>
  [% GITWEB_SITE_HEADER %]
  <div class="gitweb_header"> <!-- or page_header -->
  breadcrumbs
  logo, search box
  perhaps navigation menu and subnavigation menu
  </div>
  [% if ($action eq 'project_list') HOME_TEXT %]
  <div class="gitweb_body"> 
  ...
  </div>
  <div class="gitweb_footer">
  stuff generated by git_footer_html()
  </div>
  [% GITWEB_SITE_FOOTER %]
  <script src="static/gitweb.js"></script> <!-- if needed -->
  </body>
-- 
Jakub Narebski
Poland
Eli Barzilay· Jul 8, 2010, 19:30 UTC · re: Jakub Narebski · lore

Re: gitweb.css

On Jul  8, Jakub Narebski wrote:
> 
> No, what I meant here is that the structure of gitweb page should look
> like the following, in pseudocode: [...]

Ah -- dividing the gitweb content to header/content/footer -- that makes perfect sense.

-- 
          ((lambda (x) (x x)) (lambda (x) (x x)))          Eli Barzilay:
                    http://barzilay.org/                   Maze is Life!

← back to recent threads