@jjlmoya/utils-cooking 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +60 -0
- package/src/category/i18n/en.ts +24 -0
- package/src/category/i18n/es.ts +208 -0
- package/src/category/i18n/fr.ts +24 -0
- package/src/category/index.ts +37 -0
- package/src/category/seo.astro +15 -0
- package/src/components/PreviewNavSidebar.astro +116 -0
- package/src/components/PreviewToolbar.astro +143 -0
- package/src/data.ts +11 -0
- package/src/env.d.ts +5 -0
- package/src/index.ts +32 -0
- package/src/layouts/PreviewLayout.astro +117 -0
- package/src/pages/[locale]/[slug].astro +146 -0
- package/src/pages/[locale].astro +251 -0
- package/src/pages/index.astro +4 -0
- package/src/tests/faq_count.test.ts +19 -0
- package/src/tests/i18n-titles.test.ts +66 -0
- package/src/tests/locale_completeness.test.ts +42 -0
- package/src/tests/mocks/astro_mock.js +2 -0
- package/src/tests/no_h1_in_components.test.ts +48 -0
- package/src/tests/seo_length.test.ts +22 -0
- package/src/tests/tool_validation.test.ts +17 -0
- package/src/tool/american-kitchen-converter/AmericanKitchenEngine.ts +259 -0
- package/src/tool/american-kitchen-converter/bibliography.astro +6 -0
- package/src/tool/american-kitchen-converter/component.astro +838 -0
- package/src/tool/american-kitchen-converter/i18n/en.ts +282 -0
- package/src/tool/american-kitchen-converter/i18n/es.ts +281 -0
- package/src/tool/american-kitchen-converter/i18n/fr.ts +292 -0
- package/src/tool/american-kitchen-converter/index.ts +24 -0
- package/src/tool/american-kitchen-converter/seo.astro +8 -0
- package/src/tool/banana-ripeness/BananaCare.css +587 -0
- package/src/tool/banana-ripeness/BananaEngine.ts +79 -0
- package/src/tool/banana-ripeness/bibliography.astro +6 -0
- package/src/tool/banana-ripeness/component.astro +285 -0
- package/src/tool/banana-ripeness/i18n/en.ts +177 -0
- package/src/tool/banana-ripeness/i18n/es.ts +177 -0
- package/src/tool/banana-ripeness/i18n/fr.ts +177 -0
- package/src/tool/banana-ripeness/index.ts +24 -0
- package/src/tool/banana-ripeness/seo.astro +8 -0
- package/src/tool/brine/bibliography.astro +6 -0
- package/src/tool/brine/component.astro +884 -0
- package/src/tool/brine/i18n/en.ts +221 -0
- package/src/tool/brine/i18n/es.ts +222 -0
- package/src/tool/brine/i18n/fr.ts +221 -0
- package/src/tool/brine/index.ts +26 -0
- package/src/tool/brine/seo.astro +8 -0
- package/src/tool/cookware-guide/CookwareGuide.css +487 -0
- package/src/tool/cookware-guide/bibliography.astro +6 -0
- package/src/tool/cookware-guide/component.astro +164 -0
- package/src/tool/cookware-guide/i18n/en.ts +163 -0
- package/src/tool/cookware-guide/i18n/es.ts +163 -0
- package/src/tool/cookware-guide/i18n/fr.ts +164 -0
- package/src/tool/cookware-guide/index.ts +24 -0
- package/src/tool/cookware-guide/init.ts +174 -0
- package/src/tool/cookware-guide/seo.astro +8 -0
- package/src/tool/egg-timer/EggTimer.css +503 -0
- package/src/tool/egg-timer/bibliography.astro +14 -0
- package/src/tool/egg-timer/component.astro +281 -0
- package/src/tool/egg-timer/i18n/en.ts +230 -0
- package/src/tool/egg-timer/i18n/es.ts +222 -0
- package/src/tool/egg-timer/i18n/fr.ts +121 -0
- package/src/tool/egg-timer/index.ts +27 -0
- package/src/tool/egg-timer/seo.astro +39 -0
- package/src/tool/ingredient-rescaler/IngredientRescaler.css +308 -0
- package/src/tool/ingredient-rescaler/bibliography.astro +6 -0
- package/src/tool/ingredient-rescaler/component.astro +107 -0
- package/src/tool/ingredient-rescaler/i18n/en.ts +265 -0
- package/src/tool/ingredient-rescaler/i18n/es.ts +268 -0
- package/src/tool/ingredient-rescaler/i18n/fr.ts +207 -0
- package/src/tool/ingredient-rescaler/index.ts +24 -0
- package/src/tool/ingredient-rescaler/init.ts +200 -0
- package/src/tool/ingredient-rescaler/seo.astro +8 -0
- package/src/tool/kitchen-timer/KitchenTimer.css +325 -0
- package/src/tool/kitchen-timer/bibliography.astro +6 -0
- package/src/tool/kitchen-timer/component.astro +341 -0
- package/src/tool/kitchen-timer/i18n/en.ts +154 -0
- package/src/tool/kitchen-timer/i18n/es.ts +154 -0
- package/src/tool/kitchen-timer/i18n/fr.ts +154 -0
- package/src/tool/kitchen-timer/index.ts +26 -0
- package/src/tool/kitchen-timer/init.ts +55 -0
- package/src/tool/kitchen-timer/lib/AudioHelper.ts +27 -0
- package/src/tool/kitchen-timer/lib/DockManager.ts +97 -0
- package/src/tool/kitchen-timer/lib/KitchenTimer.ts +264 -0
- package/src/tool/kitchen-timer/seo.astro +8 -0
- package/src/tool/meringue-peak/MeringueCalculator.css +298 -0
- package/src/tool/meringue-peak/bibliography.astro +6 -0
- package/src/tool/meringue-peak/component.astro +169 -0
- package/src/tool/meringue-peak/i18n/en.ts +257 -0
- package/src/tool/meringue-peak/i18n/es.ts +234 -0
- package/src/tool/meringue-peak/i18n/fr.ts +234 -0
- package/src/tool/meringue-peak/index.ts +24 -0
- package/src/tool/meringue-peak/seo.astro +8 -0
- package/src/tool/mold-scaler/MoldScaler.css +406 -0
- package/src/tool/mold-scaler/bibliography.astro +6 -0
- package/src/tool/mold-scaler/component.astro +126 -0
- package/src/tool/mold-scaler/i18n/en.ts +268 -0
- package/src/tool/mold-scaler/i18n/es.ts +269 -0
- package/src/tool/mold-scaler/i18n/fr.ts +276 -0
- package/src/tool/mold-scaler/index.ts +26 -0
- package/src/tool/mold-scaler/init.ts +264 -0
- package/src/tool/mold-scaler/seo.astro +8 -0
- package/src/tool/pizza/Pizza.css +569 -0
- package/src/tool/pizza/bibliography.astro +6 -0
- package/src/tool/pizza/calculator.ts +143 -0
- package/src/tool/pizza/component.astro +237 -0
- package/src/tool/pizza/i18n/en.ts +288 -0
- package/src/tool/pizza/i18n/es.ts +289 -0
- package/src/tool/pizza/i18n/fr.ts +288 -0
- package/src/tool/pizza/index.ts +27 -0
- package/src/tool/pizza/seo.astro +8 -0
- package/src/tool/roux-guide/RouxGuide.css +483 -0
- package/src/tool/roux-guide/bibliography.astro +6 -0
- package/src/tool/roux-guide/component.astro +194 -0
- package/src/tool/roux-guide/i18n/en.ts +233 -0
- package/src/tool/roux-guide/i18n/es.ts +225 -0
- package/src/tool/roux-guide/i18n/fr.ts +225 -0
- package/src/tool/roux-guide/index.ts +24 -0
- package/src/tool/roux-guide/init.ts +187 -0
- package/src/tool/roux-guide/seo.astro +8 -0
- package/src/tool/sourdough-calculator/SourdoughCalculator.css +369 -0
- package/src/tool/sourdough-calculator/bibliography.astro +6 -0
- package/src/tool/sourdough-calculator/component.astro +198 -0
- package/src/tool/sourdough-calculator/i18n/en.ts +242 -0
- package/src/tool/sourdough-calculator/i18n/es.ts +243 -0
- package/src/tool/sourdough-calculator/i18n/fr.ts +248 -0
- package/src/tool/sourdough-calculator/index.ts +24 -0
- package/src/tool/sourdough-calculator/init.ts +131 -0
- package/src/tool/sourdough-calculator/seo.astro +8 -0
- package/src/tools.ts +29 -0
- package/src/types.ts +73 -0
|
@@ -0,0 +1,234 @@
|
|
|
1
|
+
import type { ToolLocaleContent } from "../../../types";
|
|
2
|
+
|
|
3
|
+
export const content: ToolLocaleContent = {
|
|
4
|
+
slug: "calculateur-meringue-proportions-sucre-blancs-oeuf",
|
|
5
|
+
title: "Calculateur de Meringue et Blancs en Neige Professionnel",
|
|
6
|
+
description:
|
|
7
|
+
"Calculez la quantité exacte de sucre pour une meringue française, italienne ou suisse selon le poids de vos blancs d'œufs. Maîtrisez le bec d'oiseau.",
|
|
8
|
+
ui: {
|
|
9
|
+
whitesLabel: "Poids des Blancs d'Œufs",
|
|
10
|
+
whitesPlaceholder: "Ex. 120",
|
|
11
|
+
whitesUnit: "g",
|
|
12
|
+
typeLabel: "Type de Meringue",
|
|
13
|
+
typeFrench: "Française",
|
|
14
|
+
typeItalian: "Italienne",
|
|
15
|
+
typeSwiss: "Suisse",
|
|
16
|
+
timesHeading: "Temps Estimés (Fouettage à vitesse moyenne-haute)",
|
|
17
|
+
stageSpumado: "Moussu",
|
|
18
|
+
stageSpumadoDesc: "Grosses bulles, comme de l'eau savonneuse.",
|
|
19
|
+
stageSoftPeaks: "Bec d'Oiseau",
|
|
20
|
+
stageSoftPeaksDesc: "La pointe retombe doucement en formant un bec.",
|
|
21
|
+
stageStiffPeaks: "Ferme (En Neige)",
|
|
22
|
+
stageStiffPeaksDesc: "Pointe droite, ferme et brillante.",
|
|
23
|
+
frenchSugarWhite: "Sucre Semoule",
|
|
24
|
+
frenchSugarPowder: "Sucre Glace",
|
|
25
|
+
frenchTip: "La meringue française est la plus simple. Idéale pour les meringues cuites ou les biscuits. Ne pas consommer crue.",
|
|
26
|
+
frenchTime1: "1-2 min",
|
|
27
|
+
frenchTime2: "3-5 min",
|
|
28
|
+
frenchTime3: "7-9 min",
|
|
29
|
+
italianSugarSyrup: "Sucre pour Sirop",
|
|
30
|
+
italianWater: "Eau",
|
|
31
|
+
italianTip: "La meringue italienne est la plus stable. Réalisée avec un sirop à 118°C. Parfaite pour décorer les entremets.",
|
|
32
|
+
italianTime1: "2 min",
|
|
33
|
+
italianTime2: "5 min",
|
|
34
|
+
italianTime3: "10-12 min",
|
|
35
|
+
swissSugarWhite: "Sucre Semoule",
|
|
36
|
+
swissMaxTemp: "Temp Max",
|
|
37
|
+
swissTip: "La meringue suisse est chauffée au bain-marie jusqu'à dissolution du sucre. Très soyeuse, idéale pour les crèmes.",
|
|
38
|
+
swissTime1: "1-2 min",
|
|
39
|
+
swissTime2: "4-6 min",
|
|
40
|
+
swissTime3: "8-10 min",
|
|
41
|
+
invalidWeightError: "Entrez un poids valide",
|
|
42
|
+
},
|
|
43
|
+
faqTitle: "Questions Fréquentes sur la Meringue",
|
|
44
|
+
faq: [
|
|
45
|
+
{
|
|
46
|
+
question: "Quel est le ratio idéal blancs/sucre ?",
|
|
47
|
+
answer: "Le standard professionnel est un ratio de 1:2. Pour chaque gramme de blanc d'œuf, utilisez deux grammes de sucre pour assurer une structure stable et ferme.",
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
question: "Comment savoir si les blancs sont assez fermes ?",
|
|
51
|
+
answer: "Les blancs sont prêts quand ils forment une pointe verticale qui ne se courbe pas. Le mélange doit être très brillant, dense, et rester dans le bol même retourné.",
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
question: "Quelle meringue choisir pour un décor ?",
|
|
55
|
+
answer: "La meringue italienne est privilégiée car le sirop chaud 'cuit' les protéines, ce qui la rend stable et résistante à l'humidité pendant des heures.",
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
question: "Pourquoi mes blancs ne montent-ils pas ?",
|
|
59
|
+
answer: "La moindre trace de gras (jaune d'œuf, résidus sur le matériel) empêche la formation de la mousse. Utilisez toujours un bol en métal ou en verre parfaitement propre.",
|
|
60
|
+
},
|
|
61
|
+
],
|
|
62
|
+
howTo: [
|
|
63
|
+
{
|
|
64
|
+
name: "Pesez vos blancs d'œufs",
|
|
65
|
+
text: "Utilisez une balance digitale. Une différence de 5g modifie déjà la quantité de sucre nécessaire.",
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
name: "Calculez le sucre",
|
|
69
|
+
text: "Entrez le poids dans l'outil pour obtenir les mesures exactes de sucre semoule et/ou glace.",
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
name: "Choisissez la technique",
|
|
73
|
+
text: "Française pour la cuisson simple, Italienne pour la stabilité, ou Suisse pour les crèmes soyeuses.",
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
name: "Fouettez jusqu'au brillant",
|
|
77
|
+
text: "Suivez le guide des temps jusqu'à obtenir une pointe ferme et verticale (le fameux bec d'oiseau).",
|
|
78
|
+
},
|
|
79
|
+
],
|
|
80
|
+
bibliographyTitle: "Sources Techniques et Références",
|
|
81
|
+
bibliography: [
|
|
82
|
+
{
|
|
83
|
+
name: "Le Journal du Pâtissier - Science du Merengue",
|
|
84
|
+
url: "https://www.lejournaldupatissier.com/",
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
name: "Exploratorium - La science des œufs",
|
|
88
|
+
url: "https://www.exploratorium.edu/explore/cooking/egg-science",
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
name: "Mercotte - Tout savoir sur les meringues",
|
|
92
|
+
url: "https://www.mercotte.fr/",
|
|
93
|
+
},
|
|
94
|
+
],
|
|
95
|
+
seo: [
|
|
96
|
+
{
|
|
97
|
+
type: "title",
|
|
98
|
+
text: "Guide Maître pour les Proportions de Meringue et Blancs en Neige",
|
|
99
|
+
level: 2,
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
type: "paragraph",
|
|
103
|
+
html: "Maîtriser les <strong>blancs en neige</strong> et les différentes méthodes de meringue est la base de la haute pâtisserie. La clé réside dans la précision du poids des blancs et le dosage exact du sucre pour stabiliser les protéines.",
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
type: "stats",
|
|
107
|
+
columns: 4,
|
|
108
|
+
items: [
|
|
109
|
+
{
|
|
110
|
+
value: "1:2",
|
|
111
|
+
label: "Ratio Blanc:Sucre",
|
|
112
|
+
icon: "mdi:scale-balance",
|
|
113
|
+
},
|
|
114
|
+
{
|
|
115
|
+
value: "118°C",
|
|
116
|
+
label: "Sirop Italien",
|
|
117
|
+
icon: "mdi:thermometer-high",
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
value: "60°C",
|
|
121
|
+
label: "Bain-Marie Suisse",
|
|
122
|
+
icon: "mdi:beaker-question-outline",
|
|
123
|
+
},
|
|
124
|
+
{
|
|
125
|
+
value: "0%",
|
|
126
|
+
label: "Tolérance au Gras",
|
|
127
|
+
icon: "mdi:close-circle-outline",
|
|
128
|
+
},
|
|
129
|
+
],
|
|
130
|
+
},
|
|
131
|
+
{
|
|
132
|
+
type: "title",
|
|
133
|
+
text: "Comparaison des Techniques de Meringue",
|
|
134
|
+
level: 3,
|
|
135
|
+
},
|
|
136
|
+
{
|
|
137
|
+
type: "comparative",
|
|
138
|
+
columns: 3,
|
|
139
|
+
items: [
|
|
140
|
+
{
|
|
141
|
+
title: "Meringue Française",
|
|
142
|
+
icon: "mdi:baguette",
|
|
143
|
+
description: "La plus simple mais la moins stable. Blancs et sucre fouettés à froid.",
|
|
144
|
+
points: [
|
|
145
|
+
"Idéale pour les meringues cuites",
|
|
146
|
+
"Texture légère et aérée",
|
|
147
|
+
"Nécessite une cuisson",
|
|
148
|
+
"Rapide à préparer",
|
|
149
|
+
],
|
|
150
|
+
},
|
|
151
|
+
{
|
|
152
|
+
title: "Meringue Italienne",
|
|
153
|
+
icon: "mdi:pizza",
|
|
154
|
+
description: "La plus stable. Utilise un sirop de sucre au boulé.",
|
|
155
|
+
highlight: true,
|
|
156
|
+
points: [
|
|
157
|
+
"Parfaite pour les décors",
|
|
158
|
+
"Consommable sans cuisson",
|
|
159
|
+
"Résiste mieux à l'humidité",
|
|
160
|
+
"Brillance miroir et densité",
|
|
161
|
+
],
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
title: "Meringue Suisse",
|
|
165
|
+
icon: "mdi:cheese",
|
|
166
|
+
description: "Chauffée au bain-marie. Équilibre entre facilité et stabilité.",
|
|
167
|
+
points: [
|
|
168
|
+
"Base pour crèmes au beurre",
|
|
169
|
+
"Texture très soyeuse",
|
|
170
|
+
"Excellente pour les fourrages",
|
|
171
|
+
"Sécurité alimentaire accrue",
|
|
172
|
+
],
|
|
173
|
+
},
|
|
174
|
+
],
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
type: "title",
|
|
178
|
+
text: "Étapes Visuelles du Montage des Blancs",
|
|
179
|
+
level: 3,
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
type: "table",
|
|
183
|
+
headers: ["Étape", "Description Visuelle", "Usage Recommandé", "Stabilité"],
|
|
184
|
+
rows: [
|
|
185
|
+
["Moussu", "Grosses bulles transparentes", "Ajouter l'acide/sucre", "Nulle"],
|
|
186
|
+
["Bec d'Oiseau", "La pointe se courbe vers le bas", "Mousses et soufflés", "Moyenne"],
|
|
187
|
+
["Ferme / Neige", "Pointe verticale et rigide", "Décor et cuisson", "Haute"],
|
|
188
|
+
["Grainé", "Texture sèche et grumeleuse", "Inutilisable (brisé)", "Effondrement"],
|
|
189
|
+
],
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
type: "diagnostic",
|
|
193
|
+
variant: "warning",
|
|
194
|
+
title: "Votre Meringue rejette-t-elle du Liquide ?",
|
|
195
|
+
html: "Si vous voyez du sirop s'échapper (synérèse), c'est soit que le sucre n'était pas dissous, soit que l'humidité ambiante est trop forte. Pour l'italienne, versez le sirop en filet constant, jamais directement sur le fouet.",
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
type: "title",
|
|
199
|
+
text: "Glossaire de la Pâtisserie Technique",
|
|
200
|
+
level: 3,
|
|
201
|
+
},
|
|
202
|
+
{
|
|
203
|
+
type: "glossary",
|
|
204
|
+
items: [
|
|
205
|
+
{
|
|
206
|
+
term: "Ovalbumine",
|
|
207
|
+
definition: "Principale protéine du blanc d'œuf responsable de l'emprisonnement de l'air.",
|
|
208
|
+
},
|
|
209
|
+
{
|
|
210
|
+
term: "Hygroscopique",
|
|
211
|
+
definition: "Propriété du sucre à absorber l'humidité de l'air, ce qui peut ramollir la meringue.",
|
|
212
|
+
},
|
|
213
|
+
{
|
|
214
|
+
term: "Crème de Tartre",
|
|
215
|
+
definition: "Sel acide qui aide à stabiliser la mousse et évite de 'grainer' les blancs.",
|
|
216
|
+
},
|
|
217
|
+
{
|
|
218
|
+
term: "Bain-Marie",
|
|
219
|
+
definition: "Méthode de chauffe douce cruciale pour dissoudre le sucre de la meringue suisse.",
|
|
220
|
+
},
|
|
221
|
+
],
|
|
222
|
+
},
|
|
223
|
+
{
|
|
224
|
+
type: "tip",
|
|
225
|
+
title: "L'Astuce du Bol au Vinaigre",
|
|
226
|
+
html: "Passez un papier absorbant avec un peu de vinaigre ou de citron dans votre bol avant de commencer. Le moindre résidu de gras tuera votre mousse.",
|
|
227
|
+
},
|
|
228
|
+
{
|
|
229
|
+
type: "paragraph",
|
|
230
|
+
html: "Notre calculateur automatise les calculs pour que vous puissiez vous concentrer sur le fouettage jusqu'au brillant parfait.",
|
|
231
|
+
},
|
|
232
|
+
],
|
|
233
|
+
schemas: [],
|
|
234
|
+
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { CookingToolEntry, ToolDefinition } from '../../types';
|
|
2
|
+
import MeringueComponent from './component.astro';
|
|
3
|
+
import MeringueComponentSEO from './seo.astro';
|
|
4
|
+
import MeringueComponentBibliography from './bibliography.astro';
|
|
5
|
+
|
|
6
|
+
export const meringuePeak: CookingToolEntry = {
|
|
7
|
+
id: 'meringue-peak',
|
|
8
|
+
icons: {
|
|
9
|
+
bg: 'mdi:egg',
|
|
10
|
+
fg: 'mdi:fire',
|
|
11
|
+
},
|
|
12
|
+
i18n: {
|
|
13
|
+
es: () => import('./i18n/es').then((m) => m.content),
|
|
14
|
+
en: () => import('./i18n/en').then((m) => m.content),
|
|
15
|
+
fr: () => import('./i18n/fr').then((m) => m.content),
|
|
16
|
+
},
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
export const MERENGUE_CALCULATOR_TOOL: ToolDefinition = {
|
|
20
|
+
entry: meringuePeak,
|
|
21
|
+
Component: MeringueComponent,
|
|
22
|
+
SEOComponent: MeringueComponentSEO,
|
|
23
|
+
BibliographyComponent: MeringueComponentBibliography,
|
|
24
|
+
};
|
|
@@ -0,0 +1,406 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--ms-primary: hsl(262deg, 83%, 58%);
|
|
3
|
+
--ms-primary-light: hsl(262deg, 83%, 95%);
|
|
4
|
+
--ms-primary-dark: hsl(262deg, 83%, 45%);
|
|
5
|
+
--ms-accent: hsl(190deg, 90%, 45%);
|
|
6
|
+
--ms-success: hsl(150deg, 80%, 40%);
|
|
7
|
+
--ms-warning: hsl(35deg, 95%, 55%);
|
|
8
|
+
--ms-danger: hsl(0deg, 85%, 60%);
|
|
9
|
+
--ms-bg-card: hsl(0deg, 0%, 100%);
|
|
10
|
+
--ms-bg-app: hsl(210deg, 20%, 98%);
|
|
11
|
+
--ms-border: hsl(210deg, 20%, 90%);
|
|
12
|
+
--ms-text-main: hsl(210deg, 30%, 20%);
|
|
13
|
+
--ms-text-muted: hsl(210deg, 15%, 50%);
|
|
14
|
+
--ms-shadow-sm: 0 1px 2px 0 rgb(0, 0, 0, 0.05);
|
|
15
|
+
--ms-shadow-md: 0 4px 6px -1px rgb(0, 0, 0, 0.1), 0 2px 4px -2px rgb(0, 0, 0, 0.1);
|
|
16
|
+
--ms-shadow-lg: 0 10px 15px -3px rgb(0, 0, 0, 0.1), 0 4px 6px -4px rgb(0, 0, 0, 0.1);
|
|
17
|
+
--ms-radius: 1rem;
|
|
18
|
+
--ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.theme-dark {
|
|
22
|
+
--ms-bg-card: hsl(220deg, 25%, 12%);
|
|
23
|
+
--ms-bg-app: hsl(220deg, 30%, 7%);
|
|
24
|
+
--ms-border: hsl(220deg, 20%, 20%);
|
|
25
|
+
--ms-text-main: hsl(210deg, 20%, 95%);
|
|
26
|
+
--ms-text-muted: hsl(210deg, 15%, 70%);
|
|
27
|
+
--ms-primary-light: hsl(262deg, 83%, 15%);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.theme-dark .ms-sidebar {
|
|
31
|
+
background: linear-gradient(to bottom, var(--ms-bg-card), hsl(220deg, 25%, 15%));
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.theme-dark .ms-results-header {
|
|
35
|
+
background: hsl(220deg, 25%, 8%);
|
|
36
|
+
border-bottom-color: hsl(220deg, 25%, 20%);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.theme-dark .ms-copy-btn {
|
|
40
|
+
background: hsl(220deg, 25%, 30%);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.theme-dark .ms-copy-btn:hover {
|
|
44
|
+
background: hsl(220deg, 25%, 40%);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.mold-scaler-container {
|
|
48
|
+
max-width: 1000px;
|
|
49
|
+
margin: 0 auto;
|
|
50
|
+
padding: 1rem;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.ms-card {
|
|
54
|
+
background: var(--ms-bg-card);
|
|
55
|
+
border: 1px solid var(--ms-border);
|
|
56
|
+
border-radius: var(--ms-radius);
|
|
57
|
+
box-shadow: var(--ms-shadow-lg);
|
|
58
|
+
overflow: hidden;
|
|
59
|
+
display: flex;
|
|
60
|
+
flex-direction: column;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
@media (min-width: 1024px) {
|
|
64
|
+
.ms-card {
|
|
65
|
+
flex-direction: row;
|
|
66
|
+
min-height: 700px;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.ms-sidebar {
|
|
71
|
+
flex: 1;
|
|
72
|
+
padding: 2rem;
|
|
73
|
+
border-bottom: 1px solid var(--ms-border);
|
|
74
|
+
background: linear-gradient(to bottom, var(--ms-bg-card), var(--ms-primary-light));
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
@media (min-width: 1024px) {
|
|
78
|
+
.ms-sidebar {
|
|
79
|
+
border-bottom: none;
|
|
80
|
+
border-right: 1px solid var(--ms-border);
|
|
81
|
+
max-width: 450px;
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.ms-main {
|
|
86
|
+
flex: 1.5;
|
|
87
|
+
padding: 2rem;
|
|
88
|
+
display: flex;
|
|
89
|
+
flex-direction: column;
|
|
90
|
+
gap: 2rem;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.ms-section {
|
|
94
|
+
margin-bottom: 2rem;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.ms-section-title {
|
|
98
|
+
display: flex;
|
|
99
|
+
align-items: center;
|
|
100
|
+
gap: 0.75rem;
|
|
101
|
+
font-size: 1.25rem;
|
|
102
|
+
font-weight: 700;
|
|
103
|
+
color: var(--ms-text-main);
|
|
104
|
+
margin-bottom: 1.5rem;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
.ms-section-badge {
|
|
108
|
+
display: flex;
|
|
109
|
+
align-items: center;
|
|
110
|
+
justify-content: center;
|
|
111
|
+
width: 1.75rem;
|
|
112
|
+
height: 1.75rem;
|
|
113
|
+
background: var(--ms-primary);
|
|
114
|
+
color: var(--ms-bg-card);
|
|
115
|
+
border-radius: 50%;
|
|
116
|
+
font-size: 0.875rem;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.ms-shape-selector {
|
|
120
|
+
display: grid;
|
|
121
|
+
grid-template-columns: repeat(3, 1fr);
|
|
122
|
+
gap: 0.75rem;
|
|
123
|
+
margin-bottom: 1.25rem;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.ms-shape-btn {
|
|
127
|
+
display: flex;
|
|
128
|
+
flex-direction: column;
|
|
129
|
+
align-items: center;
|
|
130
|
+
padding: 0.75rem;
|
|
131
|
+
border-radius: 0.75rem;
|
|
132
|
+
border: 1px solid var(--ms-border);
|
|
133
|
+
background: var(--ms-bg-card);
|
|
134
|
+
color: var(--ms-text-muted);
|
|
135
|
+
cursor: pointer;
|
|
136
|
+
transition: var(--ms-transition);
|
|
137
|
+
font-size: 0.875rem;
|
|
138
|
+
font-weight: 600;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
.ms-shape-btn:hover {
|
|
142
|
+
border-color: var(--ms-primary);
|
|
143
|
+
color: var(--ms-primary);
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.ms-shape-btn.active {
|
|
147
|
+
background: var(--ms-primary);
|
|
148
|
+
color: var(--ms-bg-card);
|
|
149
|
+
border-color: var(--ms-primary);
|
|
150
|
+
box-shadow: 0 4px 12px hsla(262deg, 83%, 58%, 0.3);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.ms-shape-icon {
|
|
154
|
+
width: 2rem;
|
|
155
|
+
height: 2rem;
|
|
156
|
+
margin-bottom: 0.5rem;
|
|
157
|
+
border: 2px solid currentcolor;
|
|
158
|
+
transition: var(--ms-transition);
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.ms-shape-btn[data-shape="round"] .ms-shape-icon {
|
|
162
|
+
border-radius: 50%;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
.ms-shape-btn[data-shape="square"] .ms-shape-icon {
|
|
166
|
+
border-radius: 4px;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
.ms-shape-btn[data-shape="rectangular"] .ms-shape-icon {
|
|
170
|
+
border-radius: 2px;
|
|
171
|
+
width: 2.5rem;
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
.ms-inputs-grid {
|
|
175
|
+
display: grid;
|
|
176
|
+
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
|
|
177
|
+
gap: 1rem;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.ms-input-group {
|
|
181
|
+
display: flex;
|
|
182
|
+
flex-direction: column;
|
|
183
|
+
gap: 0.5rem;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.ms-label {
|
|
187
|
+
font-size: 0.75rem;
|
|
188
|
+
font-weight: 700;
|
|
189
|
+
color: var(--ms-text-muted);
|
|
190
|
+
text-transform: uppercase;
|
|
191
|
+
letter-spacing: 0.05em;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.ms-input {
|
|
195
|
+
width: 100%;
|
|
196
|
+
padding: 0.75rem 1rem;
|
|
197
|
+
border-radius: 0.5rem;
|
|
198
|
+
border: 1px solid var(--ms-border);
|
|
199
|
+
background: var(--ms-bg-card);
|
|
200
|
+
color: var(--ms-text-main);
|
|
201
|
+
font-weight: 600;
|
|
202
|
+
transition: var(--ms-transition);
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
.ms-input:focus {
|
|
206
|
+
outline: none;
|
|
207
|
+
border-color: var(--ms-primary);
|
|
208
|
+
box-shadow: 0 0 0 3px hsla(262deg, 83%, 58%, 0.1);
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
/* Result Section */
|
|
212
|
+
.ms-hero-result {
|
|
213
|
+
text-align: center;
|
|
214
|
+
padding: 2.5rem;
|
|
215
|
+
background: linear-gradient(135deg, var(--ms-primary), var(--ms-primary-dark));
|
|
216
|
+
color: var(--ms-bg-card);
|
|
217
|
+
border-radius: var(--ms-radius);
|
|
218
|
+
box-shadow: var(--ms-shadow-md);
|
|
219
|
+
position: relative;
|
|
220
|
+
overflow: hidden;
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
.ms-hero-result::before {
|
|
224
|
+
content: '';
|
|
225
|
+
position: absolute;
|
|
226
|
+
top: -50%;
|
|
227
|
+
left: -50%;
|
|
228
|
+
width: 200%;
|
|
229
|
+
height: 200%;
|
|
230
|
+
background: radial-gradient(circle, hsla(0deg, 0%, 100%, 0.1), transparent 60%);
|
|
231
|
+
pointer-events: none;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
.ms-result-label {
|
|
235
|
+
font-size: 0.875rem;
|
|
236
|
+
font-weight: 600;
|
|
237
|
+
text-transform: uppercase;
|
|
238
|
+
letter-spacing: 0.1em;
|
|
239
|
+
opacity: 0.8;
|
|
240
|
+
margin-bottom: 0.5rem;
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
.ms-result-value {
|
|
244
|
+
font-size: 4rem;
|
|
245
|
+
font-weight: 800;
|
|
246
|
+
margin-bottom: 0.5rem;
|
|
247
|
+
line-height: 1;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
.ms-result-text {
|
|
251
|
+
font-size: 1rem;
|
|
252
|
+
opacity: 0.9;
|
|
253
|
+
max-width: 300px;
|
|
254
|
+
margin: 0 auto;
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
.ms-result-text strong {
|
|
258
|
+
font-weight: 700;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
/* Visualizer */
|
|
262
|
+
.ms-viz-container {
|
|
263
|
+
background: var(--ms-bg-app);
|
|
264
|
+
border: 1px solid var(--ms-border);
|
|
265
|
+
border-radius: var(--ms-radius);
|
|
266
|
+
padding: 1.5rem;
|
|
267
|
+
position: relative;
|
|
268
|
+
aspect-ratio: 4 / 3;
|
|
269
|
+
display: flex;
|
|
270
|
+
flex-direction: column;
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
.ms-viz-svg {
|
|
274
|
+
flex: 1;
|
|
275
|
+
width: 100%;
|
|
276
|
+
height: 100%;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
.ms-viz-legend {
|
|
280
|
+
display: flex;
|
|
281
|
+
justify-content: center;
|
|
282
|
+
gap: 1.5rem;
|
|
283
|
+
padding-top: 1rem;
|
|
284
|
+
font-size: 0.75rem;
|
|
285
|
+
font-weight: 600;
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
.ms-legend-item {
|
|
289
|
+
display: flex;
|
|
290
|
+
align-items: center;
|
|
291
|
+
gap: 0.5rem;
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
.ms-dot {
|
|
295
|
+
width: 0.75rem;
|
|
296
|
+
height: 0.75rem;
|
|
297
|
+
border-radius: 50%;
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
.ms-dot.original {
|
|
301
|
+
background: var(--ms-primary);
|
|
302
|
+
opacity: 0.5;
|
|
303
|
+
border: 1px dashed var(--ms-primary);
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
.ms-dot.target {
|
|
307
|
+
background: var(--ms-success);
|
|
308
|
+
opacity: 0.8;
|
|
309
|
+
border: 1px solid var(--ms-success);
|
|
310
|
+
}
|
|
311
|
+
|
|
312
|
+
/* Ingredients */
|
|
313
|
+
.ms-ingredients-card {
|
|
314
|
+
border: 1px solid var(--ms-border);
|
|
315
|
+
border-radius: var(--ms-radius);
|
|
316
|
+
padding: 1.5rem;
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
.ms-ingredients-list {
|
|
320
|
+
display: flex;
|
|
321
|
+
flex-direction: column;
|
|
322
|
+
gap: 0.75rem;
|
|
323
|
+
margin-bottom: 1.5rem;
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
.ms-ingredient-row {
|
|
327
|
+
display: grid;
|
|
328
|
+
grid-template-columns: 1fr;
|
|
329
|
+
gap: 0.75rem;
|
|
330
|
+
padding: 1rem;
|
|
331
|
+
background: var(--ms-bg-app);
|
|
332
|
+
border-radius: 0.75rem;
|
|
333
|
+
border: 1px solid var(--ms-border);
|
|
334
|
+
position: relative;
|
|
335
|
+
animation: slide-in 0.3s ease-out;
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
@keyframes slide-in {
|
|
339
|
+
from {
|
|
340
|
+
opacity: 0;
|
|
341
|
+
transform: translateY(10px);
|
|
342
|
+
}
|
|
343
|
+
|
|
344
|
+
to {
|
|
345
|
+
opacity: 1;
|
|
346
|
+
transform: translateY(0);
|
|
347
|
+
}
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
@media (min-width: 640px) {
|
|
351
|
+
.ms-ingredient-row {
|
|
352
|
+
grid-template-columns: 2fr 1fr 1fr auto;
|
|
353
|
+
align-items: center;
|
|
354
|
+
}
|
|
355
|
+
}
|
|
356
|
+
|
|
357
|
+
.ms-ingredient-final {
|
|
358
|
+
font-weight: 800;
|
|
359
|
+
color: var(--ms-success);
|
|
360
|
+
font-size: 1.125rem;
|
|
361
|
+
padding: 0.5rem;
|
|
362
|
+
text-align: center;
|
|
363
|
+
}
|
|
364
|
+
|
|
365
|
+
.ms-del-btn {
|
|
366
|
+
background: transparent;
|
|
367
|
+
border: none;
|
|
368
|
+
color: var(--ms-text-muted);
|
|
369
|
+
cursor: pointer;
|
|
370
|
+
padding: 0.5rem;
|
|
371
|
+
border-radius: 0.5rem;
|
|
372
|
+
transition: var(--ms-transition);
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
.ms-del-btn:hover {
|
|
376
|
+
background: var(--ms-danger);
|
|
377
|
+
color: var(--ms-bg-card);
|
|
378
|
+
}
|
|
379
|
+
|
|
380
|
+
.ms-add-btn {
|
|
381
|
+
width: 100%;
|
|
382
|
+
padding: 1rem;
|
|
383
|
+
background: transparent;
|
|
384
|
+
border: 2px dashed var(--ms-primary);
|
|
385
|
+
color: var(--ms-primary);
|
|
386
|
+
border-radius: 0.75rem;
|
|
387
|
+
font-weight: 700;
|
|
388
|
+
cursor: pointer;
|
|
389
|
+
transition: var(--ms-transition);
|
|
390
|
+
display: flex;
|
|
391
|
+
align-items: center;
|
|
392
|
+
justify-content: center;
|
|
393
|
+
gap: 0.5rem;
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
.ms-add-btn:hover {
|
|
397
|
+
background: var(--ms-primary-light);
|
|
398
|
+
border-style: solid;
|
|
399
|
+
}
|
|
400
|
+
|
|
401
|
+
.ms-empty-state {
|
|
402
|
+
text-align: center;
|
|
403
|
+
padding: 2rem;
|
|
404
|
+
color: var(--ms-text-muted);
|
|
405
|
+
font-style: italic;
|
|
406
|
+
}
|