Giter VIP home page Giter VIP logo

magento2-alpaca-theme's Introduction

⚠️ No longer maintained

Thank you for your interest in Alpaca. Unfortunately, we've decided to discontinue the maintenance of this project. It's been quite a few years since it was created and we need to move forward. Magento 2.4.4 will be the last version officially supported.


Magento 2 Alpaca Theme

📝 Component-based

  • Built on top of a collection of reusable components - guided by clear rules to ensure design consistency.

🎨 Themable

  • Gives a lot of flexibility to customize the look of the store.

📚 Feature-rich

  • Comes in a package with a set of modules.
  • Compatible with the majority of Magento Open Source and Adobe Commerce features.

💅 Polished

  • We've put a lot of work into the little things.

♿️ Accessible

  • WCAG AA level compliant

⚡️ Fast Child Theme Setup

  • Create Alpaca Child Theme in your Magento project by running one command.

To learn more about Alpaca, check documentation.

magento2-alpaca-theme's People

Contributors

adamwaclawczyk avatar aekal avatar agnnow1 avatar akai-z avatar anqaka avatar gfrey-namcopool avatar henkvalk avatar igloczek avatar jasiukiewiczm avatar jkrupinski avatar kamil-jagoda avatar kruchy8 avatar makao avatar mrtuvn avatar ofrankowska avatar patrykbura avatar pawel-snowdog avatar peteracs avatar rjwaberski avatar santialsur avatar santibm avatar tomaszrozewicz avatar zuzannaszymanda avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

magento2-alpaca-theme's Issues

Implement single order view

To do on single order view:

  • implement invoices displays - default magento2 feature
  • check if shipment displays properly
  • check if all magento2 default features for single order view are implemented

update is blocking by unknown package

Hi,

When I update my magento to the last version (2.3.5-p1) the update will stop by an unknown package of snowdog:

- Installing snowdog/module-colibri-frontools (0.2.1): Cloning 3b48d83f8a
  [RuntimeException]                                                                                                 
  Failed to clone https://github.com/SnowdogApps/magento2-colibri-frontools.git via https, ssh protocols, aborting.  
  - https://github.com/SnowdogApps/magento2-colibri-frontools.git                                                    
    Cloning into '/path/to/magento2/vendor/snowdog/module-colibri-frontools'...                 
    remote: Invalid username or password.                                                                            
    fatal: Authentication failed for 'https://github.com/SnowdogApps/magento2-colibri-frontools.git/'                
  - [email protected]:SnowdogApps/magento2-colibri-frontools.git                                                        
    Cloning into '/path/to/magento2/vendor/snowdog/module-colibri-frontools'...                 
    ERROR: Repository not found.                                                                                     
    fatal: Could not read from remote repository.                                                                    
    Please make sure you have the correct access rights                                                              
    and the repository exists. 

When I replace the snowdog/module-colibri-frontools in composer.json the update will be good.

"replace": {
        "snowdog/module-colibri-frontools": "*"
}

Possible to deactivate Snowdog_Menu?

Is it possible to disable the snowdog menu?
We are using an import based menu with the standard magento menu.
If I disable the Snowdog_Menu I get the following error:
Fatal error: Uncaught Error: Cannot instantiate interface Snowdog\Menu\Api\MenuRepositoryInterface in...
In short:
I want to use the normal Magento Menu
Thx in advance

How install

Hello, im novice, would like know how to install this theme with components.. Thanks!

Header refactor

Refactor whole header related code, the same way as in the Janus-et-cie project, with having in mind that is easier to add and customize template file, than fighting with tens of nested layout containers.

Escaping php variables in templates

There are places were we use in html attr escapeHtml instead of escapeQuotes (M 2.1) or escapeHtmlAttr (> m2.2) or where we don't use any escape methods. The same for url etc.

However which method should be used vary depending on Magento version but I think we should support from some release > M2.2 and keep support for M2.1 on some release branch.

What method to use and when explained here:
https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/templates/template-security.html

For M 2.1: https://devdocs.magento.com/guides/v2.1/frontend-dev-guide/templates/template-security.html

Failed to generate css file after installation

This theme looks great, but I've been struggling to try and get it to run. I successfully followed the installation steps and ran all the commands, and went in and changed the theme to Alpaca. Unfortunately, when you visit the home page, it's missing all the CSS . When I check the console, it looks like it can't load any of the files in the static folder. Heading directly to the link yields a 404 error, and it looks like the files are missing on the server side.
Here are the chrome errors from my development site:
Sans titre

If anyone has any advice it would be greatly appreciated.

Gulp generates css files without "min" in name if Minify CSS files is enabled

