Patch #26125

Unify form#query_form on calendar/gantt views with issues/spent time views

Added by Mischa The Evil 4 months ago. Updated 3 months ago.

Status:ClosedStart date:
Priority:NormalDue date:
Assignee:Jean-Philippe Lang% Done:

0%

Category:UI
Target version:4.0.0

Description

I noticed a difference between the rendering of the query filter forms on the issues & spent time views and the query filter forms on the calendar and gantt views. I fixed it with the following changes:
  • 1. Fix HTML structure of form#query_form on calendar/gantt views.
    This unifies the HTML structure of the query form on the calendars/show
    and gantts/show views to be the same as it is currently for the issues
    and spent time views, which were themself unified into the new
    queries/_query_form partial in r15649.
  • 2. Fix source indentation and newline usage.
    This unifies the source layout of the query form on the calendars/show
    and the gantts/show views with the queries/_query_form partial.
  • 3. Unify form#query_form structure on calendar/gantt views.
    This:
    • moves the p with inline style on the calendar view (which
      wraps the navigation buttons) out of div#query_form_content
      and adds the contextual class to the element to unify this
      with the gantt view (and to remove the inline style from
      the element now that it's styled through a stylesheets'
      style [.contextual in fact]);
    • restores the 12px font-size of the calendar navigation
      buttons;
    • increases the font-size of the gantt zoom buttons to 12px;
    • increases the margin of the calendar navigation and gantt
      zoom buttons to 12px 0px.
  • 4. Add test assertions to the four controller test cases.

To make the changes a bit more visual, here some ASCII and image graphics:

view was becomes
issues
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
        fieldset#options
      p.buttons
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
        fieldset#options
      p.buttons
spenttime
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
        fieldset#options
      p.buttons
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
        fieldset#options
      p.buttons
calendar
  form#query_form
    inputs
    fieldset#filters.collapsible
    p(inlineStyles)
    p.buttons
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
      p.contextual
      p.buttons
gantt
  form#query_form
    inputs
    fieldset#filters.collapsible
    fieldset#options
    p.contextual
    p.buttons
  form#query_form
    inputs
    div#query_form_with_buttons.hide-when-print
      div#query_form_content
        fieldset#filters.collapsible
        fieldset#options
      p.contextual
      p.buttons

I'll attach four patches implementing these changes. This patch serial, against current source:/trunk@16643, is produced using git format-patch which makes the individual patches apply-able using "patch -p1 < 0001-...".

Environment:

Environment:
  Redmine version                3.3.3.devel@r16643
  Ruby version                   2.3.3-p222 (2016-11-21) [x86_64-linux]
  Rails version                  4.2.8
  Environment                    production
  Database adapter               Mysql2
SCM:
  Subversion                     1.8.8
  Git                            1.9.1
  Filesystem                     
Redmine plugins:
  no plugin installed

issues-current.png (6.82 KB) Mischa The Evil, 2017-06-08 23:47

spenttime-current.png (7.03 KB) Mischa The Evil, 2017-06-08 23:47

calendar-current.png (6.99 KB) Mischa The Evil, 2017-06-08 23:47

gantt-current.png (8.29 KB) Mischa The Evil, 2017-06-08 23:47

issues-fixed.png (6.82 KB) Mischa The Evil, 2017-06-08 23:48

spenttime-fixed.png (7.03 KB) Mischa The Evil, 2017-06-08 23:48

calendar-fixed.png (6.81 KB) Mischa The Evil, 2017-06-08 23:48

gantt-fixed.png (8.09 KB) Mischa The Evil, 2017-06-08 23:48

0001-Fix-HTML-structure-of-query_form-on-calendar-gantt-v.patch Magnifier (2.81 KB) Mischa The Evil, 2017-06-09 00:13

0002-Fix-source-indentation-and-newline-usage.patch Magnifier (8.28 KB) Mischa The Evil, 2017-06-09 00:13

0003-Unify-query_form-structure-on-calendar-gantt-views.patch Magnifier (2.25 KB) Mischa The Evil, 2017-06-09 00:13

0004-Add-test-assertions-to-the-four-controller-test-case.patch Magnifier (3.82 KB) Mischa The Evil, 2017-06-09 00:13

Associated revisions

Revision 16701
Added by Jean-Philippe Lang 3 months ago

Fix HTML structure of query_form on calendar/gantt views (#26125).

This unifies the HTML structure of the query form on the calendars/show
and gantts/show views to be the same as it is currently for the issues
and spent time views, which were themself unified into the new
queries/_query_form partial in r15649.

Patch by Mischa The Evil.

Revision 16702
Added by Jean-Philippe Lang 3 months ago

Fix source indentation and newline usage (#26125).

This unifies the source layout of the query form on the calendars/show
and the gantts/show views with the queries/_query_form partial.

Patch by Mischa The Evil.

Revision 16703
Added by Jean-Philippe Lang 3 months ago

Unify query_form structure on calendar/gantt views (#26125).

This:
  • moves the p with inline style on the calendar view (which
    wraps the navigation buttons) out of div#query_form_content
    and adds the contextual class to the element to unify this
    with the gantt view (and to remove the inline style from
    the element now that it's styled through a stylesheets'
    style [.contextual in fact]);
  • restores the 12px font-size of the calendar navigation
    buttons;
  • increases the font-size of the gantt zoom buttons to 12px;
  • increases the margin of the calendar navigation and gantt
    zoom buttons to 12px 0px.

Patch by Mischa The Evil.

Revision 16704
Added by Jean-Philippe Lang 3 months ago

Add test assertions to the four controller test cases (#26125).

Patch by Mischa The Evil.

History

#1 Updated by Mischa The Evil 4 months ago

Edit: seems like using thumbnails in tables causes some issues; replaced with regular image tags.
Edit 2: for anyone searching for the visual differences: only the calendar and gantt views are affected by these changes

Also attaching the patches.

#2 Updated by Go MAEDA 3 months ago

  • Target version set to 4.1.0

Looks good to me. Passed all test.
Since we are freezing 3.4.0 now and this issue is a kind of refactoring, I think it would be better to set target version to 3.5.0 instead of 3.4.0.

#3 Updated by Jean-Philippe Lang 3 months ago

  • Status changed from New to Closed
  • Assignee set to Jean-Philippe Lang

Patches are committed, thanks!

#4 Updated by Jean-Philippe Lang 3 months ago

  • Target version changed from 4.1.0 to 4.0.0

Also available in: Atom PDF