diff --git a/_dev/elegance.css b/_dev/elegance.css
index be5d721..5e7fbe7 100644
--- a/_dev/elegance.css
+++ b/_dev/elegance.css
@@ -4,13 +4,27 @@
body {
@apply bg-white;
- @apply text-gray-500;
- @apply font-normal;
+ @apply text-gray-600;
+ @apply font-light;
+}
+
+a {
+ @apply text-gray-600;
+}
+
+a:hover {
+ @apply text-blue-700;
+ @apply underline;
+ @apply underline-offset-2;
}
.icon-tabler {
stroke-width: 1px;
fill: none;
- @apply text-gray-700;
- @apply stroke-gray-700;
+ @apply text-gray-500;
+ @apply stroke-gray-500;
+}
+
+a:hover .icon-tabler {
+ @apply stroke-blue-900;
}
diff --git a/_dev/js/theme.js b/_dev/js/theme.js
new file mode 100644
index 0000000..7e2d0f6
--- /dev/null
+++ b/_dev/js/theme.js
@@ -0,0 +1,5 @@
+import $ from 'jquery';
+import prestashop from 'prestashop';
+
+$(function() {
+})
diff --git a/_dev/package.json b/_dev/package.json
index 7012fa7..7d18e10 100644
--- a/_dev/package.json
+++ b/_dev/package.json
@@ -5,11 +5,16 @@
"license": "MIT",
"devDependencies": {
"livereload": "^0.9.3",
- "tailwindcss": "^3.3.5"
+ "tailwindcss": "^3.3.5",
+ "vite": "^4.5.0"
},
"scripts": {
"dev:tailwind": "tailwindcss -i ./elegance.css -o ../assets/css/theme.css --watch",
"dev:livereload": "livereload \"../templates/, ../modules/, ../assets/\"",
- "dev": "yarn run dev:livereload & yarn run dev:tailwind"
+ "dev:js": "vite dev",
+ "dev": "yarn run dev:livereload & yarn run dev:tailwind & yarn run dev:js"
+ },
+ "dependencies": {
+ "jquery": "^3.7.1"
}
}
diff --git a/_dev/vite.config.js b/_dev/vite.config.js
new file mode 100644
index 0000000..75ab635
--- /dev/null
+++ b/_dev/vite.config.js
@@ -0,0 +1,26 @@
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+ build: {
+ lib: {
+ entry: "./js/theme.js",
+ name: 'theme',
+ formats: ['iife'],
+ fileName: function() {
+ return 'theme.js'
+ }
+ },
+ outDir: '../assets/js/',
+ rollupOptions: {
+ external: ['$', 'jquery', 'prestashop'],
+ output: {
+ globals: {
+ $: '$',
+ jquery: 'jQuery',
+ prestashop: 'prestashop'
+ }
+ }
+ },
+ write: true
+ },
+})
diff --git a/_dev/yarn.lock b/_dev/yarn.lock
index 0dc65d7..89f15d0 100644
--- a/_dev/yarn.lock
+++ b/_dev/yarn.lock
@@ -7,6 +7,116 @@
resolved "https://registry.yarnpkg.com/@alloc/quick-lru/-/quick-lru-5.2.0.tgz#7bf68b20c0a350f936915fcae06f58e32007ce30"
integrity sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==
+"@esbuild/android-arm64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz#984b4f9c8d0377443cc2dfcef266d02244593622"
+ integrity sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==
+
+"@esbuild/android-arm@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.18.20.tgz#fedb265bc3a589c84cc11f810804f234947c3682"
+ integrity sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==
+
+"@esbuild/android-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.18.20.tgz#35cf419c4cfc8babe8893d296cd990e9e9f756f2"
+ integrity sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==
+
+"@esbuild/darwin-arm64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz#08172cbeccf95fbc383399a7f39cfbddaeb0d7c1"
+ integrity sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==
+
+"@esbuild/darwin-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz#d70d5790d8bf475556b67d0f8b7c5bdff053d85d"
+ integrity sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==
+
+"@esbuild/freebsd-arm64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz#98755cd12707f93f210e2494d6a4b51b96977f54"
+ integrity sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==
+
+"@esbuild/freebsd-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz#c1eb2bff03915f87c29cece4c1a7fa1f423b066e"
+ integrity sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==
+
+"@esbuild/linux-arm64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz#bad4238bd8f4fc25b5a021280c770ab5fc3a02a0"
+ integrity sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==
+
+"@esbuild/linux-arm@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz#3e617c61f33508a27150ee417543c8ab5acc73b0"
+ integrity sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==
+
+"@esbuild/linux-ia32@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz#699391cccba9aee6019b7f9892eb99219f1570a7"
+ integrity sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==
+
+"@esbuild/linux-loong64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz#e6fccb7aac178dd2ffb9860465ac89d7f23b977d"
+ integrity sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==
+
+"@esbuild/linux-mips64el@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz#eeff3a937de9c2310de30622a957ad1bd9183231"
+ integrity sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==
+
+"@esbuild/linux-ppc64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz#2f7156bde20b01527993e6881435ad79ba9599fb"
+ integrity sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==
+
+"@esbuild/linux-riscv64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz#6628389f210123d8b4743045af8caa7d4ddfc7a6"
+ integrity sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==
+
+"@esbuild/linux-s390x@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz#255e81fb289b101026131858ab99fba63dcf0071"
+ integrity sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==
+
+"@esbuild/linux-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz#c7690b3417af318a9b6f96df3031a8865176d338"
+ integrity sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==
+
+"@esbuild/netbsd-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz#30e8cd8a3dded63975e2df2438ca109601ebe0d1"
+ integrity sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==
+
+"@esbuild/openbsd-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz#7812af31b205055874c8082ea9cf9ab0da6217ae"
+ integrity sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==
+
+"@esbuild/sunos-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz#d5c275c3b4e73c9b0ecd38d1ca62c020f887ab9d"
+ integrity sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==
+
+"@esbuild/win32-arm64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz#73bc7f5a9f8a77805f357fab97f290d0e4820ac9"
+ integrity sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==
+
+"@esbuild/win32-ia32@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz#ec93cbf0ef1085cc12e71e0d661d20569ff42102"
+ integrity sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==
+
+"@esbuild/win32-x64@0.18.20":
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz#786c5f41f043b07afb1af37683d7c33668858f6d"
+ integrity sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==
+
"@jridgewell/gen-mapping@^0.3.2":
version "0.3.3"
resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz#7e02e6eb5df901aaedb08514203b096614024098"
@@ -148,6 +258,34 @@ dlv@^1.1.3:
resolved "https://registry.yarnpkg.com/dlv/-/dlv-1.1.3.tgz#5c198a8a11453596e751494d49874bc7732f2e79"
integrity sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==
+esbuild@^0.18.10:
+ version "0.18.20"
+ resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.18.20.tgz#4709f5a34801b43b799ab7d6d82f7284a9b7a7a6"
+ integrity sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==
+ optionalDependencies:
+ "@esbuild/android-arm" "0.18.20"
+ "@esbuild/android-arm64" "0.18.20"
+ "@esbuild/android-x64" "0.18.20"
+ "@esbuild/darwin-arm64" "0.18.20"
+ "@esbuild/darwin-x64" "0.18.20"
+ "@esbuild/freebsd-arm64" "0.18.20"
+ "@esbuild/freebsd-x64" "0.18.20"
+ "@esbuild/linux-arm" "0.18.20"
+ "@esbuild/linux-arm64" "0.18.20"
+ "@esbuild/linux-ia32" "0.18.20"
+ "@esbuild/linux-loong64" "0.18.20"
+ "@esbuild/linux-mips64el" "0.18.20"
+ "@esbuild/linux-ppc64" "0.18.20"
+ "@esbuild/linux-riscv64" "0.18.20"
+ "@esbuild/linux-s390x" "0.18.20"
+ "@esbuild/linux-x64" "0.18.20"
+ "@esbuild/netbsd-x64" "0.18.20"
+ "@esbuild/openbsd-x64" "0.18.20"
+ "@esbuild/sunos-x64" "0.18.20"
+ "@esbuild/win32-arm64" "0.18.20"
+ "@esbuild/win32-ia32" "0.18.20"
+ "@esbuild/win32-x64" "0.18.20"
+
fast-glob@^3.3.0:
version "3.3.1"
resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.1.tgz#784b4e897340f3dbbef17413b3f11acf03c874c4"
@@ -270,6 +408,11 @@ jiti@^1.19.1:
resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d"
integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==
+jquery@^3.7.1:
+ version "3.7.1"
+ resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.7.1.tgz#083ef98927c9a6a74d05a6af02806566d16274de"
+ integrity sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==
+
lilconfig@^2.0.5, lilconfig@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.1.0.tgz#78e23ac89ebb7e1bfbf25b18043de756548e7f52"
@@ -430,7 +573,7 @@ postcss-value-parser@^4.0.0:
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
-postcss@^8.4.23:
+postcss@^8.4.23, postcss@^8.4.27:
version "8.4.31"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.31.tgz#92b451050a9f914da6755af352bdc0192508656d"
integrity sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==
@@ -472,6 +615,13 @@ reusify@^1.0.4:
resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
+rollup@^3.27.1:
+ version "3.29.4"
+ resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.29.4.tgz#4d70c0f9834146df8705bfb69a9a19c9e1109981"
+ integrity sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==
+ optionalDependencies:
+ fsevents "~2.3.2"
+
run-parallel@^1.1.9:
version "1.2.0"
resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"
@@ -561,6 +711,17 @@ util-deprecate@^1.0.2:
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
+vite@^4.5.0:
+ version "4.5.0"
+ resolved "https://registry.yarnpkg.com/vite/-/vite-4.5.0.tgz#ec406295b4167ac3bc23e26f9c8ff559287cff26"
+ integrity sha512-ulr8rNLA6rkyFAlVWw2q5YJ91v098AFQ2R0PRFwPzREXOUJQPtFUG0t+/ZikhaOCDqFoDhN6/v8Sq0o4araFAw==
+ dependencies:
+ esbuild "^0.18.10"
+ postcss "^8.4.27"
+ rollup "^3.27.1"
+ optionalDependencies:
+ fsevents "~2.3.2"
+
wrappy@1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
diff --git a/assets/css/theme.css b/assets/css/theme.css
index 3f2d836..f949145 100644
--- a/assets/css/theme.css
+++ b/assets/css/theme.css
@@ -645,11 +645,21 @@ video {
margin-right: -1rem;
}
+.mx-4 {
+ margin-left: 1rem;
+ margin-right: 1rem;
+}
+
.mx-auto {
margin-left: auto;
margin-right: auto;
}
+.my-12 {
+ margin-top: 3rem;
+ margin-bottom: 3rem;
+}
+
.my-2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
@@ -665,14 +675,8 @@ video {
margin-bottom: 2rem;
}
-.my-12 {
- margin-top: 3rem;
- margin-bottom: 3rem;
-}
-
-.mx-4 {
- margin-left: 1rem;
- margin-right: 1rem;
+.mb-1 {
+ margin-bottom: 0.25rem;
}
.mb-4 {
@@ -683,26 +687,34 @@ video {
margin-left: 0.25rem;
}
+.mr-4 {
+ margin-right: 1rem;
+}
+
.mt-1 {
margin-top: 0.25rem;
}
-.mt-2 {
- margin-top: 0.5rem;
-}
-
-.mt-3 {
- margin-top: 0.75rem;
-}
-
.mt-16 {
margin-top: 4rem;
}
+.mt-2 {
+ margin-top: 0.5rem;
+}
+
.mt-24 {
margin-top: 6rem;
}
+.mt-3 {
+ margin-top: 0.75rem;
+}
+
+.mt-8 {
+ margin-top: 2rem;
+}
+
.block {
display: block;
}
@@ -755,10 +767,6 @@ video {
height: 2rem;
}
-.h-96 {
- height: 24rem;
-}
-
.h-auto {
height: auto;
}
@@ -767,10 +775,22 @@ video {
height: 100%;
}
+.w-1\/3 {
+ width: 33.333333%;
+}
+
+.w-1\/4 {
+ width: 25%;
+}
+
.w-12 {
width: 3rem;
}
+.w-14 {
+ width: 3.5rem;
+}
+
.w-24 {
width: 6rem;
}
@@ -791,22 +811,12 @@ video {
width: 100%;
}
-.w-14 {
- width: 3.5rem;
+.max-w-2xl {
+ max-width: 42rem;
}
-.w-28 {
- width: 7rem;
-}
-
-.min-w-fit {
- min-width: -moz-fit-content;
- min-width: fit-content;
-}
-
-.min-w-min {
- min-width: -moz-min-content;
- min-width: min-content;
+.max-w-\[140px\] {
+ max-width: 140px;
}
.max-w-\[200px\] {
@@ -821,18 +831,6 @@ video {
max-width: 100%;
}
-.max-w-2xl {
- max-width: 42rem;
-}
-
-.max-w-\[112px\] {
- max-width: 112px;
-}
-
-.max-w-\[140px\] {
- max-width: 140px;
-}
-
.flex-1 {
flex: 1 1 0%;
}
@@ -896,6 +894,10 @@ video {
justify-content: space-around;
}
+.gap-1 {
+ gap: 0.25rem;
+}
+
.gap-2 {
gap: 0.5rem;
}
@@ -904,18 +906,14 @@ video {
gap: 1rem;
}
-.gap-8 {
- gap: 2rem;
-}
-
-.gap-1 {
- gap: 0.25rem;
-}
-
.gap-6 {
gap: 1.5rem;
}
+.gap-8 {
+ gap: 2rem;
+}
+
.truncate {
overflow: hidden;
text-overflow: ellipsis;
@@ -935,14 +933,14 @@ video {
border-color: rgb(23 37 84 / var(--tw-border-opacity));
}
-.bg-gray-100 {
- --tw-bg-opacity: 1;
- background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+.border-gray-300 {
+ --tw-border-opacity: 1;
+ border-color: rgb(209 213 219 / var(--tw-border-opacity));
}
-.bg-white {
- --tw-bg-opacity: 1;
- background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+.border-red-100 {
+ --tw-border-opacity: 1;
+ border-color: rgb(254 226 226 / var(--tw-border-opacity));
}
.bg-blue-950 {
@@ -950,6 +948,21 @@ video {
background-color: rgb(23 37 84 / var(--tw-bg-opacity));
}
+.bg-gray-100 {
+ --tw-bg-opacity: 1;
+ background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+}
+
+.bg-red-50 {
+ --tw-bg-opacity: 1;
+ background-color: rgb(254 242 242 / var(--tw-bg-opacity));
+}
+
+.bg-white {
+ --tw-bg-opacity: 1;
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+
.object-cover {
-o-object-fit: cover;
object-fit: cover;
@@ -1002,6 +1015,10 @@ video {
padding-right: 0px;
}
+.pr-6 {
+ padding-right: 1.5rem;
+}
+
.pr-8 {
padding-right: 2rem;
}
@@ -1014,14 +1031,14 @@ video {
padding-top: 1rem;
}
-.pr-6 {
- padding-right: 1.5rem;
-}
-
.text-left {
text-align: left;
}
+.text-center {
+ text-align: center;
+}
+
.text-justify {
text-align: justify;
}
@@ -1055,48 +1072,42 @@ video {
font-weight: 700;
}
-.font-medium {
- font-weight: 500;
-}
-
-.font-semibold {
- font-weight: 600;
-}
-
.font-light {
font-weight: 300;
}
+.font-medium {
+ font-weight: 500;
+}
+
.font-normal {
font-weight: 400;
}
+.font-semibold {
+ font-weight: 600;
+}
+
+.uppercase {
+ text-transform: uppercase;
+}
+
+.leading-6 {
+ line-height: 1.5rem;
+}
+
.leading-none {
line-height: 1;
}
-.text-red-400 {
- --tw-text-opacity: 1;
- color: rgb(248 113 113 / var(--tw-text-opacity));
-}
-
-.text-red-700 {
- --tw-text-opacity: 1;
- color: rgb(185 28 28 / var(--tw-text-opacity));
-}
-
-.text-red-700\/50 {
- color: rgb(185 28 28 / 0.5);
-}
-
.text-blue-950 {
--tw-text-opacity: 1;
color: rgb(23 37 84 / var(--tw-text-opacity));
}
-.text-white {
+.text-gray-50 {
--tw-text-opacity: 1;
- color: rgb(255 255 255 / var(--tw-text-opacity));
+ color: rgb(249 250 251 / var(--tw-text-opacity));
}
.text-gray-500 {
@@ -1104,10 +1115,28 @@ video {
color: rgb(107 114 128 / var(--tw-text-opacity));
}
+.text-red-700\/50 {
+ color: rgb(185 28 28 / 0.5);
+}
+
+.text-red-900 {
+ --tw-text-opacity: 1;
+ color: rgb(127 29 29 / var(--tw-text-opacity));
+}
+
+.text-white {
+ --tw-text-opacity: 1;
+ color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+
.line-through {
text-decoration-line: line-through;
}
+.underline-offset-2 {
+ text-underline-offset: 2px;
+}
+
.shadow {
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -1122,7 +1151,7 @@ body {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
- color: rgb(107 114 128 / var(--tw-text-opacity));
+ color: rgb(75 85 99 / var(--tw-text-opacity));
font-weight: 400;
}
@@ -1130,22 +1159,35 @@ body {
stroke-width: 1px;
fill: none;
--tw-text-opacity: 1;
- color: rgb(55 65 81 / var(--tw-text-opacity));
- stroke: #374151;
+ color: rgb(107 114 128 / var(--tw-text-opacity));
+ stroke: #6b7280;
+}
+
+a:hover .icon-tabler {
+ stroke: #1e3a8a;
}
.hover\:stroke-2:hover {
stroke-width: 2;
}
+.hover\:text-blue-900:hover {
+ --tw-text-opacity: 1;
+ color: rgb(30 58 138 / var(--tw-text-opacity));
+}
+
+.hover\:text-gray-950:hover {
+ --tw-text-opacity: 1;
+ color: rgb(3 7 18 / var(--tw-text-opacity));
+}
+
.hover\:text-yellow-700:hover {
--tw-text-opacity: 1;
color: rgb(161 98 7 / var(--tw-text-opacity));
}
-.hover\:text-gray-950:hover {
- --tw-text-opacity: 1;
- color: rgb(3 7 18 / var(--tw-text-opacity));
+.hover\:underline:hover {
+ text-decoration-line: underline;
}
.focus\:ring-2:focus {
@@ -1158,11 +1200,6 @@ body {
display: flex;
}
-.group:hover .group-hover\:text-gray-900 {
- --tw-text-opacity: 1;
- color: rgb(17 24 39 / var(--tw-text-opacity));
-}
-
.group:hover .group-hover\:text-gray-950 {
--tw-text-opacity: 1;
color: rgb(3 7 18 / var(--tw-text-opacity));
@@ -1183,6 +1220,10 @@ body {
display: none;
}
+ .md\:w-1\/2 {
+ width: 50%;
+ }
+
.md\:w-24 {
width: 6rem;
}
@@ -1217,6 +1258,10 @@ body {
display: none;
}
+ .lg\:w-1\/3 {
+ width: 33.333333%;
+ }
+
.lg\:w-full {
width: 100%;
}
diff --git a/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl b/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl
new file mode 100644
index 0000000..d6d6e05
--- /dev/null
+++ b/modules/blockreassurance/views/templates/hook/displayBlockProduct.tpl
@@ -0,0 +1,43 @@
+
+{**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License version 3.0
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to license@prestashop.com so we can send you a copy immediately.
+ *
+ * @author PrestaShop SA and Contributors <contact@prestashop.com>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0
+ *}
+
+<div class="w-full flex justify-around">
+ {foreach from=$blocks item=$block key=$key}
+ <div{if $block['type_link'] !== $LINK_TYPE_NONE && !empty($block['link'])} style="cursor:pointer;" onclick="window.open('{$block['link']}')"{/if} class='flex flex-wrap md:flex-nowrap gap-2 items-center justify-center'>
+ <span class="item-product w-5 h-5">
+ {if $block['icon'] != 'undefined'}
+ {if $block['custom_icon']}
+ <img {if $block['is_svg']}class="svg" {/if}src="{$block['custom_icon']}">
+ {elseif $block['icon']}
+ <img class="svg" src="{$block['icon']}">
+ {/if}
+ {/if}
+ </span>
+ {if empty($block['description'])}
+ <p class="block-title text-sm" >{$block['title']}</p>
+ {else}
+ <div class='flex flex-col items-center md:items-start'>
+ <span class="block-title text-sm" >{$block['title']}</span>
+ <p class='text-xs'>{$block['description'] nofilter}</p>
+ </div>
+ {/if}
+ </div>
+ {/foreach}
+</div>
diff --git a/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl b/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl
index ee8832e..efb5b6f 100644
--- a/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl
+++ b/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl
@@ -24,19 +24,13 @@
*}
<div id="block_myaccount_infos" class="col-md-3 links wrapper">
- <p class="h3 myaccount-title hidden-sm-down">
+ <p class="font-bold">
<a class="text-uppercase" href="{$urls.pages.my_account}" rel="nofollow">
{l s='Your account' d='Shop.Theme.Customeraccount'}
</a>
</p>
<div class="title clearfix hidden-md-up" data-target="#footer_account_list" data-toggle="collapse">
- <span class="h3">{l s='Your account' d='Shop.Theme.Customeraccount'}</span>
- <span class="float-xs-right">
- <span class="navbar-toggler collapse-icons">
- <i class="material-icons add"></i>
- <i class="material-icons remove"></i>
- </span>
- </span>
+ <span class="text-base">{l s='Your account' d='Shop.Theme.Customeraccount'}</span>
</div>
<ul class="account-list collapse" id="footer_account_list">
{foreach from=$my_account_urls item=my_account_url}
diff --git a/modules/ps_customersignin/ps_customersignin.tpl b/modules/ps_customersignin/ps_customersignin.tpl
index 0383acf..35df7fd 100644
--- a/modules/ps_customersignin/ps_customersignin.tpl
+++ b/modules/ps_customersignin/ps_customersignin.tpl
@@ -23,15 +23,19 @@
* International Registered Trademark & Property of PrestaShop SA
*}
<div id="_desktop_user_info" class="relative">
- <div class="flex max-w-[200px] justify-end">
+ <div class="flex max-w-[200px] justify-end mx-4">
{if $logged}
<a
- class="logout hidden-sm-down"
+ class="logout hidden-sm-down mr-4"
href="{$logout_url}"
rel="nofollow"
>
- <i class="material-icons"></i>
- {l s='Sign out' d='Shop.Theme.Actions'}
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-logout" width="24" height="24" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2"></path>
+ <path d="M9 12h12l-3 -3"></path>
+ <path d="M18 15l3 -3"></path>
+ </svg>
</a>
<a
class="account"
@@ -39,8 +43,12 @@
title="{l s='View my customer account' d='Shop.Theme.Customeraccount'}"
rel="nofollow"
>
- <i class="material-icons hidden-md-up logged"></i>
- <span class="hidden-sm-down">{$customerName}</span>
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user-circle" width="24" height="24" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
+ <path d="M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+ <path d="M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855"></path>
+ </svg>
</a>
{else}
<a
diff --git a/modules/ps_linklist/views/templates/hook/linkblock.tpl b/modules/ps_linklist/views/templates/hook/linkblock.tpl
index 61a1bbb..fb38620 100644
--- a/modules/ps_linklist/views/templates/hook/linkblock.tpl
+++ b/modules/ps_linklist/views/templates/hook/linkblock.tpl
@@ -22,16 +22,16 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
-<div class="container">
+<div class="flex flex-wrap flex-1 flex-col md:flex-row">
{foreach $linkBlocks as $linkBlock}
- <div class="flex flex-col mb-4">
+ <div class="flex flex-col mb-4 md:w-1/3">
<div class="font-bold mb-4">
{$linkBlock.title}
</div>
- <ul>
+ <ul class="flex flex-col">
{foreach $linkBlock.links as $link}
- <li>
- <a id="{$link.id}-{$linkBlock.id}" class="{$link.class}" href="{$link.url}" title="{$link.description}" {if !empty($link.target)} target="{$link.target}" {/if}>
+ <li class="flex">
+ <a id="{$link.id}-{$linkBlock.id}" class="text-sm font-normal leading-6 {$link.class}" href="{$link.url}" title="{$link.description}" {if !empty($link.target)} target="{$link.target}" {/if}>
{$link.title}
</a>
</li>
diff --git a/templates/_partials/breadcrumb.tpl b/templates/_partials/breadcrumb.tpl
index 037ceff..17ffcec 100644
--- a/templates/_partials/breadcrumb.tpl
+++ b/templates/_partials/breadcrumb.tpl
@@ -31,9 +31,9 @@
<a itemprop="item" href="{$path.url}">
<span itemprop="name">{$path.title}</span>
</a>
- <span class="mx-4">
- /
- </span>
+ {if !$smarty.foreach.breadcrumb.last}
+ <span class="mx-4">/</span>
+ {/if}
<meta itemprop="position" content="{$smarty.foreach.breadcrumb.iteration}">
</li>
{/block}
diff --git a/templates/_partials/footer.tpl b/templates/_partials/footer.tpl
index 521fcf5..f07111b 100644
--- a/templates/_partials/footer.tpl
+++ b/templates/_partials/footer.tpl
@@ -22,14 +22,47 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
-
-<div class="container mx-auto">
- <div class="flex items-center">
- <div class="w-48 h-48 flex flex-col justify-center">
+<div class="container mx-auto flex flex-col">
+ {block name='hook_footer_before'}
+ {hook h='displayFooterBefore'}
+ {/block}
+</div>
+<div class="container mx-auto flex flex-col gap-8">
+ <div class="flex flex-col lg:flex-row gap-8">
+ <div class="w-48 flex flex-row justify-center items-center">
<a class="w-24 h-24" href="{$urls.base_url}">
<img class="logo w-full aspect-square object-fit" src="{$shop.logo}" alt="{$shop.name}">
</a>
- <div class="h-96">
+ </div>
+ <div class="w-full flex flex-1 flex-col lg:flex-row">
+ {block name='hook_footer'}
+ {hook h='displayFooter'}
+ {/block}
+ </div>
+ <div class="flex justify-center items-center gap-4">
+ <a class="p-4" href="{$urls.base_url}">
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-x" width="24" height="24" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M4 4l11.733 16h4.267l-11.733 -16z"></path>
+ <path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path>
+ </svg>
+ </a>
+ <a class="p-4">
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"></path>
+ <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+ <path d="M16.5 7.5l0 .01"></path>
+ </svg>
+ </a>
+ <a class="p-4">
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"></path>
+ <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+ <path d="M16.5 7.5l0 .01"></path>
+ </svg>
+ </a>
</div>
</div>
<div class="flex">
@@ -37,13 +70,9 @@
{hook h='displayFooterAfter'}
{/block}
</div>
- <div class="container">
- <div class="flex justify-center py-8">
- {block name='copyright_link'}
- <a class="_blank" href="https://www.prestashop.com" target="_blank" rel="nofollow">
- {l s='%copyright% %year% - Ecommerce software by %prestashop%' sprintf=['%prestashop%' => 'PrestaShop™', '%year%' => 'Y'|date, '%copyright%' => '©'] d='Shop.Theme.Global'}
- </a>
- {/block}
- </div>
+ <div class="flex py-8">
+ <a href="{$shop.url}">
+ <span class="text-sm">© 2023 Brooksbingham Clothing</span>
+ </a>
</div>
</div>
diff --git a/templates/_partials/form-errors.tpl b/templates/_partials/form-errors.tpl
index 73e3948..8b9d251 100644
--- a/templates/_partials/form-errors.tpl
+++ b/templates/_partials/form-errors.tpl
@@ -23,11 +23,11 @@
* International Registered Trademark & Property of PrestaShop SA
*}
{if $errors|count}
- <div class="help-block">
+ <div class="help-block mb-4">
{block name='form_errors'}
<ul>
{foreach $errors as $error}
- <li class="alert alert-danger">{$error|nl2br nofilter}</li>
+ <li class="alert alert-danger px-4 py-2 border border-red-100 bg-red-50 text-red-900">{$error|nl2br nofilter}</li>
{/foreach}
</ul>
{/block}
diff --git a/templates/_partials/form-fields.tpl b/templates/_partials/form-fields.tpl
index 32ffe5a..ce2d197 100644
--- a/templates/_partials/form-fields.tpl
+++ b/templates/_partials/form-fields.tpl
@@ -30,8 +30,8 @@
{else}
- <div class="form-group row {if !empty($field.errors)}has-error{/if}">
- <label class="col-md-3 form-control-label{if $field.required} required{/if}">
+ <div class="form-group row {if !empty($field.errors)}has-error{/if} flex flex-col">
+ <label class="font-medium form-control-label{if $field.required} required{/if} mb-1">
{if $field.type !== 'checkbox'}
{$field.label}
{/if}
@@ -88,9 +88,8 @@
{block name='form_field_item_checkbox'}
<span class="custom-checkbox">
- <label>
+ <label class="font-light text-sm">
<input name="{$field.name}" type="checkbox" value="1" {if $field.value}checked="checked"{/if} {if $field.required}required{/if}>
- <span><i class="material-icons rtl-no-flip checkbox-checked"></i></span>
{$field.label nofilter}
</label>
</span>
@@ -132,9 +131,9 @@
{elseif $field.type === 'password'}
{block name='form_field_item_password'}
- <div class="input-group js-parent-focus">
+ <div class="input-group js-parent-focus relative">
<input
- class="form-control js-child-focus js-visible-password"
+ class="form-control js-child-focus js-visible-password px-2 py-1 border border-gray-300 w-full"
name="{$field.name}"
title="{l s='At least 5 characters long' d='Shop.Forms.Help'}"
type="password"
@@ -142,17 +141,6 @@
pattern=".{literal}{{/literal}5,{literal}}{/literal}"
{if $field.required}required{/if}
>
- <span class="input-group-btn">
- <button
- class="btn"
- type="button"
- data-action="show-password"
- data-text-show="{l s='Show' d='Shop.Theme.Actions'}"
- data-text-hide="{l s='Hide' d='Shop.Theme.Actions'}"
- >
- {l s='Show' d='Shop.Theme.Actions'}
- </button>
- </span>
</div>
{/block}
@@ -160,7 +148,7 @@
{block name='form_field_item_other'}
<input
- class="form-control"
+ class="form-control px-2 py-1 border border-gray-300 w-full"
name="{$field.name}"
type="{$field.type}"
value="{$field.value}"
diff --git a/templates/catalog/_partials/miniatures/product.tpl b/templates/catalog/_partials/miniatures/product.tpl
index 600a5f4..68a9a0d 100644
--- a/templates/catalog/_partials/miniatures/product.tpl
+++ b/templates/catalog/_partials/miniatures/product.tpl
@@ -40,19 +40,19 @@
</div>
{/if}
{/block}
- <div class="product-description flex flex-col pt-4 group-hover:text-gray-950 gap-1">
+ <div class="product-description flex flex-col pt-4 group-hover:text-blue-900 gap-1">
{block name='product_price_and_shipping'}
<div class="flex w-full justify-between items-center">
{if $product.has_discount}
- <span class="regular-price line-through text-red-700/50 leading-none">{$product.regular_price}</span>
+ <span class="regular-price line-through leading-none font-medium">{$product.regular_price}</span>
{/if}
- <div class="font-semibold text-lg">
+ <div class="font-bold text-lg">
<span>{$product.price}</span>
</div>
</div>
{/block}
{block name='product_name'}
- <span class="text-xl" itemprop="name">{$product.name|truncate:30:'...'}</span>
+ <span class="text-xl font-medium" itemprop="name">{$product.name|truncate:30:'...'}</span>
{/block}
</div>
</a>
diff --git a/templates/catalog/_partials/product-add-to-cart.tpl b/templates/catalog/_partials/product-add-to-cart.tpl
index a86cef7..0e9951b 100644
--- a/templates/catalog/_partials/product-add-to-cart.tpl
+++ b/templates/catalog/_partials/product-add-to-cart.tpl
@@ -22,14 +22,50 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
-<div class="product-add-to-cart">
+<div class="product-add-to-cart flex flex-col gap-4 mt-12 mb-4">
{if !$configuration.is_catalog}
+ {block name='product_availability'}
+ <span id="product-availability" class='flex w-full justify-center items-center gap-1 text-xl'>
+ {if $product.show_availability && $product.availability_message}
+ {if $product.availability == 'available'}
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-box-seam" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M12 3l8 4.5v9l-8 4.5l-8 -4.5v-9l8 -4.5"></path>
+ <path d="M12 12l8 -4.5"></path>
+ <path d="M8.2 9.8l7.6 -4.6"></path>
+ <path d="M12 12v9"></path>
+ <path d="M12 12l-8 -4.5"></path>
+ </svg>
+ {elseif $product.availability == 'last_remaining_items'}
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hourglass" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M6.5 7h11"></path>
+ <path d="M6.5 17h11"></path>
+ <path d="M6 20v-2a6 6 0 1 1 12 0v2a1 1 0 0 1 -1 1h-10a1 1 0 0 1 -1 -1z"></path>
+ <path d="M6 4v2a6 6 0 1 0 12 0v-2a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1z"></path>
+ </svg>
+ {else}
+ <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-package-off" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+ <path d="M8.812 4.793l3.188 -1.793l8 4.5v8.5m-2.282 1.784l-5.718 3.216l-8 -4.5v-9l2.223 -1.25"></path>
+ <path d="M14.543 10.57l5.457 -3.07"></path>
+ <path d="M12 12v9"></path>
+ <path d="M12 12l-8 -4.5"></path>
+ <path d="M16 5.25l-4.35 2.447m-2.564 1.442l-1.086 .611"></path>
+ <path d="M3 3l18 18"></path>
+ </svg>
+ {/if}
+ {$product.availability_message}
+ {/if}
+ </span>
+ {/block}
+
{block name='product_quantity'}
- <div class="flex flex-col gap-4 my-12">
+ <div class="flex w-full flex-col gap-4">
<div class="add">
<button
- class="add-to-cart w-full h-12 bg-blue-950 text-white text-base font-light"
+ class="add-to-cart w-full h-12 bg-blue-950 disabled:bg-gray-700 text-white text-base font-light"
data-button-action="add-to-cart"
type="submit"
{if !$product.add_to_cart_url}
@@ -54,21 +90,6 @@
</div>
{/block}
- {block name='product_availability'}
- <span id="product-availability">
- {if $product.show_availability && $product.availability_message}
- {if $product.availability == 'available'}
- <i class="material-icons rtl-no-flip product-available"></i>
- {elseif $product.availability == 'last_remaining_items'}
- <i class="material-icons product-last-items"></i>
- {else}
- <i class="material-icons product-unavailable"></i>
- {/if}
- {$product.availability_message}
- {/if}
- </span>
- {/block}
-
{block name='product_minimal_quantity'}
<p class="product-minimal-quantity">
{if $product.minimal_quantity > 1}
diff --git a/templates/catalog/_partials/product-prices.tpl b/templates/catalog/_partials/product-prices.tpl
index e37ca13..5426c5a 100644
--- a/templates/catalog/_partials/product-prices.tpl
+++ b/templates/catalog/_partials/product-prices.tpl
@@ -23,12 +23,12 @@
* International Registered Trademark & Property of PrestaShop SA
*}
{if $product.show_price}
- <div class="product-prices">
+ <div class="product-prices flex flex-col mt-2">
{block name='product_discount'}
{if $product.has_discount}
<div class="product-discount">
{hook h='displayProductPriceBlock' product=$product type="old_price"}
- <span class="regular-price ">{$product.regular_price}</span>
+ <span class="regular-price line-through text-red-700/50 leading-none">{$product.regular_price}</span>
</div>
{/if}
{/block}
@@ -43,14 +43,14 @@
<link itemprop="availability" href="{$product.seo_availability}"/>
<meta itemprop="priceCurrency" content="{$currency.iso_code}">
- <div class="current-price">
+ <div class="current-price flex gap-2 items-baseline">
<span itemprop="price" class="text-2xl font-normal" content="{$product.price_amount}">{$product.price}</span>
{if $product.has_discount}
{if $product.discount_type === 'percentage'}
<span class="discount discount-percentage">{l s='Save %percentage%' d='Shop.Theme.Catalog' sprintf=['%percentage%' => $product.discount_percentage_absolute]}</span>
{else}
- <span class="discount discount-amount">
+ <span class="discount discount-amount text-sm">
{l s='Save %amount%' d='Shop.Theme.Catalog' sprintf=['%amount%' => $product.discount_to_display]}
</span>
{/if}
diff --git a/templates/catalog/product.tpl b/templates/catalog/product.tpl
index 579f704..bad319d 100644
--- a/templates/catalog/product.tpl
+++ b/templates/catalog/product.tpl
@@ -134,7 +134,7 @@
{/block}
{block name='product_tabs'}
- <div class="tabs flex flex-col gap-4 mt-16 lg:mt-36">
+ <div class="tabs flex flex-col gap-4 mt-16">
<ul class="nav nav-tabs flex justify-around" role="tablist">
{if $product.description}
<li class="nav-item text-base font-semibold text-blue-950">
@@ -222,9 +222,9 @@
{block name='product_accessories'}
{if $accessories}
- <section class="product-accessories mt-24">
+ <section class="product-accessories flex flex-col gap-8 mt-24">
<p class="text-2xl font-bold">{l s='Related Products' d='Shop.Theme.Catalog'}</p>
- <div class="products grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
+ <div class="products grid grid-cols-1 md:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8">
{foreach from=$accessories item="product_accessory"}
{block name='product_miniature'}
{include file='catalog/_partials/miniatures/product.tpl' product=$product_accessory}
diff --git a/templates/customer/_partials/customer-form.tpl b/templates/customer/_partials/customer-form.tpl
index dba04d0..f0100e1 100644
--- a/templates/customer/_partials/customer-form.tpl
+++ b/templates/customer/_partials/customer-form.tpl
@@ -28,7 +28,7 @@
{/block}
<form action="{block name='customer_form_actionurl'}{$action}{/block}" id="customer-form" class="js-customer-form" method="post">
- <section>
+ <section class="flex flex-col gap-2">
{block "form_fields"}
{foreach from=$formFields item="field"}
{block "form_field"}
@@ -40,10 +40,10 @@
</section>
{block name='customer_form_footer'}
- <footer class="form-footer clearfix">
+ <footer class="flex w-full mt-8">
<input type="hidden" name="submitCreate" value="1">
{block "form_buttons"}
- <button class="btn btn-primary form-control-submit float-xs-right" data-link-action="save-customer" type="submit">
+ <button class="py-2 w-full uppercase font-medium bg-blue-950 text-gray-50" data-link-action="save-customer" type="submit">
{l s='Save' d='Shop.Theme.Actions'}
</button>
{/block}
diff --git a/templates/customer/_partials/login-form.tpl b/templates/customer/_partials/login-form.tpl
index 932480e..590af4b 100644
--- a/templates/customer/_partials/login-form.tpl
+++ b/templates/customer/_partials/login-form.tpl
@@ -29,8 +29,7 @@
{/block}
<form id="login-form" action="{block name='login_form_actionurl'}{$action}{/block}" method="post">
-
- <section>
+ <section class="flex flex-col gap-2">
{block name='login_form_fields'}
{foreach from=$formFields item="field"}
{block name='form_field'}
@@ -39,17 +38,17 @@
{/foreach}
{/block}
<div class="forgot-password">
- <a href="{$urls.pages.password}" rel="nofollow">
+ <a class="text-base hover:underline underline-offset-2 hover:text-blue-900" href="{$urls.pages.password}" rel="nofollow">
{l s='Forgot your password?' d='Shop.Theme.Customeraccount'}
</a>
</div>
</section>
{block name='login_form_footer'}
- <footer class="form-footer text-sm-center clearfix">
+ <footer class="form-footer w-full mt-8">
<input type="hidden" name="submitLogin" value="1">
{block name='form_buttons'}
- <button id="submit-login" class="btn btn-primary" data-link-action="sign-in" type="submit" class="form-control-submit">
+ <button id="submit-login" class="uppercase font-medium py-2 text-center w-full bg-blue-950 text-gray-50" data-link-action="sign-in" type="submit" >
{l s='Sign in' d='Shop.Theme.Actions'}
</button>
{/block}
diff --git a/templates/customer/authentication.tpl b/templates/customer/authentication.tpl
index 3d940b9..e2cd697 100644
--- a/templates/customer/authentication.tpl
+++ b/templates/customer/authentication.tpl
@@ -22,25 +22,27 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
-{extends file='page.tpl'}
-
-{block name='page_title'}
- {l s='Log in to your account' d='Shop.Theme.Customeraccount'}
-{/block}
-
-{block name='page_content'}
+{extends file=$layout}
+{block name='content'}
+ <div class="flex items-center flex-col">
+ {block name='page_title'}
+ <span class="text-lg font-medium mb-4">
+ {l s='Log in to your account' d='Shop.Theme.Customeraccount'}
+ </span>
+ {/block}
{block name='login_form_container'}
- <section class="login-form">
+ <section class="login-form w-1/4">
{render file='customer/_partials/login-form.tpl' ui=$login_form}
</section>
<hr/>
{block name='display_after_login_form'}
{hook h='displayCustomerLoginFormAfter'}
{/block}
- <div class="no-account">
- <a href="{$urls.pages.register}" data-link-action="display-register-form">
+ <div class="no-account mt-2">
+ <a class="text-base hover:underline underline-offset-2 hover:text-blue-900 font-normal" href="{$urls.pages.register}" data-link-action="display-register-form">
{l s='No account? Create one here' d='Shop.Theme.Customeraccount'}
</a>
</div>
{/block}
+ </div>
{/block}
diff --git a/templates/customer/registration.tpl b/templates/customer/registration.tpl
index 9f71703..d7539b4 100644
--- a/templates/customer/registration.tpl
+++ b/templates/customer/registration.tpl
@@ -22,18 +22,26 @@
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
-{extends file='page.tpl'}
-
-{block name='page_title'}
- {l s='Create an account' d='Shop.Theme.Customeraccount'}
-{/block}
-
-{block name='page_content'}
+{extends file=$layout}
+{block name='content'}
+ <div class="flex flex-col items-center">
+ {block name='page_title'}
+ <span class="text-lg font-medium mb-4">
+ {l s='Create an account' d='Shop.Theme.Customeraccount'}
+ </span>
+ {/block}
{block name='register_form_container'}
+ <div class="w-full md:w-1/2 lg:w-1/3">
{$hook_create_account_top nofilter}
<section class="register-form">
- <p>{l s='Already have an account?' d='Shop.Theme.Customeraccount'} <a href="{$urls.pages.authentication}">{l s='Log in instead!' d='Shop.Theme.Customeraccount'}</a></p>
{render file='customer/_partials/customer-form.tpl' ui=$register_form}
+ <div class="flex justify-center mt-8">
+ <a class="text-base hover:underline underline-offset-2 hover:text-blue-900 font-normal" href="{$urls.pages.authentication}">
+ {l s='Already have an account? Log in instead!' d='Shop.Theme.Customeraccount'}
+ </a>
+ </div>
</section>
+ </div>
{/block}
+ </div>
{/block}