first commit

themes/.htaccess

@@ -0,0 +1,12 @@
+<FilesMatch "\.tpl$">
+    # Apache 2.2
+    <IfModule !mod_authz_core.c>
+        Order deny,allow
+        Deny from all
+    </IfModule>
+
+    # Apache 2.4
+    <IfModule mod_authz_core.c>
+        Require all denied
+    </IfModule>
+</FilesMatch>

themes/ayon/CONTRIBUTING.md

@@ -0,0 +1,30 @@
+# Contributing
+
+### Understanding
+
+Before getting started, you should read our article introducing the project:
+[We're Building A Starter Theme For PrestaShop 1.7.0.0](http://build.prestashop.com/news/starter-theme-kickoff/).
+
+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](http://build.prestashop.com/news/introducing-new-branching-model-prestashop/).
+
+You got any questions ? Join the gitter chat room.
+
+[![Join the chat at https://gitter.im/PrestaShop/StarterTheme](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/PrestaShop/StarterTheme?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+
+
+### Setting up
+
+There are few things to do before you are ready to contribute.
+
+1. Check your _Git_ configuration. Read [Set Up Your Git For Contributing](http://build.prestashop.com/howtos/misc/set-up-your-git-for-contributing/)
+1. Check your editor configuration. The rules are defined in `.editorconfig`. Do it manually or [install the available plugin](http://editorconfig.org/#download).
+
+
+### Reporting issues
+
+The _Starter Theme_ project is the only PrestaShop project that **use GitHub issues**. Please don't report any bug on the forge but open an issue here.
+
+Open an issue:
+
+1. To report a bug.
+1. To propose an improvement and get feedbacks before you code it. ([example](https://github.com/PrestaShop/StarterTheme/issues/2))

themes/ayon/README.md

@@ -0,0 +1,4 @@
+# PrestaShop Classic Theme
+
+The Classic Theme is the new default Theme for Prestashop 1.7 and onwards.
+It is build upon the new Starter Theme.

themes/ayon/_dev/_webpack/util.js

@@ -0,0 +1,30 @@
+const mapObject = obj => fn => Object.keys(obj).map(key => fn(obj[key], key));
+
+module.exports = {
+	browserSyncPort: 3000, // The port on which the server browserSync will be launched
+	browserSyncOpen: true, // Auto open browserSync URL in browser
+	browserSyncTarget: "https://ayon.dev/", // URL of your server prestashop (example: "http://localhost:8080/ps/" or "http://remote-server.com")
+	themeFolderName: 'ayon', // folder name your theme
+
+	outputFolderName: 'assets/js',
+	get publicPath(){
+		return `https://localhost:${this.browserSyncPort}/themes/${this.themeFolderName}/${this.outputFolderName}/`;
+		// check public path to 'outputFolderName'
+		// if you use next 'browserSyncTarget'
+		// browserSyncTarget: "http://localhost:8080/ps/"
+		// That publicPath will be such
+		// `http://localhost:${this.browserSyncPort}/ps/themes/${this.themeFolderName}/${this.outputFolderName}/`
+	},
+	DEV: process.env.NODE_ENV !== "production",
+
+	addHotMiddleware(entry) {
+		const newEntry = {};
+
+		mapObject(entry)((val, name) => {
+			val = (Array.isArray(val) ? val : [val]).slice();
+			val.unshift("webpack/hot/dev-server", "webpack-hot-middleware/client");
+			newEntry[name] = val;
+		});
+		return newEntry;
+	}
+};

themes/ayon/_dev/_webpack/webpack.default.js

@@ -0,0 +1,69 @@
+const path = require('path');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const {DEV, outputFolderName} = require('./util.js');
+
+let config = {
+  entry: {
+    main: [
+      './js/theme.js',
+      './css/theme.scss'
+    ]
+  },
+  output: {
+    path: path.resolve(__dirname, `../../${outputFolderName}/`),
+    filename: 'theme.js'
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js/,
+        loader: 'babel-loader'
+      },
+      {
+        test: /\.scss$/,
+        use: ExtractTextPlugin.extract({
+          fallback: 'style-loader',
+          use: [
+            {
+              loader: 'css-loader',
+              options: {
+                minimize: !DEV
+              }
+            },
+            'postcss-loader',
+            'sass-loader'
+          ]
+        })
+      },
+      {
+        test: /.(png|woff(2)?|eot|ttf|svg)(\?[a-z0-9=\.]+)?$/,
+        use: [
+          {
+            loader: 'file-loader',
+            options: {
+              name: '../css/[hash].[ext]'
+            }
+          }
+        ]
+      },
+      {
+        test : /\.css$/,
+        use: ['style-loader', 'css-loader', 'postcss-loader']
+      }
+    ]
+  },
+  externals: {
+    prestashop: 'prestashop',
+    $: '$',
+    jquery: 'jQuery'
+  },
+  plugins: [
+    new ExtractTextPlugin({
+      filename: path.join('..', 'css', 'theme.css'),
+      allChunks: true,
+      disable: DEV
+    })
+  ]
+};
+
+module.exports = config;

themes/ayon/_dev/_webpack/webpack.development.js

@@ -0,0 +1,59 @@
+const { resolve } = require("path");
+const { sync: delSync } = require("del");
+const { HotModuleReplacementPlugin } = require("webpack");
+const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
+const HardSourceWebpackPlugin = require("hard-source-webpack-plugin");
+const BrowserSyncHotPlugin = require("browser-sync-dev-hot-webpack-plugin");
+
+const {publicPath, browserSyncPort, browserSyncOpen, browserSyncTarget, themeFolderName} = require('./util.js');
+
+module.exports = {
+	output: {
+		publicPath
+	},
+	plugins: [
+		{
+			apply(){
+				delSync([
+					resolve(__dirname, `../../assets/css/theme.css`)
+				], {force: true});
+			}
+		},
+		new HotModuleReplacementPlugin(),
+		new BrowserSyncHotPlugin({
+			browserSync: {
+				port: browserSyncPort,
+				open: browserSyncOpen,
+				reloadDelay: 500,
+				proxy: {
+					target: browserSyncTarget
+				},
+				plugins: [
+					{
+						module: "bs-html-injector",
+						options: {
+							files: [
+								/* pwd() + */"../templates/**/*.tpl",
+								/* pwd() + */'../modules/**/*.tpl'
+							]
+						}
+					}
+				]
+			},
+			devMiddleware: {
+				publicPath,
+				stats: { colors: true, chunck: false },
+				hot: true
+			},
+			hotMiddleware: {}
+		}),
+		new HardSourceWebpackPlugin({
+			cacheDirectory: `${resolve(__dirname, "../node_modules/.cache/hard-source/")}[confighash]`,
+			recordsPath: `${resolve(__dirname, "../node_modules/.cache/hard-source/")}[confighash]/records.json`,
+			configHash: require("node-object-hash")({ sort: false }).hash
+		}),
+		new BundleAnalyzerPlugin({
+			openAnalyzer: false
+		}),
+	]
+};

themes/ayon/_dev/_webpack/webpack.production.js

@@ -0,0 +1,40 @@
+const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
+
+module.exports = {
+  plugins: [
+    new UglifyJsPlugin({
+      uglifyOptions: {
+        mangle: true,
+        compress: {
+          arrows: false,
+          booleans: false,
+          collapse_vars: false,
+          comparisons: false,
+          computed_props: false,
+          hoist_funs: false,
+          hoist_props: false,
+          hoist_vars: false,
+          if_return: false,
+          inline: false,
+          join_vars: false,
+          keep_infinity: true,
+          loops: false,
+          negate_iife: false,
+          properties: false,
+          reduce_funcs: false,
+          reduce_vars: false,
+          sequences: false,
+          side_effects: false,
+          switches: false,
+          top_retain: false,
+          toplevel: false,
+          typeofs: false,
+          unused: false,
+          conditionals: true,
+          dead_code: true,
+          evaluate: true
+        }
+      }
+    })
+  ]
+};

themes/ayon/_dev/css/components/alert.scss

@@ -0,0 +1,49 @@
+.ps-alert-error {
+  margin-bottom: 0;
+}
+
+.ps-alert-error,
+.ps-alert-success {
+  .item {
+    align-items: center;
+    border: 2px $brand-danger solid;
+    display: flex;
+    background-color: $brand-danger;
+    margin-bottom: 1rem;
+
+    i {
+      border: 15px $brand-danger solid;
+      display: flex;
+
+      svg {
+        background-color: $brand-danger;
+        width: 24px;
+        height: 24px;
+      }
+    }
+
+    p {
+      background-color: $body-bg;
+      margin: 0!important;
+      padding: 18px 20px 18px 20px;
+      width: 100%;
+    }
+  }
+}
+
+.ps-alert-success {
+  padding: 0.25rem 0.25rem 2.75rem 0.25rem;
+
+  .item {
+    border-color: $brand-success;
+    background-color: $brand-success;
+
+    i {
+      border-color: $brand-success;
+
+      svg {
+        background-color: $brand-success;
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/animsition.css

@@ -0,0 +1,193 @@
+.animsition,
+.animsition-overlay {
+  position: relative;
+  opacity: 0;
+  animation-fill-mode: both;
+}
+
+.animsition-overlay-slide {
+  position: fixed;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+}
+
+/* loading option */
+.roy-loader {
+  width: 100%;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1000;
+}
+
+.roy-loader .icon_loader {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.roy-loader .icon_loader span {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  border-width: 2px;
+  border-style: solid;
+  margin-right: 4px;
+  transform: translateZ(0);
+  animation-iteration-count: infinite;
+  animation-timing-function: linear;
+  animation-duration: 0.6s;
+  animation-name: icon_loader;
+}
+
+.roy-loader .icon_loader span:nth-child(2) {
+  animation-delay: 0.2s;
+}
+
+.roy-loader .icon_loader span:nth-child(3) {
+  animation-delay: 0.4s;
+}
+@keyframes icon_loader {
+  0% {
+    transform: translateY(0);
+  }
+  25% {
+    transform: translateY(3px);
+  }
+  75% {
+    transform: translateY(-3px);
+  }
+  100% {
+    transform: translateY(0);
+  }
+}
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.fade-in {
+  animation-name: fade-in;
+}
+@keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+.fade-out {
+  animation-name: fade-out;
+}
+@keyframes fade-in-up {
+  0% {
+    transform: translateY(500px);
+    opacity: 0;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+.fade-in-up {
+  animation-name: fade-in-up;
+}
+@keyframes fade-out-up {
+  0% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(-500px);
+    opacity: 0;
+  }
+}
+.fade-out-up {
+  animation-name: fade-out-up;
+}
+@keyframes fade-in-up-sm {
+  0% {
+    transform: translateY(100px);
+    opacity: 0;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+.fade-in-up-sm {
+  animation-name: fade-in-up-sm;
+}
+@keyframes fade-out-up-sm {
+  0% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(-100px);
+    opacity: 0;
+  }
+}
+.fade-out-up-sm {
+  animation-name: fade-out-up-sm;
+}
+@keyframes fade-in-down {
+  0% {
+    transform: translateY(-500px);
+    opacity: 0;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+.fade-in-down {
+  animation-name: fade-in-down;
+}
+@keyframes fade-out-down {
+  0% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(500px);
+    opacity: 0;
+  }
+}
+.fade-out-down {
+  animation-name: fade-out-down;
+}
+@keyframes fade-in-down-sm {
+  0% {
+    transform: translateY(-100px);
+    opacity: 0;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+.fade-in-down-sm {
+  animation-name: fade-in-down-sm;
+}
+@keyframes fade-out-down-sm {
+  0% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(100px);
+    opacity: 0;
+  }
+}
+.fade-out-down-sm {
+  animation-name: fade-out-down-sm;
+}/*# sourceMappingURL=animsition.css.map */

themes/ayon/_dev/css/components/animsition.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["animsition.scss","animsition.css"],"names":[],"mappings":"AAAA;;EAEE,kBAAA;EACA,UAAA;EAEQ,yBAAA;ACCV;;ADCA;EACE,eAAA;EACA,UAAA;EACA,WAAA;EACA,YAAA;ACEF;;ADAA,mBAAA;AACA;EACE,WAAA;EACA,aAAA;EACA,eAAA;EACA,MAAA;EACA,OAAA;EACA,aAAA;ACGF;;ADDA;EACE,kBAAA;EACA,QAAA;EACA,SAAA;EACA,gCAAA;ACIF;;ADFA;EACE,qBAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,iBAAA;EACA,mBAAA;EACA,iBAAA;EAEQ,wBAAA;EAEA,mCAAA;EAEA,iCAAA;EAEA,wBAAA;EAEA,2BAAA;ACKV;;ADFA;EACI,qBAAA;ACKJ;;ADHA;EACI,qBAAA;ACMJ;ADeA;EACE;IAEU,wBAAA;ECMV;EDJA;IAEU,0BAAA;ECMV;EDJA;IAEU,2BAAA;ECMV;EDJA;IAEU,wBAAA;ECMV;AACF;ADQA;EACE;IACE,UAAA;ECEF;EDAA;IACE,UAAA;ECEF;AACF;ADEA;EAEU,uBAAA;ACAV;ADcA;EACE;IACE,UAAA;ECHF;EDKA;IACE,UAAA;ECHF;AACF;ADOA;EAEU,wBAAA;ACLV;ADmBA;EACE;IAEU,4BAAA;IACR,UAAA;ECJF;EDMA;IAEU,wBAAA;IACR,UAAA;ECJF;AACF;ADQA;EAEU,0BAAA;ACNV;ADwBA;EACE;IAEU,wBAAA;IACR,UAAA;ECTF;EDWA;IAEU,6BAAA;IACR,UAAA;ECTF;AACF;ADaA;EAEU,2BAAA;ACXV;ADyBA;EACE;IAEU,4BAAA;IACR,UAAA;ECVF;EDYA;IAEU,wBAAA;IACR,UAAA;ECVF;AACF;ADcA;EAEU,6BAAA;ACZV;AD8BA;EACE;IAEU,wBAAA;IACR,UAAA;ECfF;EDiBA;IAEU,6BAAA;IACR,UAAA;ECfF;AACF;ADiBA;EAEU,8BAAA;ACfV;AD8BA;EACE;IAEU,6BAAA;IACR,UAAA;ECfF;EDiBA;IAEU,wBAAA;IACR,UAAA;ECfF;AACF;ADmBA;EAEU,4BAAA;ACjBV;ADmCA;EACE;IAEU,wBAAA;IACR,UAAA;ECpBF;EDsBA;IAEU,4BAAA;IACR,UAAA;ECpBF;AACF;ADwBA;EAEU,6BAAA;ACtBV;ADoCA;EACE;IAEU,6BAAA;IACR,UAAA;ECrBF;EDuBA;IAEU,wBAAA;IACR,UAAA;ECrBF;AACF;ADyBA;EAEU,+BAAA;ACvBV;ADwCA;EACE;IAEU,wBAAA;IACR,UAAA;ECzBF;ED2BA;IAEU,4BAAA;IACR,UAAA;ECzBF;AACF;AD4BA;EAEU,gCAAA;AC1BV","file":"animsition.css"}

themes/ayon/_dev/css/components/animsition.scss

@@ -0,0 +1,396 @@
+.animsition,
+.animsition-overlay {
+  position: relative;
+  opacity: 0;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+}
+.animsition-overlay-slide {
+  position: fixed;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+}
+/* loading option */
+.roy-loader {
+  width: 100%;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1000;
+}
+.roy-loader .icon_loader {
+  position: absolute;
+  top:50%;
+  left:50%;
+  transform: translate(-50%,-50%);
+}
+.roy-loader .icon_loader span {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  border-width: 2px;
+  border-style: solid;
+  margin-right: 4px;
+  -webkit-transform: translateZ(0);
+          transform: translateZ(0);
+  -webkit-animation-iteration-count:infinite;
+          animation-iteration-count:infinite;
+  -webkit-animation-timing-function: linear;
+          animation-timing-function: linear;
+  -webkit-animation-duration: 0.6s;
+          animation-duration: 0.6s;
+  -webkit-animation-name: icon_loader;
+          animation-name: icon_loader;
+
+}
+.roy-loader .icon_loader span:nth-child(2) {
+    animation-delay: .2s;
+}
+.roy-loader .icon_loader span:nth-child(3) {
+    animation-delay: .4s;
+}
+
+@-webkit-keyframes icon_loader {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+  25% {
+    -webkit-transform: translateY(3px);
+            transform: translateY(3px);
+  }
+  75% {
+    -webkit-transform: translateY(-3px);
+            transform: translateY(-3px);
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+}
+@keyframes icon_loader {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+  25% {
+    -webkit-transform: translateY(3px);
+            transform: translateY(3px);
+  }
+  75% {
+    -webkit-transform: translateY(-3px);
+            transform: translateY(-3px);
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+}
+
+
+
+@-webkit-keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+
+.fade-in {
+  -webkit-animation-name: fade-in;
+          animation-name: fade-in;
+}
+
+
+@-webkit-keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+
+@keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+
+.fade-out {
+  -webkit-animation-name: fade-out;
+          animation-name: fade-out;
+}
+@-webkit-keyframes fade-in-up {
+  0% {
+    -webkit-transform: translateY(500px);
+            transform: translateY(500px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes fade-in-up {
+  0% {
+    -webkit-transform: translateY(500px);
+            transform: translateY(500px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+
+.fade-in-up {
+  -webkit-animation-name: fade-in-up;
+          animation-name: fade-in-up;
+}
+
+
+@-webkit-keyframes fade-out-up {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(-500px);
+            transform: translateY(-500px);
+    opacity: 0;
+  }
+}
+
+
+@keyframes fade-out-up {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(-500px);
+            transform: translateY(-500px);
+    opacity: 0;
+  }
+}
+
+
+.fade-out-up {
+  -webkit-animation-name: fade-out-up;
+          animation-name: fade-out-up;
+}
+@-webkit-keyframes fade-in-up-sm {
+  0% {
+    -webkit-transform: translateY(100px);
+            transform: translateY(100px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes fade-in-up-sm {
+  0% {
+    -webkit-transform: translateY(100px);
+            transform: translateY(100px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+
+.fade-in-up-sm {
+  -webkit-animation-name: fade-in-up-sm;
+          animation-name: fade-in-up-sm;
+}
+
+
+@-webkit-keyframes fade-out-up-sm {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(-100px);
+            transform: translateY(-100px);
+    opacity: 0;
+  }
+}
+
+
+@keyframes fade-out-up-sm {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(-100px);
+            transform: translateY(-100px);
+    opacity: 0;
+  }
+}
+.fade-out-up-sm {
+  -webkit-animation-name: fade-out-up-sm;
+          animation-name: fade-out-up-sm;
+}
+
+@-webkit-keyframes fade-in-down {
+  0% {
+    -webkit-transform: translateY(-500px);
+            transform: translateY(-500px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes fade-in-down {
+  0% {
+    -webkit-transform: translateY(-500px);
+            transform: translateY(-500px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+
+.fade-in-down {
+  -webkit-animation-name: fade-in-down;
+          animation-name: fade-in-down;
+}
+
+
+@-webkit-keyframes fade-out-down {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(500px);
+            transform: translateY(500px);
+    opacity: 0;
+  }
+}
+
+
+@keyframes fade-out-down {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(500px);
+            transform: translateY(500px);
+    opacity: 0;
+  }
+}
+
+
+.fade-out-down {
+  -webkit-animation-name: fade-out-down;
+          animation-name: fade-out-down;
+}
+@-webkit-keyframes fade-in-down-sm {
+  0% {
+    -webkit-transform: translateY(-100px);
+            transform: translateY(-100px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes fade-in-down-sm {
+  0% {
+    -webkit-transform: translateY(-100px);
+            transform: translateY(-100px);
+    opacity: 0;
+  }
+  100% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+
+.fade-in-down-sm {
+  -webkit-animation-name: fade-in-down-sm;
+          animation-name: fade-in-down-sm;
+}
+
+
+@-webkit-keyframes fade-out-down-sm {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(100px);
+            transform: translateY(100px);
+    opacity: 0;
+  }
+}
+
+@keyframes fade-out-down-sm {
+  0% {
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+    opacity: 1;
+  }
+  100% {
+    -webkit-transform: translateY(100px);
+            transform: translateY(100px);
+    opacity: 0;
+  }
+}
+
+.fade-out-down-sm {
+  -webkit-animation-name: fade-out-down-sm;
+          animation-name: fade-out-down-sm;
+}

themes/ayon/_dev/css/components/block-reassurance.scss

@@ -0,0 +1,52 @@
+#block-reassurance{
+  margin-top: 2rem;
+  margin-bottom:4rem;
+  ul {
+    margin-bottom:0;
+  }
+  img{
+    width: 2rem;
+    margin-right: 1rem;
+    float:left;
+    opacity: 0.2;
+    -webkit-transition: all .4s cubic-bezier(.36,.76,0,.88);
+    transition: all .4s cubic-bezier(.36,.76,0,.88);
+  }
+  li{
+  }
+  li .block-reassurance-item{
+    padding: 1rem 2rem;
+    display: flex;
+    align-items: center;
+    span {
+      font-weight: 500;
+      margin:0;
+    }
+  }
+  li .block-reassurance-item:hover img {
+    opacity: 1;
+  }
+  #checkout &{
+    li .block-reassurance-item span {
+      margin-bottom: 0;
+    }
+  }
+  #product &{
+    // border:$border-width solid $body-border;
+    // border-radius: 4px;
+    border:none;
+    span{
+      font-weight: 500;
+      font-size: 0.85rem;
+      line-height: 1rem;
+      display: block;
+      margin-bottom: 0;
+    }
+  }
+}
+
+@include media-breakpoint-down(md) {
+  #block-reassurance {
+    margin-bottom:0;
+  }
+}

themes/ayon/_dev/css/components/cart.scss

@@ -0,0 +1,521 @@
+.cart-grid {
+  margin-bottom: 1rem;
+}
+.cart-items {
+  margin-bottom: 0;
+}
+.cart-item {
+  padding: 2rem 0;
+  border-bottom:2px solid;
+}
+.cart-item:last-of-type {
+  border:none;
+}
+.cart-summary-line {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  flex-direction: column;
+  margin-bottom:4px;
+  .label {
+    padding-left: 0;
+    white-space: inherit;
+    font-size:14px;
+    text-align: left;
+    margin-right: 14px;
+  }
+  .value {
+    font-size: 20px;
+    font-weight: 600;
+  }
+  .remove {
+    height: 18px;
+    margin-left:10px;
+  }
+  &.cart-summary-subtotals {
+    .label,
+    .value {
+      font-weight: normal;
+    }
+  }
+  &.cart-total {
+    .label {
+      font-size:18px;
+      line-height:18px;
+    }
+    .value {
+      font-size:28px;
+      line-height: 28px;
+      margin-top:10px;
+    }
+  }
+}
+
+/** CART BODY **/
+.cart-grid-body {
+  .cart-container {
+    padding:0 3rem;
+  }
+  .card {
+    border:none;
+    h1 {
+      margin-bottom: 0!important;
+    }
+  }
+  .back_to_shop {
+    margin-top:20px;
+    display: inline-block;
+  }
+  a.label {
+    &:hover {
+    }
+  }
+  .card-block {
+    padding: 1rem 0;
+  }
+  .cart-overview {
+    padding: 1.5rem 0;
+  }
+
+  .product-line-grid {
+    display:flex;
+    width:100%;
+    align-items: center;
+    > * {
+      .row {
+        display:flex;
+        align-items: center;
+      }
+    }
+    .product-line-grid-thumb {
+      margin-right: 50px;
+      img {
+        max-width: 110px;
+      }
+    }
+  }
+}
+@media (min-width: 768px) {
+.product-line-grid-left.col-md-2 {
+  width: 15%;
+}
+.product-line-grid-price.col-md-2 {
+  width: 15%;
+}
+}
+
+/** CART RIGHT **/
+.product-line-grid-price {
+  text-align: center;
+}
+.cart-grid-right {
+  position: static;
+  .cart-summary {
+    padding:3.5rem 4rem;
+    background: rgba(0, 0, 0, 0.05)!important;
+    .card-block {
+      padding-left: 0;
+      padding-right: 0;
+      h4 {
+        margin-bottom: 30px;
+      }
+      a.bright {
+        // width:100%;
+        padding:26px 40px;
+        font-size:16px;
+        font-weight: 500!important;
+      }
+    }
+    a:not(.bright) {
+      position: relative;
+      &:before {
+        display:none
+      }
+      &:after {
+        content:'';
+        position: absolute;
+        height:2px;
+        width:100%;
+        left:0;
+        bottom:-4px;
+        opacity: 0;
+        @include trans-fast;
+      }
+      &.promo-code-button {
+        &:after {
+          width:calc(100% - 30px);
+          left:30px;
+        }
+      }
+      &.collapsed {
+        &:after {
+          opacity: 1;
+        }
+      }
+    }
+  }
+  .promo-discounts {
+    margin-bottom: 0;
+    .cart-summary-line {
+      .label {
+        .code {
+          text-decoration: underline;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+  padding-left:6px;
+  .cart-detailed-totals {
+    .card-block {
+      padding: 2.5rem 0;
+      display: flex;
+      flex-wrap: wrap;
+      > * {
+        width:33%;
+        &.cart-total {
+          flex:1 1 auto;
+        }
+      }
+      &.promo-discounts {
+        padding-top:0.5rem;
+        padding-bottom: 0;
+      }
+      &:first-child {
+        padding-top: 0;
+      }
+    }
+    > .block-promo {
+      padding:40px 0;
+      border-top:2px solid rgba(0, 0, 0, 0.1);
+      border-bottom:2px solid rgba(0, 0, 0, 0.1);
+      .promo-name {
+        padding:0
+      }
+      .cart-voucher {
+        p {
+          margin:0;
+        }
+      }
+      form {
+        display: flex;
+        align-items: center;
+        width:100%;
+        flex-wrap: wrap;
+        padding-top:12px;
+      }
+    }
+  }
+  .checkout {
+    margin-top:22px;
+  }
+}
+.block-promo {
+  .promo-code {
+    .alert-danger {
+      position: relative;
+      margin-top: 1.25rem;
+      display: none;
+      &::after {
+        bottom: 100%;
+        left: 10%;
+        border: solid transparent;
+        content: " ";
+        height: 0;
+        width: 0;
+        position: absolute;
+        pointer-events: none;
+        border-width: 10px;
+        margin-left: -10px;
+      }
+    }
+  }
+  .promo-input {
+    flex:1 1 auto;
+  }
+  .btn {
+    margin-left: -2px;
+  }
+  .cart-summary-line .label,
+  .promo-name {
+    font-weight: 600;
+    a {
+      font-weight: normal;
+      display: inline-block;
+    }
+  }
+  .promo-code-button {
+    display: inline-flex;
+    align-items: center;
+    i {
+      height: 20px;
+      margin-right:6px;
+    }
+    &:before {
+      display:none;
+    }
+  }
+  &.promo-highlighted {
+    padding: 1.25rem 0 0 0;
+    padding-bottom: 0;
+    margin-bottom: 0;
+  }
+}
+
+/** CONTENT BODY **/
+.product-line-grid-body {
+  display: flex;
+  width:100%;
+  flex-direction: column;
+  justify-content: space-between;
+  .product-line-name {
+    position: relative;
+    margin-top:10px;
+    .product-line-info {
+      .product-name {
+        font-size:18px;
+        font-weight: 500;
+        display: inline-block;
+        padding-right:40px;
+      }
+      > .unit-price-cart {
+        padding-left: 0.3125rem;
+        font-size: 0.875rem;
+      }
+      &.atts {
+        * {
+          font-size:13px;
+        }
+      }
+    }
+    > .product-line-info.atts {
+      display: inline-block;
+      margin-right:4px;
+      margin-bottom: 0;
+      .value:after {
+        content:',';
+      }
+      &:last-of-type > .value:after {
+        content:'';
+      }
+    }
+    .cart-line-product-actions {
+      .remove-from-cart {
+        position: absolute;
+        right:-5px;
+        top:0;
+        opacity:0.7;
+        @include trans-fast;
+        &:hover {
+          opacity:1;
+        }
+      }
+    }
+  }
+  .product-line-prices {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .product-price {
+      font-size:16px;
+      line-height:16px;
+      font-weight: 500;
+      margin-bottom: 0;
+      .current-price {
+        display: flex;
+      }
+      .regular-price {
+        font-size: 13px;
+        line-height: 13px;
+        margin-left:12px;
+        opacity:0.4;
+      }
+      .discount {
+        display: none;
+      }
+    }
+    .product-line-actions {
+      display: flex;
+      align-items: center;
+      .price {
+        margin-left:40px;
+      }
+      .product-price {
+        margin:0 0 0 18px;
+      }
+      .js-cart-line-product-quantity {
+        border:none;
+        background:none;
+        padding:0 14px;
+        min-width:0;
+        width:40px;
+        text-align: center;
+        font-size:16px;
+        font-weight: 600;
+        box-shadow:none!important;
+      }
+    }
+  }
+}
+/** CONTENT LEFT **/
+.product-line-grid-right {
+  .cart-line-product-actions,
+  .product-price {
+    font-size:1.125rem;
+    line-height: 36px;
+    .remove-from-cart {
+      display: inline-block;
+      margin-top: 0.3125rem;
+    }
+  }
+}
+
+/*** Responsive part ***/
+@include media-breakpoint-down(md) {
+  .cart-grid-right {
+    margin-top:60px;
+  }
+  .cart-grid-body .cart-container {
+    padding:0;
+  }
+}
+
+@include media-breakpoint-down(sm) {
+  .cart-grid-body .product-line-grid {
+    // flex-wrap: wrap;
+    flex-direction: row;
+    margin:0;
+    position: relative;
+    > * {
+      padding:0;
+      position: static;
+    }
+  }
+  .product-line-grid-left {
+    flex-basis: 34%;
+    img {
+      max-width: calc(100% - 10px);
+      margin-right: 10px;
+    }
+  }
+  .product-line-grid-body {
+    justify-content: center;
+    flex-direction: column;
+    margin-bottom: 1rem;
+    .product-line-prices {
+      flex-direction: column;
+      align-items: flex-start;
+      margin-top: 16px;
+      .product-line-actions {
+        flex-direction: column;
+        align-items: flex-start;
+        width: 100%;
+        .price {
+          margin:0;
+          .product-price {
+            margin:0;
+          }
+        }
+      }
+    }
+  }
+  .cart-grid {
+    margin-bottom: 0;
+  }
+  body#cart {
+    #main {
+     padding-bottom: 0;
+    }
+    #footer {
+      padding-top:0;
+    }
+  }
+  .cart-item:last-child {
+    padding-bottom:0;
+  }
+  .cart-grid-right .cart-detailed-totals .card-block {
+    flex-direction: column;
+    padding-bottom:0;
+  }
+  .cart-grid-right .cart-detailed-totals .card-block > * {
+    width:100%;
+    margin-bottom: 22px;
+  }
+  .block-promo .btn {
+    margin:12px 0 0 0;
+    width:100%;
+  }
+  #cart #main h1.h1 {
+    display: block;
+  }
+  .cart-grid-right .cart-summary {
+    margin:0 -40px;
+  }
+  .product-line-grid-price {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  .product-line-grid-right {
+    flex-basis: 66%;
+    width: 66%;
+    .text-xs-right {
+      position: absolute;
+      top: -3px;
+      right: -14px;
+      padding: 0;
+      width: auto;
+    }
+  }
+  .cart-item {
+    padding:2rem 0 2.5rem;
+  }
+  .cart-grid-body .product-line-grid > * .row {
+    flex-basis: 66%;
+  }
+  .cart-grid-body, .cart-grid-right {
+    padding:0 15px;
+  }
+  .cart-grid-body .back_to_shop {
+    display: none
+  }
+
+}
+
+@include media-breakpoint-down(xs) {
+  .cart-items {
+    padding: 1rem 0;
+  }
+  .cart-item {
+    border-bottom: 1px solid $gray-light;
+    &:last-child {
+      border-bottom: 0;
+    }
+  }
+  .cart-grid-body {
+    .cart-overview {
+      padding: 0;
+    }
+    .no-items {
+      padding: 1rem;
+      display: inline-block;
+    }
+    .card-block h1 {
+      text-align: center;
+    }
+  }
+  .product-line-grid-left {
+    padding-right: 0 !important;
+  }
+}
+
+@media (max-width: 360px) {
+  .product-line-grid-right {
+    .qty {
+      width: 100%;
+    }
+    .price {
+      width: 100%;
+    }
+  }
+}

themes/ayon/_dev/css/components/categories.scss

@@ -0,0 +1,733 @@
+#products {
+  .products-select {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+  }
+  .up {
+    margin-bottom: 1rem;
+    .btn-secondary {
+      text-transform: inherit;
+      .material-icons {
+        margin-right: 0;
+      }
+    }
+  }
+}
+.block-category {
+  margin-bottom: 1.5rem;
+  #category-description {
+    p {
+      margin-bottom: 0;
+    }
+  }
+  .category-cover {
+    display:block;
+    margin-bottom: 60px;
+  }
+}
+.card {
+  padding:2.5em;
+  box-shadow:none;
+  border:2px solid;
+  border-radius:3px;
+}
+
+/* Subcategories */
+#subcategories {
+  padding: 0;
+  overflow: hidden;
+}
+#subcategories ul {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+  margin-bottom: 30px;
+  margin-left:-30px;
+  margin-right:-30px;
+  li {
+    flex-grow: 1;
+    width:25%;
+    padding:0 30px;
+    margin-bottom:30px;
+    @include trans-fast;
+    .subcategory-image {
+      margin-bottom:20px;
+      overflow: hidden;
+    }
+    .subcategory-image a {
+        display: block;
+        padding: 0;
+    }
+    .subcategory-image a img {
+        max-width: 100%;
+        vertical-align: top;
+        -webkit-transition: all .88s cubic-bezier(.36,.76,0,.88);
+        transition: all .88s cubic-bezier(.36,.76,0,.88);
+    }
+    h5 {
+      text-align: center;
+    }
+    &:hover {
+      .subcategory-image a img {
+        transform:scale(1.1);
+      }
+    }
+  }
+}
+
+
+.products-selection {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 30px;
+  margin-bottom:30px;
+  .sort-by-row {
+    display: flex;
+    align-items: center;
+  }
+  .sort-by {
+    white-space: normal;
+    word-break: break-word;
+    text-align: right;
+    display: flex;
+    align-items: center;
+    height: 60px;
+    padding: 0 30px;
+  }
+  .total-products {
+    i {
+      display: none;
+    }
+    p {
+      vertical-align: middle;
+      display: inline-block;
+      margin:0;
+      span {
+        font-weight: 600;
+        font-size:16px;
+      }
+    }
+  }
+  h1 {
+    padding-top: 0.625rem;
+  }
+}
+.products-sort-order {
+  .select-title {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    cursor: pointer;
+    height: 60px;
+    padding: 0 30px;
+    i {
+      height:24px;
+      padding-left:60px;
+    }
+  }
+  .select-list {
+    display: block;
+    padding: 0;
+    margin:3px 40px;
+    opacity:0.5;
+    &:hover {
+      opacity:1;
+      text-decoration: none;
+    }
+  }
+  .dropdown-menu {
+    left: auto;
+    width: 100% ;
+    @include shadow-long;
+    margin: 0;
+    padding:16px 0;
+    transform:translateY(-2px);
+  }
+}
+.facet-dropdown {
+  padding-left: 0;
+  padding-right: 0;
+  margin-bottom: 12px;
+  box-sizing: border-box;
+  &.open {
+    border: 0;
+  }
+  .select-title {
+    display: inline-flex;
+    align-items: center;
+    margin-left: 0;
+    width: 100%;
+    height: 3.75rem;
+    min-height: 60px;
+    padding: 19px 28px;
+    border-width: 2px;
+    border-style: solid;
+    cursor: pointer;
+    font-size: 0.9rem;
+    > i {
+      margin-left: auto;
+    }
+  }
+  .select-list {
+    display: block;
+    padding: 8px 18px;
+    opacity:0.5;
+    &:hover {
+      text-decoration: none;
+      opacity:1;
+    }
+  }
+  .dropdown-menu {
+    padding: 12px;
+    left: auto;
+    width: 100%;
+    border: none;
+    @include shadow-long;
+  }
+}
+
+#search_filters {
+  .sidebar-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  h4 {
+    margin-bottom:18px;
+    font-size:18px;
+  }
+  .custom-radio {
+    margin-right:6px;
+  }
+  .custom-checkbox input[type="checkbox"] + span {
+    margin-top: -1px;
+  }
+  .color, .custom-checkbox input[type="checkbox"] + span.color {
+    width: 26px;
+    height: 26px;
+    // margin-right:9px;
+  }
+  .facet-label.active .custom-checkbox span.color, .facet-label:hover .custom-checkbox span.color {
+    border: none!important;
+  }
+  .facet-label:hover .color:before, .facet-label:hover .custom-checkbox input[type="checkbox"] + span.color:before,
+  .facet-label.active .color:before, .facet-label.active .custom-checkbox input[type="checkbox"] + span.color:before {
+    box-shadow: 0 0 0 2px $input-border-focus;
+    transform: scale(1);
+  }
+  .facet {
+    padding-top: 20px;
+    &:first-of-type {
+      padding-top: 8px;
+    }
+    .collapse {
+      display: block;
+    }
+    .facet-label {
+      margin-bottom: 0;
+      a {
+        margin-top: 0;
+        display: inline-block;
+        position: relative;
+        font-size:14px;
+        .magnitude {
+          font-size: 13px;
+          font-weight: 500;
+          position: absolute;
+          top: -4px;
+          right: -6px;
+          transform: translateX(80%);
+        }
+      }
+    }
+  }
+  .faceted-slider div {
+    z-index: 2!important;
+  }
+}
+body #search_filters .facet .facet-label {
+  text-align: left;
+  display: inline-flex;
+  margin:3px 0;
+  align-items: center;
+  .custom-checkbox {
+    top:-1px;
+    margin-right:7px;
+  }
+  .custom-radio {
+    top:-1px;
+    margin-right:6px;
+  }
+}
+#search_filters_brands,
+#search_filters_suppliers {
+  .facet {
+    padding-top: 0;
+    .facet-label {
+      margin-bottom: 0.3125rem;
+    }
+  }
+}
+.pagination {
+  width: 100%;
+  > div:first-child{
+  }
+  .page-list {
+    margin-top:40px;
+    padding-top:40px;
+    margin-bottom: 1.5rem;
+    li {
+      display: inline;
+    }
+  }
+  a {
+    font-size: 1.25rem;
+    text-decoration: none;
+    &:not(.previous):not(.next) {
+      margin:0 8px;
+      letter-spacing: 0;
+    }
+    &.previous,
+    &.next {
+      font-size:14px;
+      display: flex;
+      i {
+        height: 24px;
+      }
+    }
+    &.previous:hover {
+    }
+    &.next:hover {
+    }
+  }
+  .previous {
+    float: left;
+  }
+  .next {
+    float: right;
+  }
+  .disabled {
+    opacity:0.4;
+  }
+  .current a {
+    text-decoration: none;
+  }
+  .showing {
+    font-size: 14px;
+    padding:0 6px;
+    text-align: right;
+  }
+}
+#_desktop_search_filters_clear_all {
+  display: none;
+}
+.active_filters {
+  padding-bottom:16px;
+  margin-bottom: 30px;
+  display: flex;
+  align-items: center;
+  #_desktop_search_filters_clear_all {
+    display: inline-block;
+    margin-left:auto;
+    .js-search-filters-clear-all {
+      width: auto;
+      background: none;
+      border:none;
+      box-shadow: none;
+      padding:0;
+      margin:0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      i {
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        @include trans-def;
+      }
+      &:hover {
+        i {
+          transform: rotate(90deg);
+          -webkit-transform: rotate(90deg);
+        }
+      }
+    }
+  }
+  .active-filter-title {
+    display: flex;
+    align-items: center;
+    margin:0 14px 0 0;
+    svg {
+      margin-right:6px;
+    }
+  }
+  ul {
+    display: inline;
+    margin:0;
+  }
+  .filter-block {
+    border: 2px solid;
+    margin-right: $small-space;
+    padding: 0.625rem 1rem;
+    display: inline-block;
+    font-size: $font-size-xs;
+    font-weight:500;
+    .close {
+      font-size: $font-size-lg;
+      font-weight: 600;
+      opacity: 1;
+      margin-top: .2rem;
+      margin-left: .3125rem;
+    }
+  }
+}
+
+.side-column > .sidebar-block.block-categories .sidebar-content {
+  padding: 0;
+}
+.side-column > .block-categories {
+  .category-sub-menu {
+    .category-sub-link {
+      font-size: 0.9rem;
+      padding:0;
+      display:inline-block;
+    }
+    li{
+      position: relative;
+      padding:8px 0 0 0!important;
+    }
+    li[data-depth="0"] > a {
+      font-size: $font-size-h3;
+      font-weight: 500;
+      width: auto;
+      display: inline-block;
+      padding:0;
+      margin-bottom:8px;
+    }
+    li:last-child[data-depth="0"] > a {
+      border-bottom: none;
+    }
+    li:not([data-depth="0"]):not([data-depth="1"]) {
+      padding-left: 0.3125rem;
+      &::before {
+        content: "-";
+        margin-right: 0.3125rem;
+      }
+    }
+  }
+  #side_cats {
+    .collapse-icons {
+      position: absolute;
+      right: 0;
+      top: 0;
+      padding: 0;
+      height: 100%;
+      width:auto;
+      cursor: pointer;
+      text-align: right;
+      line-height: 3rem;
+      z-index: 2;
+      &[aria-expanded="true"] {
+        .add {
+          display: none;
+        }
+        .remove {
+          display: flex;
+        }
+      }
+      .add,
+      .remove {
+        margin-top:8px;
+        display: flex;
+        height: 24px;
+        width:24px;
+        align-items: center;
+        justify-content: center;
+        &:hover {
+        }
+      }
+      .add {
+        transform: rotate(90deg);
+        -webkit-transform: rotate(90deg);
+      }
+      .remove {
+        display: none;
+      }
+    }
+  }
+  .arrows {
+    .arrow-right,
+    .arrow-down {
+      font-size: $font-size-sm;
+      cursor: pointer;
+      margin-left: 2px;
+    }
+    .arrow-down {
+      display: none;
+    }
+    &[aria-expanded="true"] {
+      .arrow-right {
+        display: none;
+      }
+      .arrow-down {
+        display: inline-block;
+      }
+    }
+  }
+}
+
+.side-column > .block-categories .category-top-menu {
+  margin-bottom: 0;
+}
+.side-column > .block-categories .category-sub-menu .category-sub-menu > li {
+  // border-bottom:none;
+}
+.side-column > .block-categories .category-sub-menu .category-sub-menu > li:last-child {
+  border-bottom:none;
+}
+.side-column > .block-categories li[data-depth="0"] .collapse > ul {
+  position: relative;
+  padding-left:12px;
+  margin-bottom:12px;
+  @include trans-fast;
+}
+.side-column > .block-categories li[data-depth="0"] .collapse > ul:before {
+}
+.products-selection {
+  .filter-button {
+    .btn-secondary {
+    }
+  }
+}
+
+#category {
+  #main h1:not(.active-filter-title) {
+    margin-bottom:2rem;
+  }
+}
+
+/*** Responsive part ***/
+@include media-breakpoint-down(md) {
+  .products-selection {
+    flex-direction: column;
+    align-items: flex-start;
+    .total-products {
+      display: none;
+    }
+    .sort-by-row {
+      flex-wrap: wrap;
+      width: 100%;
+      > * {
+        width: auto;
+        flex:1 1 auto;
+      }
+    }
+  }
+  #category {
+    #left-column, #right-column {
+      width: 100%;
+      #search_filter_controls {
+        text-align: center;
+        display: flex;
+        flex-wrap: wrap;
+        flex-direction: column;
+        > * {
+          display:flex;
+          align-items: center;
+          justify-content: center;
+          flex-grow: 1;
+          font-weight: 600;
+        }
+        > #_mobile_search_filters_clear_all {
+          display: none;
+          button {
+            outline:none!important;
+            display: flex;
+            align-items: center;
+            text-transform: none;
+            &:active, &:focus {
+              i {
+                transform: rotate(45deg);
+              }
+            }
+            span {
+              display: inline-block!important;
+            }
+            i {
+              display: block;
+              height: 24px;
+              -webkit-transition: all .4s cubic-bezier(.36,.76,0,.88);
+              transition: all .4s cubic-bezier(.36,.76,0,.88);
+              svg {
+                pointer-events: none;
+                width:24px;
+                * {
+                }
+              }
+            }
+          }
+        }
+        > button {
+          text-transform: none;
+          font-weight: 600;
+          i {
+            height:24px;
+            width:24px;
+            margin-right: 8px;
+          }
+          svg {
+            pointer-events: none;
+            width:24px;
+            height:24px;
+            * {
+              stroke: $btn-color!important;
+            }
+          }
+        }
+        button {
+          margin: 0 0 10px 0;
+          height: 60px;
+          padding: 0;
+          width: 100%;
+          border-radius: 0;
+        }
+        margin-bottom: 22px;
+      }
+    }
+    #search_filter_toggler {
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      font-weight: 600;
+      padding: 0 30px;
+      height: 60px;
+      i {
+        height:22px;
+        padding-left:60px;
+        svg {
+          height:22px;
+          width:22px;
+        }
+      }
+    }
+    
+    #search_filters {
+      margin-bottom: 0;
+      box-shadow: none;
+      padding: 0 0 90px;
+      .facet {
+        padding-top: 0;
+        border-bottom: 2px solid $gray-lighter;
+        &:last-child {
+          border-bottom:none;
+        }
+        .title {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding:23px 0;
+          background: none;
+          cursor: pointer;
+          font-size:16px;
+          .collapse-icons .remove {
+            display: none;
+          }
+        }
+        .title[aria-expanded="true"] {
+          .collapse-icons {
+            .add {
+              display: none;
+            }
+            .remove {
+              display: block;
+            }
+          }
+        }
+        .facet-title {
+          margin:0;
+        }
+        .h6 {
+          margin-bottom: 0;
+          padding: 0;
+          display: inline-block;
+        }
+        .navbar-toggler {
+          display: inline-block;
+          padding: 0;
+          i {
+            color: $title;
+          }
+        }
+        .collapse {
+          display: none;
+          &.in {
+            display: block;
+          }
+        }
+        .facet-label {
+          a {
+            margin-top: 0;
+          }
+        }
+        ul {
+          margin-bottom: 0;
+          li {
+            border-top: 1px solid $gray-lighter;
+            padding: 10px 0;
+          }
+        }
+      }
+    }
+  }
+  .products-sort-order {
+    .select-title {
+      margin-left: 0;
+      line-height: 1.1;
+    }
+  }
+  .products-selection {
+    h1 {
+      padding-top: 0;
+      text-align: center;
+      margin-bottom: 1rem;
+    }
+    .showing {
+      padding: 2rem 0 0;
+    }
+  }
+  #prices-drop #content-wrapper,
+  #new-products #content-wrapper,
+  #best-sales #content-wrapper {
+    width: 100%;
+  }
+  #subcategories ul li {
+    width:50%;
+  }
+}
+
+@include media-breakpoint-down(xs) {
+  #subcategories ul li {
+    width:100%;
+  }
+  .products-selection {
+    .filter-button {
+      padding-left: 0;
+    }
+    .sort-by-row {
+      flex-direction: column;
+      > * {
+        width: 100%;
+        padding:0;
+        &.filter-button {
+          margin-top:14px;
+        }
+      }
+      .select-title {
+        width:100%
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/checkout.scss

@@ -0,0 +1,679 @@
+body#checkout {
+    .cart-container {
+        .btn.btn-primary {
+          width:100%;
+        }
+    }
+  #block-reassurance li {
+    border:none;
+  }
+  .login-tabs {
+    a {
+      font-weight: 600;
+      &:after {
+        content: "";
+        position: absolute;
+        left: 0;
+        bottom: -4px;
+        width: 0;
+        height: 2px;
+        background-color: #323232;
+        transition: all .4s cubic-bezier(.36,.76,0,.88);
+      }
+      &.active {        
+        &:after {
+          width: 100%;
+        }
+      }
+    }
+  }
+  .create_acc {
+    margin-top:40px;
+    .title {
+      font-weight: 600;
+    }
+    .text-muted {
+      font-size: smaller;
+    }
+  }
+
+  section#content {
+    margin-bottom: 1.563rem;
+  }
+  .container {
+    min-height: 100%;
+  }
+  section.checkout-step {
+    padding: 0 0 2.5rem;
+    @include trans-fast;
+    &:last-child {
+      border: 0;
+    }
+    .step-title {
+      display: flex;
+      align-items: center;
+      font-size: 26px;
+      cursor: pointer;
+      margin-bottom: 0;
+      padding: 0.625rem 0;
+      border-bottom: 2px solid #f2f2f2;
+    }
+    .content {
+      padding: 0;
+      margin-top:32px;
+    }
+    .step-edit {
+      margin-left:auto;
+      text-transform: lowercase;
+      font-weight: normal;
+      @include trans-fast;
+    }
+    &:hover {
+      .step-edit {
+        opacity:1;
+        transform: translateX(-30%) rotate(-12deg);
+      }
+    }
+    .not-allowed {
+      cursor: not-allowed;
+      opacity: 0.5;
+    }
+    .content,
+    .done,
+    .step-edit {
+      display: none;
+    }
+    &.-current {
+      .content {
+        display: block;
+      }
+    }
+    &.-current.-reachable.-complete {
+      .done,
+      .step-edit {
+        display: none;
+      }
+      .step-number {
+        display: inline-block;
+      }
+      .content {
+        display: block;
+      }
+    }
+    &.-reachable.-complete {
+      opacity: 0.5;
+      &:hover {
+        opacity: 1;
+      }
+      h3 {
+        .done {
+          display: flex;
+          height: 48px;
+          align-items: center;
+          margin-right:8px;
+        }
+        .step-number {
+          display: none;
+        }
+        .step-edit {
+          cursor: pointer;
+          display: block;
+          float: right;
+          margin-right: 0.125rem;
+        }
+      }
+      .content {
+        display: none;
+      }
+    }
+    small {
+    }
+    .default-input {
+      min-width: 40%;
+      &[name=address1],
+      &[name=address2] {
+        min-width: 60%;
+      }
+    }
+    .radio-field {
+      margin-top: 1.875rem;
+      label {
+        display: inline;
+      }
+    }
+    .checkbox-field div {
+      margin-top: 3.75rem;
+    }
+    .checkbox-field + .checkbox-field div {
+      margin-top: 0;
+    }
+    .select-field div {
+      padding: 0.625rem 3.125rem;
+    }
+    .form-footer {
+      text-align: center;
+    }
+    #conditions-to-approve {
+      padding-top: 1rem;
+    }
+    .payment-options {
+      label {
+        display: table-cell;
+        cursor:pointer;
+      }
+      .custom-radio {
+        margin-right: $medium-space;
+      }
+      .payment-option {
+        margin-bottom: 0.5rem;
+      }
+    }
+    .step-number {
+      display: inline-block;
+      padding: 0.625rem;
+      &:after {
+        content:' .';
+      }
+    }
+    .address-selector {
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-start;
+      flex-wrap: wrap;
+    }
+    .address-item {
+      flex: 0 0 49%;
+      margin-bottom: $small-space;
+      border: 2px solid $input-border;
+      &.selected {
+        border: 2px solid $input-border-focus;
+        box-shadow: 0 18px 80px 0px rgba(0, 0, 0, 0.11);
+      }
+    }
+    .address-alias {
+      display: inline-block;
+      font-weight: 500;
+      margin-left:10px;
+    }
+    .address {
+      margin-left: 36px;
+      font-weight: normal;
+      line-height: 22px;
+      font-size: 14px;
+      margin-top: 18px;
+    }
+    .radio-block {
+      padding: 2rem;
+      text-align: left;
+      cursor: pointer;
+    }
+    .custom-radio {
+      margin-right: 0;
+      input[type="radio"] {
+        height: 1.25rem;
+        width: 1.25rem;
+      }
+    }
+    .delete-address,
+    .edit-address {
+      color: $gray;
+      display: inline-block;
+      margin: 0 0.3125rem;
+      .delete,
+      .edit {
+        font-size: $base-font-size;
+      }
+    }
+    hr {
+      margin: 0;
+    }
+    .address-footer {
+      text-align: center;
+      padding: 0.625rem;
+    }
+    #delivery-addresses,
+    #invoice-addresses {
+      margin-top: 1.25rem;
+    }
+    .add-address {
+      margin-top: 1.25rem;
+      a {
+        i {
+          font-size: $font-size-lg;
+        }
+      }
+    }
+    .delivery-options { margin-bottom:32px; }
+    .delivery_message { font-size:14px; text-align: left; }
+    .delivery-option {
+      padding: 0;
+      border: 2px solid $input-border;
+      margin: 0 0 16px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      @include trans-fast;
+      &.active {
+      }
+      .row {
+        display: flex;
+        align-items: center;
+        width: 100%;
+        .delname {
+          flex:1 1 auto;
+        }
+        .delprice {
+          margin-left:auto;
+          text-align: right;
+        }
+      }
+      img {
+        max-width:40px;
+        margin-right:16px;
+      }
+      label {
+        padding:2rem 1.5rem;
+        text-align: inherit;
+        margin:0;
+        cursor:pointer;
+        display: flex;
+        min-height: 110px;
+      }
+    }
+    .carrier-delay {
+      font-size:0.875rem;
+    }
+    .carrier-delay,
+    .carrier-name {
+      display: inline-block;
+      word-break: break-word;
+      text-align: left;
+      margin:0;
+    }
+    #customer-form,
+    #delivery-address,
+    #invoice-address,
+    #login-form {
+      margin-left: 0.3125rem;
+      margin-top: 1.563rem;
+      .form-control-label {
+        text-align: left;
+      }
+      .radio-inline {
+        padding: 0;
+        margin-right:14px;
+      }
+    }
+    .sign-in {
+      font-size: $font-size-sm;
+    }
+    .forgot-password {
+      // margin-left: 26%;
+      font-size: 14px;
+      font-weight: 600;
+      margin-top: -20px;
+      margin-bottom: 20px;
+      float: right;
+    }
+  }
+  .additional-information {
+    font-size: $font-size-sm;
+    margin-left: 2.875rem;
+    margin-top: 1.25rem;
+  }
+  .condition-label {
+    margin-left: 2.5rem;
+    margin-top: 0.625rem;
+    label {
+      text-align: inherit;
+    }
+  }
+  .cancel-address {
+    margin: 0.625rem;
+    display: block;
+    color: $body-text;
+    text-decoration: underline;
+  }
+  .modal-content {
+    padding: $medium-space;
+  }
+  #cart-summary-product-list {
+    font-size: $font-size-sm;
+    img {
+      // border: $body-border 1px solid;
+      width: 3.125rem;
+    }
+    .media-left {
+      img {
+        border-radius: 4px;
+      }
+    }
+    .media-body {
+      vertical-align: middle;
+      .product-price {
+        font-size: 16px !important;
+        margin-bottom: 0;
+        float: none!important;
+        display: block;
+        line-height: 1.2;
+        margin-bottom: 30px;
+      }
+      .product-quantity {
+        display: inline-block;
+      }
+    }
+  }
+  #order-summary-content {
+    padding-top: 0.9375rem;
+    h4.h4 {
+      margin-top: 0.625rem;
+      margin-bottom: 1.25rem;
+    }
+    h4.black {
+    }
+    h4.addresshead {
+      margin-top: 0.1875rem;
+    }
+    .noshadow {
+      box-shadow: none;
+    }
+    #order-items {
+      border-right: 0;
+      h3.h3 {
+        margin-top: 1.25rem;
+      }
+      table {
+        tr {
+          &:first-child {
+            td {
+              border-top: 0;
+            }
+          }
+        }
+      }
+    }
+    .order-confirmation-table {
+      padding: 1rem;
+      margin-bottom: 2rem;
+      background-color: $content-bg;
+      border: 3px solid $body-border;
+      border-radius: 0;
+    }
+    .summary-selected-carrier {
+      margin-bottom: 0.75rem;
+      background-color: $content-bg;
+      border: 1px solid $body-border;
+      border-radius: 0;
+      padding: 1rem;
+    }
+    .step-edit {
+      display: inline;
+    }
+    .step-edit:hover {
+      cursor: pointer;
+    }
+    a {
+      .step-edit {
+      }
+    }
+  }
+  #gift_message, #delivery{
+    max-width: 100%;
+    textarea {
+      max-width: 100%;
+      margin-bottom: 10px;
+    }
+  }
+}
+/**** ORDER CONFIRMATION *****/
+#order-details {
+  padding-left: 54px;
+  em {
+    font-style: normal;
+  }
+  > .card-title {
+    margin-bottom: $large-space;
+  }
+  ul {
+    margin-bottom: $medium-space;
+    li {
+      margin-bottom: $small-space;
+    }
+  }
+}
+#content-hook_payment_return {
+  margin-bottom:44px;
+}
+#order-items {
+  border-right: $body-border 2px solid;
+  padding-right: 54px;
+  table {
+    width: 100%;
+    tr {
+      height: 1rem;
+      td {
+        &:last-child {
+          text-align: right;
+        }
+      }
+    }
+  }
+  .order-line {
+    margin-top: 1rem;
+  }
+  .image {
+    img {
+        width: 100%;
+        max-width: 60px!important;
+        border-radius: 4px;
+        margin-bottom: 1rem;
+    }
+  }
+  .details {
+    margin-bottom: 1rem;
+    .customizations {
+      margin-top: 0.625rem;
+    }
+  }
+  .qty {
+    margin-bottom: 1rem;
+  }
+}
+#order-confirmation {
+  #registration-form {
+    width: 50%;
+    margin: 0 auto 1rem;
+  }
+}
+@include media-breakpoint-down(md) {
+  #order-items {
+    display: none;
+  }
+  body#checkout section.checkout-step .step-title {
+    font-size:20px;
+  }
+  .done {
+    margin: 0;
+    padding: 0;
+  }
+  body#checkout section.checkout-step .address-item {
+    flex-grow: 1;
+  }
+  body#checkout section.checkout-step .delivery-option-2 {
+    flex-direction: column;
+  }
+  .delivery-option {
+    display: flex;
+    margin: auto;
+    .custom-radio {
+      flex: 0 0 auto;
+    }
+  }
+  .condition-label {
+    label[for="conditions_to_approve[terms-and-conditions]"] {
+      text-align: left;
+    }
+  }
+  #order-confirmation {
+    #registration-form {
+      width: 100%;
+    }
+  }
+}
+
+@include media-breakpoint-down(sm) {
+
+  footer .btn {
+    width:100%;
+  }
+  .login-tabs {
+    .nav-item+.nav-item {
+      float: right;
+    }
+  }
+  
+#order-confirmation {
+  .card {
+    padding:0;
+    font-size: 14px;
+    p {
+      font-size: 14px;
+    }
+  }
+  .card-block {
+    padding:0 0 10px 0;
+  }
+  .card-title {
+    font-size: 1.125rem;
+    margin-bottom: 30px;
+    padding-bottom: 30px;
+    border-bottom: 2px solid #f2f2f2;
+    i {
+      margin-right: 5px;
+      margin-top: -3px;
+    }
+  }
+  .card.definition-list dl {
+    border:2px solid;
+    padding:15px;
+    strong {
+      font-weight: 600;
+      font-size: 15px;
+      margin:20px 0 30px;
+      display: inline-block;
+    }
+  }
+}
+
+body#checkout section.checkout-step .delivery-option label > .row {
+  flex-direction: column;
+  align-items: flex-start;
+  .delname > .row {
+    margin:0 0 10px 0;
+  }
+  .delprice {
+    text-align: left;
+  }
+}
+body#checkout section.checkout-step .delivery-option label {
+  flex:1 1 auto;
+  padding-right: 0;
+  padding-left:0.5rem;
+}
+
+
+  body#checkout {
+    #header .header-nav {
+      max-height: none;
+      padding: 0;
+    }
+    section.checkout-step {
+      .content {
+        padding: 0.9375rem;
+      }
+    }
+    .form-group {
+      margin-bottom: 0.5rem;
+    }
+  }
+  #order-items {
+    border-right: 0;
+    margin-bottom: 2.5rem;
+    padding:15px;
+    .card-title {
+      border-bottom: 1px solid $body-border;
+      margin-bottom: 1rem;
+      padding-bottom: 1rem;
+    }
+    hr {
+      border-top-color: $body-border;
+    }
+  }
+  .bold {
+    font-weight: bold;
+  }
+  #order-details {
+    padding-left: 0.9375rem;
+    .card-title {
+      border-bottom: 2px solid $body-border;
+      margin-bottom: 1rem;
+      padding-bottom: 1rem;
+      display: none;
+    }
+  }
+  body#checkout section.checkout-step .forgot-password {
+    margin-left: 0;
+    margin-bottom: 20px;
+    text-align: right;
+  }
+
+}
+
+@include media-breakpoint-down(xs) {
+  body#checkout {
+    section.checkout-step {
+      .content {
+        padding: 0.9375rem 0;
+      }
+    }
+  }
+  #payment-confirmation {
+    button {
+      font-size: 0.875rem;
+      &.btn {
+        white-space: normal;
+      }
+    }
+  }
+}
+
+#payment-confirmation {
+  margin-bottom:32px;
+}
+
+.cart-empty {
+  .cart-summary {
+  }
+}
+.js-payment-binary {
+  display: none;
+  .accept-cgv {
+    display: none;
+  }
+  &.disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+    &::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      pointer-events: none;
+    }
+    .accept-cgv {
+      display: block;
+    }
+  }
+}

