+
Descripción
+
{description}
+
+
Uso
+
{usage}
+
+ {aliases && aliases.length > 0 && (
+
+ Alias: {aliases.join(', ')}
+
+ )}
+
+
Ejemplo
+ {examples.map((example, idx) => (
+
{example}
+ ))}
+
+ {warning && (
+
+ {warning}
+
+ )}
+
+);
+
+export default CommandDoc;
diff --git a/src/components/CommandDoc/CommandDoc.module.css b/src/components/CommandDoc/CommandDoc.module.css
new file mode 100644
index 0000000..cefecc5
--- /dev/null
+++ b/src/components/CommandDoc/CommandDoc.module.css
@@ -0,0 +1,49 @@
+.commandContainer {
+ padding: 1.5rem;
+ background: var(--ifm-background-color);
+ border-radius: 12px;
+ border: 1px solid var(--ifm-color-emphasis-200);
+ margin-bottom: 2rem;
+ transition: box-shadow 0.25s ease, transform 0.25s ease;
+}
+
+.commandTitle {
+ font-size: 1.5rem;
+ font-weight: 600;
+ color: var(--ifm-color-content);
+ margin-bottom: 0.25rem;
+}
+
+.commandDescription {
+ font-size: 1rem;
+ color: var(--ifm-color-content-secondary);
+ margin-bottom: 1rem;
+ line-height: 1.5;
+}
+
+.sectionTitle {
+ font-size: 1.125rem;
+ font-weight: 600;
+ color: var(--ifm-color-primary);
+ margin: 1rem 0 0.5rem;
+}
+
+.codeBlock {
+ font-size: 0.95rem;
+ font-family: var(--ifm-font-family-monospace);
+ background: var(--ifm-pre-background);
+ color: var(--ifm-pre-color);
+ padding: 0.5rem 0.75rem;
+ border-radius: 6px;
+ overflow-x: auto;
+ border: 1px solid var(--ifm-color-emphasis-100);
+}
+
+.warning {
+ font-size: 0.9rem;
+ color: var(--ifm-color-warning);
+ background-color: var(--ifm-color-warning-background);
+ padding: 0.5rem;
+ border-radius: 6px;
+ margin-top: 1rem;
+}
diff --git a/src/components/CraftRenderer/CraftRenderer.css b/src/components/CraftRenderer/CraftRenderer.css
new file mode 100644
index 0000000..5460cc5
--- /dev/null
+++ b/src/components/CraftRenderer/CraftRenderer.css
@@ -0,0 +1,210 @@
+
+.item-ui {
+ border: #25035c 2px solid;
+ background-color: #110211;
+ border-radius: 5px;
+ padding: 10px;
+ /* responsive height and width */
+ width: 100%;
+ height: 100%;
+}
+
+.item-ui > .title {
+ font-size: 18px;
+ margin-bottom: 0px;
+}
+
+.item-ui > .description {
+ font-size: 18px;
+ margin-bottom: 0px;
+}
+
+.item-ui > .tag {
+ font-size: 18px;
+ margin-bottom: 0px;
+}
+
+.item-ui > img {
+ margin-bottom: 5px;
+}
+
+.color4 {
+ color: #aa0000;
+}
+
+.colorC {
+ color: #ff5555;
+}
+
+.color6 {
+ color: #ffaa00;
+}
+
+.colorE {
+ color: #ffff55;
+}
+
+.color2 {
+ color: #00aa00;
+}
+
+.colorA {
+ color: #55ff55;
+}
+
+.color3 {
+ color: #00aaaa;
+}
+
+.colorB {
+ color: #55ffff;
+}
+
+.color1 {
+ color: #0000aa;
+}
+
+.color9 {
+ color: #5555ff;
+}
+
+.color5 {
+ color: #aa00aa;
+}
+
+.colorD {
+ color: #ff55ff;
+}
+
+.colorF {
+ color: #ffffff;
+}
+
+.color7 {
+ color: #aaaaaa;
+}
+
+.color8 {
+ color: #555555;
+}
+
+.color0 {
+ color: #000000;
+}
+
+.colorZombPot {
+ color: #5f7d48;
+}
+
+.formatR {
+ font-family: 'Minecraft';
+}
+
+.formatL {
+ font-family: 'MinecraftBold';
+}
+
+.formatM {
+ text-decoration: line-through;
+}
+
+.formatN {
+ text-decoration: underline;
+}
+
+.formatO {
+ font-family: 'MinecraftItalic';
+}
+
+.formatOL {
+ font-family: 'MinecraftBoldItalic';
+}
+
+/* CraftRenderer.css */
+
+.item {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin-bottom: 3rem;
+ gap: 1rem;
+}
+
+@media (min-width: 768px) {
+ .item {
+ flex-direction: row;
+ align-items: center;
+ }
+}
+
+.item-image {
+ margin-right: 1rem;
+ min-width: 250px;
+}
+
+.item-image img {
+ width: 100%;
+ height: auto;
+ display: block;
+}
+
+.item-ui {
+ text-align: center;
+}
+
+@media (min-width: 768px) {
+ .item-ui {
+ text-align: left;
+ }
+}
+
+.title {
+ margin: 0;
+ padding: 0;
+}
+
+.description {
+ margin: 0;
+ padding: 0;
+}
+
+.tag {
+ margin: 0;
+ padding: 0;
+ display: inline-block;
+}
+
+/* Estilos extra que usas */
+.anchor {
+ display: block;
+ position: relative;
+ top: -80px; /* Por si tienes navbar fija */
+ visibility: hidden;
+}
+
+.big-centered-number {
+ font-size: 2rem;
+ font-weight: bold;
+ text-align: center;
+ margin: 0;
+ padding: 0;
+}
+
+/* Simulación de algunas clases de color / formato */
+.color8 {
+ color: #b87eff;
+}
+
+.formatR {
+ font-family: 'Minecraftia', monospace;
+ font-weight: 700;
+}
+
+/* Márgenes laterales simulando me-3 / ms-2 de Bootstrap */
+.me-3 {
+ margin-right: 1rem;
+}
+
+.ms-2 {
+ margin-left: 0.5rem;
+}
diff --git a/src/components/CraftRenderer/CraftRenderer.jsx b/src/components/CraftRenderer/CraftRenderer.jsx
new file mode 100644
index 0000000..0f5c874
--- /dev/null
+++ b/src/components/CraftRenderer/CraftRenderer.jsx
@@ -0,0 +1,78 @@
+import './CraftRenderer.css';
+
+export default function CraftRenderer({ craft }) {
+ switch (craft.name) {
+ case "admin_stick":
+ case "scissors":
+ case "spawner_breaker":
+ case "zombification_potion":
+ return