Opened 4 years ago

Closed 3 years ago

#4609 closed change (fixed)

Default grid component

Reported by: saroyanm Assignee: juliandoucette
Priority: P2 Milestone:
Module: Websites Keywords:
Cc: saroyanm, jeen, p.pastourmatzis, mvelchevski, greiner Blocked By:
Blocking: #4606 Platform: Unknown / Cross platform
Ready: yes Confidential: no
Tester: Unknown Verified working: no
Review URL(s):

https://codereview.adblockplus.org/29361708/

Description (last modified by juliandoucette)

Background

We would like to implement a default grid component.

Requirements

  • Responsive columns
    • Desktop
      • 4 columns
    • Tablet
      • 2 columns (4 collapse into 2)
    • Mobile
      • 1 column
  • Nesting rows
  • Reverse order rows
  • Right-to-left rows
  • Support last 2 versions, Safari 6, IE 8

Change History (9)

comment:1 Changed 4 years ago by juliandoucette

  • Description modified (diff)
  • Owner set to juliandoucette
  • Review URL(s) modified (diff)
  • Summary changed from UDL grid layout implementatio to UDL grid component

comment:2 Changed 4 years ago by juliandoucette

  • Status changed from new to reviewing

comment:3 Changed 4 years ago by juliandoucette

  • Priority changed from Unknown to P2
  • Ready set

comment:4 Changed 4 years ago by juliandoucette

  • Cc saroyanm jeen p.pastourmatzis mvelchevski greiner added; juliandoucette removed
  • Description modified (diff)

comment:5 Changed 4 years ago by juliandoucette

  • Description modified (diff)

comment:6 Changed 4 years ago by juliandoucette

  • Description modified (diff)

comment:7 Changed 4 years ago by juliandoucette

  • Description modified (diff)
  • Summary changed from UDL grid component to Default grid component

Updated summary and requirements based on discussions in review.

Pushing & Pulling

We used pushing and pulling in Acceptable Ads to reverse the order of columns so that the right column would appear before the left on mobile. This can be achieved using our default grid component by using reverse order rows.

Another common use for pushing and pulling is creating rows with less than 100% width. This can be achieved using our default grid component by manually setting the width of a row or row container.

---

Unlike most other grid components our grid fully supports right-to-left direction and right-to-left direction in combination with reverse ordering.

comment:8 Changed 3 years ago by abpbot

A commit referencing this issue has landed:
Issue 4609 - Default grid component

comment:9 Changed 3 years ago by juliandoucette

  • Resolution set to fixed
  • Status changed from reviewing to closed
Note: See TracTickets for help on using tickets.