themes/ayon/_dev/css/components/contact.scss

@@ -0,0 +1,103 @@
+.contact-rich {
+  word-wrap: break-word;
+  display: flex;
+  .block {
+    margin-bottom:90px;
+    margin-right:120px;
+    label {
+      margin-bottom:32px;
+    }
+    .data {
+      line-height: 28px;
+      i {
+        display: inline-block;
+        height: 26px;
+        margin-right: 4px;
+        svg {
+          vertical-align: middle;
+        }
+      }
+    }
+  }
+}
+.contact-form {
+  padding: 1rem;
+  width: 100%;
+  h3 {
+    text-transform: uppercase;
+  }
+}
+#contact {
+  .card {
+    padding:0;
+    border:none;
+  }
+  .contact-form {
+    padding:0;
+  }
+}
+
+
+.inputs_col {
+  .alert {
+    float:none;
+    margin-bottom: 40px;
+  }
+  .form-group.row {
+    display:flex;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    margin-bottom:0;
+    > div {
+      margin-bottom:40px;
+      > label {
+        opacity:0.4;
+        font-size:13px;
+        font-weight: 600;
+        margin-left:8px;
+        margin-right:8px;
+        float:right;
+      }
+    }
+  }
+  input[type="submit"] {
+    padding-left:70px;
+    padding-right:70px;
+  }
+}
+
+@include media-breakpoint-down(md) {
+  #contact {
+    .contact-rich {
+      justify-content: space-around;
+      .block {
+        margin-right:0;
+        margin-bottom:30px;
+      }
+    }
+  }
+
+  .inputs_col {
+    .form-group.row {
+      flex-wrap: nowrap;
+      flex-direction: column;
+      align-items: stretch;
+      > div {
+        margin-bottom:20px;
+      }
+    }
+    input[type="submit"] {
+      width:100%;
+    }
+  }
+}
+@include media-breakpoint-down(sm) {
+  #contact {
+    .contact-rich {
+      flex-direction: column;
+      .block {
+        margin-right:0;
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/county.scss

@@ -0,0 +1,229 @@
+.notexist { }
+.countcontainer {
+  margin-top:16px;
+  display:inline-block;
+  max-width: 100%;
+  padding: 0;
+  @include trans-fast;
+  z-index: 2;
+  .county {
+    width: 100%!important;
+    position: relative;
+    height: 60px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    i {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex:1 1 auto;
+      height: 100%;
+      padding: 0 8px 0 0;
+      svg {
+        margin-top:4px;
+      }
+    }
+    .county-cell {
+      font-weight: 500;
+      font-size: 20px;
+      line-height: 20px;
+      padding: 5px 14px 0;
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      flex: 1 1 auto;
+      &.last {
+        padding-right: 0;
+      }
+      .county-days, .county-hours, .county-minutes, .county-seconds {
+        letter-spacing: -0.3px;
+      }
+      .county-label {
+        margin:0;
+        padding: 0;
+        font-size: 11px;
+        line-height: 11px;
+        background-color: transparent;
+      }
+    }
+  }
+}
+.product-item.product_show_list .countcontainer {
+  display: none;
+}
+.sidebar-content .thumbnail-container {
+  .countcontainer {
+    display: none;
+  }
+  &:hover .count_icon {
+  }
+}
+
+.thumbnail-container {
+  .count_icon {
+    position: absolute;
+    z-index: 2;
+    right:24px;
+    top:24px;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    box-shadow: 0 10px 18px 0px rgba(0, 0, 0, 0.09);
+    @include trans-def;
+    svg {
+      width:38px;
+      height: 38px;
+    }
+  }
+}
+
+.product_count_block .countcontainer .roycountoff:before {
+  display:none;
+}
+.roycountoff
+{
+  height:60px;
+  width:100%;
+  text-align: center;
+  line-height: 60px;
+  color:$prods-count;
+  position:relative;
+  @include shadow-medium;
+}
+.roycountoff > span
+{
+  position:relative;
+}
+
+/* product page count */
+.product_count_block {
+  display:inline-block;
+  width:100%;
+  height:auto;
+  overflow: visible;
+  position: relative;
+  margin:0;
+  .countcontainer {
+    margin:0;
+    position: relative;
+  	padding:0;
+  	border:none;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    .clearfix {
+      width:100%;
+    }
+    .count_icon {
+      width:32px;
+      height:32px;
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      svg {
+        width:32px;
+        height: 32px;
+        * {
+        }
+      }
+    }
+    .count_other {
+      margin-left:14px;
+      .roycounttitle {
+        position: relative;
+        width:100%;
+        font-size:14px;
+        line-height: 16px;
+        margin:0;
+      }
+      .county {
+        padding:0;
+        box-shadow: none;
+        justify-content: flex-start;
+        &:before {
+        }
+        .county-cell {
+          padding:0 8px 0;
+        }
+      }
+    }
+  }
+}
+
+.hand-hour {
+  -webkit-transform-origin: 50% 50%;
+  -moz-transform-origin: 50% 50%;
+  transform-origin: 50% 50%;
+  -webkit-animation: 20s royspinback infinite linear;
+  -moz-animation: 20s royspinback infinite linear;
+  animation: 20s royspinback infinite linear;
+}
+.hand-min {
+  -webkit-transform-origin: 50% 50%;
+  -moz-transform-origin: 50% 50%;
+  transform-origin: 50% 50%;
+  -webkit-animation: 1s royspinback infinite linear;
+  -moz-animation: 1s royspinback infinite linear;
+  animation: 1s royspinback infinite linear;
+
+}
+
+@-webkit-keyframes royspinback  {
+  0% {-webkit-transform: rotate(0deg)}
+  100% { -webkit-transform: rotate(-360deg) }
+}
+@-moz-keyframes royspinback  {
+  0% {-moz-transform: rotate(0deg)}
+  100% { -moz-transform: rotate(-360deg) }
+}
+@keyframes royspinback  {
+  0% {transform: rotate(0deg)}
+  100% { transform: rotate(-360deg) }
+}
+
+
+@media (min-width:1200px) {
+  ul.product_list.grid > li:hover .product-container .product-image-container .countcontainer,
+  #index .rv_carousel_container div.owl-item > li:hover .product-container .product-image-container .countcontainer {
+      opacity:0;
+} }
+
+@media (max-width: 479px) {
+  ul.product_list:not(.carousel-home) .roycountdown > div, ul.product_list:not(.carousel-home) .roycountdown > span, ul.product_list:not(.carousel-home) .roycountoff > span { display: none!important; }
+  ul.product_list:not(.carousel-home) .roycountdown, ul.product_list:not(.carousel-home) .roycountoff { width: 54px!important; float:right; text-align: center; }
+  ul.product_list:not(.carousel-home) .roycountdown:after, ul.product_list:not(.carousel-home) .roycountoff:after {
+    display: block;
+    content: "\f3b3";
+    font-family: "IonIcons";
+    font-size: 26px;
+    line-height: 54px;
+    cursor: pointer;
+    z-index: 1;
+    position: absolute;
+    top: 0;
+    left: 50%;
+    -moz-transform: translateX(-50%);
+    -webkit-transform: translateX(-50%);
+    transform: translateX(-50%);
+  }
+  .product_count_block .countcontainer .count_other .county {
+    padding:0 6px;
+  }
+  .product_count_block .countcontainer .count_other {
+    margin-left:0;
+  }
+  .product_count_block .countcontainer .count_icon {
+    display: none;
+  }
+}
+
+/* /product page count */

themes/ayon/_dev/css/components/custom-text.scss

@@ -0,0 +1,36 @@
+#custom-text {
+  background: white;
+  border-radius: 2px;
+  margin-bottom: 1.5rem;
+  padding: 3.125rem 3.125rem;
+  text-align: center;
+  h3 {
+    text-transform: uppercase;
+    color: $gray-darker;
+    font-size: 1.563rem;
+    font-weight: 700;
+  }
+  p {
+    color: $gray-darker;
+    font-weight: 400;
+    font-size: 1.1em;
+    .dark {
+      color: $gray;
+      font-weight: 400;
+    }
+  }
+}
+.page-content.page-cms{
+  text-align: justify;
+  .cms-box{
+    img{
+      max-width: 100%;
+      height:auto;
+    }
+  }
+}
+@include media-breakpoint-down(md) {
+  #block-cmsinfo {
+    padding: $medium-space $large-space;
+  }
+}

themes/ayon/_dev/css/components/customer.scss

