diff --git a/.eslintrc.js b/.eslintrc.js index 353fc2287..17339acd9 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -55,7 +55,7 @@ module.exports = { devDependencies: ['tests/**/*.js', '.webpack/**/*.js'], }, ], - 'max-len': ['error', {code: 120}], + 'max-len': ['error', {code: 150}], 'no-alert': 0, 'no-bitwise': 0, 'no-new': 0, @@ -70,6 +70,7 @@ module.exports = { ], 'prefer-destructuring': ['error', {object: true, array: false}], 'no-shadow': 'off', + 'no-useless-constructor': 'off', '@typescript-eslint/no-shadow': ['error'], }, settings: { diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index e8f7f956a..b5d11a338 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -11,19 +11,16 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@v3 + uses: actions/checkout@v4 - name: Setup node env - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: 20 - name: Install dependencies run: npm ci - - name: Copy Webpack config - run: cp ./webpack/.env-example ./webpack/.env - - name: Build assets run: npm run build @@ -32,6 +29,7 @@ jobs: rm .git/ -rf rm .github/ -rf rm .storybook/ -rf + rm docker/ -rf rm node_modules/ -rf rm src/ -rf rm stories/ -rf diff --git a/.github/workflows/cd.yml b/.github/workflows/cd.yml index a0f9606e4..53b747052 100644 --- a/.github/workflows/cd.yml +++ b/.github/workflows/cd.yml @@ -16,10 +16,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@master + uses: actions/checkout@v4 - name: Setup node env - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: ${{ matrix.node }} @@ -27,7 +27,7 @@ jobs: run: npm ci - name: Generate - run: npm run build-storybook + run: npm run storybook:build - name: Deploy uses: peaceiris/actions-gh-pages@v3 diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index 5ea7559a1..ccdb7b896 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -1,29 +1,46 @@ name: Lint on: [ push, pull_request ] jobs: - stylelint: - name: SCSS Lint + stylelint_prettier: + name: Stylelint & Prettier runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v4 - name: Setup Node - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: 20 + + # Install project dependencies + - name: Install dependencies + run: npm ci - - name: Lint scss - run: npm ci && npm run scss-lint + # Run Prettier check command + - name: Run Prettier check + run: | + npm run prettier || { + echo "::error::Prettier check failed. Run 'npm run prettier:fix' to format your code." + exit 1 + } + + # Run Stylelint check command + - name: Run Stylelint check + run: | + npm run stylelint || { + echo "::error::Stylelint check failed. Run 'npm run stylelint:fix' to autofix issues." + exit 1 + } eslint: name: ESLint runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v4 - name: Setup Node - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: 20 - name: Lint js - run: touch ./webpack/.env && npm ci && npm run lint + run: npm ci && npm run lint diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml index 4b6722ba4..77de9adc6 100644 --- a/.github/workflows/tests.yml +++ b/.github/workflows/tests.yml @@ -9,15 +9,15 @@ jobs: js: [ '20' ] steps: - name: Setup Node - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: ${{ matrix.js }} - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v4 - name: Cache Node Directory - uses: actions/cache@v2 + uses: actions/cache@v4 with: path: ~/.npm key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }} diff --git a/.github/workflows/typecheck.yml b/.github/workflows/typecheck.yml index f40cb52fd..b1d3cab68 100644 --- a/.github/workflows/typecheck.yml +++ b/.github/workflows/typecheck.yml @@ -5,12 +5,12 @@ jobs: name: TypeScript type check runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: actions/checkout@v4 - name: Setup Node - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: 20 - name: Build and check types - run: touch ./webpack/.env && npm ci && npm run build + run: npm ci && npm run build diff --git a/.gitignore b/.gitignore index 34c4f5f31..8dac26206 100644 --- a/.gitignore +++ b/.gitignore @@ -2,3 +2,4 @@ node_modules assets .env coverage +storybook-static diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 000000000..70f6554c7 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +v20.19.4 diff --git a/.prettierrc.js b/.prettierrc.js new file mode 100644 index 000000000..a819be48e --- /dev/null +++ b/.prettierrc.js @@ -0,0 +1,15 @@ +module.exports = { + overrides: [ + { + files: "*.scss", + options: { + printWidth: 100, + tabWidth: 2, + useTabs: false, + singleQuote: false, + bracketSpacing: true, + parser: "scss", + }, + }, + ], +}; diff --git a/.storybook/main.js b/.storybook/main.js index d2e038b6a..5d805c217 100644 --- a/.storybook/main.js +++ b/.storybook/main.js @@ -1,35 +1,66 @@ const path = require('path'); module.exports = { - "stories": [ - "../stories/**/*.stories.mdx", - "../stories/**/*.stories.@(js|jsx|ts|tsx)" + stories: [ + '../stories/**/*.mdx', + '../stories/**/*.stories.@(js|jsx|ts|tsx)' ], - "addons": [ - "@storybook/addon-links", - "@storybook/addon-essentials", + + addons: [ + '@storybook/addon-links', + '@storybook/addon-essentials', '@storybook/addon-a11y', + '@storybook/addon-webpack5-compiler-swc' ], - "framework": "@storybook/html", - "core": { - "builder": "webpack5" + + framework: { + name: '@storybook/html-webpack5', + options: {} }, + webpackFinal: (config) => { - config.module.rules[3].use = 'html-loader?minimize=false'; + // Add support for HTML + config.module.rules = config.module.rules.map((rule) => { + if (rule.test && rule.test.toString().includes('\\.html$')) { + return { + ...rule, + use: { + loader: 'html-loader', + } + }; + } + return rule; + }); + + // Add support for SCSS config.module.rules.push({ test: /\.scss$/, - use: ['style-loader', 'css-loader', 'sass-loader'], + use: [ + 'style-loader', + 'css-loader', + { + loader: 'sass-loader', + options: { + sassOptions: { + // Removes deprecation warnings from Bootstrap + quietDeps: true, + } + } + } + ], include: path.resolve(__dirname, '../'), }); + // Add path aliases config.resolve.alias = { ...config.resolve.alias, '@js': path.resolve(__dirname, '../src/js'), '@services': path.resolve(__dirname, '../src/js/services'), '@constants': path.resolve(__dirname, '../src/js/constants'), '@helpers': path.resolve(__dirname, '../src/js/helpers'), - } + }; + // Define external libraries config.externals = { ...config.externals, prestashop: 'prestashop', @@ -37,7 +68,6 @@ module.exports = { return config; }, - addonActionsTheme: { - BASE_COLOR: 'red', - }, -} + + docs: {} +}; diff --git a/.storybook/manager.js b/.storybook/manager.js index 46c82a2a8..8583ce74a 100644 --- a/.storybook/manager.js +++ b/.storybook/manager.js @@ -1,5 +1,4 @@ -import {addons} from '@storybook/addons'; -import {themes} from '@storybook/theming'; +import { addons } from '@storybook/preview-api'; import psTheme from './ps-theme'; addons.setConfig({ diff --git a/.storybook/preview.js b/.storybook/preview.js index 313bd3de7..8e3ecd359 100644 --- a/.storybook/preview.js +++ b/.storybook/preview.js @@ -19,17 +19,11 @@ window.prestashop = { } } -export const parameters = { - actions: { argTypesRegex: "^on[A-Z].*" }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, +const preview = { + parameters: { + // Add parameters here }, - options: { - storySort: { - order: ['Theme', ['Introduction', 'JavaScript', ['Components', ['Introduction']]], 'UI', ['Introduction']], - }, - }, -} + + tags: ['autodocs'] +}; +export default preview; diff --git a/.stylelintrc b/.stylelintrc index 1bc2bf8ff..f12260e56 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -4,16 +4,21 @@ ], "customSyntax": "postcss-scss", "rules": { + "declaration-colon-newline-after": null, + "function-disallowed-list": null, + "property-disallowed-list": null, + "selector-class-pattern": null, "selector-id-pattern": null, - "selector-max-id": null, "selector-max-class": null, - "selector-max-type": null, + "selector-max-combinators": null, "selector-max-compound-selectors": null, + "selector-max-id": null, + "selector-max-type": null, "selector-no-qualifying-type": null, - "selector-max-combinators": null, - "selector-class-pattern": null, - "function-disallowed-list": null, + "value-list-comma-newline-after": null, + "value-list-comma-space-after": null, "scss/dollar-variable-default": null, - "property-disallowed-list": null + "scss/operator-no-newline-after": null, + "scss/percent-placeholder-pattern": null } } diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index dbc1871a1..cd964eb14 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,49 +1,51 @@ -# Contributing +# 🀝 Contributing to Hummingbird -### Understanding +Thank you for your interest in contributing! Hummingbird is an open-source **development theme** for PrestaShop, and your help is highly appreciated πŸ™Œ -Before getting started, you should read our article introducing the project: -[We're Building A Starter Theme For PrestaShop 1.7.8 and 8](https://build.prestashop-project.org/news/2022/new-theme-announce/). +## 🧠 Learn Before You Start -If you are contributing to this theme, you are probably interested in PrestaShop development as well. Please the following article to get familiar with [PrestaShop branching model](https://build.prestashop-project.org/news/2015/introducing-new-branching-model-prestashop/). +- [We’re Building a Starter Theme for PrestaShop](https://build.prestashop-project.org/news/2022/new-theme-announce/). +- [PrestaShop Branching Model](https://build.prestashop-project.org/news/2015/introducing-new-branching-model-prestashop/). -You got any questions ? Join the open source slack. +πŸ’¬ Join our Slack community: [https://www.prestashop-project.org/slack/](https://www.prestashop-project.org/slack/) -[Join the slack at https://www.prestashop-project.org/slack/](https://www.prestashop-project.org/slack/) +## πŸ› οΈ Environment Setup -### Setting up +Follow the [README.md](README.md) for detailed setup and build instructions. -There are few things to do before you are ready to contribute. +## βœ… Checklist Before You Start -1. Check your _Git_ configuration. Read [Set Up Your Git For Contributing](https://build.prestashop-project.org/howtos/misc/set-up-your-git-for-contributing/) -2. Check your editor configuration. The rules are defined in `.editorconfig`. Do it manually or [install the available plugin](http://editorconfig.org/#download). -3. Make sure you at least have [NodeJS 14](https://nodejs.org/en/download/) installed. -4. You should install the theme inside a PrestaShop instance, please refer to [the developers docummentation of the project](https://devdocs.prestashop-project.org/1.7/basics/installation/). +1. Set up your Git config:
+ [Set up your Git for contributing](https://build.prestashop-project.org/howtos/misc/set-up-your-git-for-contributing/) +2. Use an editor that supports .editorconfig.
+ [Download an EditorConfig plugin](http://editorconfig.org/#download). +3. Make sure you have [Node.js v20](https://nodejs.org/en/download/) installed. -### How to build the theme +## πŸ‘ Good Practices -First you need to install every node module: +- Use [BEM naming conventions](https://getbem.com/) for CSS. +- Use Bootstrap components **when they fully meet your needs**. +- Create custom components when **Bootstrap isn't sufficient**. +- Use **Bootstrap CSS variables** in your custom components wherever possible to maintain consistency. +- Add comments to your code where clarification is needed. +- Before submitting a PR: + - Format code using Prettier:
+ `npm run prettier` and `npm run prettier:fix` + - Run linters for both JavaScript and styles:
+ For linting check use `npm run lint && npm run stylelint`. Use `npm run lint:fix && npm run stylelint:fix` to auto-fix where possible.
+ **Otherwise, fix issues manually.** +- If your PR is a work in progress, use **GitHub draft PR**. +- Fill out the PR template thoroughly to speed up testing and review. +- Organize your commits clearly and try to follow [conventional commits](https://www.conventionalcommits.org/) to name it.
+ **Examples:** + - `feat: add responsive support for product cards` + - `fix: correct header spacing on mobile` + - `chore: update dependencies` -`npm ci` +## πŸ› Reporting Issues -then create a `.env` file inside the *webpack* folder by copying `webpack/.env-example` and complete it with your environment's informations. Please use a free tcp port. +You can [open an issue](https://github.com/PrestaShop/hummingbird/issues) to: -then build assets: - -`npm run build` - -### Good practices - -- Follow the BEM convention -- Be careful about creating SCSS files in the right folder, refer to the [documentation](https://build.prestashop-project.org/hummingbird/) for further informations. -- When you want to submit a PR, please make sure that you ran both linters using `npm run lint-fix && npm run scss-fix` and fixed every lint issues. -- If your PR is a work in progress, make sure that you use the Github draft mode. -- Fill the PR template as much as possible, it's important to speed the process of testing, reviewing... -- Try to organize your commits in a way to simplify the review. - -### Reporting issues - -Open an issue: - -1. To report a bug. -2. To propose an improvement and get feedbacks before you code it. ([example](https://github.com/PrestaShop/hummingbird/issues/)) +- Report a bug 🐞 +- Suggest an improvement πŸ’‘ +- Ask a question or get feedback before starting work πŸ’¬ diff --git a/README.md b/README.md index ed3bfd0ff..808c1c504 100644 --- a/README.md +++ b/README.md @@ -1,44 +1,156 @@ -# Hummingbird theme +# Hummingbird Theme for PrestaShop -This is a PrestaShop's theme we are working on. Please, if you work on this theme, use the `8.1.x` branch of PrestaShop to make sure this theme is compatible with the latest `8.1.x` version. +![CI](https://github.com/PrestaShop/hummingbird/actions/workflows/lint.yml/badge.svg) +![PrestaShop 9.0+](https://img.shields.io/badge/prestashop-9.0%2B-brightgreen.svg) +![Docker Ready](https://img.shields.io/badge/docker-ready-blue.svg) +![Node.js v20](https://img.shields.io/badge/node.js-20.x-blue.svg) +![License](https://img.shields.io/badge/license-AFL%203.0-lightgray.svg) -[Read more](https://build.prestashop.com/news/new-theme-announce/) about this theme on the blog. +Hummingbird is a modern, in-development theme for PrestaShop built to be compatible with versions `9.0.x` and above. -![image](https://user-images.githubusercontent.com/16455155/199937084-3d2eab3f-dc3e-488f-8b87-e8d4565219b3.png) +## πŸ” Theme Previews +| [](https://github.com/user-attachments/assets/59828a32-462d-437b-b137-3c78ce057bb6) | [](https://github.com/user-attachments/assets/77e5e3ec-1004-4f69-bda6-c51a140c812f) | [](https://github.com/user-attachments/assets/31a1966b-6e73-44af-9735-874666ae486a) | +| --- | --- | --- | +| Homepage | Category | Product | -## How to build assets +## ⚠️ Requirements -Same as the PrestaShop project, you need at least **NodeJS 20.x** and **NPM 8** in order to build the project. +To work on Hummingbird, you'll need: -First you need to install every node module: +- Node.js **v20.x**. +- npm **v8**. -`npm ci` +## πŸ“‘ Table of Contents +- Want to help develop the theme? Start with [πŸ§‘β€πŸ’» Develop on Hummingbird](#-develop-on-hummingbird). +- Want to preview or test it? Jump to [🐳 Run Hummingbird with Docker](#-run-hummingbird-with-docker). +- Having issues with caching during development? Jump to [πŸ₯΅ Troubleshooting](#-troubleshooting). -then create a `.env` file inside the *webpack* folder by copying `webpack/.env-example` and complete it with your environment's informations. Please use a free tcp port. +## πŸ§‘β€πŸ’» Develop on Hummingbird -then build assets: +### 🧰 Installation / Setup -`npm run build` +#### πŸ‘€ Watch Mode Setup -## Documentation +From the **project root** run the following commands if you want to: -We use Storybook as a [documentation](https://build.prestashop.com/hummingbird/). As the theme is currently in development, there is a lot of work on documentation. Don't hesitate to add whatever you feel usefull to it. +1. Install dependencies: `npm ci`. +2. Run watch mode to build assets: `npm run watch`. +3. You can now go to [🐳 Run Hummingbird with Docker](#-run-hummingbird-with-docker) section to run PrestaShop embedding Hummingbird. -## Contributing +#### πŸ”₯ Hot Module Reload (HMR) Setup -Please refer to the [contributing guide](https://github.com/PrestaShop/hummingbird/blob/develop/CONTRIBUTING.md) +1. From the **project root** run: `npm ci`. +2. Navigate to the `webpack/` directory. +3. Run `cp .env-docker-example .env` or `cp .env-vhost-example .env` (depending on how you want to run your PrestaShop environment). +4. Edit `.env` with your local environment settings and ensure you use a free TCP port. +5. From the **project root** run `npm run dev`. +6. You can now go to [🐳 Run Hummingbird with Docker](#-run-hummingbird-with-docker) section to run PrestaShop embedding Hummingbird. -## Continuous Integration +### πŸ–ŒοΈ Code Quality -The CI runs contain stylelint, eslint, TypeScript type checks. +To ensure code quality and consistency, run the following commands from the **project root**: -## Continuous Deployment +- Lint & auto-fix SCSS files: `npm run stylelint` or `npm run stylelint:fix`. +- Format & auto-format SCSS with Prettier: `npm run prettier` or `npm run prettier:fix`. +- Lint & auto-fix JS/TS files: `npm run lint` or `npm run lint:fix`. -When develop is merged into master, the Storybook is delivered almost instantly to his public link using a Github Pages. +## 🐳 Run Hummingbird with Docker -## License +This theme includes Docker configurations for both **PrestaShop** and **PrestaShop Flashlight** development environments. -This theme is released under the [Academic Free License 3.0][AFL-3.0] +### πŸ› οΈ Getting Started + +**Note:** If you've already set up your development environment using `Watch Mode` or `Hot Module Reload (HMR)`, you can skip ahead to **step 3**. + +1. From the **project root** run: `npm ci`. +2. Then run: `npm run build`. +3. Navigate to the `docker/` directory: `cd docker`. +4. Copy the example environment file: `cp .env-example .env`. +5. Edit `.env` to configure the following variables: + - `PS_TAG`: PrestaShop or Flashlight version tag. + - [PrestaShop tags](https://hub.docker.com/r/prestashop/prestashop/tags). + - [Flashlight tags](https://hub.docker.com/r/prestashop/prestashop-flashlight/tags). + - `PLATFORM`: Platform architecture (e.g., linux/amd64, linux/arm64). + - `ADMIN_EMAIL`: Back office admin email. + - `ADMIN_PASSWORD`: Back office admin password. + +### πŸ“¦ Available Configurations + +- `docker-compose-prestashop.yml`: for standard PrestaShop development environment. +- `docker-compose-flashlight.yml`: for PrestaShop Flashlight development environment. + +### ▢️ Starting the Environment + +From the **project root**, run one of the following commands: + +```bash +# For PrestaShop environment +docker compose -f docker/docker-compose-prestashop.yml up -d + +# For Flashlight environment +docker compose -f docker/docker-compose-flashlight.yml up -d +``` + +### πŸ‘€ After Starting the Environment +- PrestaShop/Flashlight will be available at http://localhost:8887 and BO at http://localhost:8887/admin-dev. +- phpMyAdmin will be available at http://localhost:8889. + +### ⏹️ Stopping the Environment + +From the **project root**, run one of the following commands: + +```bash +# For PrestaShop environment +docker compose -f docker/docker-compose-prestashop.yml down -v + +# For Flashlight environment +docker compose -f docker/docker-compose-flashlight.yml down +``` + +## πŸ₯΅ Troubleshooting + +> [!WARNING] +> If you're experiencing issues with styles or assets not updating while using HMR mode, follow these steps to avoid browser and PrestaShop caching problems: + +1. Disable browser cache during development: + - Open your browser's DevTools. + - Go to the `Network` tab. + - Enable `Disable cache` (⚠️ this only works while DevTools stays open). +2. Disable PrestaShop caching: + - In the back office, go to: `Advanced Parameters` β†’ `Performance`. + - Under the Smarty section: + - Set Force compilation to `Yes`. + - Set Cache to `No`. + - Under the CCC (Combine, Compress and Cache) section: + - Disable all options. + +## πŸ“š Storybook + +Storybook is used to document and preview the theme's UI components during development. You can view the [live documentation here](https://build.prestashop.com/hummingbird/). Since the theme is still in progress, contributions to improve or expand the documentation are welcome and encouraged. + +### ▢️ Run Storybook Locally + +To run Storybook on your machine: + +1. Make sure project dependencies are installed, if not, from the **project root** run: `npm ci`. +2. Then run: `npm run storybook`. +3. Storybook will be available at http://localhost:6006. + +## 🀝 Contributing + +Please refer to the [contributing guide](CONTRIBUTING.md). + +## βœ… Continuous Integration + +The CI runs include Stylelint, Prettier, ESLint, and TypeScript type checks. + +## πŸš€ Continuous Deployment + +Whenever the `develop` branch is merged into `master`, the Storybook documentation is automatically deployed to GitHub Pages and becomes publicly accessible within minutes. + +## πŸ“„ License + +This theme is released under the [Academic Free License 3.0][AFL-3.0]. [AFL-3.0]: https://opensource.org/licenses/AFL-3.0 diff --git a/composer.json b/composer.json index 7d06efe87..64a1b9230 100644 --- a/composer.json +++ b/composer.json @@ -1,6 +1,6 @@ { "name": "prestashop/hummingbird", - "description": "Hummingbird theme for develop PrestaShop version", + "description": "Hummingbird development theme for PrestaShop", "type": "prestashop-theme", "license": "AFL-3.0", "authors": [ diff --git a/config/theme.yml b/config/theme.yml index af0ef2313..65c228ee7 100644 --- a/config/theme.yml +++ b/config/theme.yml @@ -1,6 +1,6 @@ name: hummingbird display_name: Hummingbird -version: 1.0.1 +version: 2.0.0 author: name: "PrestaShop Team" email: "pub@prestashop.com" @@ -8,9 +8,9 @@ author: meta: compatibility: - from: 8.1.0 - to: ~ - framework: 'bootstrap-v5.2.0' + from: 9.0.0 + to: ~ + framework: bootstrap-v5.3.3 available_layouts: layout-full-width: @@ -26,43 +26,24 @@ meta: name: Two Columns, small right column description: Two columns with a small right column -assets: - # If you're using this theme as child and you want to load - # the parent theme assets, uncomment this line. -# use_parent_assets: true - - # The following lines are showing how to load assets in your page - # Uncomment and change value to start loading css or js files -# css: -# all: -# - id: custom-lib-style -# path: assets/css/custom-lib.css -# product: -# - id: product-style -# path: assets/css/product.css -# media: all -# priority: 200 -# js: -# cart: -# - id: cat-extra-lib -# path: assets/js/cart-lib.js - - global_settings: configuration: PS_IMAGE_QUALITY: png + HOME_FEATURED_NBR: 4 + NEW_PRODUCTS_NBR: 4 + BLOCKSPECIALS_SPECIALS_NBR: 4 + PS_BLOCK_BESTSELLERS_TO_DISPLAY: 4 + PSR_ICON_COLOR: "#0b69f6" + PSR_TEXT_COLOR: "#212529" modules: - to_enable: - - ps_linklist + to_enable: + - ps_linklist + to_disable: + - blockwishlist hooks: modules_to_hook: - displayAdminCustomers: - - blockwishlist displayCustomerAccount: - - blockwishlist - psgdpr - displayMyAccountBlock: - - blockwishlist displayNav1: - ps_contactinfo displayNav2: @@ -81,13 +62,12 @@ global_settings: - ps_newproducts - ps_bestsellers displayFooterBefore: - - ps_emailsubscription - ps_socialfollow + - ps_emailsubscription displayFooter: - ps_linklist - ps_customeraccountlinks - ps_contactinfo - - blockwishlist displayFooterProduct: - productcomments displayLeftColumn: @@ -110,8 +90,6 @@ global_settings: - ps_featuredproducts displayCrossSellingShoppingCart: - ps_featuredproducts - displayProductActions: - - blockwishlist image_types: cart_default: @@ -126,42 +104,42 @@ global_settings: width: 452 height: 452 scope: [products, manufacturers, suppliers] - home_default: - width: 250 - height: 250 - scope: [products] large_default: width: 800 height: 800 scope: [products, manufacturers, suppliers] + home_default: + width: 250 + height: 250 + scope: [products] category_default: width: 141 height: 180 scope: [categories] stores_default: - width: 170 - height: 115 + width: 287 + height: 160 scope: [stores] default_xs: - width: 120 - height: 120 - scope: [products, manufacturers, suppliers, categories] - default_s: width: 160 height: 160 + scope: [products, manufacturers, suppliers, categories] + default_sm: + width: 216 + height: 216 scope: [categories, products] - default_m: - width: 200 - height: 200 - scope: [stores, manufacturers, suppliers, products] default_md: - width: 320 - height: 320 + width: 261 + height: 261 + scope: [manufacturers, suppliers, products, categories] + default_lg: + width: 336 + height: 336 scope: [categories, products] default_xl: width: 400 height: 400 - scope: [stores, products] + scope: [products] product_main: width: 720 height: 720 @@ -179,7 +157,6 @@ global_settings: height: 400 scope: [categories] - theme_settings: rtl_generation: false default_layout: layout-full-width diff --git a/docker/.env-example b/docker/.env-example new file mode 100644 index 000000000..b0941f388 --- /dev/null +++ b/docker/.env-example @@ -0,0 +1,4 @@ +PS_TAG= # PrestaShop version or PrestaShop Flashlight version +PLATFORM= # Platform for Flashlight container +ADMIN_EMAIL=admin@prestashop.com # Admin email +ADMIN_PASSWORD=prestashop # Admin password diff --git a/docker/docker-compose-flashlight.yml b/docker/docker-compose-flashlight.yml new file mode 100644 index 000000000..41f9df90f --- /dev/null +++ b/docker/docker-compose-flashlight.yml @@ -0,0 +1,41 @@ +name: hummingbird-fl +services: + prestashop: + image: prestashop/prestashop-flashlight:${PS_TAG} + platform: ${PLATFORM} # Set the desired platform in .env for Prestashop Flashlight Image + container_name: hummingbird-fl-prestashop + restart: unless-stopped + depends_on: + - mysql + ports: + - 8887:80 + environment: + PS_DOMAIN: localhost:8887 + volumes: + - ..:/var/www/html/themes/hummingbird # Mount the theme to the container + + mysql: + image: mariadb:lts + platform: ${PLATFORM} + container_name: hummingbird-fl-mysql + restart: unless-stopped + ports: + - 8888:3306 + environment: + TZ: UTC + MYSQL_USER: prestashop + MYSQL_PASSWORD: prestashop + MYSQL_ROOT_PASSWORD: prestashop + MYSQL_DATABASE: prestashop + + phpmyadmin: + platform: ${PLATFORM} + image: phpmyadmin:latest + container_name: hummingbird-fl-phpmyadmin + restart: unless-stopped + depends_on: + - mysql + ports: + - 8889:80 + environment: + PMA_HOST: mysql diff --git a/docker/docker-compose-prestashop.yml b/docker/docker-compose-prestashop.yml new file mode 100644 index 000000000..b487122fe --- /dev/null +++ b/docker/docker-compose-prestashop.yml @@ -0,0 +1,56 @@ +name: hummingbird-ps +services: + prestashop: + image: prestashop/prestashop:${PS_TAG} + platform: linux/amd64 # Only platform supported by Prestashop Official Image + container_name: hummingbird-ps-prestashop + restart: unless-stopped + depends_on: + - mysql + ports: + - 8887:80 + environment: + PS_DEV_MODE: 1 + DB_SERVER: mysql + DB_USER: root + DB_PASSWD: root + DB_NAME: prestashop + PS_INSTALL_AUTO: 1 + PS_ERASE_DB: 1 + PS_INSTALL_DB: 1 + PS_DOMAIN: localhost:8887 + PS_FOLDER_ADMIN: admin-dev + PS_FOLDER_INSTALL: install-dev + ADMIN_MAIL: ${ADMIN_EMAIL} + ADMIN_PASSWD: ${ADMIN_PASSWORD} + volumes: + - ..:/var/www/html/themes/hummingbird # Mount the theme to the container + + mysql: + image: mariadb:lts + platform: ${PLATFORM} + container_name: hummingbird-ps-mysql + restart: unless-stopped + ports: + - 8888:3306 + environment: + MARIADB_ROOT_PASSWORD: root + MARIADB_DATABASE: prestashop + volumes: + - db_ps_data:/var/lib/mysql + + phpmyadmin: + platform: ${PLATFORM} + image: phpmyadmin:latest + container_name: hummingbird-ps-phpmyadmin + restart: unless-stopped + depends_on: + - mysql + ports: + - 8889:80 + environment: + PMA_HOST: mysql + MYSQL_ROOT_PASSWORD: root + +volumes: + db_ps_data: diff --git a/modules/blockreassurance/views/dist/front.css b/modules/blockreassurance/views/dist/front.css new file mode 100644 index 000000000..f936c2a5e --- /dev/null +++ b/modules/blockreassurance/views/dist/front.css @@ -0,0 +1 @@ +/* Empty blockreassurance */ diff --git a/modules/blockreassurance/views/templates/hook/blockreassurance.tpl b/modules/blockreassurance/views/templates/hook/blockreassurance.tpl deleted file mode 100644 index 17933e335..000000000 --- a/modules/blockreassurance/views/templates/hook/blockreassurance.tpl +++ /dev/null @@ -1,18 +0,0 @@ -{** - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - *} -{if $elements} -
-
    - {foreach from=$elements item=element} -
  • -
    - {$element.text} - {$element.text} -
    -
    • - {/foreach} -
-
-{/if} diff --git a/modules/blockreassurance/views/templates/hook/displayBlock.tpl b/modules/blockreassurance/views/templates/hook/displayBlock.tpl new file mode 100644 index 000000000..09d8e908f --- /dev/null +++ b/modules/blockreassurance/views/templates/hook/displayBlock.tpl @@ -0,0 +1,53 @@ +{** + * Copyright since 2007 PrestaShop SA and Contributors + * PrestaShop is an International Registered Trademark & Property of PrestaShop SA + * + * NOTICE OF LICENSE + * + * This source file is subject to the Academic Free License version 3.0 + * that is bundled with this package in the file LICENSE.md. + * It is also available through the world-wide-web at this URL: + * https://opensource.org/licenses/AFL-3.0 + * If you did not receive a copy of the license and are unable to + * obtain it through the world-wide-web, please send an email + * to license@prestashop.com so we can send you a copy immediately. + * + * @author PrestaShop SA and Contributors + * @copyright Since 2007 PrestaShop SA and Contributors + * @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0 + *} +{if isset($blocks) && !empty($blocks)} +
+
+ {foreach from=$blocks item=$block key=$key} + {if $block['type_link'] !== $LINK_TYPE_NONE && !empty($block['link'])} + + {else} +
+ {/if} + + + {if $block['custom_icon']} + + {elseif $block['icon']} + + {/if} + + + + {$block['title']|escape:'htmlall':'UTF-8'} + {if !empty($block['description'])} +
+ {$block['description'] nofilter} + {/if} + + + {if !empty($block['link']) && $block['type_link'] !== $LINK_TYPE_NONE} + + {else} +
+ {/if} + {/foreach} +
+
+{/if} diff --git a/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl b/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl new file mode 100644 index 000000000..2dc9daeab --- /dev/null +++ b/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl @@ -0,0 +1,37 @@ +{** + * For the full copyright and license information, please view the LICENSE + * file that was distributed with this source code. + *} +{if isset($blocks) && !empty($blocks)} +
+ {foreach from=$blocks item=$block key=$key} + {if $block['type_link'] !== $LINK_TYPE_NONE && !empty($block['link'])} + + {else} +
+ {/if} + + + {if $block['custom_icon']} + + {elseif $block['icon']} + + {/if} + + + + {$block['title']|escape:'htmlall':'UTF-8'} + {if !empty($block['description'])} +
+ {$block['description'] nofilter} + {/if} + + + {if !empty($block['link']) && $block['type_link'] !== $LINK_TYPE_NONE} + + {else} +
+ {/if} + {/foreach} +
+{/if} diff --git a/modules/blockreassurance/views/templates/hook/displayBlockWhite.tpl b/modules/blockreassurance/views/templates/hook/displayBlockWhite.tpl new file mode 100644 index 000000000..8e0b4c616 --- /dev/null +++ b/modules/blockreassurance/views/templates/hook/displayBlockWhite.tpl @@ -0,0 +1,53 @@ +{** + * Copyright since 2007 PrestaShop SA and Contributors + * PrestaShop is an International Registered Trademark & Property of PrestaShop SA + * + * NOTICE OF LICENSE + * + * This source file is subject to the Academic Free License version 3.0 + * that is bundled with this package in the file LICENSE.md. + * It is also available through the world-wide-web at this URL: + * https://opensource.org/licenses/AFL-3.0 + * If you did not receive a copy of the license and are unable to + * obtain it through the world-wide-web, please send an email + * to license@prestashop.com so we can send you a copy immediately. + * + * @author PrestaShop SA and Contributors + * @copyright Since 2007 PrestaShop SA and Contributors + * @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0 + *} +{if isset($blocks) && !empty($blocks)} +
+
+ {foreach from=$blocks item=$block key=$key} + {if $block['type_link'] !== $LINK_TYPE_NONE && !empty($block['link'])} + + {else} +
+ {/if} + + + {if $block['custom_icon']} + + {elseif $block['icon']} + + {/if} + + + + {$block['title']|escape:'htmlall':'UTF-8'} + {if !empty($block['description'])} +
+ {$block['description'] nofilter} + {/if} + + + {if !empty($block['link']) && $block['type_link'] !== $LINK_TYPE_NONE} + + {else} +
+ {/if} + {/foreach} +
+
+{/if} diff --git a/modules/blockwishlist/views/templates/components/modals/add-to-wishlist.tpl b/modules/blockwishlist/views/templates/components/modals/add-to-wishlist.tpl index 95400d6d4..d9275e958 100644 --- a/modules/blockwishlist/views/templates/components/modals/add-to-wishlist.tpl +++ b/modules/blockwishlist/views/templates/components/modals/add-to-wishlist.tpl @@ -14,10 +14,10 @@ role="dialog" aria-modal="true" > -
+
-
-

{l s='Add to wishlist' d='Modules.Blockwishlist.Shop'}

+
+

{l s='Add to wishlist' d='Modules.Blockwishlist.Shop'}

{/if} diff --git a/modules/productcomments/views/css/productcomments.css b/modules/productcomments/views/css/productcomments.css new file mode 100644 index 000000000..122eef8f0 --- /dev/null +++ b/modules/productcomments/views/css/productcomments.css @@ -0,0 +1 @@ +/* Empty productcomments */ diff --git a/modules/productcomments/views/img/small_stars.png b/modules/productcomments/views/img/small_stars.png new file mode 100644 index 000000000..02c688237 Binary files /dev/null and b/modules/productcomments/views/img/small_stars.png differ diff --git a/modules/productcomments/views/img/stars.png b/modules/productcomments/views/img/stars.png new file mode 100644 index 000000000..84fb4738a Binary files /dev/null and b/modules/productcomments/views/img/stars.png differ diff --git a/modules/productcomments/views/js/list-comments.js b/modules/productcomments/views/js/list-comments.js new file mode 100644 index 000000000..bb4b422c2 --- /dev/null +++ b/modules/productcomments/views/js/list-comments.js @@ -0,0 +1 @@ +/* productcomments */ diff --git a/modules/productcomments/views/js/post-comment.js b/modules/productcomments/views/js/post-comment.js new file mode 100644 index 000000000..bb4b422c2 --- /dev/null +++ b/modules/productcomments/views/js/post-comment.js @@ -0,0 +1 @@ +/* productcomments */ diff --git a/modules/productcomments/views/js/productListingComments.js b/modules/productcomments/views/js/productListingComments.js new file mode 100644 index 000000000..e6220c7ff --- /dev/null +++ b/modules/productcomments/views/js/productListingComments.js @@ -0,0 +1,2 @@ +/* productcomments */ + diff --git a/modules/productcomments/views/templates/hook/alert-modal.tpl b/modules/productcomments/views/templates/hook/alert-modal.tpl index 8eeda6249..a6e7b093e 100644 --- a/modules/productcomments/views/templates/hook/alert-modal.tpl +++ b/modules/productcomments/views/templates/hook/alert-modal.tpl @@ -6,25 +6,18 @@ {assign var='icon' value=$icon|default:'check'} {assign var='modal_message' value=$modal_message|default:''} - -