diff --git a/practice/practice-02/package-lock.json b/practice/practice-02/package-lock.json
index 186f438..0567e8b 100644
--- a/practice/practice-02/package-lock.json
+++ b/practice/practice-02/package-lock.json
@@ -15,6 +15,7 @@
"devDependencies": {
"@parcel/transformer-pug": "^2.9.3",
"@parcel/transformer-sass": "^2.9.3",
+ "@prettier/plugin-pug": "^2.5.1",
"parcel": "^2.9.3"
}
},
@@ -1813,6 +1814,32 @@
"@parcel/core": "^2.9.3"
}
},
+ "node_modules/@prettier/plugin-pug": {
+ "version": "2.5.1",
+ "resolved": "https://registry.npmjs.org/@prettier/plugin-pug/-/plugin-pug-2.5.1.tgz",
+ "integrity": "sha512-rauAMYyTv6tgoo4DZ+1TwpytjaoJgcg+8btp0CfAUaHwjxfNo4cuAGgsJS6WVT7vx2Sz4Pkos50xuSNZuvJAWQ==",
+ "dev": true,
+ "funding": [
+ {
+ "type": "github",
+ "url": "https://github.com/Shinigami92"
+ },
+ {
+ "type": "paypal",
+ "url": "https://www.paypal.com/donate/?hosted_button_id=L7GY729FBKTZY"
+ }
+ ],
+ "dependencies": {
+ "pug-lexer": "^5.0.1"
+ },
+ "engines": {
+ "node": "^16.13.0 || >=18.0.0",
+ "npm": ">=7.10.0"
+ },
+ "peerDependencies": {
+ "prettier": "^2.3.0"
+ }
+ },
"node_modules/@swc/core": {
"version": "1.3.69",
"resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.69.tgz",
@@ -3493,6 +3520,22 @@
"node": ">=12"
}
},
+ "node_modules/prettier": {
+ "version": "2.8.8",
+ "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
+ "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
+ "dev": true,
+ "peer": true,
+ "bin": {
+ "prettier": "bin-prettier.js"
+ },
+ "engines": {
+ "node": ">=10.13.0"
+ },
+ "funding": {
+ "url": "https://github.com/prettier/prettier?sponsor=1"
+ }
+ },
"node_modules/promise": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
diff --git a/practice/practice-02/package.json b/practice/practice-02/package.json
index 15f04c9..0eb6ef4 100644
--- a/practice/practice-02/package.json
+++ b/practice/practice-02/package.json
@@ -3,7 +3,7 @@
"version": "1.0.0",
"description": "Practice 02",
"scripts": {
- "start": "rm -rf dist && rm -rf .parcel-cache && parcel ./src/*.pug --no-cache --no-source-maps",
+ "start": "del -rf dist && del -rf .parcel-cache && parcel ./src/*.pug --no-cache --no-source-maps",
"build": "rm -rf build && rm -rf .parcel-cache && parcel build ./src/*.pug --no-cache --no-source-maps --dist-dir dist",
"test": "echo \"Error: no test specified\" && exit 1"
},
@@ -13,6 +13,7 @@
"devDependencies": {
"@parcel/transformer-pug": "^2.9.3",
"@parcel/transformer-sass": "^2.9.3",
+ "@prettier/plugin-pug": "^2.5.1",
"parcel": "^2.9.3"
},
"dependencies": {
diff --git a/practice/practice-02/src/assets/fonts/inter-regular.ttf b/practice/practice-02/src/assets/fonts/inter-regular.ttf
new file mode 100644
index 0000000..8d4eebf
Binary files /dev/null and b/practice/practice-02/src/assets/fonts/inter-regular.ttf differ
diff --git a/practice/practice-02/src/assets/fonts/sofia-pro-regular.otf b/practice/practice-02/src/assets/fonts/sofia-pro-regular.otf
new file mode 100644
index 0000000..6180dd7
Binary files /dev/null and b/practice/practice-02/src/assets/fonts/sofia-pro-regular.otf differ
diff --git a/practice/practice-02/src/assets/images/logo.svg b/practice/practice-02/src/assets/images/logo.svg
new file mode 100644
index 0000000..bc274f3
--- /dev/null
+++ b/practice/practice-02/src/assets/images/logo.svg
@@ -0,0 +1,23 @@
+
diff --git a/practice/practice-02/src/assets/images/nav-button.svg b/practice/practice-02/src/assets/images/nav-button.svg
new file mode 100644
index 0000000..6aa0de7
--- /dev/null
+++ b/practice/practice-02/src/assets/images/nav-button.svg
@@ -0,0 +1,7 @@
+
diff --git a/practice/practice-02/src/index.pug b/practice/practice-02/src/index.pug
index 71fe774..0ddb165 100644
--- a/practice/practice-02/src/index.pug
+++ b/practice/practice-02/src/index.pug
@@ -3,6 +3,12 @@ html(lang="en")
head
meta(charset="UTF-8")
meta(name="viewport", content="width=device-width, initial-scale=1.0")
- link(rel="stylesheet", href="./sass/main.scss")
+ link(rel="stylesheet", href="./styles/main.scss")
title Food Hut
- body
\ No newline at end of file
+ body
+ header.header
+ .logo-wrapper
+ a.logo-link(href="javascript:void(0)")
+ img.logo(src="./assets/images/logo.svg", alt="Food Hut logo")
+ .header-content
+ include layouts/nav/nav-menu
diff --git a/practice/practice-02/src/layouts/nav/nav-menu.pug b/practice/practice-02/src/layouts/nav/nav-menu.pug
new file mode 100644
index 0000000..0183ac8
--- /dev/null
+++ b/practice/practice-02/src/layouts/nav/nav-menu.pug
@@ -0,0 +1,10 @@
+- var list = ["Today Special Offers", "Why FoodHut", "Our Menu", "Our Popular Food"];
+
+nav.nav
+ input.toggle-menu(type="checkbox")
+ .icon-menu
+ ul.nav-list
+ each val in list
+ li.nav-item
+ a.nav-link(href="javascrip:void(0)")= val
+a.btn(href="javascript:void(0)") Download App
diff --git a/practice/practice-02/src/sass/base/reset.scss b/practice/practice-02/src/styles/base/reset.scss
similarity index 100%
rename from practice/practice-02/src/sass/base/reset.scss
rename to practice/practice-02/src/styles/base/reset.scss
diff --git a/practice/practice-02/src/sass/main.scss b/practice/practice-02/src/styles/main.scss
similarity index 100%
rename from practice/practice-02/src/sass/main.scss
rename to practice/practice-02/src/styles/main.scss