@@ -0,0 +1,405 @@
+/*** SOME GENERIC STYLES ***/
+@mixin customer-area-base-box {
+  padding: 2rem;
+}
+@mixin customer-area-box {
+  @include customer-area-base-box;
+  font-size: $font-size-sm;
+}
+#my-account #main p a {
+  text-decoration: underline;
+  &:hover {
+    text-decoration: none;
+  }
+}
+.table-labeled {
+  th {
+    vertical-align: middle;
+  }
+  td {
+    vertical-align: middle;
+  }
+  .label {
+    font-weight: 400;
+    border-radius: 3px;
+    font-size: inherit;
+    padding: 0.25rem 0.375rem;
+    margin: 0.125rem;
+    white-space: nowrap;
+  }
+}
+.page-order {
+  .table {
+    margin-bottom: 0;
+  }
+  table {
+    th {
+      padding: 0.5rem;
+    }
+    td {
+      padding: 0.5rem;
+    }
+    thead {
+      th {
+        text-align: center;
+      }
+    }
+  }
+}
+#authentication {
+  .tooltip.tooltip-bottom {
+    padding: 0;
+    margin: 0;
+  }
+  .custom-checkbox {
+    display: flex;
+    span {
+      flex: 0 0 1.25rem;
+    }
+    label {
+      padding-left: 0.625rem;
+    }
+  }
+}
+#identity,
+#authentication {
+  .radio-inline {
+    padding: 0;
+    margin-right:1.25rem;
+    .custom-radio {
+    }
+  }
+  .logininstead {
+    padding: 40px 60px;
+    border: 2px solid;
+    text-align: center;
+    margin-top: 60px;
+    a {
+      margin-left:14px;
+    }
+  }
+}
+/*** Most of the customer accpunt pages ***/
+.page-customer-account {
+  #content {
+    .order-actions {
+      a {
+        padding: 0 0.125rem;
+      }
+    }
+    .forgot-password {
+      text-align: right;
+      font-size: 14px;
+      padding-bottom: 40px;
+    }
+  }
+}
+@media(min-width:992px) {
+  .page-customer-account #content .forgot-password {
+    margin-top:-24px;
+  }
+}
+/*** Login page ***/
+.page-authentication {
+  #content {
+    @include customer-area-base-box;
+    max-width: 640px;
+    margin: 0 auto;
+  }
+}
+/*** Addresses page ***/
+.page-addresses {
+  .address {
+    border:2px solid;
+    @include trans-fast;
+    &:hover {
+      box-shadow: 0 10px 40px 0px rgba(0, 0, 0, 0.09);
+    }
+    margin-bottom: 2rem;
+    .address-body {
+      padding: 3rem 3.5rem;
+      h4 {
+        font-weight: 600;
+      }
+    }
+    .address-footer {
+      border-top: 2px solid;
+      padding: 1.25rem 3.5rem;
+      display: flex;
+      align-items: center;
+      a {
+        margin-right: 18px;
+        font-size:14px;
+        line-height: 14px;
+        display: flex;
+        align-items: center;
+        i {
+          width:18px;
+          height:18px;
+          display: inline-block;
+          margin-right:6px;
+          svg {
+            width:18px;
+            height:18px;
+          }
+        }
+        span {
+          vertical-align: middle;
+        }
+      }
+    }
+  }
+  .addresses-footer {
+    margin: 0 0.9375rem;
+    a {
+      i {
+        font-size: $base-font-size;
+      }
+      span {
+        font-size: $base-font-size;
+        vertical-align: middle;
+        margin-top: $small-space;
+      }
+    }
+  }
+}
+@media(min-width: 992px) {
+  .myacc_content {
+    padding-left: 2rem;
+  }
+}
+#main .myacc_content .page-header {
+  margin-bottom:64px;
+}
+
+.myacc_content #notifications .container {
+  padding: 0;
+}
+#history #wrapper #notifications {
+  display: none;
+}
+/*** Order details page ***/
+.page-order-detail {
+  font-size: 0.875rem;
+  .box {
+    padding:0 0 60px;
+    margin-bottom: 60px;
+  }
+  #main .page-content ul {
+    margin:0;
+  }
+  h3 {
+    font-size: $base-font-size;
+    font-weight: 600;
+    text-transform: uppercase;
+    margin-bottom: 1rem;
+  }
+  #order-infos {
+    ul {
+      margin: 0;
+    }
+  }
+  #order-history {
+    .history-lines {
+      .history-line {
+        padding: 0.5rem 0;
+        &:last-child {
+          border-bottom: 0;
+        }
+        .label {
+          display: inline-block;
+          margin: 0.25rem 0;
+          padding: 0.25rem 0.375rem;
+          border-radius: 3px;
+        }
+      }
+    }
+  }
+  .addresses {
+    margin: 0 -0.9375rem;
+    h4 {
+      font-size: $base-font-size;
+      font-weight: 700;
+    }
+  }
+  #order-products {
+    &.return {
+      margin-bottom: 1rem;
+      th {
+        &.head-checkbox {
+          width: 30px;
+        }
+      }
+      td {
+        padding: 1.375rem 0.75rem;
+        &.qty {
+          min-width: 125px;
+          .current {
+            width: 30%;
+            float: left;
+            text-align: right;
+            padding-right: 0.5rem;
+          }
+          .select {
+            width: 70%;
+            float: left;
+            margin: -0.625rem 0;
+            padding-left: 0.25rem;
+            select {
+              text-align: center;
+            }
+          }
+        }
+      }
+    }
+  }
+  .order-items {
+    padding: 0 !important;
+    .order-item {
+      padding: 1rem 1rem 0;
+      border-bottom: 1px solid $gray-lighter;
+      .checkbox {
+        width: 30px;
+        float: left;
+        padding: 0 0.9375rem;
+      }
+      .content {
+        width: calc(100% - 30px);
+        float: left;
+        padding: 0 0.9375rem;
+      }
+      .desc {
+        .name {
+          font-weight: bold;
+        }
+        margin-bottom: 1rem;
+      }
+      .qty {
+        margin-bottom: 1rem;
+        .q {
+          margin-bottom: 0.25rem;
+        }
+        .s {
+          margin-bottom: 0.25rem;
+        }
+      }
+    }
+  }
+  .messages {
+    .message {
+      margin-top: 0.5rem;
+      border-bottom: 1px solid $gray-lighter;
+      &:last-child {
+        border-bottom: 0;
+      }
+      > div {
+        margin-bottom: 0.5rem;
+      }
+    }
+  }
+  .customization {
+    margin-top: 0.75rem;
+  }
+}
+/*** Order return page ***/
+#order-return-infos {
+  .thead-default th {
+  }
+  .customization {
+    margin-top: 0.75rem;
+  }
+}
+/*** My account landing page ***/
+.myacc_left {
+  .myacc_name {
+    font-weight: 500;
+    font-size: 28px;
+    line-height: 28px;
+    display: inline-block;
+  }
+  .links {
+    margin-top:60px;
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    a {
+      display: flex;
+      align-items: center;
+      font-size: 22px;
+      font-weight: 500;
+      margin-bottom: 30px;
+      width: 100%;
+      float: none;
+      padding: 0;
+      @include trans-fast;
+      &:last-child {
+        margin-top:50px;
+        font-size:20px;
+        opacity:0.5;
+      }
+      &:before {
+        display:none!important;
+      }
+      i {
+        display: inline-block;
+        margin-right:18px;
+        width:24px;
+        height:24px;
+        @include trans-fast;
+      }
+      &:hover {
+        i {
+          transform: translateX(4px);
+          -webkit-transform: translateX(4px);
+        }
+      }
+    }
+  }
+}
+/*** History page ***/
+#history {
+  .orders {
+    margin: 0 -1rem;
+    .order {
+      padding: 0.75rem 1rem;
+      border-bottom: 2px solid $body-border;
+      .label {
+        display: inline-block;
+        margin: 0.25rem 0;
+        padding: 0.25rem 0.375rem;
+        border-radius: 3px;
+      }
+      &:last-child {
+        border-bottom: 0;
+      }
+    }
+  }
+}
+
+#discount .table-bordered {
+  td, th {
+  border:none;
+  }
+}
+
+/*** FOOTER ***/
+.page-footer {
+  .account-link {
+    margin-right: 2rem;
+    i {
+      font-size: $base-font-size;
+    }
+    span {
+      font-size: $base-font-size;
+      vertical-align: middle;
+    }
+  }
+}
+
+.login-form {
+  margin-top: 15px;
+  .form-footer {
+    text-align: center;
+  }
+}

themes/ayon/_dev/css/components/customization-modal.scss

@@ -0,0 +1,22 @@
+.customization-modal {
+  .modal-content {
+    border-radius: 0;
+    border: 1px solid $gray-lighter;
+    .modal-body {
+      padding-top: 0;
+      .product-customization-line {
+        .label {
+          font-weight: bold;
+          text-align: right;
+        }
+        padding-bottom: 0.9375rem;
+        padding-top: 0.9375rem;
+        border-bottom: 1px solid $gray-lighter;
+        &:last-child {
+          padding-bottom: 0;
+          border-bottom: 0;
+        }
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/drop-down.scss

@@ -0,0 +1,35 @@
+.dropdown{
+  &:hover .expand-more{
+  }
+  .expand-more{
+    cursor: pointer;
+    user-select: none;
+
+  }
+
+  .active{
+    max-height: 200px;
+    overflow-y: hidden;
+    visibility: visible;
+  }
+
+  select {
+    -moz-appearance: none;
+    border: 0 none;
+    outline: 0 none;
+  }
+}
+.dropdown-item {
+  font-size:$font-size-sm;
+  font-weight:$base-font-weight;
+  opacity: 0.5;
+  @include trans-def;
+}
+.dropdown-item:focus, .dropdown-item:hover {
+  background: none;
+  text-decoration: none;
+  opacity: 1;
+}
+ul.dropdown-menu {
+  @include shadow-long;
+}

themes/ayon/_dev/css/components/errors.scss

@@ -0,0 +1,45 @@
+#products,
+#pagenotfound {
+  #main {
+    .page-header {
+      margin: 2rem 0 3rem;
+    }
+    .page-content {
+      margin-bottom: 10rem;
+    }
+  }
+  .page-not-found {
+    padding: 3rem;
+    .title404 {
+      text-align: center;
+      font-size:12rem;
+      line-height: 12rem;
+      color:$body-border;
+      font-weight: bold;
+      letter-spacing: -1rem;
+      display: inline-block;
+      width: 100%;
+      margin: 1.5rem 0 1rem;
+    }
+    h4 {
+      font-size: 1rem;
+      text-align: center;
+      font-weight: 500;
+      margin: 0.5rem 0!important;
+      color:$body-comment!important;
+    }
+    p {
+      font-size: 1rem;
+      font-weight: 500;
+      text-align: center;
+      color:$body-comment;
+    }
+    .search-widget {
+      margin:0 auto;
+      float: none;
+      input {
+        width: 100%;
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/featuredproducts.scss

@@ -0,0 +1,611 @@
+#products,.featured-products,.product-accessories,.product-miniature {
+  .products {
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: flex-start;
+    margin:0 -30px;
+    &.owl-carousel {
+      padding:0 12px;
+      margin:0;
+      .owl-stage-outer {
+        overflow: visible;
+      }
+    }
+  }
+  &.slideme {
+    .products {
+      display:block;
+    }
+  }
+  .product-image {
+    display: block;
+    position: relative;
+    .add_wrap {
+      // display: none;
+    }
+  }
+  .product-thumbnail {
+    display: block;
+    border-radius: 3px 3px 0 0;
+    overflow: hidden;
+  }
+  .product-title a {
+  }
+  .thumbnail-container {
+    position: relative;
+    @include trans-fast;
+    &:hover, &:focus {
+      .action-block {
+        transform: translateY(-1.25rem);
+        .action-btn {
+          opacity:1;
+        }
+      }
+      .product-flags > *, .discount-product {
+        opacity:0;
+        pointer-events: none;
+        transform: translateX(-0.75rem);
+      }
+    }
+  }
+  .product-title {
+    margin-bottom:0.75rem;
+  }
+  .variant-links {
+    position: relative;
+    padding-top: 0.75rem;
+    min-height: 2.5rem;
+    a.color {
+      width:22px;
+      height:22px;
+      &:last-of-type {
+        margin-right:0;
+      }
+    }
+    a.color .ctooltip {
+      position: absolute;
+      pointer-events: none;
+      opacity: 0;
+      font-size:1em;
+      padding:0.75em;
+      border-radius: 3px;
+      @include box-shadow;
+      .change {
+        opacity: 1;
+      }
+    }
+
+  }
+  .action-block {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    pointer-events: none;
+    position: absolute;
+    padding: 0 11px;
+    z-index: 3;
+    width: 100%;
+    @include trans-def;
+    .action-btn {
+      pointer-events: auto;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      float:right;
+      opacity:0;
+      height:60px;
+      line-height: 18px;
+      box-shadow: 0 8px 18px 0 rgba(0,0,0,0.07);
+      cursor:pointer;
+      @include trans-fast;
+      a {
+        display: inline-block;
+        width:100%;
+        height: 100%;
+      }
+      i {
+        pointer-events: none;
+        display: inline-block;
+        text-align: center;
+        width:100%;
+        height:100%;
+        svg {
+          width:24px;
+          pointer-events: none;
+          * {
+            @include trans-fast;
+          }
+        }
+      }
+      &:hover {
+        transform: translateY(-4px);
+        box-shadow: 0 10px 16px 0 rgba(0,0,0,0.14);
+      }
+    }
+  }
+  .product-description {
+    display: flex;
+    flex-direction: column;
+    margin-top:32px;
+    z-index: 1;
+    background: none;
+    @include trans-def;
+  }
+  .prod-short-desc {
+    line-height: 1.15rem;
+    text-align: center;
+    display: none;
+  }
+  img {
+    width:100%;
+    max-width: 100%;
+    height: auto;
+  }
+  .comments_note {
+    display: flex;
+    align-items: center;
+    span {
+      display: none;
+    }
+  }
+  .regular-price {
+    text-decoration: line-through;
+  }
+  .count {
+    position: relative;
+    bottom: 0.5rem;
+  }
+  .add_to_cart {
+    white-space: normal;
+  }
+}
+
+.regular-price.old-price {
+  text-decoration: line-through;
+}
+
+.product-item:not(.product_show_list) .product-price-and-shipping {
+  a:not(.color) {
+    display: block;
+  }
+}
+
+#roy_specials_col .product-miniature .product-image a:not(.action-btn) { padding:0; }
+
+/* Separate list styles */
+i.gl {
+  opacity:0.4;
+  @include trans-fast;
+  &.active,
+  &:hover {
+    opacity: 1;
+  }
+  svg {
+    width: 24px;
+  }
+  svg * {
+    stroke: $cat-gl!important;
+    @include trans-fast;
+  }
+  &:hover {
+    svg * {
+      // stroke: $body-link-h!important;
+    }
+  }
+}
+.show_list, .show_grid {
+  cursor:pointer;
+  opacity:1.0;
+  height: 24px;
+  display: inline-block;
+  margin-right:4px;
+}
+.show_list:hover, .show_grid:hover {
+}
+
+#products #js-product-list .product-item.product_show_list {
+  width:100%;
+  .thumbnail-container {
+    padding:0;
+    min-height: 140px;
+    &:hover, &:focus {
+    }
+    .product-flags, .action-block, .discount-product {
+      display: none;
+    }
+    .product-thumbnail {
+      border-radius: 3px!important;
+    }
+    .variant-links {
+      display:none!important;
+    }
+    .product-price-and-shipping > span {
+      vertical-align: middle;
+    }
+    form {
+      display: inline-block;
+    }
+    .comments_note {
+      display: none;
+    }
+    .product-description {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      border-width: 2px 2px 2px 0!important;
+      border-radius: 0 4px 4px 0!important;
+      height:140px;
+      padding: 0 1.75rem 0!important;
+      text-align: left;
+      *:not(.add_to_cart) {
+        text-align: left!important;
+      }
+      .product-title {
+        margin:0!important;
+        flex-basis: 44%;
+      }
+      .add_to_cart {
+        margin-top:0!important;
+        margin-left: 20px;
+      }
+      .product-price-and-shipping {
+        display:flex;
+        align-items: center;
+        .price {
+          margin-left: 14px;
+        }
+      }
+    }
+    &:hover {
+      .product-description {
+      }
+    }
+    .product-image {
+      max-width:140px;
+      float:left;
+      margin-right: 0;
+    }
+  }
+}
+
+#products #js-product-list .product-item {
+  -webkit-transform: translateY(30px);
+  transform: translateY(30px);
+  opacity: 0;
+  -webkit-transition-timing-function: cubic-bezier(0.13, 0.19, 0.34, 0.96);
+  transition-timing-function: cubic-bezier(0.13, 0.19, 0.34, 0.96);
+  -webkit-transition-property: opacity, -webkit-transform;
+  transition-property: opacity, transform;
+  &.show {
+    -webkit-transform: none;
+    transform: none;
+    -webkit-transition-delay: 0s;
+    transition-delay: 0s;
+    opacity: 1;
+  }
+}
+
+.product-item {
+  padding:0 30px;
+  @include trans-fast;
+}
+.product-miniature, .col-image {
+  .discount {
+    display: none;
+  }
+  .product-flags .new,
+  .product-flag,
+  .online-only,
+  .on-sale,
+  .discount-percentage,
+  .discount-amount,
+  .pack {
+    display: inline-block;
+    position: relative;
+    font-size:0.85rem;
+    margin-top: 0.625rem;
+    padding: 0.5rem 1.125rem;
+    min-height: 1.875rem;
+    box-shadow: 6px 9px 22px 0px rgba(0, 0, 0, 0.09);
+    @include trans-def;
+    &.discount-percentage,
+    &.discount-amount,
+    &.on-sale{
+      z-index: 2;
+    }
+    &.online-only {
+      &::before{
+        content:"\E30A";
+        font-family: 'Material Icons';
+        vertical-align: middle;
+        margin: 0.3125rem;
+      }
+    }
+  }
+}
+
+// Homepage products
+
+@media (min-width:992px) {
+.featured-products.col-lg-6 {
+    padding-left:80px;
+    padding-right:80px;
+}
+.featured-products.pl_per2 .product-item {
+  width:50%;
+}
+.featured-products.pl_per4 .product-item {
+  width:25%;
+}
+.featured-products.pl_per5 .product-item {
+  width:20%;
+}
+.featured-products.pl_spa1 {
+  .products {
+    .product-item {
+      .thumbnail-container {
+        margin-bottom:60px;
+      }
+    }
+  }
+  &.pl_lay1 {
+    .products {
+      .product-item {
+        .thumbnail-container {
+          margin-bottom:40px;
+        }
+      }
+    }
+  }
+}
+.featured-products.pl_spa2 {
+  .products {
+    margin:0 -60px;
+    .product-item {
+      padding-left:60px;
+      padding-right:60px;
+      .thumbnail-container {
+        margin-bottom:120px;
+      }
+    }
+  }
+}
+}
+
+// Mini products
+#main .featured-products.mini {
+  .products {
+    .products-box {
+      display:flex;
+      flex-direction: column;
+      .product-item {
+        width:100%;
+        .thumbnail-container {
+          display:flex;
+          align-items: center;
+          margin-bottom:40px;
+          .product-image {
+            margin-right:2rem;
+            width:90px;
+            min-width:90px;
+          }
+          .product-price-and-shipping .regular-price {
+            opacity:0.5;
+            font-size: smaller;
+          }
+          .product-price-and-shipping i {
+            position: absolute;
+            border-radius: 100%;
+            width:40px;
+            height: 40px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            top: 50%;
+            lefT: -20px;
+            margin-top: -20px;
+            @include trans-fast;
+            svg {
+              width:20px;
+              height: 20px;
+              margin: 2px 0 0 2px;
+            }
+          }
+          .product-description {
+            min-height: 0;
+            margin:0;
+            display:flex;
+            align-items: flex-start;
+            justify-content: flex-start;
+            .comments_note {
+              margin-top:0;
+              margin-bottom:10px;
+            }
+            .product-title {
+              text-align: left;
+              a {
+                font-size:16px;
+              }
+            }
+            .discount-product {
+              display: none;
+            }
+          }
+        }
+        &:hover {
+          .product-price-and-shipping i {
+            opacity:0;
+            transform: translateX(20px);
+          }
+        }
+      }
+    }
+  }
+  &.pl_per2 {
+    .products {
+      .products-box {
+        width:50%;
+      }
+    }
+  }
+  &.pl_per3 {
+    .products {
+      .products-box {
+        width:33.3333%;
+      }
+    }
+  }
+  &.pl_per4 {
+    .products {
+      .products-box {
+        width:25%;
+      }
+    }
+  }
+  &.pl_per5 {
+    .products {
+      .products-box {
+        width:20%;
+      }
+    }
+  }
+}
+@media(max-width:991px) {
+  #main .featured-products.mini {
+    .products {
+      .products-box {
+        width:50%!important;
+      }
+    }
+  }
+}
+@media(max-width:767px) {
+  #main .featured-products.mini {
+    .products {
+      .products-box {
+        width:100%!important;
+      }
+    }
+  }
+  .featured-products .undertitle {
+    display: none;
+  }
+}
+
+
+
+// Sliders styles
+
+#index #main .featured-products {
+  margin-top:0!important;
+  margin-bottom:0!important;
+}
+#product #main .featured-products {
+  margin-top:0!important;
+  margin-bottom:0!important;
+  .pp_products_wrapper {
+    padding-bottom:60px;
+  }
+}
+
+/* Specials  */
+.side-column > #roy_specials_col {
+  .sidebar-content {
+    // overflow: hidden;
+  }
+  .comments_note {
+    display: none;
+  }
+  .product-item {
+    width:100%;
+    float:none;
+    margin-right:40px;
+    .action-block {
+      // display: none;
+    }
+    .discount-product {
+      display: block;
+      min-width: 64px;
+      min-height: 64px;
+      padding: 0 12px;
+      line-height: 64px;
+      margin:0;
+      -webkit-transform: translate(-5%, -110%);
+      transform: translate(-5%, -110%);
+      overflow: hidden;
+      pointer-events: none;
+      &:before {
+        content: '\F178';
+        width:100%;
+        height: 100%;
+        font-family: 'FontAwesome';
+        font-size: 22px;
+        position: absolute;
+        left:0;
+        top:0;
+        opacity:0;
+        box-shadow: 0 10px 18px 0px rgba(0, 0, 0, 0.04);
+        -webkit-transform: translateX(-100%);
+        transform: translateX(-100%);
+        @include trans-fast;
+      }
+    }
+    &:hover .discount-product {
+      opacity:1;
+      box-shadow: 0 4px 18px 0px rgba(0, 0, 0, 0.24);
+      -webkit-transform: translate(-25%, -110%);
+      transform: translate(-25%, -110%);
+      &:before {
+        opacity:1;
+        -webkit-transform: translateX(0);
+        transform: translateX(0);
+      }
+    }
+  }
+  .product-miniature .thumbnail-container {
+    margin:0;
+  }
+  .product-miniature .thumbnail-container:hover {
+    box-shadow: none;
+  }
+  .product-miniature .product-description {
+    background: none;
+    border: none;
+    .prod-short-desc, .prod-short-desc p {
+      font-size:14px;
+      font-weight: 500;
+    }
+  }
+}
+
+
+@include media-breakpoint-up(lg) {
+  #product .product-accessories {
+    .product-item {
+      width:25%;
+    }
+  }
+}
+@include media-breakpoint-down(md) {
+   .product-description .add_wrap {
+     margin-top:0.75rem;
+   }
+
+   
+  .product-miniature {
+    .product-flags .new,
+    .product-flag,
+    .online-only,
+    .on-sale,
+    .discount-percentage,
+    .discount-amount,
+    .pack {
+      font-size:13px;
+      margin-top: 0.5rem;
+      padding: 6px 10px 4px;
+      min-height: 0;
+    }
+  }
+
+
+}

themes/ayon/_dev/css/components/footer.scss

@@ -0,0 +1,253 @@
+// Before footer
+#footer {
+}
+#footer > .container > .row_zero {
+  margin:0;
+}
+#footer > .container > .row_zero > * {
+  padding-bottom: $section-space-half;
+}
+
+// Footer
+.block_newsletter {
+  @include search-box;
+  font-size: $font-size-lg;
+  p.alert {
+    max-width:100%;
+    padding-top:14px;
+  }
+  p.conditions {
+    font-size:12px;
+    line-height: 15px;
+    margin-top:8px;
+    opacity: 0.75;
+  }
+  form {
+    .input-wrapper {
+    }
+    input[type=text] {
+      height:60px;
+      line-height: 20px;
+      padding:0 22px;
+      @include trans-fast;
+      &:focus {
+        @include shadow-long-h;
+        outline: 0;
+      }
+      width: 100%;
+    }
+    button.go {
+      position: absolute;
+      height:60px;
+      width:60px;
+      top:0;
+      right:0;
+      padding:0;
+      display: inline-block;
+      border:none;
+      outline:none;
+      cursor:pointer;
+      mask-size:24px;
+      mask-repeat: no-repeat;
+      mask-position: center center;
+      -webkit-mask-image: url(../img/mail.svg);
+      mask-image: url(../img/mail.svg);
+      @include trans-fast;
+      &:hover {
+        opacity: 0.4;
+      }
+    }
+  }
+}
+.block-contact {
+    line-height: 1.75em;
+  .block-contact-title {
+    display:none;
+  }
+  p {
+    margin-top:40px;
+  }
+}
+.footer-container h3 {
+    margin-bottom:32px;
+}
+.block-social {
+  text-align: left;
+  ul {
+    margin-bottom: 0;
+  }
+}
+.block-social li {
+    mask-size:cover;
+    display: inline-block;
+    float:left;
+    margin-right: 22px;
+    width:26px;
+    height:26px;
+    cursor: pointer;
+    @include trans-fast;
+  &:first-child {
+    margin-left: 0;
+  }
+  &:hover {
+    transform: translateY(-0.225rem);
+    opacity:0.4;
+    @include shadow-medium;
+  }
+  a {
+    display: block;
+    height: 100%;
+    white-space: nowrap;
+    text-indent: 100%;
+    overflow: hidden;
+    &:before {
+      display: none!important;
+    }
+    &:hover {
+      color: transparent;
+    }
+  }
+}
+.facebook {
+  -webkit-mask-image: url(../img/facebook.svg);
+  mask-image: url(../img/facebook.svg);
+}
+.twitter {
+  -webkit-mask-image: url(../img/twitter.svg);
+  mask-image: url(../img/twitter.svg);
+}
+.rss {
+  -webkit-mask-image: url(../img/rss.svg);
+  mask-image: url(../img/rss.svg);
+}
+.youtube {
+  -webkit-mask-image: url(../img/youtube.svg);
+  mask-image: url(../img/youtube.svg);
+}
+.googleplus {
+  -webkit-mask-image: url(../img/gplus.svg);
+  mask-image: url(../img/gplus.svg);
+}
+.pinterest {
+  -webkit-mask-image: url(../img/pinterest.svg);
+  mask-image: url(../img/pinterest.svg);
+}
+.vimeo {
+  -webkit-mask-image: url(../img/vimeo.svg);
+  mask-image: url(../img/vimeo.svg);
+}
+.instagram {
+  -webkit-mask-image: url(../img/instagram.svg);
+  mask-image: url(../img/instagram.svg);
+}
+.vk {
+  // background-image: url(../img/vk.svg);
+}
+.footer-container {
+    padding-top: $section-space;
+    padding-bottom: $section-space;
+    overflow: hidden;
+    font-size:15px;
+  .links { width:100% }
+  p {
+    font-size:15px;
+  }
+  li {
+    margin-bottom: 0.65rem;
+  }
+  li a {
+    cursor: pointer;
+    font-size: 15px;
+  }
+}
+.links {
+  .collapse {
+    display: inherit;
+  }
+}
+
+
+@include media-breakpoint-down(sm) {
+  .footer-container {
+    box-shadow: none;
+    margin-top: 0;
+    padding-top:60px;
+    padding-bottom:0;
+    .links {
+      .title {
+        padding: 0.625rem;
+        cursor: pointer;
+        .collapse-icons .remove {
+          display: none;
+        }
+      }
+      .h3 {
+        line-height: 1.5;
+        font-size: 1.25rem;
+      }
+      ul {
+        margin-bottom: 0;
+      }
+    }
+  }
+  .links {
+    .title {
+      .collapse-icons .remove {
+        display: none;
+      }
+    }
+    .collapse {
+      display: none;
+      &.in {
+        display: block;
+      }
+    }
+    .title[aria-expanded="true"] .collapse-icons {
+      .add {
+        display: none;
+      }
+      .remove {
+        display: block;
+      }
+    }
+    .navbar-toggler {
+      display: inline-block;
+      padding: 0;
+    }
+  }
+}
+@include media-breakpoint-down(md) {
+  #footer {
+    .navbar-toggler {
+      opacity:0.5;
+    }
+  }
+  .footer-container > .container {
+    padding-left:40px;
+    padding-right:40px;
+  }
+  .block_newsletter {
+    padding-bottom: 0.625rem;
+    p#block-newsletter-label {
+      text-align: center;
+      max-width: 100%;
+      margin-top:20px;
+    }
+    form input[type=text] {
+      min-width: 0;
+    }
+  }
+  .block-social {
+    text-align: center;
+  }
+  .block-contact {
+    padding-left: 1.5rem;
+  }
+}
+@include media-breakpoint-up(lg) {
+  .footer-container {
+    .wrapper.text {
+      padding-right:80px
+    }
+  }
+}

themes/ayon/_dev/css/components/forgotten-password.css

@@ -0,0 +1,40 @@
+.forgotten-password {
+  padding: 4px;
+}
+.forgotten-password .form-fields .center-email-fields {
+  display: flex;
+  justify-content: center;
+}
+@media (max-width: 767px) {
+  .forgotten-password .form-fields .center-email-fields {
+    flex-direction: column;
+  }
+  .forgotten-password .form-fields .center-email-fields button {
+    margin: 10px;
+    width: calc(100% - 20px);
+  }
+  .forgotten-password .form-fields .center-email-fields .form-control-label {
+    text-align: left;
+  }
+}
+.forgotten-password .form-fields .center-email-fields button {
+  margin-left: 14px;
+}
+.forgotten-password .form-fields .email {
+  padding-left: 0;
+  padding-right: 0;
+}
+.forgotten-password .form-fields .email input {
+  margin-right: 14px;
+}
+@media (max-width: 767px) {
+  .forgotten-password .form-fields .email {
+    padding-left: 10px;
+    padding-right: 10px;
+    width: 100%;
+  }
+}
+.send-renew-password-link {
+  padding-left: 10px;
+  padding-right: 10px;
+}/*# sourceMappingURL=forgotten-password.css.map */

themes/ayon/_dev/css/components/forgotten-password.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["forgotten-password.scss","forgotten-password.css"],"names":[],"mappings":"AACA;EACE,YAAA;ACAF;ADII;EACE,aAAA;EACA,uBAAA;ACFN;ADIM;EAJF;IAKI,sBAAA;ECDN;EDGM;IACE,YAAA;IACA,wBAAA;ECDR;EDGM;IACE,gBAAA;ECDR;AACF;ADIM;EACE,iBAAA;ACFR;ADMI;EACE,eAAA;EACA,gBAAA;ACJN;ADKM;EACE,kBAAA;ACHR;ADMM;EAPF;IAQI,kBAAA;IACA,mBAAA;IACA,WAAA;ECHN;AACF;ADWA;EACE,kBAAA;EACA,mBAAA;ACTF","file":"forgotten-password.css"}

themes/ayon/_dev/css/components/forgotten-password.scss

@@ -0,0 +1,50 @@
+
+.forgotten-password {
+  padding: 4px;
+
+  .form-fields {
+
+    .center-email-fields {
+      display: flex;
+      justify-content: center;
+
+      @media (max-width: 767px) {
+        flex-direction: column;
+
+        button {
+          margin: 10px;
+          width: calc(100% - 20px);
+        }
+        .form-control-label {
+          text-align: left;
+        }
+      }
+
+      button {
+        margin-left:14px;
+      }
+    }
+
+    .email {
+      padding-left: 0;
+      padding-right: 0;
+      input {
+        margin-right:14px;
+      }
+
+      @media (max-width: 767px) {
+        padding-left: 10px;
+        padding-right: 10px;
+        width: 100%;
+      }
+    }
+
+    label.required {
+    }
+  }
+}
+
+.send-renew-password-link {
+  padding-left: 10px;
+  padding-right: 10px;
+}

themes/ayon/_dev/css/components/imageslider.scss

@@ -0,0 +1,78 @@
+.carousel {
+  margin-bottom: 1.5rem;
+  .direction {
+    z-index: auto;
+  }
+  .carousel-inner {
+    height: auto;
+    @media (max-width: 767px) {
+      height: auto;
+    }
+  }
+  .carousel-item {
+    height: 100%;
+    img {
+      @media (max-width: 767px) {
+        max-width: 100%;
+        height: auto;
+      }
+      @media (min-width: 768px) {
+        width: 100%;
+        margin-left: 0;
+      }
+    }
+    figure {
+      margin:0;
+    }
+    .caption {
+      position: absolute;
+      @media (min-width: 768px) {
+      bottom: 28px;
+      left: 90px;
+      }
+      @media (max-width: 767px) {
+        bottom: 5px;
+        left: 40px;
+      }
+      color: white;
+      max-width: 340px;
+      .caption-description p {
+        color: white;
+      }
+    }
+    figure {
+      @media (max-width: 767px) {
+        margin: 0;
+      }
+    }
+  }
+  .carousel-control {
+        display: none;
+    opacity: 1;
+    .icon-next,
+    .icon-prev {
+      &::before {
+        content: "";
+      }
+      i {
+        font-size: 3.125rem;
+        color: white;
+      }
+      &:hover {
+        i {
+          color: $brand-primary;
+        }
+      }
+    }
+    .icon-prev {
+      left: 1rem;
+    }
+    .icon-next {
+      right: 2rem;
+    }
+    &.left,
+    &.right {
+      background: none;
+    }
+  }
+}

themes/ayon/_dev/css/components/mainmenu.scss

