+ Simple Omelette Recipe
-
- An easy and quick dish, perfect for any meal. This classic omelette
- combines beaten eggs cooked to perfection, optionally filled with your
- choice of cheese, vegetables, or meats.
-
+
+ An easy and quick dish, perfect for any meal. This classic omelette
+ combines beaten eggs cooked to perfection, optionally filled with your
+ choice of cheese, vegetables, or meats.
+
-
-
Preparation time
+
+
+
Ingredients
- - Total: Approximately 10 minutes
- - Preparation: 5 minutes
- - Cooking: 5 minutes
+ 2-3 large eggs
Salt, to taste
Pepper, to taste
1 tablespoon of butter or oil
-
+
+ Optional fillings: cheese, diced vegetables, cooked meats, herbs
+
+
-
Ingredients
+ Instructions
-
- - 2-3 large eggs
- - Salt, to taste
- - Pepper, to taste
- - 1 tablespoon of butter or oil
- - Optional fillings: cheese, diced vegetables, cooked meats, herbs
-
+
+ -
+
+ Beat the eggs: In a bowl, beat the eggs with a
+ pinch of salt and pepper until they are well mixed. You can add a
+ tablespoon of water or milk for a fluffier texture.
+
+
- Instructions
+ -
+
+ Heat the pan: Place a non-stick frying pan over
+ medium heat and add butter or oil.
+
+
-
- -
- Beat the eggs: In a bowl, beat the eggs with a pinch of salt and pepper
- until they are well mixed. You can add a tablespoon of water or milk for
- a fluffier texture.
-
+ -
+
+ Cook the omelette: Once the butter is melted and
+ bubbling, pour in the eggs. Tilt the pan to ensure the eggs evenly
+ coat the surface.
+
+
- -
- Heat the pan: Place a non-stick frying pan over medium heat and add
- butter or oil.
-
+ -
+
+ Add fillings (optional): When the eggs begin to set
+ at the edges but are still slightly runny in the middle, sprinkle
+ your chosen fillings over one half of the omelette.
+
+
- -
- Cook the omelette: Once the butter is melted and bubbling, pour in the
- eggs. Tilt the pan to ensure the eggs evenly coat the surface.
-
+ -
+
+ Fold and serve: As the omelette continues to cook,
+ carefully lift one edge and fold it over the fillings. Let it cook
+ for another minute, then slide it onto a plate.
+
+
- -
- Add fillings (optional): When the eggs begin to set at the edges but are
- still slightly runny in the middle, sprinkle your chosen fillings over
- one half of the omelette.
-
+ -
+
+ Enjoy: Serve hot, with additional salt and pepper
+ if needed.
+
+
+
- -
- Fold and serve: As the omelette continues to cook, carefully lift one
- edge and fold it over the fillings. Let it cook for another minute, then
- slide it onto a plate.
-
+ Nutrition
- - Enjoy: Serve hot, with additional salt and pepper if needed.
-
+
+ The table below shows nutritional values per serving without the
+ additional fillings.
+
- Nutrition
+
+
+ | Calories |
+ 277kcal |
+
-
- The table below shows nutritional values per serving without the
- additional fillings.
-
+
+ | Carbs |
+ 0g |
+
-
-
- | Calories |
- 277kcal |
-
+
+ | Protein |
+ 20g |
+
-
- | Carbs |
- 0g |
-
-
-
- | Protein |
- 20g |
-
-
-
- | Fat |
- 22g |
-
-
+
+ | Fat |
+ 22g |
+
+
+
diff --git a/package-lock.json b/package-lock.json
index 8064077..f82897f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
"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"
@@ -1050,6 +1051,19 @@
"node": ">= 8"
}
},
+ "node_modules/css-declaration-sorter": {
+ "version": "7.2.0",
+ "resolved": "https://registry.npmjs.org/css-declaration-sorter/-/css-declaration-sorter-7.2.0.tgz",
+ "integrity": "sha512-h70rUM+3PNFuaBDTLe8wF/cdWu+dOZmb7pJt8Z2sedYbAcQVQV/tEchueg3GWxwqS0cxtbxmaHEdkNACqcvsow==",
+ "dev": true,
+ "license": "ISC",
+ "engines": {
+ "node": "^14 || ^16 || >=18"
+ },
+ "peerDependencies": {
+ "postcss": "^8.0.9"
+ }
+ },
"node_modules/cssesc": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -1717,6 +1731,19 @@
"postcss": "^8.4.21"
}
},
+ "node_modules/postcss-less": {
+ "version": "6.0.0",
+ "resolved": "https://registry.npmjs.org/postcss-less/-/postcss-less-6.0.0.tgz",
+ "integrity": "sha512-FPX16mQLyEjLzEuuJtxA8X3ejDLNGGEG503d2YGZR5Ask1SpDN8KmZUMpzCvyalWRywAn1n1VOA5dcqfCLo5rg==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=12"
+ },
+ "peerDependencies": {
+ "postcss": "^8.3.5"
+ }
+ },
"node_modules/postcss-load-config": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
@@ -1786,6 +1813,33 @@
"postcss": "^8.2.14"
}
},
+ "node_modules/postcss-scss": {
+ "version": "4.0.9",
+ "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz",
+ "integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==",
+ "dev": true,
+ "funding": [
+ {
+ "type": "opencollective",
+ "url": "https://opencollective.com/postcss/"
+ },
+ {
+ "type": "tidelift",
+ "url": "https://tidelift.com/funding/github/npm/postcss-scss"
+ },
+ {
+ "type": "github",
+ "url": "https://github.com/sponsors/ai"
+ }
+ ],
+ "license": "MIT",
+ "engines": {
+ "node": ">=12.0"
+ },
+ "peerDependencies": {
+ "postcss": "^8.4.29"
+ }
+ },
"node_modules/postcss-selector-parser": {
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz",
@@ -1823,6 +1877,24 @@
"url": "https://github.com/prettier/prettier?sponsor=1"
}
},
+ "node_modules/prettier-plugin-css-order": {
+ "version": "2.1.2",
+ "resolved": "https://registry.npmjs.org/prettier-plugin-css-order/-/prettier-plugin-css-order-2.1.2.tgz",
+ "integrity": "sha512-vomxPjHI6pOMYcBuouSJHxxQClJXaUpU9rsV9IAO2wrSTZILRRlrxAAR8t9UF6wtczLkLfNRFUwM+ZbGXOONUA==",
+ "dev": true,
+ "license": "ISC",
+ "dependencies": {
+ "css-declaration-sorter": "^7.1.1",
+ "postcss-less": "^6.0.0",
+ "postcss-scss": "^4.0.9"
+ },
+ "engines": {
+ "node": ">=16"
+ },
+ "peerDependencies": {
+ "prettier": "3.x"
+ }
+ },
"node_modules/prettier-plugin-tailwindcss": {
"version": "0.6.5",
"resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.6.5.tgz",
diff --git a/package.json b/package.json
index 42a64ed..7f3364c 100644
--- a/package.json
+++ b/package.json
@@ -8,12 +8,14 @@
"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"
]
},
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..70614b3
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,64 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+ @font-face {
+ font-weight: 100 900;
+ src: url("/fonts/Outfit-VariableFont_wght.ttf") format("truetype");
+ font-family: "Outfit";
+ }
+
+ @font-face {
+ font-weight: 100 900;
+ src: url("/fonts/YoungSerif-Regular.ttf") format("truetype");
+ font-family: "Young Serif";
+ }
+
+ h1,
+ h2 {
+ font-weight: 400;
+ line-height: 100%;
+ font-family: theme("fontFamily.serif");
+ }
+
+ h1 {
+ color: theme("colors.dark-charcoal");
+ font-size: 2.5rem;
+ }
+
+ h2 {
+ color: theme("colors.brandy-red");
+ font-size: 1.75rem;
+ }
+
+ h3 {
+ color: theme("colors.dark-raspberry");
+ font-weight: 600;
+ font-size: 1.25rem;
+ line-height: 100%;
+ }
+
+ p {
+ color: theme("colors.wenge-brown");
+ font-weight: 400;
+ font-size: 1rem;
+ line-height: 150%;
+
+ > strong {
+ font-weight: 700;
+ }
+ }
+
+ td {
+ color: theme("colors.wenge-brown");
+ font-weight: 400;
+ font-size: 1rem;
+ line-height: 150%;
+
+ &:last-child {
+ color: theme("colors.brandy-red");
+ font-weight: 700;
+ }
+ }
+}
diff --git a/tailwind.config.js b/tailwind.config.js
index d6cfed4..4da7d37 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,4 +1,19 @@
export default {
content: ["index.html"],
- theme: {},
+ theme: {
+ colors: {
+ "brandy-red": "#854632",
+ "dark-charcoal": "#312E2C",
+ "dark-raspberry": "#7A284E",
+ "wenge-brown": "#5F564D",
+ "white-coffee": "#E3DDD7",
+ eggshell: "#F3E5D7",
+ snow: "#FFF7FB",
+ white: "#FFFFFF",
+ },
+ fontFamily: {
+ sans: ["Outfit", "sans-serif"],
+ serif: ["Young\\ Serif", "serif"],
+ },
+ },
};