Component Request - GridWork - 1hrs

[drewbaker]

Component Description

This component is used on Directors landing pages and Work category pages to display BlockWork in an alternating fashion.

Design

Please also see attached screenshots for quick reference.

• Desktop: https://xd.adobe.com/view/c0d9243f-2f1f-4b20-614b-bef83eff7c19-b6e8/screen/e363306e-de44-4757-b09c-1ad223970e9a/specs/
• Mobile: https://xd.adobe.com/view/dd5e5638-85b6-40a8-4caa-797e6dbe406a-ab6f/screen/e2e9fc6e-fdc6-43a7-85a3-963309b10e34/

Note mobile design shows first two blocks have same alignment, this is a design bug. They should alternate down the page in a single column.

If no mobile designs provided, please use your best judgment for responsiveness.

Email drew@funkhaus.us for the design password.

Props

props: {
    items: {
        // Mock: api.pages
        type: Array,
        default: () => []
    }
}

Developer Tips

Use CSS to get the alternating and offset layout.

Required components

1. BlockWork is used for the blocks in the gird

Time & Budget

Time estimate: 1hrs
Budget: $100

Screenshots