@@ -0,0 +1,206 @@
+#_desktop_top_menu {
+  width:100%;
+  ul#top-menu {
+    position: relative;
+    padding: 0;
+    width: 100%;
+    background: $menu-bg;
+    border-radius: 5px;
+    box-shadow: 0 12px 30px 0 rgba(0,0,0,0.07);
+    display: inline-block;
+    padding:0 0 0 10px;
+    margin:0;
+    li {
+      padding:0;
+      a[data-depth="0"] {
+        font-family: $font-menu;
+        line-height: 68px;
+        font-size: 1.25rem;
+        text-transform: uppercase;
+        color:$menu-link;
+        padding:0 24px;
+        @include trans-fast;
+        &:hover {
+          color:$menu-link-h;
+        }
+      }
+    }
+  }
+}
+
+.top-menu {
+  &[data-depth="1"] {
+    margin: 0;
+    padding: 1.25rem 0.75rem ;
+  }
+  a:not([data-depth="0"]) {
+    display: block;
+    padding: 0.625rem;
+    color: $menu-link;
+    font-weight: 400;
+  }
+  a.dropdown-submenu {
+    color: $menu-link;
+    text-transform: uppercase;
+    font-weight: 600;
+  }
+  a[data-depth="0"] {
+    font-weight: 600;
+    padding: 0.1875rem $small-space 0.375rem;
+    &:hover {
+      #header & {
+        color: $menu-link-h;
+        text-decoration: none;
+      }
+    }
+  }
+  a[data-depth="1"],
+  a[data-depth="2"] {
+    padding: 0 0.625rem 0.625rem 0;
+  }
+  .collapse {
+    display: inherit;
+  }
+  .sub-menu {
+    &.collapse {
+      display: none;
+    }
+    box-shadow: 0 12px 30px 0 rgba(0,0,0,0.07);
+    background: $menu-bg;
+    border-radius: 5px;
+    border: none;
+    width: 100%;
+    min-width: 100%;
+    z-index: 18;
+    display: block!important;
+    opacity:0;
+    visibility:hidden;
+    ul[data-depth="1"] > li {
+      float: left;
+      margin: 0 1.25rem 1.5rem;
+    }
+    a:hover {
+      color: #00c293;
+    }
+  }
+  & > li:hover .sub-menu {
+    top:68px!important;
+    @include trans-fast;
+  }
+  .popover {
+    max-width: inherit;
+    border-radius: 0;
+  }
+}
+.popover.bs-tether-element-attached-top {
+  margin-top: 0;
+}
+
+#mobile_top_menu_wrapper {
+  margin-top: 0.625rem;
+  padding-bottom: 0.625rem;
+  background: $menu-bg;
+  #top-menu {
+    margin-bottom: 0.625rem;
+  }
+  .top-menu {
+    color: $menu-link;
+    .collapse-icons[aria-expanded="true"] {
+      .add {
+        display: none;
+      }
+      .remove {
+        display: block;
+      }
+    }
+    .collapse-icons .remove {
+      display: none;
+    }
+    .navbar-toggler {
+      display: inline-block;
+      padding: 0;
+    }
+    a[data-depth="0"] {
+      padding: 0.625rem;
+      border-bottom: 1px solid $gray-lighter;
+    }
+    .collapse {
+      display: none;
+      &.in {
+        display: block;
+      }
+    }
+    .sub-menu {
+      &.collapse {
+        display: none;
+        &.in {
+          display: block;
+        }
+      }
+      box-shadow: none;
+      z-index: inherit;
+      display: block;
+      position: static;
+      overflow: hidden;
+      margin-left: 0;
+      width: 100%;
+      min-width: 100%;
+      background: $gray-lighter;
+      ul[data-depth="0"] > li {
+        border-bottom: 1px solid $gray;
+      }
+      ul[data-depth="1"] {
+        margin: 0;
+        > li {
+          float: none;
+          margin: 0;
+          a {
+            text-transform: none;
+          }
+        }
+      }
+      ul {
+        padding: 0;
+      }
+      li > a {
+        padding: 0.625rem;
+        border-bottom: 1px solid white;
+        font-weight: bold;
+      }
+      ul[data-depth="2"] li a {
+        padding-left: 1.25rem;
+      }
+      ul[data-depth="3"] li a {
+        padding-left: 2.5rem;
+      }
+      ul[data-depth="4"] li a {
+        padding-left: 3.75rem;
+      }
+    }
+  }
+  .js-top-menu-bottom {
+    a {
+      color: $gray;
+    }
+    .language-selector-wrapper {
+      padding: 0.625rem;
+      .language-selector {
+        display: inline;
+      }
+    }
+    .currency-selector {
+      padding: 0.625rem;
+    }
+    #contact-link {
+      padding: 0.625rem;
+    }
+    .user-info {
+      padding: 0 0.625rem;
+      a {
+        padding: 0.625rem 0;
+        display: block;
+        width: 100%;
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/quickview.scss

@@ -0,0 +1,148 @@
+.quickview {
+  display:flex!important;
+  padding:0!important;
+  align-items: center;
+  justify-content: center;
+  .modal-dialog {
+    width: calc(100% - 30px);
+    max-width: 64rem;
+    min-height: 60vh;
+    max-height: 80vh;
+    overflow: hidden;
+  }
+  .left_col {
+    ul {
+      .thumb-container {
+        width:100%;
+        // min-height: 60vh;
+        img {
+          max-width:100%;
+          width:auto;
+        }
+      }
+    }
+  }
+  .right_col {
+    overflow: scroll;
+    overflow-x: hidden;
+    position: absolute;
+    left: 50%;
+    height: 100%;
+      max-height: 80vh;
+    .right_col_inner {
+      padding:60px 40px;
+    }
+    .discover_qw {
+      margin-top:1rem;
+      a {
+        width: 100%;
+      }
+    }
+    .manufacturer-logo {
+      display: none;
+    }
+  }
+  .modal-content {
+    border:none;
+  }
+  .modal-header {
+    border: none;
+    padding: $small-space;
+  }
+  .modal-body {
+    padding:0;
+  }
+  .modal-footer {
+  }
+  .prod-buttons {
+    display:none;
+  }
+  h1.product-title {
+    padding-right: 40px;
+  }
+  .has-discount .discount {
+    font-size: 13px;
+    line-height: 15px;
+  }
+  button.close {
+    width: 30px;
+    height: 30px;
+    position: absolute;
+    top: 55px;
+    right: 55px;
+    opacity: 0.8;
+    cursor:pointer;
+    z-index: 5;
+    outline:none;
+    @include trans-fast;
+    &:hover {
+      opacity:1;
+      outline:none;
+      transform: rotate(90deg);
+    }
+    svg {
+      width: 30px;
+      height: 30px;
+      * {
+      }
+    }
+  }
+  .layer {
+    display: none;
+  }
+  .product-cover img {
+    width: 95%;
+  }
+  .images-container {
+    .product-images > li.thumb-container > .thumb {
+    }
+  }
+  .mask {
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 auto;
+    ul {
+      margin:0;
+    }
+  }
+}
+
+@media(min-width:1200px) {
+  .quickview {
+    .modal-dialog {
+      max-width: 1024px;
+    }
+  }
+}
+@media(min-width:992px) and (max-width:1199px) {
+  .quickview {
+    .modal-dialog {
+      max-width: 760px;
+      margin:0;
+    }
+  }
+}
+@include media-breakpoint-down(sm) {
+  .quickview {
+    .modal-dialog {
+      width:100%;
+      height: 100%;
+      margin:0;
+      overflow-y: auto;
+      overflow-x: hidden;
+      overflow-y: scroll;
+      -webkit-overflow-scrolling: touch;
+      max-height: 100%;
+    }
+    .left_col {
+      width:100%;
+    }
+    .right_col {
+      width:100%;
+      position: relative;
+      left:auto;
+      top:auto;
+      overflow: auto;
+    }
+  }
+}

themes/ayon/_dev/css/components/renew-password.css

@@ -0,0 +1,9 @@
+.renew-password {
+  margin-left: 10px;
+}
+.renew-password .email {
+  padding-bottom: 30px;
+}
+.renew-password [type=submit] {
+  margin-left: 50px;
+}/*# sourceMappingURL=renew-password.css.map */

themes/ayon/_dev/css/components/renew-password.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renew-password.scss","renew-password.css"],"names":[],"mappings":"AACA;EACE,iBAAA;ACAF;ADEE;EACE,oBAAA;ACAJ;ADGE;EACE,iBAAA;ACDJ","file":"renew-password.css"}

themes/ayon/_dev/css/components/renew-password.scss

@@ -0,0 +1,12 @@
+
+.renew-password {
+  margin-left: 10px;
+
+  .email {
+    padding-bottom: 30px;
+  }
+
+  [type=submit] {
+    margin-left: 50px;
+  }
+}

themes/ayon/_dev/css/components/search-widget.scss

@@ -0,0 +1,73 @@
+.search-widget {
+  @include search-box;
+}
+.header-top {
+  .search-widget {
+    form {
+      input[type="text"] {
+        height: 54px;
+        min-width: inherit;
+        width: 100%;
+        min-width:240px;
+        padding: 0.5rem 2rem 0.5rem 1.25rem;
+        background: none;
+        &:focus {
+          padding-left: 1.5rem;
+          padding-right: 2.5rem;
+          box-shadow: 0 14px 40px 0px rgba(0, 0, 0, 0.11);
+        }
+      }
+      button[type=submit] {
+        outline: none!important;
+        .search svg {
+          width:28px;
+        }
+      }
+    }
+  }
+}
+#checkout {
+  #search_widget {
+    display: none; /* Not ideal solution by allows to reuse same hooks/templates */
+  }
+}
+
+#pagenotfound {
+  .page-content {
+    #search_widget {
+      width: 100%;
+    }
+  }
+}
+
+.page-not-found {
+  .search-widget {
+    form {
+      display: inline-block;
+    }
+  }
+}
+
+.layout-full-width.page-search {
+  h2 {
+    margin-top:22px;
+    text-align: center;
+  }
+}
+
+/*** Responsive part ***/
+@include media-breakpoint-down(sm) {
+  .header-top {
+    .search-widget {
+      float: none;
+      padding: 0 0.9375rem;
+      form {
+        margin: 0 auto;
+        input[type="text"] {
+          min-width: inherit;
+          background: white;
+        }
+      }
+    }
+  }
+}

themes/ayon/_dev/css/components/sitemap.scss

@@ -0,0 +1,40 @@
+.sitemap-title {
+  text-transform: capitalize;
+}
+
+.sitemap {
+  margin-top: 0.9375rem;
+
+  h2 {
+    color: $title;
+    text-transform: uppercase;
+    font-size: 1.1rem;
+    font-weight: 600;
+    margin-left: -15px;
+    width: 100%;
+    height: 35px;
+  }
+
+  ul {
+    margin-left: -15px;
+    margin-top: 20px;
+
+    &.nested {
+      margin-left: 20px;
+    }
+
+    li {
+      font-size: 0.9rem;
+      margin-bottom: 1rem;
+    }
+  }
+}
+
+@include media-breakpoint-down(md) {
+  .sitemap {
+    margin-top: 0;
+  }
+  .sitemap ul {
+    margin-bottom:40px;
+  }
+}

themes/ayon/_dev/css/components/stores.scss

@@ -0,0 +1,103 @@
+#stores {
+  .page-stores {
+    .store-item {
+      padding-left: 0.75rem;
+      padding-right: 0.75rem;
+    }
+    margin: 0 auto;
+    .store-picture {
+      img {
+        max-width: 100%;
+      }
+    }
+    .store-item-container {
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      padding: $large-space 0;
+      ul {
+        margin-bottom: 0;
+        font-size: $font-size-lg;
+      }
+      .divide-left {
+        border-left: $body-border 2px solid;
+        tr {
+          height: 1.563rem;
+        }
+        td {
+          padding-left: 0.375rem;
+        }
+        th {
+          text-align: right;
+        }
+      }
+      .store-description{
+        font-size: $base-font-size;
+      }
+    }
+    .store-item-footer {
+      margin-top: 0.5rem;
+      padding-top: 0.5rem;
+      display: flex;
+      justify-content: space-around;
+      &.divide-top {
+        border-top: $body-border 2px solid;
+      }
+      div:first-child {
+        flex: 0 0 65%;
+      }
+      i.material-icons{
+        margin-right: $small-space;
+        color: $body-text;
+        font-size: $base-font-size;
+      }
+      li{
+        margin-bottom: $small-space;
+      }
+    }
+  }
+}
+
+/*** Responsive part ***/
+@include media-breakpoint-down(sm) {
+  #stores {
+    .page-stores {
+      width: 100%;
+      .store-item-container {
+        padding: 1rem 0;
+      }
+    }
+  }
+}
+@include media-breakpoint-down(xs) {
+  #stores {
+    .page-stores {
+      .store-item-container {
+        display: block;
+        .divide-left {
+          border-left: none;
+        }
+        .store-description {
+          a {
+            margin-bottom: 0.5rem;
+          }
+          address {
+            margin-bottom: 0.5rem;
+          }
+        }
+      }
+      .store-item-footer {
+        display: block;
+        &.divide-top {
+          border-top: $body-border 2px solid;
+        }
+        li{
+          margin-bottom: $small-space;
+        }
+        .card-block {
+          padding: 0.75rem 0.75rem 0;
+        }
+      }
+    }
+  }
+}

themes/ayon/_dev/css/partials/_commons.scss

@@ -0,0 +1,696 @@
+body,
+html {
+  height: 100%;
+}
+body {
+  direction: ltr;
+  font-family: $font-text;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  line-height: 1.5em;
+  main {
+    -webkit-transition: all 0.52s cubic-bezier(0.36, 0.76, 0, 0.88);
+    transition: all 0.52s cubic-bezier(0.36, 0.76, 0, 0.88);
+  }
+}
+ul {
+  list-style: none;
+  padding-left: 0;
+}
+a {
+    z-index: 1;
+    position: relative;
+    @include trans-fast;
+}
+a:hover, a:focus {
+  text-decoration: none;
+  outline:none;
+}
+
+p {
+  font-size: 0.9375rem;
+  font-weight: $base-font-weight;
+}
+.dropdown-item:focus,
+.dropdown-item:hover {
+  background: none;
+}
+.color,
+.custom-checkbox input[type="checkbox"] + span.color {
+  width: 42px;
+  height: 42px;
+  display: inline-block;
+  margin: 0.05rem 0.15rem 0 0;
+  border: none;
+  cursor: pointer;
+  background-size: contain;
+  border-radius: 50%;
+  position: relative;
+  @include trans-fast;
+  &:before {
+    pointer-events: none;
+    content:'';
+    position: absolute;
+    top:0;
+    left:0;
+    width:100%;
+    height: 100%;
+    box-shadow: inset 0 0 0 4px $content-bg, 0 0 0 3px $content-bg;
+    border-radius: 50%;
+    transform: scale(1.15);
+    @include trans-fast;
+    z-index:2;
+  }
+  #search_filters &:before {
+    box-shadow: 0 0 0 3px $content-bg;
+  }
+  &.white:after {
+    pointer-events: none;
+    content:' ';
+    position: absolute;
+    top:0;
+    left:0;
+    width:100%;
+    height: 100%;
+    box-shadow: inset 0 0 0 8px $border-color;
+    border-radius: 50%;
+    @include trans-fast;
+    z-index:1;
+  }
+  &:hover {
+    @include shadow-medium;
+    &:before {
+      box-shadow: inset 0 0 0 7px $content-bg, 0 0 0 0 $body-border;
+      transform: scale(0.9);
+    }
+  }
+  &.white:hover:after {
+    box-shadow: inset 0 0 0 9px $border-color;
+    transform: scale(0.9);
+  }
+  &.white:hover:before {
+    box-shadow: inset 0 0 0 7px $content-bg, 0 0 0 3px $body-border;
+  }
+}
+
+.modal-content {
+  border:none;
+  border-radius: 0;
+}
+
+.facet-label {
+  &.active,
+  &:hover {
+    .custom-checkbox span.color {
+      border: $input-btn-border-width solid $input-border-focus;
+    }
+  }
+}
+.h1,
+.h2,
+.h3 {
+}
+.h4 {
+}
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1.125;
+}
+//Buttons style
+.btn:not(.btn-touchspin) {
+  line-height: 18px;
+  padding:19px 32px;
+  white-space: normal;
+  @include shadow-low;
+  @include trans-fast;
+  &:hover,
+  &:focus,
+  &.btn-primary.disabled:hover,
+  &.btn-primary:disabled:hover {
+    border:2px solid;
+    text-decoration: none;
+    box-shadow:none;
+  }
+  &.wide {
+    padding-left:60px;
+    padding-right:60px;
+  }
+}
+.btn-primary,
+.btn-secondary {
+  .material-icons {
+    margin-right: $small-space;
+  }
+}
+.btn-tertiary {
+  @extend .btn-secondary;
+  padding: 0.25rem;
+  margin: 0.25rem 0;
+}
+.btn-unstyle {
+  background-color: transparent;
+  border: none;
+  padding: 0;
+  text-align: inherit;
+  &:focus {
+    outline: 0;
+    .expand-more {
+    }
+  }
+}
+.btn-high {
+  padding:24px 30px;
+}
+label ,.label {
+  text-align: right;
+  font-size: 1rem;
+}
+small.label, small.value {
+  font-size: 0.8125rem;
+}
+.form-control-label {
+  padding-top: 0.625rem;
+}
+input, select {
+  @include trans-fast;
+}
+.form-control, #quantity_wanted {
+  border-width:2px;
+  border-style: solid;
+  padding: 19px 28px;
+  min-width:6rem;
+  font-weight:600;
+  font-size:13px;
+  line-height: 18px;
+  outline:none;
+}
+svg {
+  pointer-events: none;
+  > * {
+    pointer-events: none;
+  }
+}
+.input-group {
+  min-width:6rem;
+  &.bootstrap-touchspin {
+    box-shadow: none;
+    display: flex;
+  }
+  &.focus {
+  }
+  .form-control:focus {
+    outline: none;
+  }
+  .input-group-btn {
+    width:0;
+    height: 100%;
+    &.group-span-filestyle {
+      width:auto;
+      outline: none;
+      > .btn {
+        position: absolute;
+        right:0;
+        top:0;
+        height:100%;
+        z-index: 5;
+        display: flex;
+        align-items: center;
+        .buttonText {
+          display: flex;
+          @include trans-fast;
+          svg {
+            width:26px;
+            height: 26px;
+          }
+        }
+        &:hover {
+          .buttonText {
+            transform: rotate(30deg);
+          }
+        }
+      }
+    }
+    > .btn {
+      border: 0;
+      box-shadow: none;
+      font-size: 0.6875rem;
+      font-weight: normal;
+      margin-left: 0;
+      padding: 0.625rem 1rem;
+      text-transform: uppercase;
+      outline: none!important;
+      &[data-action="show-password"]{
+        height: 100%;
+        color:$input-text;
+        background: none;
+        border:none;
+        // border-left:2px solid $input-border;
+        position: absolute;
+        top:0;
+        right:0;
+        width: auto;
+        z-index: 5;
+        display: flex;
+        align-items: center; // fix 2020 for eye icon position
+        &:before {
+          content:'';
+          height:50%;
+          width: 2px;
+          left:0;
+          top:25%;
+          position: absolute;
+        }
+        i {
+            pointer-events: none;  // fix 2021 checkout collapse section on click
+          font-size: 1.5rem;
+          font-style: normal;
+          display: inline-block;
+          opacity:0.2;
+          width: 26px;
+          height: 26px;
+          @include trans-fast;
+          svg {
+            width: 26px;
+            height: 26px;
+          }
+        }
+        &:hover {
+          &:before {
+          }
+          i {
+          opacity:1;
+          }
+        }
+      }
+    }
+  }
+}
+.custom-file {
+  .btn {
+    display: flex;
+    svg {
+      width:26px;
+      height: 26px;
+      margin-top: 3px;
+      margin-left: 4px;
+      margin-right: 4px;
+      * {
+        stroke:$btn-color!important;
+      }
+    }
+  }
+}
+input:not(.btn), textarea {
+  &::-webkit-input-placeholder {
+    color: $input-placeholder;
+  }
+  &::-moz-placeholder {
+    color: $input-placeholder;
+  }
+  &:-ms-input-placeholder {
+    color: $input-placeholder;
+  }
+  &:-moz-placeholder {
+    color: $input-placeholder;
+  }
+  &:active {
+    &::-webkit-input-placeholder {
+      color: $input-placeholder;
+    }
+    &::-moz-placeholder {
+      color: $input-placeholder;
+    }
+    &:-ms-input-placeholder {
+      color: $input-placeholder;
+    }
+    &:-moz-placeholder {
+      color: $input-placeholder;
+    }
+  }
+  height: 3.75rem;
+  padding: 19px 28px;
+  border-width:2px;
+  border-style: solid;
+  line-height: 18px;
+  outline:none!important;
+  @include trans-fast;
+  &:not(.btn):focus {
+    padding-left:24px;
+    box-shadow: 0 14px 22px 0px rgba(0, 0, 0, 0.09);
+  }
+}
+textarea, textarea.form-control {
+  min-height: 90px;
+  line-height: 18px;
+  padding-top:22px;
+  padding-bottom:22px;
+}
+.form-control-select, body select.form-control:not([size]):not([multiple]) {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  background: $input-bg url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAQAAAD9CzEMAAAAPklEQVR4Ae3TwREAEBQD0V/6do4SXPZg7EsBhsQ8IEmSMOsiuEfg3gL3oXC7wK0bd1G4o8X9F4yIkyQfSrIByQBjp7QuND8AAAAASUVORK5CYII=") no-repeat scroll right 0.5rem center / 1.25rem 1.25rem;
+  height: 3.75rem;
+  min-height: 60px;
+  padding: 19px 28px;
+  border-width:2px;
+  border-style: solid;
+  line-height: 18px;
+  cursor:pointer;
+  outline:none!important;
+  &:focus {
+    padding-left:24px;
+    box-shadow: 0 14px 22px 0px rgba(0, 0, 0, 0.09);
+  }
+}
+body select.form-control:not([size]):not([multiple]) {
+  padding-right: 2.75rem;
+}
+.form-control-valign {
+  padding-top: 0.5rem;
+}
+.form-control-comment {
+  font-size: 0.75rem;
+  padding-top: 4px;
+  padding-left:4px;
+  letter-spacing: 0.1rem;
+  letter-spacing: 0.04rem;
+  position: static;
+  display: inline-block;
+}
+.form-control-submit {
+  &.disabled {
+  }
+}
+@media (max-width:991px) {
+  .form-control-comment {
+    padding-left:5px;
+    text-align: right;
+    float:right;
+  }
+}
+.form-group {
+  &.has-error {
+    input,
+    select {
+      outline: 0.1875rem solid $brand-danger;
+    }
+    .help-block {
+      color: $brand-danger;
+    }
+  }
+  &.row {
+    position: relative;
+  }
+  .req {
+    position: absolute;
+    top:4px;
+    right:-8px;
+    font-size:28px;
+    font-weight: 400;
+  }
+}
+@media(min-width:768px) {
+  .form-group {
+    &.row {
+      display: flex;
+      align-items: center;
+      flex-wrap: wrap;
+      label {
+        font-size:14px;
+      }
+    }
+  }
+}
+.group-span-filestyle {
+  label {
+    margin: 0;
+    .icon-span-filestyle {
+      display: none;
+    }
+  }
+  .btn-default {
+    text-transform: uppercase;
+    border-radius: 0;
+    font-size: 0.875rem;
+    padding: 0.5rem 1rem;
+  }
+}
+.bootstrap-touchspin {
+  width: auto;
+  float: left;
+  display: inline-block;
+  @include box-shadow-light;
+  input {
+    &:focus {
+      outline: none;
+    }
+    &.form-control,
+    &.input-group {
+      float: left;
+    }
+  }
+  .btn-touchspin {
+    @extend .btn-default;
+    &:hover {
+    }
+  }
+  .input-group-btn-vertical {
+    width: auto;
+    float: left;
+    border-radius: 3px;
+    overflow: hidden;
+    z-indeX: 5;
+    display: table;
+    .bootstrap-touchspin-up {
+      border-radius: 0;
+      padding: 12px 10px 11px;
+    }
+    .bootstrap-touchspin-down {
+      border-radius: 0;
+      padding: 11px 10px 12px;
+    }
+    > .btn {
+      margin-left: 0;
+    }
+    .touchspin-up {
+      &:after {
+        content: "\E5CE";
+      }
+    }
+    .touchspin-down {
+      &:after {
+        content: "\E5CF";
+      }
+    }
+    i {
+      top: 0.2rem;
+      left: 0.15rem;
+      font-size: 0.9375rem;
+    }
+  }
+}
+.custom-radio {
+  display: inline-block;
+  position: relative;
+  width: 22px;
+  height: 22px;
+  vertical-align: middle;
+  cursor: pointer;
+  border-radius: 50%;
+  border: $input-border 2px solid;
+  background: none;
+  margin-right: 0.625rem;
+  @include trans-def;
+  input[type="radio"] {
+    opacity: 0;
+    cursor: pointer;
+    height: auto;
+    & + span {
+      pointer-events: none;
+      display: block;
+      background: none;
+      width: 12px;
+      height: 12px;
+      border-radius: 50%;
+      position: absolute;
+      top: 3px;
+      left: 3px;
+      transform: scale(1.5);
+      @include trans-fast;
+    }
+  }
+  input[type="radio"] {
+    &:checked + span {
+      transform: scale(1);
+    }
+    &:focus + span {
+    }
+  }
+  &:hover {
+    border-color: $input-border-focus;
+    @include shadow-long-h;
+  }
+}
+.custom-checkbox {
+  position: relative;
+  input[type="checkbox"] {
+    margin-top: 0.25rem;
+    opacity: 0;
+    width:1.25rem;
+    height:1.25rem;
+    top:0;
+    z-index: 3;
+    // height: auto;
+    cursor: pointer;
+    position: absolute;
+    + span {
+      margin-right: 4px;
+      margin-top: 2px;
+      display: inline-block;
+      width: 1.25rem;
+      height: 1.25rem;
+      vertical-align: middle;
+      cursor: pointer;
+      border: 2px solid $input-border;
+      border-radius: 4px;
+      @include trans-def;
+      .checkbox-checked {
+        display: none;
+        margin: 0 -0.1rem;
+        font-size: 1.5rem;
+        font-weight: bold;
+        @include trans-def;
+      }
+    }
+    &:checked + span {
+      .checkbox-checked {
+        display: inline-block;
+        margin-top: -12px;
+      }
+    }
+    &:focus + span {
+      border-color: $input-border;
+    }
+    &:hover + span {
+        border-color: $input-border-focus;
+        @include shadow-long-h;
+    }
+  }
+  label {
+    text-align: left;
+    font-size: $font-size-sm;
+    margin-bottom: 0;
+  }
+}
+.text-muted {
+  font-size: $font-size-sm;
+}
+.done {
+  display: inline-block;
+  padding: 0 0.8125rem;
+  margin-right: 1.563rem;
+}
+.thumb-mask {
+  > .mask {
+    position: relative;
+    width: 3.438rem;
+    height: 3.438rem;
+    overflow: hidden;
+    border: $gray-light 1px solid;
+    margin: $small-space 0;
+    img {
+      width: 55px;
+      height: 55px;
+    }
+  }
+}
+.definition-list {
+  dl {
+    border:2px solid;
+    padding:10px;
+    font-size: 13px;
+    line-height: 16px;
+    font-weight: 500;
+    display: flex;
+    flex-wrap: wrap;
+    dt {
+      font-weight: 500;
+    }
+    dd {
+      font-weight: 600;
+    }
+    dd,
+    dt {
+      flex: 0 0 45%;
+      padding: 0.625rem;
+      margin: 0.125rem;
+      &:nth-of-type(even) {
+      }
+    }
+  }
+}
+.help-block {
+  margin-top: $small-space;
+}
+.alert {
+    padding: 1.25rem 1.75rem 1.25rem 4.25rem!important;
+    background:none;
+    font-size: 0.875rem!important;
+    line-height: 1.25rem!important;
+    position: relative;
+    &:before {
+      content:'';
+      width:20px;
+      height: 20px;
+      border-radius: 50%;
+      position: absolute;
+      left:1.5rem;
+      top:50%;
+      transform: translateY(-50%);
+      display: block;
+    }
+    ul, ol {
+      margin-bottom:0.5rem!important;
+    }
+}
+.alert-warning {
+  .material-icons {
+    font-size: 2rem;
+    margin-right: $small-space;
+    padding-top: $extra-small-space;
+  }
+  .alert-text {
+    font-size: 0.9375rem;
+    padding-top: $small-space;
+  }
+  .alert-link {
+    border-radius: 2px;
+    border-width: 2px;
+    margin-left: $small-space;
+    padding: $extra-small-space $medium-space;
+    font-weight: 600;
+    font-size: 0.8125rem;
+  }
+  .warning-buttons {
+    margin-top: $extra-small-space;
+  }
+}
+
+.btn-warning {
+  @include transition(all .4s ease-in-out);
+}
+.btn-tertiary-outline {
+  background-image: none;
+  background-color: transparent;
+  @include transition(all .4s ease-in-out);
+}
+.separator {
+  margin: 0;
+}
+.text-center {
+  text-align: center;
+}
+
+.hide_it_pls {
+  visibility: hidden;
+  display: none;
+}

themes/ayon/_dev/css/partials/_fonts.scss

@@ -0,0 +1,39 @@
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: url(~material-design-icons/iconfont/MaterialIcons-Regular.eot); /* For IE6-8 */
+  src: local('Material Icons'),
+       local('MaterialIcons-Regular'),
+       url(~material-design-icons/iconfont/MaterialIcons-Regular.woff2) format('woff2'),
+       url(~material-design-icons/iconfont/MaterialIcons-Regular.woff) format('woff'),
+       url(~material-design-icons/iconfont/MaterialIcons-Regular.ttf) format('truetype');
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;  /* Preferred icon size */
+  display: inline-block;
+  vertical-align: middle;
+  width: 1em;
+  height: 1em;
+  line-height: 1;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  white-space: nowrap;
+  direction: ltr;
+
+  /* Support for all WebKit browsers. */
+  -webkit-font-smoothing: antialiased;
+  /* Support for Safari and Chrome. */
+  text-rendering: optimizeLegibility;
+
+  /* Support for Firefox. */
+  -moz-osx-font-smoothing: grayscale;
+
+  /* Support for IE. */
+  font-feature-settings: 'liga';
+}

themes/ayon/_dev/css/partials/_mixins.scss

@@ -0,0 +1,86 @@
+@mixin search-box {
+  form {
+    position: relative;
+    input[type=text] {
+      padding: 0.5rem 2rem 0.5rem 1rem;
+      &:focus {
+        padding-left: 1.5rem;
+        padding-right: 2.5rem;
+        + button {
+        }
+      }
+    }
+    button[type=submit] {
+      background: none;
+      border: none;
+      cursor: pointer;
+      @include trans-fast;
+      &:hover {
+      }
+      .search {
+        @include trans-fast;
+        svg {
+          width: 22px;
+        }
+      }
+      .search:hover {
+        color: #00c293;
+      }
+    }
+  }
+}
+
+@mixin box-shadow {
+  box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.2);
+}
+@mixin box-shadow-light {
+  box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.2);
+}
+@mixin shadow-low {
+  box-shadow: 0 6px 18px 0px rgba(0, 0, 0, 0.12);
+}
+@mixin shadow-medium {
+  box-shadow: 0 14px 22px 0px rgba(0, 0, 0, 0.14);
+}
+@mixin shadow-long {
+  box-shadow: 0 10px 40px 0px rgba(0, 0, 0, 0.12);
+}
+@mixin shadow-long-h {
+  box-shadow: 0 14px 50px 0px rgba(0, 0, 0, 0.22);
+}
+
+@mixin trans-fast {
+  -webkit-transition: all .22s cubic-bezier(.07,.74,.56,.89);
+  transition: all .22s cubic-bezier(.07,.74,.56,.89);
+}
+@mixin trans-def {
+  -webkit-transition: all .4s cubic-bezier(.36,.76,0,.88);
+  transition: all .4s cubic-bezier(.36,.76,0,.88);
+}
+@mixin trans-slow {
+  -webkit-transition: all .88s cubic-bezier(.36,.76,0,.88);
+  transition: all .88s cubic-bezier(.36,.76,0,.88);
+}
+
+@mixin micro {
+  opacity: 0;
+
+  -webkit-transition-timing-function: cubic-bezier(0.13, 0.19, 0.34, 0.96);
+  transition-timing-function: cubic-bezier(0.13, 0.19, 0.34, 0.96);
+
+  -webkit-transition-property: opacity, -webkit-transform;
+  transition-property: opacity, transform;
+
+  -webkit-transition-duration: 0s;
+  transition-duration: 0s;
+}
+@mixin microgo {
+  -webkit-transition-duration: 1s;
+  transition-duration: 1s;
+  -webkit-transition-delay: .6s;
+  transition-delay: .6s;
+}
+@mixin microclose {
+  -webkit-transition-delay: 1s;
+  transition-delay: 1s;
+}

themes/ayon/_dev/css/partials/_variables.scss

@@ -0,0 +1,192 @@
+$font-title: 'Cuprum', sans-serif;
+$font-menu: 'Cuprum', sans-serif;
+$font-price: 'Cuprum', sans-serif;
+$font-text: 'Poppins', sans-serif;
+$gray-darker: #232323;
+$gray: #7A7A7A;
+$gray-light: #F1F1F1;
+$gray-lighter: #f6f6f6;
+$brand-primary: #2fb5d2;
+$brand-secondary: #f39d72;
+$brand-success: #4cbb6c;
+$brand-warning: #ff9a52;
+$brand-danger: #ff4c4c;
+$label-color: $gray-darker;
+$btn-primary-color: #fff;
+$btn-primary-bg: $brand-primary;
+$btn-primary-border: transparent;
+$btn-secondary-color: $gray-darker;
+$btn-secondary-bg: $gray-lighter;
+$btn-secondary-border: transparent;
+$btn-border-radius: 0;
+$input-border-color: rgba(0, 0, 0, 0.25);
+$headings-font-weight: 700;
+$tooltip-bg: $brand-danger;
+$border-radius: 0;
+$extra-small-space: 0.3125rem;
+$small-space: 0.625rem;
+$medium-space: 1.25rem;
+$large-space: 1.875rem;
+$extra-large-space: 2.5rem;
+$section-space: 6.25rem;
+$section-space-half: 3.25rem;
+$warning: #FF9A52;
+$warning-hover: #FDE7BB;
+$alert-warning-bg: rgba(255,154,82,0.3);
+$alert-warning-border: $warning;
+$alert-warning-text: $gray-darker;
+$btn-warning-bg: $warning;
+$btn-warning-color: white;
+$btn-tertiary-color: #6C868E;
+$btn-tertiary-hover: #BBCDD2;
+$base-font-weight: 500;
+$base-font-size: 1rem;
+$font-size-lg: 0.9375rem;
+$font-size-sm: 0.875rem;
+$font-size-xs: 0.8125rem;
+$font-size-h1: 1.375rem;
+$font-size-h2: 1.25rem;
+$font-size-h3: 1.125rem;
+$font-size-h4: 1.125rem;
+$font-size-h5: 1rem;
+$font-size-h6: 0.9375rem;
+$display1-size: 3.125rem;
+$display1-weight: 600;
+$display2-size: 2.188rem;
+$display2-weight: 400;
+$display3-size: 1.563rem;
+$display3-weight: 400;
+$display4-size: 1.25rem;
+$display4-weight: 400;
+$text-muted: $gray;
+// $NotoSansPath: "~notosans-fontface/fonts";
+// $NotoSansVersion: "1.0.1";
+
+// Design
+//header
+$header-bg:#f2f2f2;
+$header-nav-bg:#ffffff;
+$header-nav-border:#f2f2f2;
+$header-nav-text:#bebebe;
+$header-nav-link:#424242;
+$header-nav-link-h:#00c293;
+//cart
+$cart-bg:#ffffff;
+$cart-icon:#ff246c;
+$cart-text:#1c1c1c;
+$cart-q:#424242;
+//mainmenu
+$menu-bg:#ffffff;
+$menu-link:#1c1c1c;
+$menu-link-h:#00c293;
+// blog
+
+//levibox
+$box-bg:#ffffff;
+$box-icon:#1c1c1c;
+$box-arrow:#dcdcdc;
+$box-indicate:#00c293;
+//side menu
+$side-bg:#ffffff;
+$side-text:#aaaaaa;
+$side-light:#bbbbbb;
+$side-link:#1c1c1c;
+$side-decor:#f2f2f2;
+
+//mobile menu
+$moba_header:#ffffff;
+$moba_bg:#ffffff;
+$moba_icon:#1c1c1c;
+
+// content
+$main-bg:#f2f2f2;
+$content-bg:#ffffff;
+$body-text: #777777;
+$body-comment: #bbbbbb;
+$body-link: #000000;
+$body-link-h: #00c293;
+$body-border:#f2f2f2;
+$body-table-even:#f6f6f6;
+$alert-danger:#ff4653;
+$success-bg:#00c293;
+$success-text:#ffffff;
+
+//titles
+$title:#1c1c1c;
+$title-before:#f2f2f2;
+$title-decor:#5fceb3;
+//inputs
+$border-width: 2px;
+$border-color: #f2f2f2;
+$input-bg:#ffffff;
+$input-border:#f2f2f2;
+$input-border-focus: #5c5c5c;
+$input-btn-border-width: 2px;
+$input-bg: #ffffff;
+$input-text: #1c1c1c;
+$input-placeholder: #aaaaaa;
+$input-checked: #00c293;
+//buttons
+$btn-bg:#5fceb3;
+$btn-border:#5fceb3;
+$btn-color:#ffffff;
+$btn-bg-h:#1c1c1c;
+$btn-border-h:#1c1c1c;
+$btn-color-h:#ffffff;
+
+// breadcrumb
+$breadcrumb-color:#1c1c1c;
+$breadcrumb-decor:#cccccc;
+
+// tooltips
+$tt-bg:#ffffff;
+$tt-color:#1c1c1c;
+
+// products
+$prods-bg:#ffffff;
+$prods-border:#f2f2f2;
+$prods-name:#1c1c1c;
+$prods-desc:#aaaaaa;
+$prods-action-bg:#ffffff;
+$prods-action-color:#1c1c1c;
+$prods-sale:#f2f2f2;
+$prods-sale-bg:#1c1c1c;
+$prods-new:#5fceb3;
+$prods-new-bg:#ffffff;
+$prods-price:#1c1c1c;
+$prods-old-price:#bbbbbb;
+$cat-gl:#1c1c1c;
+$prods-count:#888888;
+$prods-count-bg:#ffffff;
+$prods-count-i:#000000;
+$prods-count-i-bg:#fbd4d6;
+
+
+// product page
+$pro-title:#1c1c1c;
+$pro-text:#888888;
+$pro-add-bg:#5fceb3;
+$pro-add-color:#ffffff;
+$pro-icons:#888888;
+$pro-labels:#c1c1c1;
+$pro-values:#1c1c1c;
+
+// sidebar
+$side-col-bg:#ffffff;
+$sidebar-title-bg:#5fceb3;
+$sidebar-title-color:#ffffff;
+$sidebar-block-bg:#ffffff;
+$sidebar-block-decor:#f2f2f2;
+$sidebar-block-text:#424242;
+$sidebar-block-link:#1c1c1c;
+$sidebar-block-link-h:#00c293;
+
+// Footer
+$footer-bg:#fafafa;
+$footer-titles:#cccccc;
+$footer-text:#9d9d9d;
+$footer-links:#555555;
+$footer-links-h:#000000;
+$footer-news-bg:#ffffff;
+$footer-news-color:#a0a0a0;
+$footer-news-btn:#ff4653;