I am not sure if it is a bug but, in developer mode there is a mode in Stores-> Settings-> Configuration-> Advanced -> Developer-> CSS Settings: Minify CSS Files. When it is enabled then Magento expects i.e. (pub/static/frontend/Snowdog/alpaca/pl_PL/Magento_Checkout/) checkout.min.css instead of checkout.css or (pub/static/frontend/Snowdog/alpaca/pl_PL/css) styles.min.css instead of styles.css.

I worked around it making the copy of existing file with the correct name with ".min.".

Alpaca vs Theme-Blank-Sass

Can you provide insight? I see documents and forum posts everywhere, but I am starting a new project and evaluating Magento-base theme vs alpaca vs theme-blank-sass .. Can you explain recommended use? Do these all use frontools and replace Magento-recommended CLI commands? or has magento implemented? I see they have selectors and things now?

FYI - I am using Docker with a PHP container containing the node, gulp, gulp-cli and bower components necessary to start and can adapt that if necessary. I had theme-blank-sass working and then noticed alpaca was maybe more modern or a rewrite/re-develop?

Also, could you provide link to or maybe mention here the appropriate commands for requiring the theme/components/tools and also standard development workflow using commands?

Can't change password in my account page

Issue:

In customer/account/edit page, after select "change password" and fill all input fields. Click "save" button.
"You saved the account information" success message shows, but the password not changed.

Possible Reason:
check Magento_Customer/templates/form/edit.phtml
commits 202be6b and ff6c51b
checkbox name changed from "change_password" to "account_update", value changed from "1" to "changePassword".

magento/module-customer/Controller/Account/EditPost.php line 258
changeCustomerPassword function will check
if ($this->getRequest()->getParam('change_password'))

Do I absolutely need Node.js v12?

Hello, I am trying to use your alpaca theme because I am frustrated with Magento's frontend scheme using LESS. I don't have a problem with LESS, but the structure is confusing.

I am at the step "Install Frontools dependecies and setup config files cd vendor/snowdog/frontools && yarn && gulp setup"

Yarn barfs on my node.js version 10... I am hosted at Nexcess so don't have access to modify the server, though I can request version 12... is this necessary or can I just change the version requirement in /vendor/snowdog/frontools/.node-version ?

Magento 2.2.x compatibility

The current composer.json file accepts only magento/framework version 100.1.* (Magento 2.1.x)

Please add compatibility with magento/framework version 101.0.* (Magento 2.2.x)

Best way to use E2E tests now

Hi, thanks for the great work. I can see that Cypress E2E tests have reasonable coverage in the open PR, and are a good base. Unfortunately, all data-testid attributes are available only on develop branch. Do you plan to release those or some easy way to get only data-testid related commits and merge them in a custom theme?

Invalid form key in catalog with Varnish

Step to reproduce:

  1. Clear cookies (delete form_key)
  2. Add product to cart, Add product to wish list, or Add product to compare
  3. Invalid form key message

This error occur because Varnish keep invalid old form key inside action attribute. We should update solr and alpaca methods to keep it in 'magento-way'.

To do:

  • Replace solr-add-to-cart.js with extended magento catalog-add-to-cart.js widget and add customerData with invalidate() method (to keep minicart updated).
  • delete form_key from solr, and add dynamic block with no-cached form_key.

Wrong name for review input field

There is a problem with the reviews summary calculation because the name of the rating input field is using an incorrect variable

Cannot instantiate interface Snowdog\Menu\Api\MenuRepositoryInterface

Hi, after following your instructions to install this theme, I get the following error when I activate the theme in Magento. Any help would be appreciated.

2019/01/12 02:55:41 [error] 12991#0: *593 FastCGI sent in stderr: "PHP message: PHP Fatal error:  Uncaught Error: Cannot instantiate interface Snowdog\Menu\Api\MenuRepositoryInterface in /var/www/magento.xxxxxxxxxxxxxxxxx.com/htdocs/vendor/magento/framework/ObjectManager/Factory/Dynamic/Developer.php:50
Stack trace:
#0 /var/www/magento.xxxxxxxxxxxxxxxxx.com/htdocs/vendor/magento/framework/ObjectManager/ObjectManager.php(70): Magento\Framework\ObjectManager\Factory\Dynamic\Developer->create('Snowdog\\Menu\\Ap...')
#1 /var/www/magento.xxxxxxxxxxxxxxxxx.com/htdocs/vendor/magento/framework/ObjectManager/Factory/AbstractFactory.php(160): Magento\Framework\ObjectManager\ObjectManager->get('Snowdog\\Menu\\Ap...')
#2 /var/www/magento.xxxxxxxxxxxxxxxxx.com/htdocs/vendor/magento/framework/ObjectManager/Factory/AbstractFactory.php(246): Magento\Framework\ObjectManager\Factory\AbstractFactory->resolveArgument(Array, 'Snowdog\\Menu\\Ap...', NULL, 'menuRepository', 'Snowdog\\Menu\\Bl...')
#3 /var/www/magento.xxxxxxxxxxxxxxxxx.com/htdocs/vendor/magento/framework/ObjectManager/Factory/D" while reading response header from upstream, client: xx.xx.xx.xx, server: magento.xxxxxxxxxxxxxxxxx.com, request: "GET / HTTP/2.0", upstream: "fastcgi://127.0.0.1:9090", host: "magento.xxxxxxxxxxxxxxxxx.com"

