e commerce product page

grucloud · Nov 14, 2024 · eee70fc · eee70fc
1 parent f8f7422
commit eee70fc
Show file tree

Hide file tree

Showing 43 changed files with 1,325 additions and 1 deletion.
diff --git a/bau-ui/globalStyle/globalStyle.js b/bau-ui/globalStyle/globalStyle.js
@@ -11,7 +11,7 @@ const ColorPaletteDefault = [
 const SHADES_LIGHT = [
   ["light", "1.15"],
   ["lighter", "1.3"],
-  ["lightest", "1.5"],
+  ["lightest", "1.7"],
 ];
 const SHADES_DARK = [
   ["dark", "0.9"],
@@ -117,6 +117,7 @@ export default function globalStyle(
       --background-color: var(--color-white);
       --global-border-width: 1px;
       --global-radius: 0.2rem;
+      --font-color: var(--color-content);
       --font-color-base: var(--color-content);
       --font-color-disabled: var(--color-emphasis-600);
       --font-color-inverse: var(--color-content-inverse);

diff --git a/examples/e-commerce-product-page/.gitignore b/examples/e-commerce-product-page/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/examples/e-commerce-product-page/.npmrc b/examples/e-commerce-product-page/.npmrc
@@ -0,0 +1,2 @@
+save-exact = true
+package-lock = false
diff --git a/examples/e-commerce-product-page/README.md b/examples/e-commerce-product-page/README.md
@@ -0,0 +1,23 @@
+# Frontend Mentor E-commerce Product Page
+
+Here is the implementation in [Bau.js](https://github.com/grucloud/bau) of the [Frontend Mentor E-commerce Product Page code challenge](https://www.frontendmentor.io/challenges/ecommerce-product-page-UPsZ9MJp6)
+
+## Workflow
+
+Install the dependencies:
+
+```sh
+npm install
+```
+
+Start a development server:
+
+```sh
+npm run dev
+```
+
+Build a production version:
+
+```sh
+npm run build
+```
diff --git a/examples/e-commerce-product-page/index.html b/examples/e-commerce-product-page/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link
+      rel="icon"
+      type="image/png"
+      href="./assets/images/favicon-32x32.png"
+    />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      name="description"
+      content="E-commerce Product Page FrontendMentor written in bau.js"
+    />
+    <title>E-commerce Product Page | FrontendMentor</title>
+    <style id="bau-css"></style>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/examples/e-commerce-product-page/package.json b/examples/e-commerce-product-page/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "frontendmentor-e-commerce-product-page",
+  "homepage": "https://grucloud.github.io/bau/frontendmentor/e-commerce-product-page/",
+  "private": true,
+  "version": "0.86.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "deploy": "gh-pages -d ../../dist"
+  },
+  "devDependencies": {
+    "gh-pages": "6.1.1",
+    "typescript": "^5.0.2",
+    "vite": "^5.2.11"
+  },
+  "dependencies": {
+    "@grucloud/bau": "^0.86.0",
+    "@grucloud/bau-css": "^0.86.0",
+    "@grucloud/bau-router": "^0.86.0",
+    "@grucloud/bau-ui": "^0.86.0",
+    "bignumber.js": "9.1.2"
+  }
+}
diff --git a/examples/e-commerce-product-page/public/assets/images/favicon-32x32.png b/examples/e-commerce-product-page/public/assets/images/favicon-32x32.png
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-cart.svg b/examples/e-commerce-product-page/public/assets/images/icon-cart.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-close.svg b/examples/e-commerce-product-page/public/assets/images/icon-close.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-delete.svg b/examples/e-commerce-product-page/public/assets/images/icon-delete.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-menu.svg b/examples/e-commerce-product-page/public/assets/images/icon-menu.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-minus.svg b/examples/e-commerce-product-page/public/assets/images/icon-minus.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-next.svg b/examples/e-commerce-product-page/public/assets/images/icon-next.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-plus.svg b/examples/e-commerce-product-page/public/assets/images/icon-plus.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/icon-previous.svg b/examples/e-commerce-product-page/public/assets/images/icon-previous.svg
diff --git a/examples/e-commerce-product-page/public/assets/images/image-avatar.png b/examples/e-commerce-product-page/public/assets/images/image-avatar.png
diff --git a/...ples/e-commerce-product-page/public/assets/images/image-product-1-thumbnail.jpg b/...ples/e-commerce-product-page/public/assets/images/image-product-1-thumbnail.jpg
diff --git a/examples/e-commerce-product-page/public/assets/images/image-product-1.jpg b/examples/e-commerce-product-page/public/assets/images/image-product-1.jpg
diff --git a/...ples/e-commerce-product-page/public/assets/images/image-product-2-thumbnail.jpg b/...ples/e-commerce-product-page/public/assets/images/image-product-2-thumbnail.jpg
diff --git a/examples/e-commerce-product-page/public/assets/images/image-product-2.jpg b/examples/e-commerce-product-page/public/assets/images/image-product-2.jpg
diff --git a/...ples/e-commerce-product-page/public/assets/images/image-product-3-thumbnail.jpg b/...ples/e-commerce-product-page/public/assets/images/image-product-3-thumbnail.jpg
diff --git a/examples/e-commerce-product-page/public/assets/images/image-product-3.jpg b/examples/e-commerce-product-page/public/assets/images/image-product-3.jpg
diff --git a/...ples/e-commerce-product-page/public/assets/images/image-product-4-thumbnail.jpg b/...ples/e-commerce-product-page/public/assets/images/image-product-4-thumbnail.jpg
diff --git a/examples/e-commerce-product-page/public/assets/images/image-product-4.jpg b/examples/e-commerce-product-page/public/assets/images/image-product-4.jpg
diff --git a/examples/e-commerce-product-page/public/assets/images/logo.svg b/examples/e-commerce-product-page/public/assets/images/logo.svg