themes/ayon/_dev/img/facebook.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-facebook"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg>

themes/ayon/_dev/img/gplus.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
+<g>
+	<image overflow="visible" opacity="0.1" width="46" height="34" xlink:href="CE61D04B.png"  transform="matrix(1 0 0 1 -2 4)">
+	</image>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M14,18.1v4.2c0,0,4,0,5.7,0c-0.9,2.7-2.3,4.2-5.7,4.2c-3.4,0-6.1-2.8-6.1-6.2S10.5,14,14,14
+				c1.8,0,3,0.6,4.1,1.5c0.9-0.9,0.8-1,3-3.1c-1.9-1.7-4.3-2.7-7.1-2.7c-5.8,0-10.5,4.7-10.5,10.5C3.5,26,8.2,30.7,14,30.7
+				c8.7,0,10.8-7.5,10.1-12.6C22,18.1,14,18.1,14,18.1z M32.9,18.4v-3.6h-2.6v3.6h-3.7v2.6h3.7v3.7h2.6v-3.7h3.6v-2.6H32.9z"/>
+		</g>
+	</g>
+</g>
+</svg>

themes/ayon/_dev/img/instagram.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-instagram"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" y1="6.5" x2="17.5" y2="6.5"></line></svg>

themes/ayon/_dev/img/mail.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>

themes/ayon/_dev/img/pinterest.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
+<g>
+	<image overflow="visible" opacity="0.1" width="38" height="46" xlink:href="8DF66D4B.png"  transform="matrix(1 0 0 1 2 -1)">
+	</image>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M18.7,5.1C13.4,5.6,8.1,10,7.8,16.1c-0.1,3.8,0.9,6.6,4.5,7.4c1.6-2.7-0.5-3.3-0.8-5.3
+				c-1.3-8.1,9.4-13.7,15-8c3.9,3.9,1.3,16-4.9,14.8c-6-1.2,2.9-10.8-1.8-12.7c-3.9-1.5-5.9,4.7-4.1,7.8c-1.1,5.3-3.4,10.3-2.5,17
+				c3.1-2.2,4.1-6.5,4.9-10.9c1.5,0.9,2.4,1.9,4.3,2.1c7.2,0.6,11.2-7.2,10.3-14.4C31.8,7.5,25.5,4.3,18.7,5.1z"/>
+		</g>
+	</g>
+</g>
+</svg>

themes/ayon/_dev/img/rss.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg>

themes/ayon/_dev/img/rt_close.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>4</title><g id="Layer_4" data-name="Layer 4"><circle cx="12.02" cy="12" r="10" style="fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5px"/><line x1="9.56" y1="9.6" x2="14.51" y2="14.55" style="fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5px"/><line x1="9.56" y1="14.55" x2="14.51" y2="9.6" style="fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5px"/></g></svg>

themes/ayon/_dev/img/twitter.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitter"><path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"></path></svg>

themes/ayon/_dev/img/vimeo.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
+<g>
+	<image overflow="visible" opacity="0.1" width="43" height="40" xlink:href="503E00AB.png"  transform="matrix(1 0 0 1 -1 1)">
+	</image>
+	<g>
+		<g>
+			<g>
+				<path fill="#FFFFFF" d="M4.1,14c0.7-0.5,1.8-1.4,3.3-2.8c1.5-1.3,2.7-2.3,3.7-2.9c1.3-0.7,2.4-1,3.5-0.7c0.5,0.1,1,0.5,1.4,1.1
+					c0.4,0.6,0.8,1.2,1,1.9c0.2,0.6,0.5,2.1,0.9,4.5c0.1,0.4,0.1,1,0.2,2c0.1,0.9,0.2,1.7,0.3,2.3c0.1,0.6,0.3,1.3,0.5,2
+					c0.3,0.7,0.6,1.3,1,1.8c0.8,0.8,1.6,1,2.4,0.4c0.5-0.4,1.2-1.3,1.9-2.7c0.9-1.7,1.3-3,1.4-3.9c0.1-1.4-0.1-2.3-0.7-2.7
+					c-0.6-0.4-1.6-0.6-3.1-0.4c0.3-0.9,0.7-1.7,1.2-2.5c0.5-0.8,1.1-1.4,1.6-1.9c0.6-0.5,1.2-0.9,1.8-1.3c0.6-0.4,1.1-0.7,1.6-0.8
+					c0.4-0.2,0.8-0.3,1.1-0.3c2.5-0.4,4.2,0,5.1,1.2c0.7,0.9,0.9,2.1,0.6,3.6c-0.3,1.3-1,3.4-2.3,6.2c-1.2,2.8-2.8,5.5-4.7,8
+					c-2.2,2.9-4.4,5.1-6.8,6.5c-0.6,0.4-1.3,0.7-2.1,0.9c-0.8,0.2-1.5,0.2-2.3,0c-1.1-0.5-2-1.6-2.8-3.4c-0.4-0.9-0.9-2.7-1.6-5.4
+					c-0.7-2.6-1.1-4.3-1.4-5.1c-0.1-0.2-0.2-0.6-0.3-1.1c-0.1-0.5-0.3-0.9-0.4-1.3c-0.1-0.4-0.3-0.7-0.5-1.1
+					c-0.3-0.5-0.7-0.8-1.1-0.8c-0.4,0-1,0.1-1.6,0.3c-0.6,0.2-1.1,0.3-1.5,0.2c-0.2,0-0.4-0.2-0.6-0.5c-0.2-0.3-0.4-0.6-0.7-0.7
+					L4.1,14L4.1,14L4.1,14z"/>
+			</g>
+		</g>
+	</g>
+</g>
+</svg>

themes/ayon/_dev/img/youtube.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-youtube"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"></path><polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon></svg>

themes/ayon/_dev/js/cart.js

@@ -0,0 +1,343 @@
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+prestashop.cart = prestashop.cart || {};
+
+prestashop.cart.active_inputs = null;
+
+let spinnerSelector = 'input[name="product-quantity-spin"]';
+let hasError = false;
+let isUpdateOperation = false;
+let errorMsg = '';
+
+/**
+ * Attach Bootstrap TouchSpin event handlers
+ */
+function createSpin()
+{
+  $.each($(spinnerSelector), function (index, spinner) {
+     $(spinner).TouchSpin({
+      verticalbuttons: false,
+      verticalupclass: 'material-icons touchspin-up',
+      verticaldownclass: 'material-icons touchspin-down',
+      buttondown_class: 'btn btn-touchspin js-touchspin js-increase-product-quantity',
+      buttonup_class: 'btn btn-touchspin js-touchspin js-decrease-product-quantity',
+      min: parseInt($(spinner).attr('min'), 10),
+      max: 1000000
+    });
+  });
+
+  CheckUpdateQuantityOperations.switchErrorStat();
+}
+
+
+$(document).ready(() => {
+  let productLineInCartSelector = '.js-cart-line-product-quantity';
+  let promises = [];
+
+  prestashop.on('updateCart', () => {
+    $('.quickview').modal('hide');
+  });
+
+  prestashop.on('updatedCart', () => {
+    createSpin();
+    
+    $('#header .row.action .blockcart a').click(function(e) {
+      e.preventDefault();
+      $('body').addClass('side_open')
+      $('.side_menu .side_menu_rel > div').removeClass('show');
+      $('#side_cart_wrap').addClass('show');
+      $('.side_close').removeClass('search_close menu_close').addClass('cart_close');
+      $('.side_menu').find('.cart-prods > li').each(function(i){
+        var row = $(this);
+        setTimeout(function(){
+          row.addClass('show');
+        }, 300 + i * 160);
+      });
+    });
+
+  });
+
+  createSpin();
+
+  let $body = $('body');
+
+  function isTouchSpin(namespace) {
+    return namespace === 'on.startupspin' || namespace === 'on.startdownspin';
+  }
+
+  function shouldIncreaseProductQuantity(namespace) {
+    return namespace === 'on.startupspin';
+  }
+
+  function findCartLineProductQuantityInput($target) {
+    var $input = $target.parents('.bootstrap-touchspin').find(productLineInCartSelector);
+
+    if ($input.is(':focus')) {
+      return null;
+    } else {
+      return $input;
+    }
+  }
+
+  function camelize(subject) {
+    let actionTypeParts = subject.split('-');
+    let i;
+    let part;
+    let camelizedSubject = '';
+
+    for (i = 0; i < actionTypeParts.length; i++) {
+      part = actionTypeParts[i];
+
+      if (0 !== i) {
+        part = part.substring(0, 1).toUpperCase() + part.substring(1);
+      }
+
+      camelizedSubject = camelizedSubject + part;
+    }
+
+    return camelizedSubject;
+  }
+
+  function parseCartAction($target, namespace) {
+    if (!isTouchSpin(namespace)) {
+      return {
+        url: $target.attr('href'),
+        type: camelize($target.data('link-action'))
+      }
+    }
+
+    let $input = findCartLineProductQuantityInput($target);
+    if (!$input) {
+      return;
+    }
+
+    let cartAction = {};
+    if (shouldIncreaseProductQuantity(namespace)) {
+      cartAction = {
+        url: $input.data('up-url'),
+        type: 'increaseProductQuantity'
+      };
+    } else {
+      cartAction = {
+        url: $input.data('down-url'),
+        type: 'decreaseProductQuantity'
+      }
+    }
+
+    return cartAction;
+  }
+
+  let abortPreviousRequests = () => {
+    var promise;
+    while (promises.length > 0) {
+      promise = promises.pop();
+      promise.abort();
+    }
+  };
+
+  var getTouchSpinInput = ($button) => {
+    return $($button.parents('.bootstrap-touchspin').find('input'));
+  };
+
+  var handleCartAction = (event) => {
+    event.preventDefault();
+
+    let $target = $(event.currentTarget);
+    let dataset = event.currentTarget.dataset;
+
+    let cartAction = parseCartAction($target, event.namespace);
+    let requestData = {
+      ajax: '1',
+      action: 'update'
+    };
+
+    if (typeof cartAction === 'undefined') {
+      return;
+    }
+
+    abortPreviousRequests();
+    $.ajax({
+      url: cartAction.url,
+      method: 'POST',
+      data: requestData,
+      dataType: 'json',
+      beforeSend: function (jqXHR) {
+        promises.push(jqXHR);
+      }
+    }).then(function (resp) {
+      CheckUpdateQuantityOperations.checkUpdateOpertation(resp);
+      var $quantityInput = getTouchSpinInput($target);
+      $quantityInput.val(resp.quantity);
+
+      // Refresh cart preview
+      prestashop.emit('updateCart', {
+        reason: dataset
+      });
+    }).fail((resp) => {
+      prestashop.emit('handleError', {
+        eventType: 'updateProductInCart',
+        resp: resp,
+        cartAction: cartAction.type
+      });
+    });
+
+  };
+
+  $body.on(
+    'click',
+    '[data-link-action="delete-from-cart"], [data-link-action="remove-voucher"]',
+    handleCartAction
+  );
+
+  $body.on('touchspin.on.startdownspin', spinnerSelector, handleCartAction);
+  $body.on('touchspin.on.startupspin', spinnerSelector, handleCartAction);
+
+  function sendUpdateQuantityInCartRequest(updateQuantityInCartUrl, requestData, $target) {
+    abortPreviousRequests();
+
+    return $.ajax({
+      url: updateQuantityInCartUrl,
+      method: 'POST',
+      data: requestData,
+      dataType: 'json',
+      beforeSend: function (jqXHR) {
+        promises.push(jqXHR);
+      }
+    }).then(function (resp) {
+      CheckUpdateQuantityOperations.checkUpdateOpertation(resp);
+      $target.val(resp.quantity);
+
+      var dataset;
+      if ($target && $target.dataset) {
+        dataset = $target.dataset;
+      } else {
+        dataset = resp;
+      }
+
+
+      // Refresh cart preview
+      prestashop.emit('updateCart', {
+        reason: dataset
+      });
+    }).fail((resp) => {
+      prestashop.emit('handleError', {eventType: 'updateProductQuantityInCart', resp: resp})
+    });
+  }
+
+  function getRequestData(quantity) {
+    return {
+      ajax: '1',
+      qty: Math.abs(quantity),
+      action: 'update',
+      op: getQuantityChangeType(quantity)
+    }
+  }
+
+  function getQuantityChangeType($quantity) {
+    return ($quantity > 0) ? 'up' : 'down';
+  }
+
+  function updateProductQuantityInCart(event)
+  {
+    let $target = $(event.currentTarget);
+    let updateQuantityInCartUrl = $target.data('update-url');
+    let baseValue = $target.attr('value');
+
+    // There should be a valid product quantity in cart
+    let targetValue = $target.val();
+    if (targetValue != parseInt(targetValue) || targetValue < 0 || isNaN(targetValue)) {
+      $target.val(baseValue);
+
+      return;
+    }
+
+    // There should be a new product quantity in cart
+    let qty = targetValue - baseValue;
+    if (qty == 0) {
+      return;
+    }
+
+    var requestData = getRequestData(qty);
+
+    sendUpdateQuantityInCartRequest(updateQuantityInCartUrl, requestData, $target);
+  }
+
+  $body.on(
+    'focusout',
+    productLineInCartSelector,
+    (event) => {
+      updateProductQuantityInCart(event);
+    }
+  );
+
+  $body.on(
+    'keyup',
+    productLineInCartSelector,
+    (event) => {
+      if (event.keyCode == 13) {
+        updateProductQuantityInCart(event);
+      }
+    }
+  );
+
+  $body.on(
+    'click',
+    '.js-discount .code',
+    (event) => {
+      event.stopPropagation();
+
+      var $code = $(event.currentTarget);
+      var $discountInput = $('[name=discount_name]');
+
+      $discountInput.val($code.text());
+
+      return false;
+    }
+  )
+});
+
+
+const CheckUpdateQuantityOperations = {
+  'switchErrorStat': () => {
+    /*
+    if errorMsg is not empty or if notifications are shown, we have error to display
+    if hasError is true, quantity was not updated : we don't disable checkout button
+     */
+    let $checkoutBtn = $('.checkout a');
+    if ($("#notifications article.alert-danger").length || ('' !== errorMsg && !hasError)) {
+      $checkoutBtn.addClass('disabled');
+    }
+
+    if ('' !== errorMsg) {
+      let strError = ' <article class="alert alert-danger" role="alert" data-alert="danger"><ul><li>' + errorMsg + '</li></ul></article>';
+      $('#notifications .container').html(strError);
+      errorMsg = '';
+      isUpdateOperation = false;
+      if (hasError) {
+        // if hasError is true, quantity was not updated : allow checkout
+        $checkoutBtn.removeClass('disabled');
+      }
+    } else if (!hasError && isUpdateOperation) {
+      hasError = false;
+      isUpdateOperation = false;
+      $('#notifications .container').html('');
+      $checkoutBtn.removeClass('disabled');
+    }
+  },
+  'checkUpdateOpertation': (resp) => {
+    /*
+    resp.hasError can be not defined but resp.errors not empty: quantity is updated but order cannot be placed
+    when resp.hasError=true, quantity is not updated
+     */
+    hasError = resp.hasOwnProperty('hasError');
+    let errors = resp.errors || "";
+    // 1.7.2.x returns errors as string, 1.7.3.x returns array
+    if (errors instanceof Array) {
+      errorMsg = errors.join(" ");
+    } else {
+      errorMsg = errors;
+    }
+    isUpdateOperation = true;
+  }
+};

themes/ayon/_dev/js/checkout.js

@@ -0,0 +1,76 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+function setUpCheckout() {
+  if ($('.js-cancel-address').length !== 0) {
+    $('.checkout-step:not(.js-current-step) .step-title').addClass('not-allowed');
+  }
+
+  $('.js-terms a').on('click', (event) => {
+    event.preventDefault();
+    var url = $(event.target).attr('href');
+    if (url) {
+      // TODO: Handle request if no pretty URL
+      url += `?content_only=1`;
+      $.get(url, (content) => {
+        $('#modal').find('.js-modal-content').html($(content).find('.page-cms').contents());
+      }).fail((resp) => {
+        prestashop.emit('handleError', {eventType: 'clickTerms', resp: resp});
+      });
+    }
+
+    $('#modal').modal('show');
+  });
+
+  $('.js-gift-checkbox').on('click', (event) => {
+    $('#gift').collapse('toggle');
+  });
+}
+
+$(document).ready(() => {
+  if ($('body#checkout').length === 1) {
+    setUpCheckout();
+  }
+
+  prestashop.on('updatedDeliveryForm', (params) => {
+    if (typeof params.deliveryOption === 'undefined' || 0 === params.deliveryOption.length) {
+        return;
+    }
+    // Hide all carrier extra content ...
+    $(".carrier-extra-content").hide();
+    // and show the one related to the selected carrier
+    params.deliveryOption.next(".carrier-extra-content").slideDown();
+    // active delivery
+    $('.delivery-option').removeClass('active');
+    params.deliveryOption.addClass('active');
+  });
+
+  if($('.delivery-option input:radio:checked').length > 0){
+    $('.delivery-option input:radio:checked').parents('div.delivery-option').addClass('active');
+  }
+
+});

themes/ayon/_dev/js/components/block-cart.js

@@ -0,0 +1,49 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import prestashop from 'prestashop';
+import $ from 'jquery';
+
+prestashop.blockcart = prestashop.blockcart || {};
+
+prestashop.blockcart.showModal = (html) => {
+  function getBlockCartModal() {
+    return $('#blockcart-modal');
+  }
+
+  let $blockCartModal = getBlockCartModal();
+  if ($blockCartModal.length){
+    $blockCartModal.remove();
+  }
+
+  $('body').append(html);
+
+  $blockCartModal = getBlockCartModal();
+  $blockCartModal.modal('show').on('hidden.bs.modal', (event) => {
+    prestashop.emit('updateProduct', {
+      reason: event.currentTarget.dataset
+    });
+  });
+};
+

themes/ayon/_dev/js/components/drop-down.js

@@ -0,0 +1,54 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+
+export default class DropDown {
+  constructor(el) {
+    this.el = el;
+  }
+  init() {
+    this.el.on('show.bs.dropdown', function(e, el) {
+      if (el) {
+        $(`#${el}`).find('.dropdown-menu').first().stop(true, true).slideDown();
+      } else {
+        $(e.target).find('.dropdown-menu').first().stop(true, true).slideDown();
+      }
+    });
+
+    this.el.on('hide.bs.dropdown', function(e, el) {
+      if (el) {
+        $(`#${el}`).find('.dropdown-menu').first().stop(true, true).slideUp();
+      } else {
+        $(e.target).find('.dropdown-menu').first().stop(true, true).slideUp();
+      }
+    });
+
+    this.el.find('select.link').each(function(idx, el) {
+      $(el).on('change', function(event) {
+        window.location = $(this).val();
+      });
+    });
+  }
+}

themes/ayon/_dev/js/components/form.js

@@ -0,0 +1,55 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+
+export default class Form {
+  init() {
+    this.parentFocus();
+    this.togglePasswordVisibility();
+  }
+
+  parentFocus() {
+    $('.js-child-focus').focus(function () {
+      $(this).closest('.js-parent-focus').addClass('focus');
+    });
+    $('.js-child-focus').focusout(function () {
+      $(this).closest('.js-parent-focus').removeClass('focus');
+    });
+  }
+
+  togglePasswordVisibility() {
+    $('button[data-action="show-password"]').on('click', function () {
+        const elm = $(this).closest('.input-group').children('input.js-visible-password');
+        
+      if (elm.attr('type') === 'password') {
+        elm.attr('type', 'text');
+        $(this).html('<i><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg></i>');
+      } else {
+        elm.attr('type', 'password');
+        $(this).html('<i><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye-off"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg></i>');
+      }
+    });
+  }
+}

themes/ayon/_dev/js/components/product-miniature.js

@@ -0,0 +1,49 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+
+export default class ProductMinitature {
+  init(){
+    $('.js-product-miniature').each((index, element) => {
+      const FLAG_MARGIN = 10;
+      let $discount = $(element).find('.discount-product');
+      let $onsale =  $(element).find('.on-sale');
+      let $new = $(element).find('.new');
+      // if($onsale.length){
+      //   $new.css('top', ($onsale.height() * 2 + 12));
+      // }
+      if($(element).find('.color').length > 5){
+        let count = 0;
+        $(element).find('.color').each((index, element) =>{
+          if(index > 4){
+            $(element).hide();
+            count ++;
+          }
+        });
+        $(element).find('.js-count').append(`+${count}`);
+      }
+    });
+  }
+}

themes/ayon/_dev/js/components/product-select.js

@@ -0,0 +1,84 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import 'velocity-animate';
+
+export default class ProductSelect {
+  init() {
+    const MAX_THUMBS = 5;
+    const FLAG_MARGIN = 10;
+    let $arrows =   $('.js-modal-arrows');
+    let $thumbnails = $('.js-modal-product-images');
+    let $onsale =  $('.on-sale');
+
+    $('body').on('click','.js-modal-thumb', (event) => {
+      if($('.js-modal-thumb').hasClass('selected')){
+        $('.js-modal-thumb').removeClass('selected');
+      }
+      $(event.currentTarget).addClass('selected');
+      $('.js-modal-product-cover').attr('src', $(event.target).data('image-large-src'));
+      $('.js-modal-product-cover').attr('title', $(event.target).attr('title'));
+      $('.js-modal-product-cover').attr('alt', $(event.target).attr('alt'));
+    })
+    .on('click', 'aside#thumbnails', (event) => {
+      if (event.target.id == 'thumbnails'){
+        $('#product-modal').modal('hide');
+      }
+    });
+
+    // if($onsale.length && $('#product').length){
+    //   $('.new').css('top',$onsale.height() + FLAG_MARGIN);
+    // }
+    if ($('.js-modal-product-images li').length <= MAX_THUMBS) {
+      $arrows.css('opacity', '.2');
+    } else {
+      $arrows.on('click', (event) => {
+        if ($(event.target).hasClass('arrow-up') && $thumbnails.position().top < 0) {
+          this.move('up');
+          $('.js-modal-arrow-down').css('opacity','1');
+        } else if ($(event.target).hasClass('arrow-down') && $thumbnails.position().top + $thumbnails.height() >  $('.js-modal-mask').height()) {
+          this.move('down');
+          $('.js-modal-arrow-up').css('opacity','1');
+        }
+      });
+    }
+  }
+
+  move(direction) {
+    const THUMB_MARGIN = 10;
+    var $thumbnails = $('.js-modal-product-images');
+    var thumbHeight = $('.js-modal-product-images li img').height() + THUMB_MARGIN;
+    var currentPosition = $thumbnails.position().top;
+    $thumbnails.velocity({
+      translateY: (direction === 'up') ? currentPosition + thumbHeight : currentPosition - thumbHeight
+    },function(){
+      if ($thumbnails.position().top >= 0) {
+        $('.js-modal-arrow-up').css('opacity','.2');
+      } else if ($thumbnails.position().top + $thumbnails.height() <=  $('.js-modal-mask').height()) {
+        $('.js-modal-arrow-down').css('opacity','.2');
+      }
+    });
+  }
+}

themes/ayon/_dev/js/components/top-menu.js

@@ -0,0 +1,92 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import DropDown from './drop-down';
+
+export default class TopMenu extends DropDown {
+  init() {
+    let elmId;
+    let self = this;
+    this.el.find('li').hover((e) => {
+      if (this.el.parent().hasClass('mobile')) {
+        return;
+      }
+      if (elmId !== $(e.currentTarget).attr('id')) {
+        if ($(e.target).data('depth') === 0) {
+          $(`#${elmId} .js-sub-menu`).css({
+            'top': '78px',
+            'visibility': 'hidden',
+            'opacity':'0'
+          });
+        }
+        elmId = $(e.currentTarget).attr('id');
+      }
+      if (elmId && $(e.target).data('depth') === 0) {
+        $(`#${elmId} .js-sub-menu`).css({
+          'top': '68px',
+          'visibility': 'visible',
+          'opacity':'1'
+        });
+      }
+    });
+    $('#menu-icon').on('click', function() {
+      $('#mobile_top_menu_wrapper').toggle();
+      self.toggleMobileMenu();
+    });
+    $('.js-top-menu').mouseleave(() => {
+      if (this.el.parent().hasClass('mobile')) {
+        return;
+      }
+      $(`#${elmId} .js-sub-menu`).css({
+        'top': '78px',
+        'visibility': 'hidden',
+        'opacity':'0'
+      });
+    });
+    this.el.on('click', (e) => {
+      if (this.el.parent().hasClass('mobile')) {
+        return;
+      }
+      e.stopPropagation();
+    });
+    prestashop.on('responsive update', function(event) {
+      $('.js-sub-menu').removeAttr('style');
+      self.toggleMobileMenu();
+    });
+    super.init();
+  }
+
+  toggleMobileMenu() {
+      if ($('#mobile_top_menu_wrapper').is(":visible")) {
+        $('#notifications').hide();
+        $('#wrapper').hide();
+        $('#footer').hide();
+      } else {
+        $('#notifications').show();
+        $('#wrapper').show();
+        $('#footer').show();
+      }
+  }
+}

themes/ayon/_dev/js/county.js

@@ -0,0 +1,262 @@
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+!function($){
+	"use strict";
+
+	var County = function(arg, options){
+		this.init(arg, options);
+	};
+
+	County.prototype = {
+		constructor: County,
+
+		init: function(arg, options){
+			this.settings = $.extend({ endDateTime: new Date(), animation: 'fade', reflection: false, reflectionOpacity: 0.2, speed: 500, theme: 'black' }, options);
+			this.timeoutInterval = null;
+			this.container = $(arg);
+
+			this.createViews();
+		},
+
+		createViews: function() {
+			var self = this;
+			if (!this.container.hasClass('county')) {
+				this.container.addClass('county ' + this.settings.theme);
+	            this.container.append('<div class="county-cell county-days-wrapper first"><span class="county-days">000</span><span class="county-label county-label-days">' + this.settings.titleDays + '</span></div><div class="county-cell county-hours-wrapper"><span class="county-hours">00</span><span class="county-label county-label-hours">' + this.settings.titleHours + '</span></div><div class="county-cell county-minutes-wrapper separator-left separator-left"><span class="county-minutes">00</span><span class="county-label county-label-minutes">' + this.settings.titleMinutes + '</span></div><div class="county-cell county-seconds-wrapper separator-left last"><span class="county-seconds">00</span><span class="county-label county-label-seconds">' + this.settings.titleSeconds + '</span></div>');
+            }
+            if (this.container.attr('id') == undefined || this.container.attr('id') == null) {
+                this.container.attr('id', Math.random());
+            }
+            var w = 0;
+            this.container.find('>span').each(function () {
+                if ($(this).hasClass('county-days-wrapper') ||
+                $(this).hasClass('county-hours-wrapper') ||
+                $(this).hasClass('county-minutes-wrapper') ||
+                $(this).hasClass('county-seconds-wrapper'))
+                    w += $(this).outerWidth();
+            });
+
+            this.container.css({ width: w });
+
+            this.container.find('>span>span').each(function () {
+
+                $(this).css({ position: 'absolute', width: $(this).width(), height: $(this).height() });
+                $(this).parent().css({ width: $(this).width() });
+                var daysLabel = self.container.find('.county-label-days');
+                var hoursLabel = self.container.find('.county-label-hours');
+                var minutesLabel = self.container.find('.county-label-minutes');
+                var secondsLabel = self.container.find('.county-label-seconds');
+                if ($(this).hasClass('county-days')) {
+                    daysLabel.css({ width: $(this).parent().outerWidth() });
+                }
+                if ($(this).hasClass('county-hours')) {
+                    hoursLabel.css({ width: $(this).parent().outerWidth() });
+                }
+                if ($(this).hasClass('county-minutes')) {
+                    minutesLabel.css({ width: $(this).parent().outerWidth() });
+                }
+                if ($(this).hasClass('county-seconds')) {
+                    secondsLabel.css({ width: $(this).parent().outerWidth() });
+                }
+            });
+
+            this.reflectionContainer = this.container.clone().css({ opacity: this.settings.reflectionOpacity }).attr('id', this.container.attr('id') + '-refl').addClass('county-reflection');
+            if (this.settings.reflection)
+                this.container.after(this.reflectionContainer);
+
+            this.updateCounter();
+		},
+
+		getCountDown: function() {
+			var self = this;
+			clearTimeout(this.timeoutInterval);
+            this.timeoutInterval = setTimeout(function () {
+
+                self.updateCounter();
+
+            }, 1000);
+		},
+
+		updateCounter: function() {
+			var countDown = this.getCurrentCountDown();
+            var days = this.container.find('.county-days');
+            var hours = this.container.find('.county-hours');
+            var minutes = this.container.find('.county-minutes');
+            var seconds = this.container.find('.county-seconds');
+
+            var dayVal = days.html();
+            var hourVal = hours.html();
+            var minuteVal = minutes.html();
+            var secondVal = seconds.html();
+
+            if (dayVal == countDown.days) {
+                days.html(countDown.days);
+            }
+            else {
+                if (this.settings.reflection)
+                    this.aimateObject(days, this.reflectionContainer.find('.county-days'), dayVal, countDown.days, this.settings.animation);
+                else
+                    this.aimateObject(days, null, dayVal, countDown.days, this.settings.animation);
+            }
+
+            if (hourVal == countDown.hours)
+                hours.html(countDown.hours);
+            else {
+                if (this.settings.reflection)
+                    this.aimateObject(hours, this.reflectionContainer.find('.county-hours'), hourVal, countDown.hours, this.settings.animation);
+                else
+                    this.aimateObject(hours, null, hourVal, countDown.hours, this.settings.animation);
+            }
+
+            if (minuteVal == countDown.minutes)
+                minutes.html(countDown.minutes);
+            else {
+                if (this.settings.reflection)
+                    this.aimateObject(minutes, this.reflectionContainer.find('.county-minutes'), minuteVal, countDown.minutes, this.settings.animation);
+                else
+                    this.aimateObject(minutes, null, minuteVal, countDown.minutes, this.settings.animation);
+            }
+            if (secondVal == countDown.seconds)
+                seconds.html(countDown.seconds);
+            else {
+                if (this.settings.reflection)
+                    this.aimateObject(seconds, this.reflectionContainer.find('.county-seconds'), secondVal, countDown.seconds, this.settings.animation);
+                else
+                    this.aimateObject(seconds, null, secondVal, countDown.seconds, this.settings.animation);
+            }
+
+            this.getCountDown();
+		},
+
+		aimateObject: function(element, reflectionElement, oldValue, newValue, type) {
+
+		if (type == 'fade') {
+                element.fadeOut('fast').fadeIn('fast').html(newValue);
+                if (this.settings.reflection)
+                    this.reflectionElement.fadeOut('fast').fadeIn('fast').html(newValue);
+            }
+            else if (type == 'none') {
+                element.html(newValue);
+            }
+            else if (type == 'scroll') {
+                var copy = element.clone();
+                var reflectionCopy = null;
+
+                if (this.settings.reflection)
+                    reflectionCopy = reflectionElement.clone();
+
+                var marginTop = copy.outerHeight();
+
+                copy.css({ marginTop: -marginTop });
+                copy.html(newValue);
+                copy.prependTo(element.parent());
+
+                if (this.settings.reflection) {
+                    reflectionCopy.css({ marginTop: -marginTop });
+                    reflectionCopy.html(newValue);
+                    reflectionCopy.prependTo(this.reflectionElement.parent());
+                }
+
+                element.animate({ marginTop: "22px", opacity: 0 }, this.settings.speed, function () { $(this).remove(); });
+                copy.animate({ marginTop: 0 }, this.settings.speed, function () { });
+
+                if (this.settings.reflection) {
+                    this.reflectionElement.animate({ marginTop: marginTop }, this.settings.speed, function () { $(this).remove(); });
+                    reflectionCopy.animate({ marginTop: 0 }, this.settings.speed, function () { });
+                }
+
+            }
+		},
+
+		getCurrentCountDown: function() {
+			var currentDateTime = new Date();
+
+            var diff = parseFloat(this.settings.endDateTime - currentDateTime);
+			var self = this;
+
+            var seconds = 0;
+            var minutes = 0;
+            var hours = 0;
+            var total = parseFloat(((((diff / 1000.0) / 60.0) / 60.0) / 24.0));
+
+            var days = parseInt(total);
+
+            total -= days;
+
+            total *= 24.0;
+
+            hours = parseInt(total);
+
+            total -= hours;
+
+            total *= 60.0;
+
+            minutes = parseInt(total);
+
+            total -= minutes;
+
+            total *= 60;
+
+            seconds = parseInt(total);
+
+            return { days: self.formatNumber(Math.max(0, days), true), hours: self.formatNumber(Math.max(0, hours), false), minutes: self.formatNumber(Math.max(0, minutes), false), seconds: self.formatNumber(Math.max(0, seconds), false) };
+
+		},
+
+		formatNumber: function(number, isday) {
+			var strNumber = number.toString();
+            if (!isday) {
+                if (strNumber.length == 1)
+                    return '0' + strNumber;
+                else
+                    return strNumber;
+            }
+            else {
+                if (strNumber.length == 1)
+                    return strNumber;
+                else if (strNumber == 2)
+                    return strNumber;
+                else
+                    return strNumber;
+            }
+		},
+
+		getHunderth: function(number) {
+			var strNumber = '' + number;
+
+            if (strNumber.length == 3)
+                return strNumber.substr(0, 1);
+            else
+                return '0';
+		},
+
+		getTenth: function(number) {
+			var strNumber = '' + number;
+
+            if (strNumber.length == 2)
+                return strNumber.substr(0, 1);
+            else
+                return '0';
+		},
+
+		getUnit: function(number) {
+            var strNumber = '' + number;
+
+            if (strNumber.length >= 1)
+                return strNumber.substr(0, 1);
+            else
+                return '0';
+		}
+	}
+
+	$.fn.county = function (option, params) {
+        var $this = $(this);
+        var data = $this.data('list');
+        if (!data) {$this.data('list', (data = new County(this, option)));}
+        if (typeof option === 'string'){ return data[option](params);}
+	};
+
+	$.fn.county.Constructor = County;
+
+}(window.jQuery);

