Web Pattern Library

Github Repo

Menu


Global styles

Global components


Template Structure


Bag, Wishlist, & Checkout

Home / Login

Marketing Modules

Product Listing & Detail

Size & Fit Guides

Personalization

My Account / History

Static pages


JavaScript Helpers

What's New

PDP Redesign - Release 74

The PDP redesign is in progress, which includes a refactor of the carousel module as well.

Sticky Masthead - Release 73

We've made the smallscreen masthead more compact and introduced a new sticky behavior as well.

Hotspot Zoomgrid Module - Release 72.7

A new module for a series of hero images that uses focalpoints to show a cropped grid of them all. Once zoomed into an image, the hotspots for that image will appear and be usable. At smallscreen sizes, the zoomed in image will overflow scroll and will open with a slight pan animation.

Hotspot Zoomgrid Module - Release 72.7

A new module for a series of hero images that uses focalpoints to show a cropped grid of them all. Once zoomed into an image, the hotspots for that image will appear and be usable. At smallscreen sizes, the zoomed in image will overflow scroll and will open with a slight pan animation.

Marketing Carousels

Womens Fit Guide – Release 68

Demo: http://tag-68-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.68

Added includes for Womens Fitguide on PDP and Dialogs

Additionally, we've made a Fit Guide generator page to create the various pieces you'll need for making Fit Guides.

New "Every Woman" side curve image Hero Template – Release 65

Demo: http://tag-65-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.65

New variation on the Priority Banner: Side-by-side module that places the curve to the right of the hero image at desktop sizes, and below at mobile.

PDP video Module, Video in PLP style detail modules – Release 63.1

Demo: http://tag-63-1-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.63.1

Added support for ambient or full videos to the style detail PLP modules

To test videos, go to the "Style images" tab and click on the video toggle. This will be especially useful for thesingle image variant.

Videos are also supported on the style carousel for the future.

Added support for a full video (with sound) on the PDP

PDP with video

PLP Franchise and Style module Header Bar, Detail, Carousel - Release 63

This release adds the new PLP header bar, style carousel, and style detail modules and a new form for the 2 and 3-up product overlap module.

Demo: http://tag-63-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.63.0

New PLP Style Detail and Carousel Modules

New module: Product overlap modules #3834

New forms to create the image + silhouette product photo module variants.

Email Templates – Release 62.6.8

Notable changes include bug fixes and new email templates

Demo: http://tag-62-6-8-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.6.8

Email Template System

Buy online pick up in store (BOPIS) for Bag, Order History – Release 62.9

Demo: http://tag-62-9-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.9

Bag & Checkout templates with BOPIS:

BOPIS Updates – Release 62.6.9

Bug fixes merged from main branch.

Demo: http://tag-62-13-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.13

Buy online pick up in store (BOPIS) – Release 62.8

Demo: http://tag-62-8-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.8

Updated Product pages:

Updated Checkout:

Buy online pick up in store (BOPIS) – Release 62.7

Demo: http://tag-62-7-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.7

Fit Guide – Releases 62.3-6

Demo: http://tag-62-6-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.3, https://github.com/.../v0.62.4, v0.62.5 & v0.62.6

Curalate module placement – Release 62.2

Demo: http://tag-62-2-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.2

Marketing Module & RGP improvements – Release 62.1

Demo: http://tag-62-1-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.1

MLB Landing Page – Release 62.0

Demo: http://tag-62-0-origin-vineyardvines.fgview.com
Code: https://github.com/.../v0.62.0

Need help?

Please post a message on Basecamp or contact thegroup@filamentgroup.com.