Exceptions on wishlist page

1 exception(s):
Exception #0 (Magento\Framework\Config\Dom\ValidationException): Element 'referenceBlock', attribute 'class': The attribute 'class' is not allowed.
Line: 1142

Element 'referenceBlock', attribute 'cacheable': The attribute 'cacheable' is not allowed.
Line: 1142


Exception #0 (Magento\Framework\Config\Dom\ValidationException): Element 'referenceBlock', attribute 'class': The attribute 'class' is not allowed.
Line: 1142

Element 'referenceBlock', attribute 'cacheable': The attribute 'cacheable' is not allowed.
Line: 1142

snownav.php - 404 not found

I have this error in console:
Failed to load resource: the server responded with a status of 404 () " /snownav.php"

How can I solve it?
Where can I find it?

Modal icon covers text

How to reproduce issues

  1. use mobile/smaller screen
  2. add product to cart
  3. open minicart
  4. click remove icon

Expected result:

Close icon doesn't cover text inside modal (text has proper padding/margin)

Actuall result:

Extra notes

Test modal not only in minicart

Special Price component's CSS is not applied

It looks like Special Price markup is not matching the component https://alpaca-components-staging.herokuapp.com/components/detail/price--with-special-price.html.

I have Vanila Magento 2.3 Open Source and Alpaca installed. Nothing else.

<div class="catalog-grid-item__price">
                            <div class="price">
                                <span class="price__value">

                                    <div class="price-box price-final_price" data-role="priceBox" data-product-id="1" data-price-box="product-id-1">
    <span class="special-price">
        

<span class="price-container price-final_price tax weee">
            <span class="price-label">Special Price</span>
        <span id="product-price-1" data-price-amount="25" data-price-type="finalPrice" class="price-wrapper "><span class="price">£25.00</span></span>
        </span>
    </span>
    <span class="old-price">
        

<span class="price-container price-final_price tax weee">
            <span class="price-label">Regular Price</span>
        <span id="old-price-1" data-price-amount="37.99" data-price-type="oldPrice" class="price-wrapper "><span class="price">£37.99</span></span>
        </span>
    </span>

</div>                                </span>
                            </div>
                        </div>

image

Login Account Icon Missing

Hello, I've successfully installed your theme. It's amazing. But I can't see the customer login icon. Is it normal? If so, can you please suggest how to enable it?
Thanks

Doumentation

Hey Guys,

i'm planning to use the alpace theme as base theme for some of our projects.
This is looking very good.

Few questions tho, is there some documentation available how to set this up in magento 2?
Problems/questions I have now are:

  • how this styles.css rendered and copied to the static folder?
  • I dont see a link between the theme and alpaca components? How does this work?
  • Whats the recommended way to edit files?
  • How are static files from alpaca components placed in the magento static folder?
    I'm missing something right?

Cheers,

Configurable swatches do not change price

On Magento 2.3.0, when configurable products are set up with different option prices, they do not seem to be reloaded in the Catalog List upon selecting a swatch option

location of child theme, and path defined in themes.json

Hello - there was a reply to an issue in the Snowdog Blank SASS theme git repo which suggested that a child theme for a magento installation using frontools should go into /vendor/{client}/{client-theme}. However, when doing that, Magento wasn't able to find my theme in the admin panel. I moved it to /app/design/frontend/{client}/{client-theme}, and that worked.

Running "gulp styles && gulp babel && gulp svg" doesn't throw any errors, but I'm not sure if it's really accessing the correct location for my child theme.

Before I go forward I just want to make sure that my /dev/tools/frontend/config/themes.json is correct for the child theme's "src" variable. Should it reference vendor/ or should it reference app/design/frontend/ ? As you know, the README for this project defines the default themes.json for a child theme with alpaca as parent such that "src" for the child references vendor/ - which didn't let Magento find it.

eg,

"src": "vendor/{vendor-name}/theme-frontend-{theme-name}",

or

"src": "app/design/frontend/{vendor-name}/theme-frontend-{theme-name}",

Did something change in Magento that caused it to stop loading themes in the vendor/ folder? or have I mis-configured some other file?

Checkout cart actions html issue

In the following file:
Magento_Checkout/templates/cart/item/renderer/actions/remove.phtml
On line 1 there is a button tag opened and at the end on line 9 there is an anchor tag closed.
The anchor closing tag should be changed for a button closing tag.
remove_phtml