themes/ayon/_dev/js/customer.js

@@ -0,0 +1,42 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+
+function initRmaItemSelector() {
+  $('#order-return-form table thead input[type=checkbox]').on('click', function() {
+    var checked = $(this).prop('checked');
+    $('#order-return-form table tbody input[type=checkbox]').each(function(_, checkbox) {
+      $(checkbox).prop('checked', checked);
+    });
+  });
+}
+
+function setupCustomerScripts() {
+  if ($('body#order-detail')) {
+    initRmaItemSelector();
+  }
+}
+
+$(document).ready(setupCustomerScripts);

themes/ayon/_dev/js/lib/anime.min.js

@@ -0,0 +1,33 @@
+/*
+ 2017 Julian Garnier
+ Released under the MIT license
+*/
+var $jscomp={scope:{}};$jscomp.defineProperty="function"==typeof Object.defineProperties?Object.defineProperty:function(e,r,p){if(p.get||p.set)throw new TypeError("ES3 does not support getters and setters.");e!=Array.prototype&&e!=Object.prototype&&(e[r]=p.value)};$jscomp.getGlobal=function(e){return"undefined"!=typeof window&&window===e?e:"undefined"!=typeof global&&null!=global?global:e};$jscomp.global=$jscomp.getGlobal(this);$jscomp.SYMBOL_PREFIX="jscomp_symbol_";
+$jscomp.initSymbol=function(){$jscomp.initSymbol=function(){};$jscomp.global.Symbol||($jscomp.global.Symbol=$jscomp.Symbol)};$jscomp.symbolCounter_=0;$jscomp.Symbol=function(e){return $jscomp.SYMBOL_PREFIX+(e||"")+$jscomp.symbolCounter_++};
+$jscomp.initSymbolIterator=function(){$jscomp.initSymbol();var e=$jscomp.global.Symbol.iterator;e||(e=$jscomp.global.Symbol.iterator=$jscomp.global.Symbol("iterator"));"function"!=typeof Array.prototype[e]&&$jscomp.defineProperty(Array.prototype,e,{configurable:!0,writable:!0,value:function(){return $jscomp.arrayIterator(this)}});$jscomp.initSymbolIterator=function(){}};$jscomp.arrayIterator=function(e){var r=0;return $jscomp.iteratorPrototype(function(){return r<e.length?{done:!1,value:e[r++]}:{done:!0}})};
+$jscomp.iteratorPrototype=function(e){$jscomp.initSymbolIterator();e={next:e};e[$jscomp.global.Symbol.iterator]=function(){return this};return e};$jscomp.array=$jscomp.array||{};$jscomp.iteratorFromArray=function(e,r){$jscomp.initSymbolIterator();e instanceof String&&(e+="");var p=0,m={next:function(){if(p<e.length){var u=p++;return{value:r(u,e[u]),done:!1}}m.next=function(){return{done:!0,value:void 0}};return m.next()}};m[Symbol.iterator]=function(){return m};return m};
+$jscomp.polyfill=function(e,r,p,m){if(r){p=$jscomp.global;e=e.split(".");for(m=0;m<e.length-1;m++){var u=e[m];u in p||(p[u]={});p=p[u]}e=e[e.length-1];m=p[e];r=r(m);r!=m&&null!=r&&$jscomp.defineProperty(p,e,{configurable:!0,writable:!0,value:r})}};$jscomp.polyfill("Array.prototype.keys",function(e){return e?e:function(){return $jscomp.iteratorFromArray(this,function(e){return e})}},"es6-impl","es3");var $jscomp$this=this;
+(function(e,r){"function"===typeof define&&define.amd?define([],r):"object"===typeof module&&module.exports?module.exports=r():e.anime=r()})(this,function(){function e(a){if(!h.col(a))try{return document.querySelectorAll(a)}catch(c){}}function r(a,c){for(var d=a.length,b=2<=arguments.length?arguments[1]:void 0,f=[],n=0;n<d;n++)if(n in a){var k=a[n];c.call(b,k,n,a)&&f.push(k)}return f}function p(a){return a.reduce(function(a,d){return a.concat(h.arr(d)?p(d):d)},[])}function m(a){if(h.arr(a))return a;
+h.str(a)&&(a=e(a)||a);return a instanceof NodeList||a instanceof HTMLCollection?[].slice.call(a):[a]}function u(a,c){return a.some(function(a){return a===c})}function C(a){var c={},d;for(d in a)c[d]=a[d];return c}function D(a,c){var d=C(a),b;for(b in a)d[b]=c.hasOwnProperty(b)?c[b]:a[b];return d}function z(a,c){var d=C(a),b;for(b in c)d[b]=h.und(a[b])?c[b]:a[b];return d}function T(a){a=a.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(a,c,d,k){return c+c+d+d+k+k});var c=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(a);
+a=parseInt(c[1],16);var d=parseInt(c[2],16),c=parseInt(c[3],16);return"rgba("+a+","+d+","+c+",1)"}function U(a){function c(a,c,b){0>b&&(b+=1);1<b&&--b;return b<1/6?a+6*(c-a)*b:.5>b?c:b<2/3?a+(c-a)*(2/3-b)*6:a}var d=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(a)||/hsla\((\d+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)/g.exec(a);a=parseInt(d[1])/360;var b=parseInt(d[2])/100,f=parseInt(d[3])/100,d=d[4]||1;if(0==b)f=b=a=f;else{var n=.5>f?f*(1+b):f+b-f*b,k=2*f-n,f=c(k,n,a+1/3),b=c(k,n,a);a=c(k,n,a-1/3)}return"rgba("+
+255*f+","+255*b+","+255*a+","+d+")"}function y(a){if(a=/([\+\-]?[0-9#\.]+)(%|px|pt|em|rem|in|cm|mm|ex|ch|pc|vw|vh|vmin|vmax|deg|rad|turn)?$/.exec(a))return a[2]}function V(a){if(-1<a.indexOf("translate")||"perspective"===a)return"px";if(-1<a.indexOf("rotate")||-1<a.indexOf("skew"))return"deg"}function I(a,c){return h.fnc(a)?a(c.target,c.id,c.total):a}function E(a,c){if(c in a.style)return getComputedStyle(a).getPropertyValue(c.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase())||"0"}function J(a,c){if(h.dom(a)&&
+u(W,c))return"transform";if(h.dom(a)&&(a.getAttribute(c)||h.svg(a)&&a[c]))return"attribute";if(h.dom(a)&&"transform"!==c&&E(a,c))return"css";if(null!=a[c])return"object"}function X(a,c){var d=V(c),d=-1<c.indexOf("scale")?1:0+d;a=a.style.transform;if(!a)return d;for(var b=[],f=[],n=[],k=/(\w+)\((.+?)\)/g;b=k.exec(a);)f.push(b[1]),n.push(b[2]);a=r(n,function(a,b){return f[b]===c});return a.length?a[0]:d}function K(a,c){switch(J(a,c)){case "transform":return X(a,c);case "css":return E(a,c);case "attribute":return a.getAttribute(c)}return a[c]||
+0}function L(a,c){var d=/^(\*=|\+=|-=)/.exec(a);if(!d)return a;var b=y(a)||0;c=parseFloat(c);a=parseFloat(a.replace(d[0],""));switch(d[0][0]){case "+":return c+a+b;case "-":return c-a+b;case "*":return c*a+b}}function F(a,c){return Math.sqrt(Math.pow(c.x-a.x,2)+Math.pow(c.y-a.y,2))}function M(a){a=a.points;for(var c=0,d,b=0;b<a.numberOfItems;b++){var f=a.getItem(b);0<b&&(c+=F(d,f));d=f}return c}function N(a){if(a.getTotalLength)return a.getTotalLength();switch(a.tagName.toLowerCase()){case "circle":return 2*
+Math.PI*a.getAttribute("r");case "rect":return 2*a.getAttribute("width")+2*a.getAttribute("height");case "line":return F({x:a.getAttribute("x1"),y:a.getAttribute("y1")},{x:a.getAttribute("x2"),y:a.getAttribute("y2")});case "polyline":return M(a);case "polygon":var c=a.points;return M(a)+F(c.getItem(c.numberOfItems-1),c.getItem(0))}}function Y(a,c){function d(b){b=void 0===b?0:b;return a.el.getPointAtLength(1<=c+b?c+b:0)}var b=d(),f=d(-1),n=d(1);switch(a.property){case "x":return b.x;case "y":return b.y;
+case "angle":return 180*Math.atan2(n.y-f.y,n.x-f.x)/Math.PI}}function O(a,c){var d=/-?\d*\.?\d+/g,b;b=h.pth(a)?a.totalLength:a;if(h.col(b))if(h.rgb(b)){var f=/rgb\((\d+,\s*[\d]+,\s*[\d]+)\)/g.exec(b);b=f?"rgba("+f[1]+",1)":b}else b=h.hex(b)?T(b):h.hsl(b)?U(b):void 0;else f=(f=y(b))?b.substr(0,b.length-f.length):b,b=c&&!/\s/g.test(b)?f+c:f;b+="";return{original:b,numbers:b.match(d)?b.match(d).map(Number):[0],strings:h.str(a)||c?b.split(d):[]}}function P(a){a=a?p(h.arr(a)?a.map(m):m(a)):[];return r(a,
+function(a,d,b){return b.indexOf(a)===d})}function Z(a){var c=P(a);return c.map(function(a,b){return{target:a,id:b,total:c.length}})}function aa(a,c){var d=C(c);if(h.arr(a)){var b=a.length;2!==b||h.obj(a[0])?h.fnc(c.duration)||(d.duration=c.duration/b):a={value:a}}return m(a).map(function(a,b){b=b?0:c.delay;a=h.obj(a)&&!h.pth(a)?a:{value:a};h.und(a.delay)&&(a.delay=b);return a}).map(function(a){return z(a,d)})}function ba(a,c){var d={},b;for(b in a){var f=I(a[b],c);h.arr(f)&&(f=f.map(function(a){return I(a,
+c)}),1===f.length&&(f=f[0]));d[b]=f}d.duration=parseFloat(d.duration);d.delay=parseFloat(d.delay);return d}function ca(a){return h.arr(a)?A.apply(this,a):Q[a]}function da(a,c){var d;return a.tweens.map(function(b){b=ba(b,c);var f=b.value,e=K(c.target,a.name),k=d?d.to.original:e,k=h.arr(f)?f[0]:k,w=L(h.arr(f)?f[1]:f,k),e=y(w)||y(k)||y(e);b.from=O(k,e);b.to=O(w,e);b.start=d?d.end:a.offset;b.end=b.start+b.delay+b.duration;b.easing=ca(b.easing);b.elasticity=(1E3-Math.min(Math.max(b.elasticity,1),999))/
+1E3;b.isPath=h.pth(f);b.isColor=h.col(b.from.original);b.isColor&&(b.round=1);return d=b})}function ea(a,c){return r(p(a.map(function(a){return c.map(function(b){var c=J(a.target,b.name);if(c){var d=da(b,a);b={type:c,property:b.name,animatable:a,tweens:d,duration:d[d.length-1].end,delay:d[0].delay}}else b=void 0;return b})})),function(a){return!h.und(a)})}function R(a,c,d,b){var f="delay"===a;return c.length?(f?Math.min:Math.max).apply(Math,c.map(function(b){return b[a]})):f?b.delay:d.offset+b.delay+
+b.duration}function fa(a){var c=D(ga,a),d=D(S,a),b=Z(a.targets),f=[],e=z(c,d),k;for(k in a)e.hasOwnProperty(k)||"targets"===k||f.push({name:k,offset:e.offset,tweens:aa(a[k],d)});a=ea(b,f);return z(c,{children:[],animatables:b,animations:a,duration:R("duration",a,c,d),delay:R("delay",a,c,d)})}function q(a){function c(){return window.Promise&&new Promise(function(a){return p=a})}function d(a){return g.reversed?g.duration-a:a}function b(a){for(var b=0,c={},d=g.animations,f=d.length;b<f;){var e=d[b],
+k=e.animatable,h=e.tweens,n=h.length-1,l=h[n];n&&(l=r(h,function(b){return a<b.end})[0]||l);for(var h=Math.min(Math.max(a-l.start-l.delay,0),l.duration)/l.duration,w=isNaN(h)?1:l.easing(h,l.elasticity),h=l.to.strings,p=l.round,n=[],m=void 0,m=l.to.numbers.length,t=0;t<m;t++){var x=void 0,x=l.to.numbers[t],q=l.from.numbers[t],x=l.isPath?Y(l.value,w*x):q+w*(x-q);p&&(l.isColor&&2<t||(x=Math.round(x*p)/p));n.push(x)}if(l=h.length)for(m=h[0],w=0;w<l;w++)p=h[w+1],t=n[w],isNaN(t)||(m=p?m+(t+p):m+(t+" "));
+else m=n[0];ha[e.type](k.target,e.property,m,c,k.id);e.currentValue=m;b++}if(b=Object.keys(c).length)for(d=0;d<b;d++)H||(H=E(document.body,"transform")?"transform":"-webkit-transform"),g.animatables[d].target.style[H]=c[d].join(" ");g.currentTime=a;g.progress=a/g.duration*100}function f(a){if(g[a])g[a](g)}function e(){g.remaining&&!0!==g.remaining&&g.remaining--}function k(a){var k=g.duration,n=g.offset,w=n+g.delay,r=g.currentTime,x=g.reversed,q=d(a);if(g.children.length){var u=g.children,v=u.length;
+if(q>=g.currentTime)for(var G=0;G<v;G++)u[G].seek(q);else for(;v--;)u[v].seek(q)}if(q>=w||!k)g.began||(g.began=!0,f("begin")),f("run");if(q>n&&q<k)b(q);else if(q<=n&&0!==r&&(b(0),x&&e()),q>=k&&r!==k||!k)b(k),x||e();f("update");a>=k&&(g.remaining?(t=h,"alternate"===g.direction&&(g.reversed=!g.reversed)):(g.pause(),g.completed||(g.completed=!0,f("complete"),"Promise"in window&&(p(),m=c()))),l=0)}a=void 0===a?{}:a;var h,t,l=0,p=null,m=c(),g=fa(a);g.reset=function(){var a=g.direction,c=g.loop;g.currentTime=
+0;g.progress=0;g.paused=!0;g.began=!1;g.completed=!1;g.reversed="reverse"===a;g.remaining="alternate"===a&&1===c?2:c;b(0);for(a=g.children.length;a--;)g.children[a].reset()};g.tick=function(a){h=a;t||(t=h);k((l+h-t)*q.speed)};g.seek=function(a){k(d(a))};g.pause=function(){var a=v.indexOf(g);-1<a&&v.splice(a,1);g.paused=!0};g.play=function(){g.paused&&(g.paused=!1,t=0,l=d(g.currentTime),v.push(g),B||ia())};g.reverse=function(){g.reversed=!g.reversed;t=0;l=d(g.currentTime)};g.restart=function(){g.pause();
+g.reset();g.play()};g.finished=m;g.reset();g.autoplay&&g.play();return g}var ga={update:void 0,begin:void 0,run:void 0,complete:void 0,loop:1,direction:"normal",autoplay:!0,offset:0},S={duration:1E3,delay:0,easing:"easeOutElastic",elasticity:500,round:0},W="translateX translateY translateZ rotate rotateX rotateY rotateZ scale scaleX scaleY scaleZ skewX skewY perspective".split(" "),H,h={arr:function(a){return Array.isArray(a)},obj:function(a){return-1<Object.prototype.toString.call(a).indexOf("Object")},
+pth:function(a){return h.obj(a)&&a.hasOwnProperty("totalLength")},svg:function(a){return a instanceof SVGElement},dom:function(a){return a.nodeType||h.svg(a)},str:function(a){return"string"===typeof a},fnc:function(a){return"function"===typeof a},und:function(a){return"undefined"===typeof a},hex:function(a){return/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(a)},rgb:function(a){return/^rgb/.test(a)},hsl:function(a){return/^hsl/.test(a)},col:function(a){return h.hex(a)||h.rgb(a)||h.hsl(a)}},A=function(){function a(a,
+d,b){return(((1-3*b+3*d)*a+(3*b-6*d))*a+3*d)*a}return function(c,d,b,f){if(0<=c&&1>=c&&0<=b&&1>=b){var e=new Float32Array(11);if(c!==d||b!==f)for(var k=0;11>k;++k)e[k]=a(.1*k,c,b);return function(k){if(c===d&&b===f)return k;if(0===k)return 0;if(1===k)return 1;for(var h=0,l=1;10!==l&&e[l]<=k;++l)h+=.1;--l;var l=h+(k-e[l])/(e[l+1]-e[l])*.1,n=3*(1-3*b+3*c)*l*l+2*(3*b-6*c)*l+3*c;if(.001<=n){for(h=0;4>h;++h){n=3*(1-3*b+3*c)*l*l+2*(3*b-6*c)*l+3*c;if(0===n)break;var m=a(l,c,b)-k,l=l-m/n}k=l}else if(0===
+n)k=l;else{var l=h,h=h+.1,g=0;do m=l+(h-l)/2,n=a(m,c,b)-k,0<n?h=m:l=m;while(1e-7<Math.abs(n)&&10>++g);k=m}return a(k,d,f)}}}}(),Q=function(){function a(a,b){return 0===a||1===a?a:-Math.pow(2,10*(a-1))*Math.sin(2*(a-1-b/(2*Math.PI)*Math.asin(1))*Math.PI/b)}var c="Quad Cubic Quart Quint Sine Expo Circ Back Elastic".split(" "),d={In:[[.55,.085,.68,.53],[.55,.055,.675,.19],[.895,.03,.685,.22],[.755,.05,.855,.06],[.47,0,.745,.715],[.95,.05,.795,.035],[.6,.04,.98,.335],[.6,-.28,.735,.045],a],Out:[[.25,
+.46,.45,.94],[.215,.61,.355,1],[.165,.84,.44,1],[.23,1,.32,1],[.39,.575,.565,1],[.19,1,.22,1],[.075,.82,.165,1],[.175,.885,.32,1.275],function(b,c){return 1-a(1-b,c)}],InOut:[[.455,.03,.515,.955],[.645,.045,.355,1],[.77,0,.175,1],[.86,0,.07,1],[.445,.05,.55,.95],[1,0,0,1],[.785,.135,.15,.86],[.68,-.55,.265,1.55],function(b,c){return.5>b?a(2*b,c)/2:1-a(-2*b+2,c)/2}]},b={linear:A(.25,.25,.75,.75)},f={},e;for(e in d)f.type=e,d[f.type].forEach(function(a){return function(d,f){b["ease"+a.type+c[f]]=h.fnc(d)?
+d:A.apply($jscomp$this,d)}}(f)),f={type:f.type};return b}(),ha={css:function(a,c,d){return a.style[c]=d},attribute:function(a,c,d){return a.setAttribute(c,d)},object:function(a,c,d){return a[c]=d},transform:function(a,c,d,b,f){b[f]||(b[f]=[]);b[f].push(c+"("+d+")")}},v=[],B=0,ia=function(){function a(){B=requestAnimationFrame(c)}function c(c){var b=v.length;if(b){for(var d=0;d<b;)v[d]&&v[d].tick(c),d++;a()}else cancelAnimationFrame(B),B=0}return a}();q.version="2.2.0";q.speed=1;q.running=v;q.remove=
+function(a){a=P(a);for(var c=v.length;c--;)for(var d=v[c],b=d.animations,f=b.length;f--;)u(a,b[f].animatable.target)&&(b.splice(f,1),b.length||d.pause())};q.getValue=K;q.path=function(a,c){var d=h.str(a)?e(a)[0]:a,b=c||100;return function(a){return{el:d,property:a,totalLength:N(d)*(b/100)}}};q.setDashoffset=function(a){var c=N(a);a.setAttribute("stroke-dasharray",c);return c};q.bezier=A;q.easings=Q;q.timeline=function(a){var c=q(a);c.pause();c.duration=0;c.add=function(d){c.children.forEach(function(a){a.began=
+!0;a.completed=!0});m(d).forEach(function(b){var d=z(b,D(S,a||{}));d.targets=d.targets||a.targets;b=c.duration;var e=d.offset;d.autoplay=!1;d.direction=c.direction;d.offset=h.und(e)?b:L(e,b);c.began=!0;c.completed=!0;c.seek(d.offset);d=q(d);d.began=!0;d.completed=!0;d.duration>b&&(c.duration=d.duration);c.children.push(d)});c.seek(0);c.reset();c.autoplay&&c.restart();return c};return c};q.random=function(a,c){return Math.floor(Math.random()*(c-a+1))+a};return q});

themes/ayon/_dev/js/lib/jquery.sticky-kit.min.js

@@ -0,0 +1,10 @@
+/*
+ Sticky-kit v1.1.3 | MIT | Leaf Corcoran 2015 | http://leafo.net
+*/
+(function(){var c,f;c=window.jQuery;f=c(window);c.fn.stick_in_parent=function(b){var A,w,J,n,B,K,p,q,L,k,E,t;null==b&&(b={});t=b.sticky_class;B=b.inner_scrolling;E=b.recalc_every;k=b.parent;q=b.offset_top;p=b.spacer;w=b.bottoming;null==q&&(q=0);null==k&&(k=void 0);null==B&&(B=!0);null==t&&(t="is_stuck");A=c(document);null==w&&(w=!0);L=function(a){var b;return window.getComputedStyle?(a=window.getComputedStyle(a[0]),b=parseFloat(a.getPropertyValue("width"))+parseFloat(a.getPropertyValue("margin-left"))+
+parseFloat(a.getPropertyValue("margin-right")),"border-box"!==a.getPropertyValue("box-sizing")&&(b+=parseFloat(a.getPropertyValue("border-left-width"))+parseFloat(a.getPropertyValue("border-right-width"))+parseFloat(a.getPropertyValue("padding-left"))+parseFloat(a.getPropertyValue("padding-right"))),b):a.outerWidth(!0)};J=function(a,b,n,C,F,u,r,G){var v,H,m,D,I,d,g,x,y,z,h,l;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);I=A.height();g=a.parent();null!=k&&(g=g.closest(k));if(!g.length)throw"failed to find stick parent";
+v=m=!1;(h=null!=p?p&&a.closest(p):c("<div />"))&&h.css("position",a.css("position"));x=function(){var d,f,e;if(!G&&(I=A.height(),d=parseInt(g.css("border-top-width"),10),f=parseInt(g.css("padding-top"),10),b=parseInt(g.css("padding-bottom"),10),n=g.offset().top+d+f,C=g.height(),m&&(v=m=!1,null==p&&(a.insertAfter(h),h.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(t),e=!0),F=a.offset().top-(parseInt(a.css("margin-top"),10)||0)-q,u=a.outerHeight(!0),r=a.css("float"),h&&h.css({width:L(a),
+height:u,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":r}),e))return l()};x();if(u!==C)return D=void 0,d=q,z=E,l=function(){var c,l,e,k;if(!G&&(e=!1,null!=z&&(--z,0>=z&&(z=E,x(),e=!0)),e||A.height()===I||x(),e=f.scrollTop(),null!=D&&(l=e-D),D=e,m?(w&&(k=e+u+d>C+n,v&&!k&&(v=!1,a.css({position:"fixed",bottom:"",top:d}).trigger("sticky_kit:unbottom"))),e<F&&(m=!1,d=q,null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),h.detach()),c={position:"",width:"",top:""},a.css(c).removeClass(t).trigger("sticky_kit:unstick")),
+B&&(c=f.height(),u+q>c&&!v&&(d-=l,d=Math.max(c-u,d),d=Math.min(q,d),m&&a.css({top:d+"px"})))):e>F&&(m=!0,c={position:"fixed",top:d},c.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(c).addClass(t),null==p&&(a.after(h),"left"!==r&&"right"!==r||h.append(a)),a.trigger("sticky_kit:stick")),m&&w&&(null==k&&(k=e+u+d>C+n),!v&&k)))return v=!0,"static"===g.css("position")&&g.css({position:"relative"}),a.css({position:"absolute",bottom:b,top:"auto"}).trigger("sticky_kit:bottom")},
+y=function(){x();return l()},H=function(){G=!0;f.off("touchmove",l);f.off("scroll",l);f.off("resize",y);c(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",H);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:"",width:""});g.position("position","");if(m)return null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),h.remove()),a.removeClass(t)},f.on("touchmove",l),f.on("scroll",l),f.on("resize",y),c(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",H),setTimeout(l,
+0)}};n=0;for(K=this.length;n<K;n++)b=this[n],J(c(b));return this}}).call(this);

themes/ayon/_dev/js/listing.js

@@ -0,0 +1,540 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import prestashop from 'prestashop';
+import 'velocity-animate';
+
+import ProductMinitature from './components/product-miniature';
+
+$(document).ready(() => {
+  prestashop.on('clickQuickView', function (elm) {
+    let data = {
+      'action': 'quickview',
+      'id_product': elm.dataset.idProduct,
+      'id_product_attribute': elm.dataset.idProductAttribute,
+    };
+    $.post(prestashop.urls.pages.product, data, null, 'json').then(function (resp) {
+      $('body').append(resp.quickview_html);
+      let productModal = $(`#quickview-modal-${resp.product.id}-${resp.product.id_product_attribute}`);
+      productModal.modal('show');
+      productConfig(productModal);
+      productModal.on('hidden.bs.modal', function () {
+        productModal.remove();
+      });
+    }).fail((resp) => {
+      prestashop.emit('handleError', {eventType: 'clickQuickView', resp: resp});
+    });
+  });
+
+  var productConfig = (qv) => {
+    const MAX_THUMBS = 4;
+    var $arrows = $('.js-arrows');
+    var $thumbnails = qv.find('.js-qv-product-images');
+    $('.js-thumb').on('click', (event) => {
+      if ($('.js-thumb').hasClass('selected')) {
+        $('.js-thumb').removeClass('selected');
+      }
+      $(event.currentTarget).addClass('selected');
+      $('.js-qv-product-cover').attr('src', $(event.target).data('image-large-src'));
+    });
+    if ($thumbnails.find('li').length <= MAX_THUMBS) {
+      $arrows.hide();
+    } else {
+      $arrows.on('click', (event) => {
+        if ($(event.target).hasClass('arrow-up') && $('.js-qv-product-images').position().top < 0) {
+          move('up');
+          $('.arrow-down').css('opacity', '1');
+        } else if ($(event.target).hasClass('arrow-down') && $thumbnails.position().top + $thumbnails.height() > $('.js-qv-mask').height()) {
+          move('down');
+          $('.arrow-up').css('opacity', '1');
+        }
+      });
+    }
+    qv.find('#quantity_wanted').TouchSpin({
+      verticalbuttons: false,
+      verticalupclass: 'material-icons touchspin-up',
+      verticaldownclass: 'material-icons touchspin-down',
+      buttondown_class: 'btn btn-touchspin js-touchspin',
+      buttonup_class: 'btn btn-touchspin js-touchspin',
+      min: 1,
+      max: 1000000
+    });
+    setTimeout(function() {
+      qv.find('.product-images').flickity({
+          draggable:1,
+          pageDots: false,
+          cellAlign: 'left',
+          contain: true,
+          arrowShape: {
+            x0: 30,
+            x1: 60, y1: 50,
+            x2: 70, y2: 50,
+            x3: 40
+          }
+      });
+    },300);
+  };
+  var move = (direction) => {
+    const THUMB_MARGIN = 20;
+    var $thumbnails = $('.js-qv-product-images');
+    var thumbHeight = $('.js-qv-product-images li img').height() + THUMB_MARGIN;
+    var currentPosition = $thumbnails.position().top;
+    $thumbnails.velocity({
+      translateY: (direction === 'up') ? currentPosition + thumbHeight : currentPosition - thumbHeight
+    }, function () {
+      if ($thumbnails.position().top >= 0) {
+        $('.arrow-up').css('opacity', '.2');
+      } else if ($thumbnails.position().top + $thumbnails.height() <= $('.js-qv-mask').height()) {
+        $('.arrow-down').css('opacity', '.2');
+      }
+    });
+  };
+
+  const parseSearchUrl = function (event) {
+    if (event.target.dataset.searchUrl !== undefined) {
+      return event.target.dataset.searchUrl;
+    }
+
+    if ($(event.target).parent()[0].dataset.searchUrl === undefined) {
+      throw new Error('Can not parse search URL');
+    }
+
+    return $(event.target).parent()[0].dataset.searchUrl;
+  };
+
+  $('body').on('change', '#search_filters input[data-search-url]', function (event) {
+    prestashop.emit('updateFacets', parseSearchUrl(event));
+  });
+
+  $('body').on('click', '.js-search-filters-clear-all', function (event) {
+    prestashop.emit('updateFacets', parseSearchUrl(event));
+  });
+
+  $('body').on('click', '.js-search-link', function (event) {
+    event.preventDefault();
+    prestashop.emit('updateFacets', $(event.target).closest('a').get(0).href);
+  });
+
+  $('body').on('change', '#search_filters select', function (event) {
+    const form = $(event.target).closest('form');
+    prestashop.emit('updateFacets', '?' + form.serialize());
+  });
+
+  prestashop.on('updateProductList', (data) => {
+    updateProductListDOM(data);
+    updateCounters();
+    hideProds();
+    showProds();
+    
+    let target = $("#products");
+    if (target.length) {
+      $('html, body').animate({
+          scrollTop: target.offset().top - 100
+      }, 240);
+    }
+
+  });
+
+  // Grid - list
+
+  $('.show_list').click(function(){
+      document.cookie = "show_list=true; expires=Thu, 30 Jan 2100 12:00:00 UTC; path=/";
+      $('#main #js-product-list .product-item').addClass('product_show_list');
+      $(this).addClass('active');
+      $('.show_grid').removeClass('active');
+      hideProds();
+      showProds();
+  });
+
+  $('.show_grid').click(function(){
+      document.cookie = "show_list=; expires=Thu, 30 Jan 1970 12:00:00 UTC; path=/";
+      $('#main #js-product-list .product-item').removeClass('product_show_list');
+      $(this).addClass('active');
+      $('.show_list').removeClass('active');
+      hideProds();
+      showProds();
+  });
+
+  prestashop.on('updateProductList', function (event) {
+      $('.show_list').click(function(){
+          $('#main #js-product-list .product-item').addClass('product_show_list');
+          $(this).addClass('active');
+          $('.show_grid').removeClass('active');
+          hideProds();
+          showProds();
+      });
+
+      $('.show_grid').click(function(){
+          $('#main #js-product-list .product-item').removeClass('product_show_list');
+          $(this).addClass('active');
+          $('.show_list').removeClass('active');
+          hideProds();
+          showProds();
+      });
+  });
+
+  // roythemes show prods
+
+  function showProds() {
+    $('#products #js-product-list').find('.products > .product-item').each(function(i){
+      var row = $(this);
+      setTimeout(function(){
+        row.addClass('show');
+      }, 360 + i * 140);
+    });
+  }
+  showProds();
+
+  function hideProds() {
+    $('#products #js-product-list').find('.products > .product-item').each(function(i){
+      $(this).removeClass('show')
+    });
+  }
+
+  // modez fastview
+
+  class Details {
+      constructor() {
+          this.DOM = {};
+
+          const detailsTmpl = `
+          <div class="details__bg details__bg--up"></div>
+          <div class="details__bg details__bg--down"></div>
+          <div class="details__close"></div>
+          <img class="details__img" src="" alt="img 01"/>
+          <h2 class="details__title"></h2>
+          <div class="details__price"></div>
+          <p class="details__description"></p>
+          <button class="details__addtocart">Add to cart</button>
+          <button class="details__magnifier"><svg class="icon icon--magnifier"><use xlink:href="#icon-magnifier"></use></svg></button>
+          `;
+
+          this.DOM.details = document.createElement('div');
+          this.DOM.details.className = 'details';
+          this.DOM.details.innerHTML = detailsTmpl;
+          DOM.content.appendChild(this.DOM.details);
+          this.init();
+      }
+      init() {
+          this.DOM.bgUp = this.DOM.details.querySelector('.details__bg--up');
+          this.DOM.bgDown = this.DOM.details.querySelector('.details__bg--down');
+          this.DOM.img = this.DOM.details.querySelector('.details__img');
+          this.DOM.title = this.DOM.details.querySelector('.details__title');
+          this.DOM.price = this.DOM.details.querySelector('.details__price');
+          this.DOM.description = this.DOM.details.querySelector('.details__description');
+          this.DOM.cart = this.DOM.details.querySelector('.details__addtocart');
+          this.DOM.close = this.DOM.details.querySelector('.details__close');
+          this.DOM.magnifier = this.DOM.details.querySelector('.details__magnifier');
+
+          this.initEvents();
+      }
+      initEvents() {
+          this.DOM.close.addEventListener('click', () => this.isZoomed ? this.zoomOut() : this.close());
+          this.DOM.magnifier.addEventListener('click', () => this.zoomIn());
+      }
+      fill(info) {
+          this.DOM.img.src = info.img;
+          this.DOM.title.innerHTML = info.title;
+          this.DOM.price.innerHTML = info.price;
+          this.DOM.description.innerHTML = info.description;
+      }
+      getProductDetailsRect() {
+          return {
+              productBgRect: this.DOM.productBg.getBoundingClientRect(),
+              detailsBgRect: this.DOM.bgDown.getBoundingClientRect(),
+              productImgRect: this.DOM.productImg.getBoundingClientRect(),
+              detailsImgRect: this.DOM.img.getBoundingClientRect()
+          };
+      }
+      open(data) {
+          if ( this.isAnimating ) return false;
+          this.isAnimating = true;
+
+          this.DOM.details.classList.add('details--open');
+
+          this.DOM.productBg = data.productBg;
+          this.DOM.productImg = data.productImg;
+
+          this.DOM.productBg.style.opacity = 0;
+          this.DOM.productImg.style.opacity = 0;
+
+          const rect = this.getProductDetailsRect();
+
+          this.DOM.bgDown.style.transform = `translateX(${rect.productBgRect.left-rect.detailsBgRect.left}px) translateY(${rect.productBgRect.top-rect.detailsBgRect.top}px) scaleX(${rect.productBgRect.width/rect.detailsBgRect.width}) scaleY(${rect.productBgRect.height/rect.detailsBgRect.height})`;
+          this.DOM.bgDown.style.opacity = 1;
+
+          this.DOM.img.style.transform = `translateX(${rect.productImgRect.left-rect.detailsImgRect.left}px) translateY(${rect.productImgRect.top-rect.detailsImgRect.top}px) scaleX(${rect.productImgRect.width/rect.detailsImgRect.width}) scaleY(${rect.productImgRect.height/rect.detailsImgRect.height})`;
+          this.DOM.img.style.opacity = 1;
+
+          anime({
+              targets: [this.DOM.bgDown,this.DOM.img],
+              duration: (target, index) => index ? 800 : 250,
+              easing: (target, index) => index ? 'easeOutElastic' : 'easeOutSine',
+              elasticity: 250,
+              translateX: 0,
+              translateY: 0,
+              scaleX: 1,
+              scaleY: 1,
+              complete: () => this.isAnimating = false
+          });
+
+          anime({
+              targets: [this.DOM.title, this.DOM.price, this.DOM.description, this.DOM.cart, this.DOM.magnifier],
+              duration: 600,
+              easing: 'easeOutExpo',
+              delay: (target, index) => {
+                  return index*60;
+              },
+              translateY: (target, index, total) => {
+                  return index !== total - 1 ? [50,0] : 0;
+              },
+              scale:  (target, index, total) => {
+                  return index === total - 1 ? [0,1] : 1;
+              },
+              opacity: 1
+          });
+
+          anime({
+              targets: this.DOM.bgUp,
+              duration: 100,
+              easing: 'linear',
+              opacity: 0.8
+          });
+
+          anime({
+              targets: this.DOM.close,
+              duration: 250,
+              easing: 'easeOutSine',
+              translateY: ['100%',0],
+              opacity: 1
+          });
+
+      }
+      close() {
+          if ( this.isAnimating ) return false;
+          this.isAnimating = true;
+
+          this.DOM.details.classList.remove('details--open');
+
+
+          anime({
+              targets: this.DOM.close,
+              duration: 250,
+              easing: 'easeOutSine',
+              translateY: '100%',
+              opacity: 0
+          });
+
+          anime({
+              targets: this.DOM.bgUp,
+              duration: 100,
+              easing: 'linear',
+              opacity: 0
+          });
+
+          anime({
+              targets: [this.DOM.title, this.DOM.price, this.DOM.description, this.DOM.cart, this.DOM.magnifier],
+              duration: 20,
+              easing: 'linear',
+              opacity: 0
+          });
+
+          const rect = this.getProductDetailsRect();
+          anime({
+              targets: [this.DOM.bgDown,this.DOM.img],
+              duration: 250,
+              easing: 'easeOutSine',
+              translateX: (target, index) => {
+                  return index ? rect.productImgRect.left-rect.detailsImgRect.left : rect.productBgRect.left-rect.detailsBgRect.left;
+              },
+              translateY: (target, index) => {
+                  return index ? rect.productImgRect.top-rect.detailsImgRect.top : rect.productBgRect.top-rect.detailsBgRect.top;
+              },
+              scaleX: (target, index) => {
+                  return index ? rect.productImgRect.width/rect.detailsImgRect.width : rect.productBgRect.width/rect.detailsBgRect.width;
+              },
+              scaleY: (target, index) => {
+                  return index ? rect.productImgRect.height/rect.detailsImgRect.height : rect.productBgRect.height/rect.detailsBgRect.height;
+              },
+              complete: () => {
+                  this.DOM.bgDown.style.opacity = 0;
+                  this.DOM.img.style.opacity = 0;
+                  this.DOM.bgDown.style.transform = 'none';
+                  this.DOM.img.style.transform = 'none';
+                  this.DOM.productBg.style.opacity = 1;
+                  this.DOM.productImg.style.opacity = 1;
+                  this.isAnimating = false;
+              }
+          });
+      }
+      zoomIn() {
+          this.isZoomed = true;
+
+          anime({
+              targets: [this.DOM.title, this.DOM.price, this.DOM.description, this.DOM.cart, this.DOM.magnifier],
+              duration: 100,
+              easing: 'easeOutSine',
+              translateY: (target, index, total) => {
+                  return index !== total - 1 ? [0, index === 0 || index === 1 ? -50 : 50] : 0;
+              },
+              scale:  (target, index, total) => {
+                  return index === total - 1 ? [1,0] : 1;
+              },
+              opacity: 0
+          });
+
+          const imgrect = this.DOM.img.getBoundingClientRect();
+          const win = {w: window.innerWidth, h: window.innerHeight};
+
+          const imgAnimeOpts = {
+              targets: this.DOM.img,
+              duration: 250,
+              easing: 'easeOutCubic',
+              translateX: win.w/2 - (imgrect.left+imgrect.width/2),
+              translateY: win.h/2 - (imgrect.top+imgrect.height/2)
+          };
+
+          if ( win.w > 0.8*win.h ) {
+              this.DOM.img.style.transformOrigin = '50% 50%';
+              Object.assign(imgAnimeOpts, {
+                  scaleX: 0.95*win.w/parseInt(0.8*win.h),
+                  scaleY: 0.95*win.w/parseInt(0.8*win.h),
+                  rotate: 90
+              });
+          }
+          anime(imgAnimeOpts);
+
+          anime({
+              targets: this.DOM.close,
+              duration: 250,
+              easing: 'easeInOutCubic',
+              scale: 1.8,
+              rotate: 180
+          });
+      }
+      zoomOut() {
+          this.isZoomed = false;
+
+          anime({
+              targets: [this.DOM.title, this.DOM.price, this.DOM.description, this.DOM.cart, this.DOM.magnifier],
+              duration: 250,
+              easing: 'easeOutCubic',
+              translateY: 0,
+              scale: 1,
+              opacity: 1
+          });
+
+          anime({
+              targets: this.DOM.img,
+              duration: 250,
+              easing: 'easeOutCubic',
+              translateX: 0,
+              translateY: 0,
+              scaleX: 1,
+              scaleY: 1,
+              rotate: 0,
+              complete: () => this.DOM.img.style.transformOrigin = '0 0'
+          });
+
+          anime({
+              targets: this.DOM.close,
+              duration: 250,
+              easing: 'easeInOutCubic',
+              scale: 1,
+              rotate: 0
+          });
+      }
+  };
+
+  class Item {
+	constructor(el) {
+		this.DOM = {};
+          this.DOM.el = el;
+          this.DOM.product = this.DOM.el.querySelector('.thumbnail-container');
+          this.DOM.productBg = this.DOM.product.querySelector('.product-description');
+          this.DOM.productImg = this.DOM.product.querySelector('.product-image img');
+          this.DOM.fw = this.DOM.product.querySelector('.fast-view');
+
+          this.info = {
+              img: this.DOM.productImg.src,
+              title: this.DOM.product.querySelector('.product-title').innerHTML,
+              description: this.DOM.product.querySelector('.prod-short-desc').innerHTML,
+              price: this.DOM.product.querySelector('.product-price-and-shipping').innerHTML
+          };
+
+		this.initEvents();
+	}
+      initEvents() {
+          console.log(this.DOM.fw);
+          this.DOM.fw.addEventListener('click', () => this.open());
+      }
+      open() {
+          DOM.details.fill(this.info);
+          DOM.details.open({
+              productBg: this.DOM.productBg,
+              productImg: this.DOM.productImg
+          });
+      }
+  };
+
+  if ( $('product-item ').length){
+    const DOM = {};
+    DOM.grid = document.querySelector('#main .products');
+    DOM.content = DOM.grid.parentNode;
+    DOM.gridItems = Array.from(DOM.grid.querySelectorAll('.product-item'));
+    let items = [];
+    DOM.gridItems.forEach(item => items.push(new Item(item)));
+
+    DOM.details = new Details();
+ }
+
+});
+
+function updateCounters() {
+	$(".countcontainer").each(function(e) {
+		var $roycountdown = $(this).find(".roycountdown");
+		var $roycount = $roycountdown.find(".roycount");
+		var $dataspecificpriceto = $roycount.attr('data-specific-price-to');
+		if ($roycountdown.length) {
+			$roycountdown.county({
+				endDateTime: new Date($dataspecificpriceto.replace(/-/g, "/")) , reflection: false, animation: 'none', theme: 'black',
+				titleDays:$roycount.data('days'),titleHours:$roycount.data('hours'),titleMinutes:$roycount.data('minutes'),titleSeconds:$roycount.data('seconds')
+			});
+		}
+	});
+}
+
+function updateProductListDOM (data) {
+  $('#search_filters').replaceWith(data.rendered_facets);
+  $('#js-active-search-filters').replaceWith(data.rendered_active_filters);
+  $('#js-product-list-top').replaceWith(data.rendered_products_top);
+  $('#js-product-list').replaceWith(data.rendered_products);
+  $('#js-product-list-bottom').replaceWith(data.rendered_products_bottom);
+  $('#js-active-search-filters-mobile').replaceWith(data.rendered_active_filters);
+
+  let productMinitature = new ProductMinitature();
+  productMinitature.init();
+
+}

themes/ayon/_dev/js/product.js

@@ -0,0 +1,344 @@
+/**
+ * 2007-2019 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import prestashop from 'prestashop';
+import { flickity } from "../node_modules/flickity/dist/flickity.pkgd.min";
+import * as PhotoSwipe from 'photoswipe';
+import * as PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default';
+
+$(document).ready(function () {
+  createProductSpin();
+  createInputFile();
+  coverImage();
+  thumbsInit();
+  ppzoom();
+  whiteborder();
+  shareclick();
+
+  prestashop.on('updatedProduct', function (event) {
+
+    createProductSpin()
+    createInputFile();
+    coverImage();
+    if (event && event.product_minimal_quantity) {
+      const minimalProductQuantity = parseInt(event.product_minimal_quantity, 10);
+      const quantityInputSelector = '#quantity_wanted';
+      let quantityInput = $(quantityInputSelector);
+
+      // @see http://www.virtuosoft.eu/code/bootstrap-touchspin/ about Bootstrap TouchSpin
+      quantityInput.trigger('touchspin.updatesettings', {min: minimalProductQuantity});
+    }
+    $($('.tabs .nav-link.active').attr('href')).addClass('active').removeClass('fade');
+    $('.js-product-images-modal').replaceWith(event.product_images_modal);
+    whiteborder();
+    updateCounters();
+    shareclick();
+    slideqv();
+
+    var $uiEl = $('.tip_inside');
+    $('body').append('<div id="ui_tip"><div class="ui_wrapper"><span class="ui_title"></span></div></div>');
+    var $uiTip = $('#ui_tip');
+    var $uiTipTitle = $uiTip.find('.ui_title');
+
+    $uiEl.on('mousemove', function(e) {
+      $uiTip.css({
+        top: e.clientY,
+        left: e.clientX
+      });
+
+      var winwidth = $(window).width(),
+          tipwidth = $('#ui_tip').width(),
+          tiprightdot = e.clientX + tipwidth + 14 + 40; // plus 40 padding compensation
+
+      if (tiprightdot > winwidth) {
+        $('#ui_tip').addClass('align-right');
+      } else {
+        $('#ui_tip').removeClass('align-right');
+      }
+    });
+
+    $uiEl.on('mouseover', function(e) {
+      $uiTipTitle.text($(this).find('.tip').text());
+      setTimeout(function() {
+        $uiTip.addClass('active')
+      }, 10);
+    }).on('mouseout', function(e) {
+      setTimeout(function() {
+        $uiTip.removeClass('active');
+      }, 10);
+    });
+
+    setTimeout( function(){
+      thumbsInit();
+      ppzoom();
+    },200);
+
+  });
+
+  function thumbsInit() {
+
+    var thumbs_count_lis = $('#main .product-thumbs-wrapper li.thumb-container');
+
+    if (thumbs_count_lis.length == 1) {
+      $('#main .product-thumbs-wrapper').addClass('hide_it_pls');
+    } else if (thumbs_count_lis.length == 2) {
+      $('#main .product-thumbs-wrapper').addClass('w50');
+    } else if (thumbs_count_lis.length == 3) {
+      $('#main .product-thumbs-wrapper').addClass('w33');
+    } else if (thumbs_count_lis.length >= 4) {
+      $('#main .product-thumbs-wrapper').addClass('w25');
+    }
+
+    setTimeout( function(){
+
+    initslidepp();
+    $('.product-thumbs-wrapper').addClass('thumbs_go');
+
+      $(window).on('load resize', function(){
+        initslidepp();
+      });
+
+      function slidepp() { // Product page lay sliders
+        $('.images-container .product-images').flickity({
+          draggable:1,
+          pageDots: false,
+          cellAlign: 'left',
+          contain: true,
+          imagesLoaded: true,
+          arrowShape: {
+            x0: 30,
+            x1: 60, y1: 50,
+            x2: 70, y2: 50,
+            x3: 40
+          }
+        });
+        $('.images-container .product-thumbs').flickity({
+          asNavFor: '.images-container .product-images',
+          draggable:1,
+          prevNextButtons: false,
+          pageDots: false,
+          cellAlign: 'center',
+          imagesLoaded: true,
+          contain: true
+        });
+
+      }
+      function initslidepp() {
+        if (window.matchMedia('(max-width: 767px)').matches) { // slide it for mobile for all lays
+            slidepp();
+        } else if ($('#product .images-container').hasClass('pp_lay1')) { // slide it for 1 lay on desktop
+            slidepp();
+        } else { // destroy sliders here for 2 and 3 on resize to bigger resolution
+          if ($('.images-container .product-images').hasClass('flickity-enabled'))
+            $('.images-container .product-images').flickity('destroy');
+          if ($('.images-container .product-thumbs').hasClass('flickity-enabled'))
+            $('.images-container .product-thumbs').flickity('destroy');
+        }
+      }
+    },100);
+
+
+  }
+
+  function ppzoom() {
+    if ($('.images-container').hasClass('pp_lay1')) {
+      $('.images-container .product-images').on( 'staticClick.flickity', function( event, pointer, cellElement, cellIndex ) {
+        // Photoswipe functions
+        var openPhotoSwipe = function() {
+          var pswpElement = document.querySelectorAll('.pswp')[0];
+
+          // build items array
+          var items = $.map($('.images-container .product-images').find("img"), function(el) {
+            return {
+              "src": el.getAttribute('src'),
+              "w":   el.width,
+              "h":   el.height
+            }
+          });
+
+          var options = {
+            history: false,
+            shareEl: false,
+            zoomEl: true,
+            index: cellIndex
+          };
+
+          var gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, items, options);
+          gallery.init();
+
+        };
+
+        openPhotoSwipe();
+      });
+
+    } else {
+
+        $('.images-container .product-images li img').click(function(event) {
+
+
+            // build items array
+            var items = $.map($('.images-container.pp_lay2 .product-images').find("img"), function(el) {
+              return {
+                "src": el.getAttribute('src'),
+                "w":   el.width,
+                "h":   el.height
+              }
+            });
+
+            // Define object and gallery options
+            var $pswp = $('.pswp')[0],
+              options = {
+                index: $(this).parent('.thumb-container').index(),
+                bgOpacity: 0.85,
+                zoomEl: true,
+                showHideOpacity: true
+              };
+
+            var gallery = new PhotoSwipe( $pswp, PhotoSwipeUI_Default, items, options);
+            gallery.init();
+
+        });
+
+    }
+
+  }
+
+  function slideqv() {
+    $('.quickview .product-images').flickity({
+      draggable:1,
+      pageDots: false,
+      cellAlign: 'left',
+      contain: true,
+      imagesLoaded: true,
+      arrowShape: {
+        x0: 30,
+        x1: 60, y1: 50,
+        x2: 70, y2: 50,
+        x3: 40
+      }
+    });
+  }
+
+  function coverImage() {
+    $('.js-thumb').on(
+      'click',
+      (event) => {
+        $('.js-modal-product-cover').attr('src',$(event.target).data('image-large-src'));
+        $('.selected').removeClass('selected');
+        $(event.target).addClass('selected');
+        $('.js-qv-product-cover').prop('src', $(event.currentTarget).data('image-large-src'));
+      }
+    );
+  }
+
+  function createInputFile()
+  {
+    $('.js-file-input').on('change', (event) => {
+      let target, file;
+
+      if ((target = $(event.currentTarget)[0]) && (file = target.files[0])) {
+        $(target).prev().text(file.name);
+      }
+    });
+  }
+
+  function createProductSpin()
+  {
+    const $quantityInput = $('#quantity_wanted');
+
+    $quantityInput.TouchSpin({
+      verticalbuttons: false,
+      verticalupclass: 'material-icons touchspin-up',
+      verticaldownclass: 'material-icons touchspin-down',
+      buttondown_class: 'btn btn-touchspin js-touchspin',
+      buttonup_class: 'btn btn-touchspin js-touchspin',
+      min: parseInt($quantityInput.attr('min'), 10),
+      max: 1000000
+    });
+
+    $('body').on('change keyup', '#quantity_wanted', (e) => {
+      $(e.currentTarget).trigger('touchspin.stopspin');
+      prestashop.emit('updateProduct', {
+          eventType: 'updatedProductQuantity',
+          event: e
+      });
+    });
+  }
+
+  // reviews click
+  $('.goreviews').click(function(e) {
+    e.preventDefault;
+    var reviewstab = $('#productCommentsBlock').parent();
+    var reviewstabid = reviewstab.attr('id');
+    var reviewstablink = $('a[href="#' + reviewstabid + '"]');
+
+    $("body,html").animate( {
+      scrollTop: $("#tabsection").offset().top - 170
+    }, 600 );
+    setTimeout( function() {
+      reviewstablink.click();
+    }, 200 );
+
+
+  });
+
+
+  // white color
+  function whiteborder()
+  {
+    $('.color').each(function() {
+      if( $(this).css('background-color') === 'rgb(255, 255, 255)') {
+        $(this).addClass('white');
+      }
+    });
+  }
+
+  // share
+  function shareclick() {
+    $('.share_text').click(function(e) {
+      e.preventDefault;
+      var share_dad = $('.share_text').parent('.social-sharing');
+      if (!share_dad.hasClass('click')) {
+
+        share_dad.addClass('click');
+      }
+    });
+  }
+
+  function updateCounters() {
+  	$(".countcontainer").each(function(e) {
+  		var $roycountdown = $(this).find(".roycountdown");
+  		var $roycount = $roycountdown.find(".roycount");
+  		var $dataspecificpriceto = $roycount.attr('data-specific-price-to');
+  		if ($roycountdown.length) {
+  			$roycountdown.county({
+  				endDateTime: new Date($dataspecificpriceto.replace(/-/g, "/")) , reflection: false, animation: 'none', theme: 'black',
+  				titleDays:$roycount.data('days'),titleHours:$roycount.data('hours'),titleMinutes:$roycount.data('minutes'),titleSeconds:$roycount.data('seconds')
+  			});
+  		}
+  	});
+  }
+
+});

themes/ayon/_dev/js/responsive.js

@@ -0,0 +1,89 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+prestashop.responsive = prestashop.responsive || {};
+
+prestashop.responsive.current_width = window.innerWidth;
+prestashop.responsive.min_width = 992;
+prestashop.responsive.mobile = prestashop.responsive.current_width < prestashop.responsive.min_width;
+
+function swapChildren(obj1, obj2)
+{
+	var temp = obj2.children().detach();
+	obj2.empty().append(obj1.children().detach());
+	obj1.append(temp);
+}
+
+function toggleMobileStyles()
+{
+	if (prestashop.responsive.mobile) {
+		$("*[id^='_desktop_']").each(function(idx, el) {
+			var target = $('#' + el.id.replace('_desktop_', '_mobile_'));
+			if (target.length) {
+				swapChildren($(el), target);
+			}
+		});
+	} else {
+		$("*[id^='_mobile_']").each(function(idx, el) {
+			var target = $('#' + el.id.replace('_mobile_', '_desktop_'));
+			if (target.length) {
+				swapChildren($(el), target);
+			}
+		});
+	}
+	prestashop.emit('responsive update', {
+		mobile: prestashop.responsive.mobile
+	});
+}
+
+$(window).on('resize', function() {
+	var _cw = prestashop.responsive.current_width;
+	var _mw = prestashop.responsive.min_width;
+	var _w = window.innerWidth;
+	var _toggle = (_cw >= _mw && _w < _mw) || (_cw < _mw && _w >= _mw);
+	prestashop.responsive.current_width = _w;
+  prestashop.responsive.mobile = prestashop.responsive.current_width < prestashop.responsive.min_width;
+	if (_toggle) {
+		toggleMobileStyles();
+	}
+});
+
+$(document).ready(function() {
+	if (prestashop.responsive.mobile) {
+		toggleMobileStyles();
+	}
+
+	var headermobile = $('.header-mobile');
+
+	$(window).scroll(function(){
+	  if ($(window).scrollTop() > 0) {
+			headermobile.addClass('scroll-down');
+		} else {
+			headermobile.removeClass('scroll-down');
+		}
+	});
+});

themes/ayon/_dev/js/rts_icons.js

@@ -0,0 +1,146 @@
+/* These SVG icons designed by RoyThemes. All rights reserved */
+
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+function regenIcons() {
+  $('i.rts').each(function(i){
+    var rts_icon = $(this).html(),
+        rts_size = $(this).attr('data-size'),
+        rts_color = $(this).attr('data-color'),
+        rts_align = $(this).attr('data-align');
+
+
+    if (rts_icon == 'fav1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M14.05,6.72C8.17.2,2.57,7.54,3.67,11.76,5.56,19,14.05,23.57,14.05,23.57s7.74-4.16,10.39-11.81C25.86,7.64,20.24.13,14.05,6.72Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px"/></svg>'
+    if (rts_icon == 'fav2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M14.63,4l3.53,5.67L24.32,11a.89.89,0,0,1,.49,1.33l-4.18,4.92.5,6.48a.89.89,0,0,1-1.16.78l-6-2.59-6,2.59a.89.89,0,0,1-1.16-.79l.57-6.58L3.06,12.33A.89.89,0,0,1,3.52,11L10.1,9.68,13.2,4A.89.89,0,0,1,14.63,4Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px"/></svg>'
+    if (rts_icon == 'fav3')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M23,6.11C23,4.4,21.29,3,19.19,3H9.81C7.71,3,6,4.4,6,6.11V25.3c0,.77,1.22,1.08,1.75.43L14.5,17.5l6.71,8.18c.54.65,1.79.34,1.79-.44Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px"/></svg>'
+    if (rts_icon == 'acc1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M18.53,8.7c0,3.17-2.09,6.78-4.18,6.78s-4.18-3.61-4.18-6.78S12,4,14.35,4,18.53,5.53,18.53,8.7Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M8.41,17.17A8.13,8.13,0,0,0,6,23a11.46,11.46,0,0,0,.17,2H22.53a11.46,11.46,0,0,0,.17-2,8.13,8.13,0,0,0-2.41-5.87" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'acc2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="14.5" cy="9.5" r="5.5" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M8.46,17.78C6.88,19.66,7,20.07,7,22.92A12.19,12.19,0,0,0,7.18,25H22.36a12.19,12.19,0,0,0,.18-2.08c0-2.85.12-3.26-1.46-5.13" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'acc3')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="14" cy="9" r="5" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M14,18.07c-2.27.53-8.14,1.77-8.14,4.75,0,.75,0,1.48.08,2.18H22.37c0-.71.08-1.43.08-2.18,0-3-6.58-4.22-8.49-4.75" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'acc4')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M23.67,25V22.65A4.67,4.67,0,0,0,19,18H9.67A4.67,4.67,0,0,0,5,22.65V25" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><circle cx="14.33" cy="8.65" r="4.67" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'acc5')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="14.16" cy="9.14" r="2.43" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M8.68,19.49a5.48,5.48,0,1,1,11,0" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><circle cx="14" cy="14" r="11" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'acc6')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M13,25h9a1.83,1.83,0,0,0,1.84-1.79q0-.14,0-.28c0-2.83-7.46-4-9.62-4.51" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M14.22,18.42C11.66,18.92,5,20.09,5,22.93q0,.13,0,.25A1.83,1.83,0,0,0,6.83,25H12" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M10.53,13.95c.81,1,1.89,3.32,3.32,3.32,2.44,0,4.42-3.08,4.42-5.53" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M9,17H6.11l1.11-4.42c0-4.88,3.23-8.84,7.22-8.84s7.22,4,7.22,8.84l1,4.42H19" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M10.53,12.84A12.44,12.44,0,0,0,15,7.32s2.21,5.53,4.42,4.42" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'search1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="13.41" cy="12.91" r="9.41" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><line x1="25.18" y1="23.5" x2="21.65" y2="19.97" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'search2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="14.76" cy="12.91" r="9.41" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><line x1="3" y1="23.5" x2="6.53" y2="19.97" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'search3')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="12.5" cy="12.25" r="8" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><line x1="24.5" y1="24.25" x2="21.07" y2="20.82" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'search4')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><circle cx="16" cy="12.25" r="8" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><line x1="4" y1="24.25" x2="7.43" y2="20.82" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'qv1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>'
+    if (rts_icon == 'qv2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" class="feather feather-move"><polyline points="5 9 2 12 5 15"></polyline><polyline points="9 5 12 2 15 5"></polyline><polyline points="15 19 12 22 9 19"></polyline><polyline points="19 9 22 12 19 15"></polyline><line x1="2" y1="12" x2="22" y2="12"></line><line x1="12" y1="2" x2="12" y2="22"></line></svg>'
+    if (rts_icon == 'discover1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="6" y="14" width="16" height="4" rx="1.6" ry="1.6" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><rect x="2" y="6" width="20" height="4" rx="2" ry="2" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'discover2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12.02" cy="12" r="10" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><polyline points="10.55 8.94 14.51 11.98 10.55 15.06" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'discover3')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="2" y="2" width="8" height="8" rx="3" ry="3" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><rect x="2" y="14" width="8" height="8" rx="3" ry="3" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><rect x="14" y="2" width="8" height="8" rx="3" ry="3" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><rect x="14" y="14" width="8" height="8" rx="3" ry="3" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'discover4')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.85,20.76l8-8.69L12,4a1.7,1.7,0,0,0-2,0L7.91,6.07a1.19,1.19,0,0,0,0,1.58L13,12.06,8,17a1.81,1.81,0,0,0,0,2l2.39,1.74A1,1,0,0,0,11.85,20.76Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7999999523162842px"/></svg>'
+    if (rts_icon == 'discover5')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="feather feather-more-horizontal"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg>'
+    if (rts_icon == 'discover6')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" class="feather feather-fast-forward"><polygon points="13 19 22 12 13 5 13 19"></polygon><polygon points="2 19 11 12 2 5 2 19"></polygon></svg>'
+    if (rts_icon == 'plus')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="Layer_4" data-name="Layer 4"><path d="M14.1,18.3V14.1h4.2a.7.7,0,0,0,.7-.7V10.6a.7.7,0,0,0-.7-.7H14.1V5.7a.7.7,0,0,0-.7-.7H10.6a.7.7,0,0,0-.7.7V9.9H5.7a.7.7,0,0,0-.7.7v2.8a.7.7,0,0,0,.7.7H9.9v4.2a.7.7,0,0,0,.7.7h2.8A.7.7,0,0,0,14.1,18.3Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px"/></g></svg>'
+    if (rts_icon == 'cat_grid')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2px;}</style></defs><rect class="a" x="2" y="2" width="8" height="8" rx="3" ry="3"/><rect class="a" x="2" y="14" width="8" height="8" rx="3" ry="3"/><rect class="a" x="14" y="2" width="8" height="8" rx="3" ry="3"/><rect class="a" x="14" y="14" width="8" height="8" rx="3" ry="3"/></svg>'
+    if (rts_icon == 'cat_list')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2px;}</style></defs><rect class="a" x="2" y="2" width="20" height="4" rx="2" ry="2"/><rect class="a" x="2" y="10" width="20" height="4" rx="2" ry="2"/><rect class="a" x="2" y="18" width="20" height="4" rx="2" ry="2"/></svg>'
+    if (rts_icon == 'cat_filter')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a,.b{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;}.a{stroke-width:2px;}.b{stroke-width:2.3px;}</style></defs><circle class="a" cx="4" cy="8" r="3"/><circle class="a" cx="20" cy="9" r="3"/><circle class="a" cx="12" cy="16" r="3"/><line class="b" x1="20" y1="2" x2="20" y2="5"/><line class="b" x1="4" y1="2" x2="4" y2="4"/><line class="b" x1="4" y1="14.29" x2="4" y2="22.21"/><line class="b" x1="12" y1="20.29" x2="12" y2="22.21"/><line class="b" x1="20" y1="15.29" x2="20" y2="22.21"/><line class="b" x1="12" y1="2" x2="12" y2="12"/></svg>'
+    if (rts_icon == 'round_plus')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5px;}</style></defs><circle class="a" cx="12.02" cy="12" r="10"/><line class="a" x1="8.54" y1="12.08" x2="15.54" y2="12.08"/><line class="a" x1="12.04" y1="15.58" x2="12.04" y2="8.58"/></svg>'
+    if (rts_icon == 'cart1')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20,21H3a1,1,0,0,1-1-1L3,4A1,1,0,0,1,4,3H19a1,1,0,0,1,1,1l1,16A1,1,0,0,1,20,21Z" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><path d="M15,6V9a3.28,3.28,0,0,1-3.5,3A3.28,3.28,0,0,1,8,9V6" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'cart2')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M21.46,26H6.54C4,26,4,23.86,4,22.46V2H24V22.46C24,23.86,24,26,21.46,26Z" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><path d="M10,8v.78c0,2.68,1.8,4.88,4,4.88s4-2.19,4-4.88V8" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'cart3')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M23,7H19V6a4.57,4.57,0,0,0-6.08-4C10.74,2.61,9,4.1,9,6.36V12h2V9h4V7H11V5.94C11,4.41,12.48,4.22,14,4c1.91-.28,3,.08,3,2.21V12h2V9h2l2,16H5L7,8,5,9,3,27H25Z"/></svg>'
+    if (rts_icon == 'cart4')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M23.71,7H19V5.36C19,3.18,17.08,2,14,2S8,3.18,8,5.36V7H4.29A2.29,2.29,0,0,0,2,9.29V22.71A2.29,2.29,0,0,0,4.29,25H23.71A2.29,2.29,0,0,0,26,22.71V9.29A2.29,2.29,0,0,0,23.71,7ZM10,5.36c0-.64,1.4-1.6,3.5-1.6s3.5,1,3.5,1.6V7H10ZM24,23H4V9H8v5h2V9H24Z"/><rect x="16" y="12" width="3" height="2"/></svg>'
+    if (rts_icon == 'cart5')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M10,10V6.75c0-2.33,0-3.5,3.5-4.67A2.82,2.82,0,0,1,17,4.42V9" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:1.75px"/><polygon points="3.5 25.05 6.94 7.88 20.68 6.74 22.96 25.05 9.23 26.2 3.5 25.05" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:1.75px"/><line x1="6.94" y1="7.88" x2="9.23" y2="26.2" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:1.75px"/></svg>'
+    if (rts_icon == 'cart6')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><polygon points="6.78 7 6.17 18 21.45 18 25.12 7 6.78 7" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:1.8px"/><line x1="2" y1="3" x2="12" y2="3" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/><circle cx="9" cy="23" r="2"/><circle cx="16" cy="23" r="2"/></svg>'
+    if (rts_icon == 'cart7')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28"><defs><linearGradient id="a" x1="11.69" y1="24.1" x2="14.19" y2="24.1" gradientTransform="matrix(-1, 0, 0, 1, 30, 0)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="1"/></linearGradient><linearGradient id="b" x1="19.18" y1="24.1" x2="21.68" y2="24.1" xlink:href="#a"/></defs><path d="M15.81,22.85c0,2.5.56,2.5,1.25,2.5a1.25,1.25,0,0,0,1.25-1.25" style="stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px;fill:url(#a)"/><path d="M8.32,22.85c0,2.5.56,2.5,1.25,2.5a1.25,1.25,0,0,0,1.25-1.25" style="stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px;fill:url(#b)"/><path d="M26.56,3.4,23,7l-4.8,12H8.56L3.76,9.4C2.56,7,5,7,5,7H17" style="fill:none;stroke:' + rts_color + ';stroke-miterlimit:10;stroke-width:2px"/></svg>'
+    if (rts_icon == 'cart8')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M6.67,2,3,6.8V23.6A2.4,2.4,0,0,0,5.4,26H22.6A2.4,2.4,0,0,0,25,23.6V6.8L21.33,2Z" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><line x1="3" y1="7" x2="25" y2="7" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/><path d="M19,11.61a4.8,4.8,0,1,1-9.59,0" style="fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px"/></svg>'
+    if (rts_icon == 'truck')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;}</style></defs><circle class="a" cx="7" cy="19" r="3"/><circle class="a" cx="18.06" cy="19" r="3"/><path class="a" d="M18.95,6H15c-1.1,0-1,3.9-1,5v5a2,2,0,0,0,1.29,1.86,3,3,0,0,1,5.59.14h.07a2,2,0,0,0,2-2V11C22.95,9.93,20.17,6.46,18.95,6Z"/><path class="a" d="M14,10H2c-1.1,0-1,1.9-1,3v3a2,2,0,0,0,2,2H4.18a3,3,0,0,1,5.63,0H12a2,2,0,0,0,2-2V10Z"/><rect class="a" x="3" y="6" width="5" height="4"/><rect class="a" x="8" y="7" width="3" height="3"/><line class="a" x1="16.76" y1="11" x2="21.06" y2="11"/></svg>'
+    if (rts_icon == 'security')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;}</style></defs><line class="a" x1="4" y1="7.13" x2="11" y2="2.83"/><path class="a" d="M4,9s.5,11,7,13"/><line class="a" x1="19" y1="7.13" x2="12" y2="2.83"/><path class="a" d="M19,9s-.5,11-7,13"/><line class="a" x1="8.97" y1="12.68" x2="11.35" y2="14.76"/><line class="a" x1="11.21" y1="14.44" x2="14.69" y2="9.72"/></svg>'
+    if (rts_icon == 'return')
+      var svg_current = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:' + rts_color + ';stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;}</style></defs><rect class="a" x="7" y="12" width="10" height="10" rx="1.87" ry="1.87"/><path class="a" d="M13,8h5.68A2.32,2.32,0,0,1,21,10.32V16"/><line class="a" x1="8.83" y1="11.43" x2="12.86" y2="8.5"/><line class="a" x1="21" y1="17.63" x2="18.17" y2="20.59"/><line class="a" x1="2.74" y1="3.13" x2="19.83" y2="3.13"/><line class="a" x1="18.25" y1="1" x2="22.16" y2="3.13"/><line class="a" x1="21.45" y1="3.13" x2="18.28" y2="5.04"/><line class="a" x1="10" y1="6" x2="4" y2="6"/><line class="a" x1="2.28" y1="6.1" x2="5.45" y2="8.02"/></svg>'
+
+
+      if (typeof rts_size !== typeof undefined && rts_size !== false) {
+        $(this).html(svg_current).css({
+           'width' : rts_size,
+           'height' : rts_size
+        });
+        $(this).find('svg').css({
+           'width' : rts_size,
+           'height' : rts_size
+        });
+      } else {
+        $(this).html(svg_current).css({
+           'width' : 24,
+           'height' : 24
+        });
+        $(this).find('svg').css({
+           'width' : 24,
+           'height' : 24
+        });
+      }
+      if (typeof rts_align !== typeof undefined && rts_align !== false) {
+        if (rts_align == 'left')
+          $(this).css({
+             'float' : 'left',
+             'margin-right' : '10px'
+          });
+        if (rts_align == 'right')
+          $(this).css({
+             'float' : 'right',
+             'margin-left' : '10px'
+          });
+      }
+
+  });
+}
+regenIcons();
+
+
+$(document).ready(function () {
+     if(typeof prestashop !== 'undefined') {
+         prestashop.on(
+           'updatedProduct',
+           function (event) {
+               regenIcons();
+           }
+         );
+         prestashop.on(
+           'updateProductList',
+           function (event) {
+               regenIcons();
+           }
+         );
+         prestashop.on('updatedCart', () => {
+             regenIcons();
+           }
+         );
+     }
+  });

