Re: gitweb html validation

[Ralf Thielow <ralf.thielow@gmail.com>]

2016-11-15 19:26 GMT+01:00 Ralf Thielow <ralf.thielow@gmail.com>:

Finally I've found the time to actually try this out and there
are some problems with it.

>
> diff --git a/gitweb/gitweb.perl b/gitweb/gitweb.perl
> index 7cf68f07b..33d7c154f 100755
> --- a/gitweb/gitweb.perl
> +++ b/gitweb/gitweb.perl
> @@ -5531,8 +5531,8 @@ sub git_project_search_form {
>                 $limit = " in '$project_filter/'";
>         }
>
> -       print "<div class=\"projsearch\">\n";
>         print $cgi->start_form(-method => 'get', -action => $my_uri) .
> +             "<div class=\"projsearch\">\n" .
>               $cgi->hidden(-name => 'a', -value => 'project_list')  . "\n";
>         print $cgi->hidden(-name => 'pf', -value => $project_filter). "\n"
>                 if (defined $project_filter);
> @@ -5544,11 +5544,11 @@ sub git_project_search_form {
>                              -checked => $search_use_regexp) .
>               "</span>\n" .
>               $cgi->submit(-name => 'btnS', -value => 'Search') .
> -             $cgi->end_form() . "\n" .
>               $cgi->a({-href => href(project => undef, searchtext => undef,
>                                      project_filter => $project_filter)},
>                       esc_html("List all projects$limit")) . "<br />\n";
> -       print "</div>\n";
> +       print "</div>\n" .
> +             $cgi->end_form() . "\n";
>  }
>

The anchor is now inside the form-tag, which means there is no
visual line-break anymore that comes automatically after </form>
as the form-tag is a block level element.  Could be solved by adding a
"<br />", which is not very nice, but OK.

>  # entry for given @keys needs filling if at least one of keys in list
> diff --git a/gitweb/static/gitweb.css b/gitweb/static/gitweb.css
> index 321260103..507740b6a 100644
> --- a/gitweb/static/gitweb.css
> +++ b/gitweb/static/gitweb.css
> @@ -539,7 +539,7 @@ div.projsearch {
>         margin: 20px 0px;
>  }
>
> -div.projsearch form {
> +form div.projsearch {
>         margin-bottom: 2px;
>  }
>

This is wrong as it overwrites the setting above, 20px at the bottom
went to 2px.

The problem is how to apply the 2px now. Before this, we had the
<form>, a block element, which we can give the 2px margin at the
bottom.  Now this element is gone and we have a set of inline
elements where we use "<br />" to emulate the line break.  There
are two css rules which can solve this, but I'm not really happy with
both of them.
1) As we know we need the two pixel below an input element, we
can say
div.projsearch input {
  margin-bottom: 2px;
}
2) Make the a-Tag inside div.projsearch being displayed as a block
element to make a margin-top setting working.  This has the benefit
that we don't care about the element above.
div.projsearch a {
        display: inline-block;
        margin-top: 2px;
}
If I have to choose I'd prefer the second one.

So I can't think of a way to solve this nicely with this change.