Alpaca Components

Design system created to speed up the process of working with design on Magento 2 stores, by creating each UI element, module, and view in an simplified, front-end developer friendly, environment.

Magento 2 experience isn't required to work with this code.

Installation

• yarn - to install dependencies
• gulp fractal:start - to start files watching and run local development server

Deployment

• gulp fractal:build --ci

General information

Components documentation is built on top of Fractal.js

• main styles.scss file and base styles are in /docs directory
• components are set in collections inside /components directory

Preview / Demo

• Develop branch - https://alpaca-components-staging.herokuapp.com/

Accessibility tests

• gulp a11y - run local development server with accessibility tests
• if on some view there is no a11y message, please go to the component's config and comment line:
  preview: '@docs-only-styles', - server restart not needed

Changelog

All notable changes to this project will be documented in this file.

The format is based on Keep a Changelog
and this project adheres to Semantic Versioning.

[Unreleased]

[0.7.0] - 07.05.2018

Fixed

• Yarn lock file

Changed

• Swatches styles
• Catalog item styles
• Filters media query size

[0.6.0] - 30.03.2018

Added

• New list variant
• Global focus style
• Catalog list item module
• Catalog grid item module
• Catalog grid view
• Catalog list view
• Filters module.
• Modal module
• Working js for Quantity-update
• Sticky footer
• Minicart
• Forgot password view

Changed

• Product view adjustements
• Links color and styles
• Brief-info styles
• Review start refactor
• Rating - use svg icons as css background with svg-uri for encoding uri
• Footer component design
• Global variables
• List module styles
• Newsletter module design
• Refactored swatch element
• Update label hidden style
• Refactored file-upload component - removed dependecy on button styles, JS code made more roboust
• Update accessibility features in file-upload component
• Login page, removed tabs and set two columns
• Aria-label values
• Registration view
• Simplify filters
• Remove unnecessary code from config
• Update toolbar styles
• Mega menu module to fit Snowdog Menu Module
• Side menu module to fit Snowdog Menu Module

Removed

• Old catalog product modules and catalog views

[0.5.0] - 20.11.2017

Added

• Slide module
• Arrow-right icon
• Home page view
• Variant for list - with components as content
• Accessibility tests

Changed

• Pager element styling that fits design
• Adjustements in slider module
• Swatcher update

[0.4.1] - 13.11.2017

Fixed

• Typo - double semicolon

[0.4.0] - 13.11.2017

Added

• Quantity-updater module
• Minus icon
• Icon component
• Dropdown list component for side menu
• Link modifier with custom border on hover

Changed

• Dropdown list component
• Footer module changed
• Update form elements style and structure (accessibility): checkbox/radio button, select, input, textarea
• Tab styling
• Cookie message styling
• Update icon list and change to alph order
• Update icons list to display with icon components
• Name of dropdown-menu element to mega-menu
• Mega menu styling

[0.3.0] - 06.11.2017

Added

• Spacer global variables

Changed

• Variables in password strength element
• Popup component
• Table styles
• Newsletter module

[0.2.0] - 28.10.2017

Added

• Banner images
• marketing bar element
• docs-styles-only preview layout
• User account dashbord elemenets, modules and views
• Project description

Changed

• Refactor banner styles
• Optimize new banner images
• Simplify banner template
• Button styling that fits alpaca design.
• Badges styling that fits alpaca design (default, new, discount).
• Breadcrumbs styling that fits alpaca design.
• Header styling that fits alpaca design.
• Styles used only for previews (i.e. buttons)
• Button icon variables to BEM
• CHANGELOG releases date format to european

[0.1.2] - 10.10.2017

Changed

• update README, correct typo

Added

• CHANGELOG.md

[0.1.1] - 09.10.2017

Changed

• Project name to module-alpaca-components

[0.1.0] - 09.10.2017

Added

• Initial release (internal purpouses only)