themes/ayon/_dev/js/sliders.js

@@ -0,0 +1,95 @@
+import $ from 'jquery';
+import { flickity } from "../node_modules/flickity/dist/flickity.pkgd.min";
+
+$(document).on('ready', function(){
+
+  var $sliders = $('.slideme');
+  $sliders.on('dragStart.flickity', () => $sliders.find('.flickity-slider > *').css('pointer-events', 'none'));
+  $sliders.on('dragEnd.flickity', () => $sliders.find('.flickity-slider > *').css('pointer-events', 'all'));
+
+  function sliders_def() {
+    // HP sliders
+    $('.featured-products.slideme .products').each(function() {
+      var hasAuto = ($(this).parent('.featured-products').attr('data-auto') === 'true') ? 4400 :false;
+      $(this).flickity({
+        autoPlay: hasAuto,
+        contain: true,
+        draggable:1,
+        prevNextButtons: true,
+        pageDots: false,
+        cellAlign: 'left',
+        arrowShape: {
+          x0: 20,
+          x1: 60, y1: 50,
+          x2: 75, y2: 50,
+          x3: 35
+        }
+      })
+    });
+
+    // Specials column slider
+    $('#roy_specials_col .products').flickity({
+      autoPlay: 4400,
+      contain: true,
+      draggable:1,
+      prevNextButtons: true,
+      imagesLoaded: true,
+      pageDots: false,
+      arrowShape: {
+        x0: 20,
+        x1: 60, y1: 50,
+        x2: 75, y2: 50,
+        x3: 35
+      }
+    });
+
+    // Brands slider
+    $('.roy_brands_ul').flickity({
+      contain: true,
+      draggable:1,
+      prevNextButtons: true,
+      pageDots: false,
+      cellAlign: 'left',
+      arrowShape: {
+        x0: 20,
+        x1: 60, y1: 50,
+        x2: 75, y2: 50,
+        x3: 35
+      }
+    });
+
+    // Blog Latest posts slider
+    $('.blogslider').flickity({
+      contain: true,
+      draggable:1,
+      prevNextButtons: true,
+      pageDots: false,
+      arrowShape: {
+        x0: 20,
+        x1: 60, y1: 50,
+        x2: 75, y2: 50,
+        x3: 35
+      }
+    });
+
+    // Product page products sliders
+    $('#product .products').flickity({
+      draggable:1,
+      prevNextButtons: true,
+      pageDots: false,
+      cellAlign: 'center',
+      contain: true,
+      arrowShape: {
+        x0: 20,
+        x1: 60, y1: 50,
+        x2: 75, y2: 50,
+        x3: 35
+      }
+    });
+  }
+
+  $(window).load(function() {
+    sliders_def();
+  });
+
+});

