magento2-alpaca-theme

Magento 2 theme built on top of Alpaca design system crafted for ecommerce

Github stars Tracking Chart

Introduction

Magento 2 theme created on top of own components library, designed from scratch by SNOW.DOG front-end team following design systems methodology principles.

Demo

  • Apache Solr based catalog is an internal Snowdog product, not open-sourced. If you are interested in having it in your store, please contact us at hello@snow.dog

Installation

  • Install Magento using Composer
  • composer require snowdog/theme-frontend-alpaca
  • Create dev/tools/frontools/config/themes.json config file following one of the samples:
  • Install Frontools dependecies and setup config files cd vendor/snowdog/frontools && yarn && gulp setup
  • In Frontools directory (or /tools in project root) run gulp styles && gulp babel && gulp svg to compile all static assets

Child theme packages structure

Each theme is built from two packages:

  1. Magento theme
  2. Components library

This leads to 4 packages linked together to create a custom theme based on Alpaca:

  1. Alpaca components
  2. Alpaca theme - depends on Alpaca components
  3. Custom components - depends on Alpaca components
  4. Custom theme - depends on Alpaca theme and Custom theme components

Inheritance of components is solved on Frontools level, it's based on the same rules as in Magento core - files from child overwrite the parent.

Workflow

In the theme, you should keep almost only templates and JS.
Do not create any non-magento specific styles inside your theme. Components are designed to be able to reflect your store UI, without having to run Magento instance. Implementing some part of UI directly inside theme will make components preview useless and you will lose all benefits of writing UI in separation.

Workflow exceptions

We don't want to mess with the checkout and product gallery (Fotorama) templates, nor styling, so these two parts are copy-pasted from the SASS Blank theme.

Overview

Name With OwnerSnowdogApps/magento2-alpaca-theme
Primary LanguageHTML
Program languagePHP (Language Count: 5)
Platform
License:MIT License
Release Count70
Last Release Name2.28.4 (Posted on 2023-04-06 12:58:06)
First Release Name0.1.0 (Posted on 2017-10-09 15:36:02)
Created At2017-04-18 10:55:56
Pushed At2023-06-08 16:55:14
Last Commit At2023-04-26 11:20:26
Stargazers Count201
Watchers Count19
Fork Count72
Commits Count4.3k
Has Issues Enabled
Issues Count79
Issue Open Count5
Pull Requests Count466
Pull Requests Open Count4
Pull Requests Close Count34
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private
To the top