diff --git a/index.html b/index.html
index c65f83f..6201ad4 100644
--- a/index.html
+++ b/index.html
@@ -28,6 +28,15 @@
+
+
diff --git a/src/main.js b/src/main.js
index e73587f..5d461d7 100644
--- a/src/main.js
+++ b/src/main.js
@@ -101,6 +101,15 @@ function findRecipes() {
});
}
+// TODO: select all/none spirits
+// function selectAll() {
+// return;
+// }
+
+// function selectNone() {
+// return;
+// }
+
function renderRecipes(recipes) {
const container = document.getElementById("recipesContainer");
@@ -122,6 +131,7 @@ function renderRecipes(recipes) {
return `
${recipe.name}
+
Licores:
${alcoholIngredients
.map(
diff --git a/src/styles.css b/src/styles.css
index 0285e57..47c1a40 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -382,6 +382,42 @@ h2 {
}
}
+.selection-options {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ gap: 0.5rem;
+
+ .selection-button {
+ width: 120px;
+ padding: 0.2rem 0.3rem;
+ font-family: "Fredoka", sans-serif;
+ font-size: 0.5rem;
+ background: linear-gradient(135deg, var(--deep-red) 0%, var(--cognac) 100%);
+ color: white;
+ border: none;
+ border-radius: 50px;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ box-shadow: 0 8px 20px rgba(139, 21, 56, 0.4);
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+ }
+ .selection-button:hover {
+ transform: translateY(-3px);
+ box-shadow: 0 12px 30px rgba(139, 21, 56, 0.5);
+ }
+
+ .selection-button:active {
+ transform: translateY(-1px);
+ }
+
+ .selection-button:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+ }
+}
+
.warning-msg {
font-family: "Fredoka", sans-serif;
font-size: 1.1rem;