themes/ayon/_dev/js/theme.js

@@ -0,0 +1,626 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import 'expose-loader?Tether!tether';
+import 'bootstrap/dist/js/bootstrap.min';
+import 'flexibility';
+import 'bootstrap-touchspin';
+
+import './responsive';
+import './checkout';
+import './customer';
+import './listing';
+import './product';
+import './cart';
+import './rts_icons';
+import './sliders';
+import './county';
+
+import DropDown from './components/drop-down';
+import Form from './components/form';
+import ProductMinitature from './components/product-miniature';
+import ProductSelect from './components/product-select';
+import TopMenu from './components/top-menu';
+
+import prestashop from 'prestashop';
+import EventEmitter from 'events';
+
+import './lib/bootstrap-filestyle.min';
+import './lib/jquery.scrollbox.min';
+import './lib/jquery.sticky-kit.min.js';
+import './lib/animsition.min';
+
+import './components/block-cart';
+
+// "inherit" EventEmitter
+for (var i in EventEmitter.prototype) {
+  prestashop[i] = EventEmitter.prototype[i];
+}
+
+$(document).ready(() => {
+  let dropDownEl = $('.js-dropdown');
+  const form = new Form();
+  let topMenuEl = $('.js-top-menu ul[data-depth="0"]');
+  let dropDown = new DropDown(dropDownEl);
+  let topMenu = new TopMenu(topMenuEl);
+  let productMinitature = new ProductMinitature();
+  let productSelect  = new ProductSelect();
+  dropDown.init();
+  form.init();
+  topMenu.init();
+  productMinitature.init();
+  productSelect.init();
+
+  $('.form-control-select').change(function(){
+    this.blur();
+  });
+
+  if ( $('.page-footer').children().length == 0 ) {
+    $('.page-footer').addClass('hidden');
+  }
+
+  // Sticky header
+
+  if ($('#header').attr('data-trans') == 'normal') {
+    var sticky_classes = 'sticky';
+  } else {
+    var sticky_classes = 'sticky normal';
+  }
+
+  var header_trans = function(){
+    if ($('#header').attr('data-trans') == 'normal') {
+      setTimeout(function() {
+        var header_height = $('#header').height();
+        $('main').css('padding-top', header_height);
+      }, 250);
+    } else {
+      var header_height = $('#header').height();
+      $('#top_column').css('min-height', header_height);
+    }
+  };
+
+  header_trans();
+
+  var sticky = function(){
+    $('#header').addClass(sticky_classes);
+  };
+  var stickyfrom = 0;
+
+  if ($(window).scrollTop() > stickyfrom) sticky();
+  if (window.matchMedia('(max-width: 991px)').matches) sticky();
+
+  $(window).scroll(function() {
+      if ($(this).scrollTop() > stickyfrom){
+              sticky();
+          } else {
+          if (window.matchMedia('(min-width: 992px)').matches) {
+              $('#header').removeClass(sticky_classes);
+          }
+      }
+  });
+
+  $(window).on('resize', function(){
+      if (window.matchMedia('(max-width: 991px)').matches) {
+          header_trans();
+          sticky();
+      } else {
+          header_trans();
+          if ($(this).scrollTop() == stickyfrom){
+              $('#header').removeClass(sticky_classes);
+          }
+      }
+  });
+
+  // Hide header on scroll
+  if ($('#header').attr('data-hide') == 'yes') {
+
+    var didScroll;
+    var lastScrollTop = 500;
+    var delta = 5;
+
+    $(window).scroll(function(event){
+        didScroll = true;
+    });
+
+    setInterval(function() {
+        if (didScroll) {
+            hasScrolled();
+            didScroll = false;
+        }
+    }, 250);
+
+    function hasScrolled() {
+        var st = $(window).scrollTop();
+        if(Math.abs(lastScrollTop - st) <= delta)
+            return;
+
+        if (st > lastScrollTop && st > 500){
+            // Scroll Down
+            $('#header').addClass('hide_up');
+        } else {
+            // Scroll Up
+            if(st + $(window).height() < $(document).height()) {
+                $('#header').removeClass('hide_up');
+            }
+        }
+        lastScrollTop = st;
+    }
+  }
+
+  // page reload
+  $(".animsition").animsition({
+    inClass: 'fade-in',
+    outClass: 'fade-out',
+    inDuration: 600,
+    outDuration: 600,
+    linkElement: 'a.noloader',
+    // e.g. linkElement: 'a:not([target="_blank"]):not([href^="#"])'
+    loading: false,
+    loadingParentElement: 'body', //animsition wrapper element
+    loadingClass: 'animsition-loading',
+    loadingInner: '', // e.g '<img src="loading.svg" />'
+    timeout: true,
+    timeoutCountdown: 300,
+    onLoadEvent: true,
+    browser: [ 'animation-duration', '-webkit-animation-duration'],
+    // "browser" option allows you to disable the "animsition" in case the css property in the array is not supported by your browser.
+    // The default setting is to disable the "animsition" in a browser that does not support "animation-duration".
+    overlay : false,
+    overlayClass : 'animsition-overlay-slide',
+    overlayParentElement : 'body',
+    transition: function(url){ window.location.href = url; }
+  });
+
+  $('.animsition').on('animsition.outStart', function(){
+  	var exitDiv = $('.roy-loader');
+    exitDiv.fadeIn('slow');
+	});
+  $('.animsition').on('animsition.inStart', function(){
+  	var exitDiv = $('.roy-loader');
+  	exitDiv.fadeOut(400);
+	});
+
+
+  // 2020 filter mobile side
+  $('body').on('click', '#search_filter_toggler', function () {
+    $('body').addClass('filter_open');
+  });
+  $('.filter_close, .closefilters').click(function () {    
+    $('body').removeClass('filter_open');
+  });
+
+
+  // side
+  // side: reopen function for mobile and open for desktop
+  var reopen = function() {
+      if($('body').hasClass('side_open')) {
+
+        $('body').removeClass('side_content');
+        $('.side_menu').removeClass('reopen_go').addClass('reopen_hide');
+        setTimeout(function(){
+          $('body').addClass('side_content');
+        }, 320);
+        setTimeout(function(){
+          $('.side_menu').removeClass('reopen_hide').addClass('reopen_go');
+        }, 600);
+
+      } else {
+          $('body').addClass('side_open side_content was_open')
+      }
+  }
+
+  var searchtoside = function() {
+    $('.action .search-widget').attr("id","");
+    $('.side_menu .search-widget').attr("id","search_widget");
+  }
+
+  searchtoside();
+
+  // side: close
+  $('.side_close, .close_cross, .return').click(function () {    
+      $('body').removeClass('side_open side_content filter_open');
+      cartprodshide();
+      accsidehide();
+      setTimeout(function(){
+        $('body').removeClass('was_open');
+      }, 440);
+  });
+
+  var cartprodshide = function () {
+    $('.side_menu').find('.cart-prods > li').each(function(i){
+      $(this).removeClass('show');
+    });
+  }
+  var cartprodsshow = function () {
+    $('.side_menu').find('.cart-prods > li').each(function(i){
+      var row = $(this);
+      setTimeout(function(){
+        row.addClass('show');
+      }, 300 + i * 220);
+    });
+  }
+  var accsidehide = function () {
+    $('.side_menu').find('.acc_ul > *').each(function(i){
+      $(this).removeClass('show');
+    });
+  }
+  var accsideshow = function () {
+    $('.side_menu').find('.acc_ul > *').each(function(i){
+      var row = $(this);
+      setTimeout(function(){
+        row.addClass('show');
+      }, 300 + i * 120);
+    });
+  }
+  var scrollsidetop = function () {
+    setTimeout(function(){
+      $('html, body').animate({
+        scrollTop: $(".side_menu").offset().top
+      }, 1000);
+    }, 980);
+  }
+
+  // action on click
+  var sm = $('.side_menu');
+  var aoc_m = sm.attr('data-menu'),
+      aoc_s = sm.attr('data-search'),
+      aoc_c = sm.attr('data-cart'),
+      aoc_a = sm.attr('data-acc');
+
+
+$(window).on('load resize', function(){
+  if (window.matchMedia('(min-width: 992px)').matches) {
+
+    $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_c);
+
+    $('.menu_top').hover(function(){
+      $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_m);
+    });
+    $('.search-widget').hover(function(){
+      $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_s);
+    });
+    $('.cart_widget, .add_wrap, .add-to-cart').hover(function(){
+      $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_c);
+    });
+    $('.acc_top').hover(function(){
+      $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_a);
+    });
+  } else {
+    $('body').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay1');
+  }
+});
+
+  // side: open, levibox clicks
+  var cart_click = function (e) {
+      e.preventDefault();
+      accsidehide();
+      reopen();
+      $('.side_menu .side_menu_rel > div').removeClass('show');
+      $('#side_cart_wrap').addClass('show');
+      $('.side_close').removeClass('search_close menu_close acc_close').addClass('cart_close');
+      $('.side_close i').toggleClass('rotateit');
+      if($('.side_menu').hasClass('reopen_hide')) {
+        setTimeout(function(){
+          cartprodsshow();
+        }, 320);
+      } else {
+        cartprodsshow();
+      }
+  }
+  var search_click = function (e) {
+      e.preventDefault();
+      accsidehide();
+      cartprodshide();
+      $('.side_menu').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_s);
+      reopen();
+      searchtoside();
+      $('.side_menu .side_menu_rel > div').removeClass('show');
+      $('#side_search_wrap').addClass('show');
+
+      $('.side_close').removeClass('cart_close menu_close acc_close').addClass('search_close');
+      $('.side_close i').toggleClass('rotateit');
+
+      setTimeout(function(){
+        $('.side_menu .search-widget form input[type=text]').focus();
+      }, 1000);
+
+  }
+  var menu_click = function (e) {
+      e.preventDefault();
+      accsidehide();
+      cartprodshide();
+      $('.side_menu').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_m);
+      reopen();
+      $('.side_menu .side_menu_rel > div').removeClass('show');
+      $('#side_menu_wrap').addClass('show');
+      $('.side_close').removeClass('cart_close search_close acc_close').addClass('menu_close');
+      $('.side_close i').toggleClass('rotateit');
+  }
+  var acc_click = function (e) {
+      e.preventDefault();
+      cartprodshide();
+      $('.side_menu').removeClass('side_lay1 side_lay2 side_lay3').addClass('side_lay' + aoc_a);
+      reopen();
+      $('.side_menu .side_menu_rel > div').removeClass('show');
+      $('#side_acc_wrap').addClass('show');
+      $('.side_close').removeClass('cart_close search_close menu_close').addClass('acc_close');
+      $('.side_close i').toggleClass('rotateit');
+      if($('.side_menu').hasClass('reopen_hide')) {
+        setTimeout(function(){
+          accsideshow();
+        }, 320);
+      } else {
+        accsideshow();
+      }
+  }
+
+  $('.box-cart').off("click", cart_click).on("click", cart_click);
+  $('.box-search').off("click", search_click).on("click", search_click);
+  $('.box-menu').off("click", menu_click).on("click", menu_click);
+  $('.box-acc').off("click", acc_click).on("click", acc_click);
+
+  $('#header .row.action .blockcart a.cart_nogo').off("click", cart_click).on("click", cart_click);
+  $('#header .row.action .search_nogo').off("click", search_click).on("click", search_click);
+
+  // mobile - desktop switch
+  if ($('#is_media').css('float') == 'left') {
+
+      $('body').addClass('mob_enabled');
+
+  } else {
+      $('body').removeClass('mob_enabled');
+      $('body').removeClass('side_open side_content');
+  }
+
+  $(window).on('resize', function(){
+      if ($('#is_media').css('float') == 'left') {
+          $('body').addClass('mob_enabled');
+      } else {
+          // $('body').removeClass('mob_enabled');
+          // $('body').removeClass('side_open side_content');
+      }
+  });
+
+});
+
+// special label height
+$(window).load(function() {
+  setTimeout(function() {
+    $('#header').css('opacity','1');
+  }, 400);
+  setTimeout(function() {
+    $('#wrapper').css('opacity','1');
+  }, 700);
+  setTimeout(function() {
+    $('.breadcrumb').css({
+      'opacity':'1',
+      'transform':'matrix(1, 0, 0, 1, 0, 0)',
+    });
+  }, 750);
+});
+
+// 1.1 fix slash after home category
+var breadlast = $('.breadcrumb > ol > li:last-child').find("span[itemprop*='name']");
+if($.trim(breadlast.html())=='') {
+  breadlast.parent().prev().addClass('noafter');
+}
+
+// tooltip
+
+
+function uitiprun() {
+
+  var $uiEl = $('.tip_inside');
+  $('body').append('<div id="ui_tip"><div class="ui_wrapper"><span class="ui_title"></span></div></div>');
+  var $uiTip = $('#ui_tip');
+  var $uiTipTitle = $uiTip.find('.ui_title');
+
+  $uiEl.on('mousemove', function(e) {
+    $uiTip.css({
+      top: e.clientY,
+      left: e.clientX
+    });
+
+    var winwidth = $(window).width(),
+        tipwidth = $('#ui_tip').width(),
+        tiprightdot = e.clientX + tipwidth + 14 + 40; // plus 40 padding compensation
+
+    if (tiprightdot > winwidth) {
+      $('#ui_tip').addClass('align-right');
+    } else {
+      $('#ui_tip').removeClass('align-right');
+    }
+  });
+
+  $uiEl.on('mouseover', function(e) {
+    $uiTipTitle.text($(this).find('.tip').text());
+    setTimeout(function() {
+      $uiTip.addClass('active')
+    }, 10);
+  }).on('mouseout', function(e) {
+    setTimeout(function() {
+      $uiTip.removeClass('active');
+    }, 10);
+  });
+
+  $(window).scroll(function() {
+    setTimeout(function() {
+      if($uiTip.hasClass('active')) {
+        $uiTip.removeClass('active');
+      }
+    }, 200);
+  });
+
+}
+
+$(document).ready(() => {
+  uitiprun();
+});
+
+
+// product 3rd lay
+$('body').append('<div id="ui_prod"><div class="ui_wrapper"><span class="ui_name"><span></span></span><div><span class="ui_price"></span></div></div></div>');
+var $uiProd = $('article.pl_lay3'),
+    $uiProdTip = $('#ui_prod'),
+    $uiProdName = $uiProdTip.find('.ui_name > span'),
+    $uiProdPrice = $uiProdTip.find('.ui_price');
+
+$uiProd.on('mousemove', function(e) {
+  $uiProdTip.css({
+    top: e.clientY,
+    left: e.clientX
+  });
+  var winwidth = $(window).width(),
+      tipwidth = $('#ui_prod').width(),
+      tiprightdot = e.clientX + tipwidth + 54;
+  if (tiprightdot > winwidth) {
+    $('#ui_prod').addClass('align-right');
+  } else {
+    $('#ui_prod').removeClass('align-right');
+  }
+});
+
+$uiProd.find('.product-thumbnail').on('mouseover', function(e) {
+
+  $uiProdName.text($(this).closest('article').find('.product-title').text());
+  $uiProdPrice.html($(this).closest('article').find('.product-price-and-shipping').html());
+  setTimeout(function() {
+    $uiProdTip.addClass('active')
+  }, 10);
+
+  $(this).closest('article').find('.tip_inside').on('mouseover', function(e) {
+    console.log('inner');
+    $uiProdTip.removeClass('active');
+  }).on('mouseout', function(e) {
+    $uiProdTip.addClass('active')
+  });
+
+}).on('mouseleave', function(e) {
+  $uiProdTip.removeClass('active');
+});
+
+
+// Sticky Right Column PP
+var pp_stick = $('.pp_stick_it'),
+    pp_stick_ops = {
+        parent: '.pp_stick_parent',
+        offset_top: 90
+    };
+
+$(window).on('load resize', function(){
+  setTimeout(function() {
+
+      if (window.matchMedia('(min-width: 992px)').matches) {
+          pp_stick.stick_in_parent(pp_stick_ops);
+      } else {
+          pp_stick.trigger("sticky_kit:detach");
+      }
+
+  },750);
+
+});
+
+
+// Roy Countdowns
+$(document).ready(function($){
+    $( ".roycount" ).each(function(e) {
+        var $roycount = $(this);
+        var $dataspecificpriceto = $roycount.attr('data-specific-price-to');
+        $roycount.closest('.roycountdown').county({
+            endDateTime: new Date($dataspecificpriceto.replace(/-/g, "/")) , reflection: false, animation: 'none', theme: 'black',
+            titleDays:$roycount.data('days'),titleHours:$roycount.data('hours'),titleMinutes:$roycount.data('minutes'),titleSeconds:$roycount.data('seconds')
+        });
+    })
+});
+
+// Youtube responsive
+$(function() {
+
+    var $allVideos = $(".page-cms iframe[src^='//player.vimeo.com'], .page-cms iframe[src^='https://player.vimeo.com'], .page-cms iframe[src^='//www.youtube.com'], .page-cms iframe[src^='https://www.youtube.com'], .page-cms iframe[src^='http://www.youtube.com'], .page-cms object, .page-cms embed"),
+        $allVideosPPS = $("#short_description_content iframe[src^='//player.vimeo.com'], #short_description_content iframe[src^='https://player.vimeo.com'], #short_description_content iframe[src^='//www.youtube.com'], #short_description_content iframe[src^='https://www.youtube.com'], #short_description_content iframe[src^='http://www.youtube.com'], #short_description_content object, #short_description_content embed"),
+        $fluidElPPS = $("#short_description_content"),
+        $allVideosPPF = $("#idTab1 iframe[src^='//player.vimeo.com'], #idTab1 iframe[src^='https://player.vimeo.com'], #idTab1 iframe[src^='//www.youtube.com'], #idTab1 iframe[src^='https://www.youtube.com'], #idTab1 iframe[src^='http://www.youtube.com'], #idTab1 object, #idTab1 embed"),
+        $fluidElPPF = $("#idTab1"),
+        $allVideosB = $("#module-smartblog-details iframe[src^='//player.vimeo.com'], #module-smartblog-details iframe[src^='https://player.vimeo.com'], #module-smartblog-details iframe[src^='//www.youtube.com'], #module-smartblog-details iframe[src^='https://www.youtube.com'], #module-smartblog-details iframe[src^='http://www.youtube.com'], #module-smartblog-details object, #module-smartblog-details embed"),
+        $fluidElB = $("#module-smartblog-details #content"),
+        $allVideosRC = $(".video_banner iframe[src^='//player.vimeo.com'], .video_banner iframe[src^='https://player.vimeo.com'], .video_banner iframe[src^='//www.youtube.com'], .video_banner iframe[src^='https://www.youtube.com'], .video_banner iframe[src^='http://www.youtube.com'], .video_banner object, .video_banner embed");
+
+    $allVideos.each(function() {
+
+        $(this)
+            // jQuery .data does not work on object/embed elements
+            .attr('data-aspectRatio', this.height / this.width)
+            .removeAttr('height')
+            .removeAttr('width');
+
+    });
+
+    $(window).resize(function() {
+
+        var newWidthPPS = $fluidElPPS.width();
+        var newWidthPPF = $fluidElPPF.width();
+        var newWidthB = $fluidElB.width();
+
+        $allVideos.each(function() {
+
+            var $el = $(this);
+            var $fluidEl = $el.parent();
+            var newWidth = $fluidEl.width();
+            $el
+                .width(newWidth)
+                .height(newWidth * $el.attr('data-aspectRatio'));
+
+        });
+
+        $allVideosB.each(function() {
+            var $el = $(this);
+            $el
+                .width(newWidthB)
+                .height(newWidthB * $el.attr('data-aspectRatio'));
+        });
+        $allVideosPPS.each(function() {
+            var $el = $(this);
+            $el
+                .width(newWidthPPS)
+                .height(newWidthPPS * $el.attr('data-aspectRatio'));
+        });
+        $allVideosPPF.each(function() {
+            var $el = $(this);
+            $el
+                .width(newWidthPPF)
+                .height(newWidthPPF * $el.attr('data-aspectRatio'));
+        });
+        $allVideosRC.each(function() {
+
+            var $el = $(this);
+            var $fluidElRC = $el.closest('.video_banner');
+            var newWidthRC = $fluidElRC.width();
+            $el
+                .width(newWidthRC)
+                .height(newWidthRC * $el.attr('data-aspectRatio'));
+        });
+
+    }).resize();
+
+});

themes/ayon/_dev/package.json

@@ -0,0 +1,54 @@
+{
+    "name": "prestashop-classic-dev-tools",
+    "version": "1.0.0",
+    "description": "Tools to help while developing the Classic theme",
+    "main": "index.js",
+    "scripts": {
+        "watch": "cross-env NODE_ENV=development webpack --watch",
+        "build": "cross-env NODE_ENV=production webpack"
+    },
+    "author": "PrestaShop",
+    "license": "AFL-3.0",
+    "devDependencies": {
+        "autoprefixer": "^6.7.7",
+        "babel-core": "6",
+        "babel-loader": "^7.1.2",
+        "bootstrap": "4.0.0-alpha.5",
+        "bootstrap-touchspin": "^3.1.1",
+        "bourbon": "^4.2.6",
+        "browser-sync": "^2.23.6",
+        "browser-sync-dev-hot-webpack-plugin": "^0.2.0",
+        "bs-html-injector": "^3.0.3",
+        "cross-env": "^5.1.3",
+        "css-loader": "^0.27.3",
+        "del": "^3.0.0",
+        "expose-loader": "^0.7.3",
+        "extract-text-webpack-plugin": "^3.0.2",
+        "file-loader": "^0.10.1",
+        "flexibility": "^1.0.5",
+        "hard-source-webpack-plugin": "^0.5.16",
+        "jquery": "^2.1.4",
+        "material-design-icons": "^2.1.3",
+        "node-object-hash": "^1.3.0",
+        "node-sass": "^4.5.0",
+        "notosans-fontface": "~1.0.1",
+        "postcss-flexibility": "^1.0.2",
+        "postcss-loader": "^1.3.3",
+        "sass-loader": "^6.0.3",
+        "style-loader": "^0.14.0",
+        "tether": "^1.1.1",
+        "uglifyjs-webpack-plugin": "^1.1.8",
+        "velocity-animate": "^1.2.3",
+        "webpack": "^3.10.0",
+        "webpack-bundle-analyzer": "^2.9.2",
+        "webpack-dev-middleware": "^2.0.4",
+        "webpack-hot-middleware": "^2.21.0",
+        "webpack-merge": "^4.1.1",
+        "webpack-sources": "^0.1.0"
+    },
+    "dependencies": {
+        "babel-preset-env": "^1.7.0",
+        "flickity": "^2.1.2",
+        "tiny-slider": "^2.9.1"
+    }
+}

themes/ayon/_dev/postcss.config.js

@@ -0,0 +1,29 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.txt.
+ * 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.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+module.exports = {
+  plugins: [
+    require('autoprefixer')
+  ]
+}

themes/ayon/_dev/webpack.config.js

@@ -0,0 +1,17 @@
+const merge = require("webpack-merge");
+const { addHotMiddleware, DEV } = require("./_webpack/util.js");
+
+let webpackConfig = require("./_webpack/webpack.default.js");
+
+if (DEV) {
+	webpackConfig = merge(
+		Array.of(webpackConfig, require("./_webpack/webpack.development.js"))
+	);
+	webpackConfig.entry = addHotMiddleware(webpackConfig.entry);
+} else {
+	webpackConfig = merge(
+		Array.of(webpackConfig, require("./_webpack/webpack.production.js"))
+	);
+}
+
+module.exports = webpackConfig;

themes/ayon/assets/css/0266b05265f317a7409560b751cd61e8.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
+<g>
+	<image overflow="visible" opacity="0.1" width="42" height="42" xlink:href="1BA08623.png" >
+	</image>
+	<g>
+		<path fill="#FFFFFF" d="M28.9,5.6H11.1C8,5.6,5.6,8,5.6,11.1V17v11.8c0,3.1,2.5,5.5,5.5,5.5h17.7c3.1,0,5.5-2.5,5.5-5.5V17v-5.9
+			C34.4,8,32,5.6,28.9,5.6z M30.5,8.9h0.6v0.6v4.3h-4.9V8.9H30.5z M15.9,17c0.9-1.2,2.5-2.1,4.1-2.1s3.2,0.9,4.1,2.1
+			c0.6,0.9,1,1.8,1,3c0,2.8-2.3,5.1-5.1,5.1c-2.7,0-5.1-2.2-5.1-5.1C14.9,18.9,15.3,17.9,15.9,17z M31.6,28.9c0,1.5-1.2,2.7-2.7,2.7
+			H11.1c-1.5,0-2.7-1.2-2.7-2.7V17h4.3c-0.4,0.9-0.6,2-0.6,3c0,4.3,3.6,7.9,7.9,7.9s7.9-3.6,7.9-7.9c0-1-0.2-2.1-0.6-3h4.3
+			L31.6,28.9L31.6,28.9z"/>
+	</g>
+</g>
+</svg>

themes/ayon/assets/css/082a71677e756fb75817e8f262a07cb4.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="45px" height="45px" viewBox="0 0 45 45" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 42 (36781) - http://www.bohemiancoding.com/sketch -->
+    <title>Artboard 3</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Artboard-3" fill-rule="nonzero" fill="#7A7A7A">
+            <g id="svg+xml" transform="translate(16.000000, 8.000000)">
+                <g id="Calque_1">
+                    <g id="Group">
+                        <path d="M9.2,22.2 L9.2,15 L11.2,15 C12.7,15 13.2,15 13.2,14.9 C13.2,14.8 13.3,13.9 13.4,12.8 C13.5,11.7 13.6,10.6 13.6,10.4 L13.6,10 L11.4,10 L9.2,10 L9.2,8.4 C9.2,7.5 9.3,6.6 9.4,6.5 C9.6,6 10.1,5.8 12,5.8 L13.7,5.8 L13.7,3.3 L13.7,0.8 L11,0.8 C8,0.8 7.2,0.9 6,1.5 C5.2,1.9 4.4,2.7 4,3.4 C3.5,4.5 3.3,5.2 3.3,7.7 L3.2,10 L1.7,10 L0.2,10 L0.2,12.5 L0.2,15 L1.7,15 L3.2,15 L3.2,22.2 L3.2,29.4 L6.2,29.4 L9.2,29.4 L9.2,22.2 Z" id="Shape"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

themes/ayon/assets/css/180a6ca60002b6b9a88b1977232f25fb.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-facebook"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg>

themes/ayon/assets/css/1fe436a84ab9fcfd5cdb30d769c1ef0a.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-youtube"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"></path><polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon></svg>

themes/ayon/assets/css/20e8982ec7e03638afe27f5c3e897681.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>

themes/ayon/assets/css/22c0528acb6d9cd5bf4c8f96381bc05c.svg

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
+<g>
+	<image overflow="visible" opacity="0.1" width="39" height="39" xlink:href="5CBF449C.png"  transform="matrix(1 0 0 1 2 1)">
+	</image>
+	<g>
+		<g>
+			<g>
+				<path fill="#FFFFFF" d="M22.9,22c-0.4,0-0.8,0.2-1.2,0.7V20h-1.1v8.4h1.1v-0.6c0.4,0.5,0.8,0.7,1.2,0.7c0.5,0,0.8-0.2,0.9-0.7
+					c0.1-0.2,0.1-0.7,0.1-1.2V24c0-0.6,0-1-0.1-1.3C23.7,22.3,23.4,22,22.9,22z M22.8,26.6c0,0.6-0.2,0.8-0.5,0.8
+					c-0.2,0-0.4-0.1-0.6-0.3v-3.8c0.2-0.2,0.4-0.3,0.6-0.3c0.3,0,0.5,0.3,0.5,0.9V26.6z"/>
+				<path fill="#FFFFFF" d="M26.5,22c-0.6,0-1,0.2-1.4,0.6c-0.2,0.3-0.3,0.8-0.3,1.5v2.2c0,0.7,0.1,1.2,0.4,1.5
+					c0.3,0.4,0.8,0.6,1.4,0.6c0.6,0,1.1-0.2,1.4-0.7c0.1-0.2,0.2-0.4,0.3-0.7c0-0.2,0-0.4,0-0.7v-0.2h-1.2c0,0.1,0,0.2,0,0.4
+					s0,0.2,0,0.3c0,0.1,0,0.1,0,0.1c-0.1,0.3-0.2,0.4-0.5,0.4c-0.4,0-0.6-0.3-0.6-0.9v-1.1h2.3v-1.3c0-0.7-0.1-1.1-0.4-1.5
+					C27.6,22.2,27.1,22,26.5,22z M27.1,24.5H26v-0.6c0-0.6,0.2-0.9,0.6-0.9c0.4,0,0.6,0.3,0.6,0.9V24.5L27.1,24.5z"/>
+				<path fill="#FFFFFF" d="M18.5,26.9c-0.2,0.4-0.5,0.5-0.7,0.5c-0.2,0-0.2-0.1-0.3-0.3c0,0,0-0.2,0-0.4v-4.6h-1.1V27
+					c0,0.4,0,0.7,0.1,0.9c0.1,0.3,0.3,0.5,0.7,0.5c0.4,0,0.9-0.3,1.3-0.8v0.7h1.1v-6.3h-1.1L18.5,26.9L18.5,26.9L18.5,26.9z"/>
+				<path fill="#FFFFFF" d="M20,15.7c0.4,0,0.5-0.3,0.5-0.9v-2.7c0-0.6-0.2-0.9-0.5-0.9c-0.4,0-0.5,0.3-0.5,0.9v2.7
+					C19.4,15.4,19.6,15.7,20,15.7z"/>
+				<polygon fill="#FFFFFF" points="12.3,21.1 13.6,21.1 13.6,28.4 14.9,28.4 14.9,21.1 16.2,21.1 16.2,20 12.3,20 				"/>
+				<path fill="#FFFFFF" d="M28.4,6.5H12.1C10.7,6.5,9.6,7,8.6,8c-1,1-1.4,2.1-1.4,3.5v16.4c0,1.4,0.5,2.5,1.4,3.5
+					c1,1,2.1,1.4,3.5,1.4h16.4c1.4,0,2.5-0.5,3.5-1.4c1-1,1.4-2.1,1.4-3.5V11.5c0-1.4-0.5-2.5-1.4-3.5C30.9,7,29.8,6.5,28.4,6.5z
+					 M22.6,10.3h1.1V15c0,0.3,0,0.4,0,0.4c0,0.2,0.1,0.3,0.3,0.3c0.2,0,0.5-0.2,0.7-0.5v-4.8h1.1v6.3h-1.1V16
+					c-0.5,0.5-0.9,0.8-1.3,0.8c-0.4,0-0.6-0.2-0.7-0.5c-0.1-0.2-0.1-0.5-0.1-0.9L22.6,10.3L22.6,10.3z M18.3,12.4
+					c0-0.7,0.1-1.2,0.4-1.5c0.3-0.4,0.7-0.6,1.3-0.6c0.6,0,1,0.2,1.3,0.6c0.2,0.3,0.4,0.8,0.4,1.5v2.2c0,0.7-0.1,1.2-0.4,1.5
+					c-0.3,0.4-0.8,0.6-1.3,0.6c-0.6,0-1-0.2-1.3-0.6c-0.2-0.3-0.4-0.8-0.4-1.5L18.3,12.4L18.3,12.4z M15.2,8.2l0.9,3.3L17,8.2h1.3
+					l-1.5,5v3.4h-1.3v-3.4c-0.1-0.6-0.4-1.5-0.8-2.7c-0.1-0.3-0.2-0.7-0.4-1.2c-0.2-0.5-0.3-0.9-0.4-1.2L15.2,8.2L15.2,8.2z
+					 M29.3,28.7c-0.1,0.5-0.4,0.9-0.7,1.2c-0.4,0.3-0.8,0.5-1.3,0.6c-1.6,0.2-3.9,0.3-7,0.3c-3.1,0-5.5-0.1-7-0.3
+					c-0.5-0.1-0.9-0.3-1.3-0.6c-0.4-0.3-0.6-0.8-0.7-1.2c-0.2-1-0.3-2.4-0.3-4.4c0-2,0.1-3.4,0.3-4.4c0.1-0.5,0.4-0.9,0.7-1.3
+					c0.4-0.3,0.8-0.5,1.3-0.6c1.5-0.2,3.9-0.3,7-0.3c3.1,0,5.5,0.1,7,0.3c0.5,0.1,0.9,0.3,1.3,0.6c0.4,0.3,0.6,0.8,0.7,1.3
+					c0.2,0.9,0.3,2.4,0.3,4.4C29.6,26.3,29.5,27.8,29.3,28.7z"/>
+			</g>
+		</g>
+	</g>
+</g>
+</svg>