Jump to content

Customizer: Difference between revisions

From Leaf Essentials
That1Dev (talk | contribs)
No edit summary
That1Dev (talk | contribs)
No edit summary
Line 12: Line 12:
         <h1 style="color: #fff; font-size: 2.5em; border: none; margin-bottom: 10px;">The Customizer</h1>
         <h1 style="color: #fff; font-size: 2.5em; border: none; margin-bottom: 10px;">The Customizer</h1>
         <p style="font-size: 1.2em; line-height: 1.6; color: #b0b0b0;">
         <p style="font-size: 1.2em; line-height: 1.6; color: #b0b0b0;">
             The Customizer is the powerhouse of Leaf Essentials. It's a versatile tool designed to bridge the gap between imagination and implementation, allowing you to craft everything from UI elements to complex logic scripts.
             The Customizer is the powerhouse of Leaf Essentials. It's a versatile tool designed to bridge the gap between imagination and implementation.
         </p>
         </p>
     </div>
     </div>
     <div style="flex: 1; min-width: 250px; text-align: center;">
     <div style="flex: 1; min-width: 250px; text-align: center;">
         [[File:CustomizerBrush.png|300px|alt=Customizer Brush]]
         [[File:CustomizerBrush.png|250px|alt=Customizer Brush]]
        <div style="font-size: 0.8em; color: #666; margin-top: 8px;">The Customizer Brush in-game</div>
     </div>
     </div>
</div>
</div>


<!-- TOOLS GRID -->
<h2 style="text-align: center; color: #58a6ff; border: none; margin-bottom: 30px; text-transform: uppercase; letter-spacing: 2px; font-size: 1em; opacity: 0.7;">Creation Modules</h2>
<h2 style="text-align: center; color: #58a6ff; border: none; margin-bottom: 30px; text-transform: uppercase; letter-spacing: 2px;">What can you create?</h2>


<div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 15px;">
<!-- THE GRID (Matching image_002382.png) -->
     <!-- CATEGORY: UI -->
<div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px;">
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center; transition: 0.3s;">
 
        <span style="color: #58a6ff; font-weight: bold;">[[Action Form]]</span>
     <!-- LINKED ITEMS (Green style) -->
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center;">
        <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            [[Action Form|<span style="color: #44bd69; font-weight: bold; letter-spacing: 0.5px;">Action Form</span>]]
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #58a6ff; font-weight: bold;">[[Chest UI]]</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            [[Chest UI|<span style="color: #44bd69; font-weight: bold;">Chest UI</span>]]
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #58a6ff; font-weight: bold;">[[Formatting]]</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            [[Formatting|<span style="color: #44bd69; font-weight: bold;">Formatting</span>]]
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
        <span style="color: #fff;">Modal Form</span>
     <div style="background: #161616; border: 1px solid #3366cc; padding: 25px 15px; border-radius: 8px; text-align: center; box-shadow: inset 0 0 10px rgba(51,102,204,0.2);">
        <div style="border: 1px solid #3366cc; padding: 15px; border-radius: 4px; background: rgba(51,102,204,0.05);">
            [[Script|<span style="color: #44bd69; font-weight: bold;">Script</span>]]
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #fff;">Sidebar</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            [[Zones|<span style="color: #44bd69; font-weight: bold;">Zone</span>]]
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #fff;">Toast</span>
    <!-- UNLINKED ITEMS (Coming Soon style) -->
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Modal Form</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
    <!-- CATEGORY: LOGIC -->
 
     <div style="background: rgba(88, 166, 255, 0.1); border: 1px solid #58a6ff; padding: 15px; border-radius: 8px; text-align: center;">
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <span style="color: #58a6ff; font-weight: bold;">[[Script]]</span>
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Sidebar</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #fff;">Function</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Toast</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #fff;">Command</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Function</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
    <!-- CATEGORY: WORLD -->
 
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <span style="color: #58a6ff; font-weight: bold;">[[Zones|Zone]]</span>
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Command</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
         <span style="color: #fff;">Warp</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
         <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Warp</div>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
        </div>
     </div>
     </div>
     <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
 
        <span style="color: #fff;">Event</span>
     <div style="background: #161616; border: 1px solid #222; padding: 25px 15px; border-radius: 8px; text-align: center; opacity: 0.8;">
    </div>
        <div style="border: 1px solid #333; padding: 15px; border-radius: 4px;">
    <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
            <div style="color: #fff; font-weight: bold; margin-bottom: 4px;">Event</div>
        <span style="color: #fff;">Folder</span>
            <div style="font-size: 0.7em; color: #888; text-transform: uppercase; letter-spacing: 1px;">Coming Soon</div>
    </div>
         </div>
    <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
        <span style="color: #fff;">Box</span>
    </div>
    <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
        <span style="color: #fff;">Invite</span>
    </div>
    <div style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 15px; border-radius: 8px; text-align: center;">
         <span style="color: #fff;">Channel</span>
     </div>
     </div>
</div>
</div>


<!-- FOOTER BRANDING -->
<!-- FOOTER -->
<div style="margin-top: 50px; padding: 30px; background: linear-gradient(90deg, rgba(88,166,255,0.1) 0%, rgba(0,0,0,0) 100%); border-radius: 15px; display: flex; align-items: center; gap: 20px;">
<div style="margin-top: 50px; padding: 20px; border-top: 1px solid #333; display: flex; align-items: center; justify-content: space-between;">
    [[File:3DBrushCompressed.png|120px]]
    <div style="display: flex; align-items: center; gap: 15px;">
    <div>
        [[File:3DBrushCompressed.png|60px]]
        <h4 style="margin: 0; color: #58a6ff;">4 Year Anniversary Edition</h4>
         <span style="font-size: 0.9em; color: #666;">Leaf Essentials Wiki &bull; 2026</span>
         <p style="margin: 5px 0 0; font-size: 0.9em; opacity: 0.7;">Celebrate the history of Leaf with the limited edition 3D branding brush.</p>
     </div>
     </div>
    <div style="font-size: 0.8em; color: #44bd69; font-weight: bold; text-transform: uppercase;">4 Year Anniversary</div>
</div>
</div>


</div>
</div>

Revision as of 10:17, 30 April 2026

   🚧 
   Stub: This page is a work in progress. Feel free to contribute!

The Customizer

The Customizer is the powerhouse of Leaf Essentials. It's a versatile tool designed to bridge the gap between imagination and implementation.

       Customizer Brush

Creation Modules

Modal Form
Coming Soon
Sidebar
Coming Soon
Toast
Coming Soon
Function
Coming Soon
Command
Coming Soon
Warp
Coming Soon
Event
Coming Soon
       
       Leaf Essentials Wiki • 2026
4 Year Anniversary