Initial commit
This commit is contained in:
commit
f468f40bf1
12 changed files with 2715 additions and 0 deletions
44
.github/workflows/vite_deploy.yaml
vendored
Normal file
44
.github/workflows/vite_deploy.yaml
vendored
Normal file
|
@ -0,0 +1,44 @@
|
||||||
|
name: Deploy static content to Pages
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches: ["main"]
|
||||||
|
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
permissions:
|
||||||
|
contents: read
|
||||||
|
pages: write
|
||||||
|
id-token: write
|
||||||
|
|
||||||
|
concurrency:
|
||||||
|
group: "pages"
|
||||||
|
cancel-in-progress: true
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
deploy:
|
||||||
|
environment:
|
||||||
|
name: github-pages
|
||||||
|
url: ${{ steps.deployment.outputs.page_url }}
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Checkout
|
||||||
|
uses: actions/checkout@v4
|
||||||
|
- name: Set up Node
|
||||||
|
uses: actions/setup-node@v4
|
||||||
|
with:
|
||||||
|
node-version: 20
|
||||||
|
cache: "npm"
|
||||||
|
- name: Install dependencies
|
||||||
|
run: npm install
|
||||||
|
- name: Build
|
||||||
|
run: npm run build
|
||||||
|
- name: Setup Pages
|
||||||
|
uses: actions/configure-pages@v4
|
||||||
|
- name: Upload artifact
|
||||||
|
uses: actions/upload-pages-artifact@v3
|
||||||
|
with:
|
||||||
|
path: "./dist"
|
||||||
|
- name: Deploy to GitHub Pages
|
||||||
|
id: deployment
|
||||||
|
uses: actions/deploy-pages@v4
|
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
node_modules/
|
||||||
|
.vite/
|
5
README.md
Normal file
5
README.md
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
# Frontend Mentor - Product preview card component solution
|
||||||
|
|
||||||
|
This is a solution to the [Product preview card component challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/product-preview-card-component-GO7UmttRfa). Frontend Mentor challenges help you improve your coding skills by building realistic projects.
|
||||||
|
|
||||||
|
![](./screenshot.jpg)
|
31
index.html
Normal file
31
index.html
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
|
||||||
|
<link
|
||||||
|
rel="icon"
|
||||||
|
type="image/png"
|
||||||
|
sizes="32x32"
|
||||||
|
href="/images/favicon-32x32.png"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<title>Product preview card component</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Perfume</p>
|
||||||
|
|
||||||
|
<h1>Gabrielle Essence Eau De Parfum</h1>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
A floral, solar and voluptuous interpretation composed by Olivier Polge,
|
||||||
|
Perfumer-Creator for the House of CHANEL.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>$149.99</p>
|
||||||
|
<p>$169.99</p>
|
||||||
|
|
||||||
|
<p>Add to Cart</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
2595
package-lock.json
generated
Normal file
2595
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
28
package.json
Normal file
28
package.json
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
{
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite --open",
|
||||||
|
"build": "vite build"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"autoprefixer": "^10.4.19",
|
||||||
|
"postcss": "^8.4.39",
|
||||||
|
"prettier": "^3.3.2",
|
||||||
|
"prettier-plugin-css-order": "^2.1.2",
|
||||||
|
"prettier-plugin-tailwindcss": "^0.6.5",
|
||||||
|
"tailwindcss": "^3.4.4",
|
||||||
|
"vite": "^5.3.2"
|
||||||
|
},
|
||||||
|
"prettier": {
|
||||||
|
"plugins": [
|
||||||
|
"prettier-plugin-css-order",
|
||||||
|
"prettier-plugin-tailwindcss"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"postcss": {
|
||||||
|
"plugins": {
|
||||||
|
"tailwindcss": {},
|
||||||
|
"autoprefixer": {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
BIN
public/images/favicon-32x32.png
Normal file
BIN
public/images/favicon-32x32.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1 KiB |
1
public/images/icon-cart.svg
Normal file
1
public/images/icon-cart.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg width="15" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M14.383 10.388a2.397 2.397 0 0 0-1.518-2.222l1.494-5.593a.8.8 0 0 0-.144-.695.8.8 0 0 0-.631-.28H2.637L2.373.591A.8.8 0 0 0 1.598 0H0v1.598h.983l1.982 7.4a.8.8 0 0 0 .799.59h8.222a.8.8 0 0 1 0 1.599H1.598a.8.8 0 1 0 0 1.598h.943a2.397 2.397 0 1 0 4.507 0h1.885a2.397 2.397 0 1 0 4.331-.376 2.397 2.397 0 0 0 1.12-2.021ZM11.26 7.99H4.395L3.068 3.196h9.477L11.26 7.991Zm-6.465 6.392a.8.8 0 1 1 0-1.598.8.8 0 0 1 0 1.598Zm6.393 0a.8.8 0 1 1 0-1.598.8.8 0 0 1 0 1.598Z" fill="#FFF"/></svg>
|
After Width: | Height: | Size: 557 B |
BIN
public/images/image-product-desktop.jpg
Normal file
BIN
public/images/image-product-desktop.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 44 KiB |
BIN
public/images/image-product-mobile.jpg
Normal file
BIN
public/images/image-product-mobile.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
4
tailwind.config.js
Normal file
4
tailwind.config.js
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
export default {
|
||||||
|
content: ["index.html"],
|
||||||
|
theme: {},
|
||||||
|
};
|
5
vite.config.js
Normal file
5
vite.config.js
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
import { defineConfig } from "vite";
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
base: "/fem-product-preview-card/",
|
||||||
|
});
|
Reference in a new issue