Thanks!

Failed to load static files after instalation

This theme looks great, but I've been struggling to try and get it to run. I successfully followed the installation steps and ran all the commands, and went in and changed the theme to Alpaca. Unfortunately, when you visit the home page, it's missing all the CSS and JS. When I check the console, it looks like it can't load any of the files in the static folder. Heading directly to those links yields a 404 error, and it looks like the files are missing on the server side.

I tried re-running gulp styles in hopes of generating those files, but to no avail. Here are the chrome errors from my development site:

(index):1 Refused to apply style from 'http://store.kidzkorner.cf/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US/css/styles.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US//images/icons-sprite.svg#heart:1 Failed to load resource: the server responded with a status of 404 (Not Found)
(index):1 Refused to apply style from 'http://store.kidzkorner.cf/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US/css/styles.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US/images/icons-sprite.svg#close:1 Failed to load resource: the server responded with a status of 404 (Not Found)
jquery-migrate.js:23 JQMIGRATE: Migrate is installed with logging active, version 1.4.1
VM14:1 GET http://store.kidzkorner.cf/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US/js-translation.json 404 (Not Found)
http://store.kidzkorner.cf/pub/static/version1560259397/frontend/Snowdog/alpaca/en_US/js-translation.json HTTP status: 404
    at XMLHttpRequest.xhr.onreadystatechange (text.js:115)

If anyone has any advice it would be greatly appreciated.

Question: workflow and theme inheritance

I've decided to check out your alpaca theme for an ecommerce project after discovering the potential of SASS.

I am running M2.3.1 - The installation process is fine.

themes.json:

{
  "alpaca": {
    "src": "vendor/snowdog/theme-frontend-alpaca",
    "dest": "pub/static/frontend/Snowdog/alpaca",
    "locale": ["en_US"],
    "modules": {
      "Snowdog_Components": "vendor/snowdog/module-alpaca-components/components"
    }
  },
"light": {
    "parent": "alpaca",
    "src": "vendor/splys/theme-frontend-light",
    "dest": "pub/static/frontend/splys/light",
    "locale": ["nb_NO"],
    "localeOverwrites": true,
    "modules": {
      "Snowdog_Components": "vendor/splys/module-light-components/components"
    }
  }
}

in /tools directory, running

gulp styles && gulp babel && gulp svg

Successfully compiles for both child and parent theme. I noticed that no vendor folder was created during the installation & compilation for splys vendor-theme. The child content is found in pub/static etc, but not in /vendor.

Questions & problems:

  1. php bin/magento setup:upgrade results in styles disappearing and I have to run gulp styles && gulp babel && gulp svg everytime to reinitialize the style. Intended? Any practices to follow here?
  2. The child theme does not appear in backend (design -> configuration section) after creating it in themes.json. Only the parent theme shows here. What should I do to make child theme appear?
  3. I know I shouldn't touch the vendor folder since that's core files. When wanting to make changes to child theme, do I import the files I want to make changes to into app/design/frontend/ folder just like you typically do in LESS based environments? Or do we make changes in pub/static strictly?

Can you spoonfeed me with a neat how-to, by answering these questions? An installation video on youtube + workflow from scratch would help a lot of people, including myself. I'm very eagered to get going here, so I hope you can do me and potential others this favour and also include some tips & tricks!

Reason I'm asking is that I feel the documentation provided was a little short and could've included a few examples for beginners such as myself.

Thank you for your hard work!

Email styling issue

There is a lack of css for emails - is it correct?
If I set locales to pl_PL then email templates expect i.e. email.css to be accessible from https:// ... /frontend/Snowdog/alpaca/en_US/css/email.css (Yes en_US)

If I copy email.css (where it exists) file from disk location: pub/static/frontend/Magento/luma/en_US/css/email.css to pub/static/frontend/Snowdog/alpaca/en_US/css/email.css it seems to work. But still urls in mail source code point to the en_US instead of pl_PL.

If I am wrong, could you please tell me how should I manage css styles for email templates?

Empty category collection when using elasticsearch.

Magento 2.3.3 Commerce, Alpaca theme 1.3.1, Elasticsearch 6, Magento Sample data installed, visiting any category page will results in the message - "We can't find products matching the selection." shown in the products list space. The same as if no products are available.
With the same product setup but with mysql as a search engine products load successfully.
I have tracked down the issue to:

<!-- vendor/snowdog/theme-frontend-alpaca/Magento_Catalog/layout/catalog_category_view.xml:21 -->
        <!-- Moved blocks -->
        <move element="div.sidebar.main" destination="columns" before="main"/>

Moving Layered navigation before the product list causes the empty product collection. If I comment this line the product collection loads fine.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.