add setup game asset structurre

docs/02-setup-main-game/05-main-scene/06-special-win.md

@@ -90,4 +90,3 @@ Special Wins are high-value reward events categorized by payout thresholds:
 **Tip**:
 - Move assets to `custom-scale/` to resolve image quality issues.
 - Customize font styles based on game design.
-- [View Platform Asset Structure](/docs/category/game-asset-structure)

docs/02-setup-main-game/05-main-scene/07-item-description.md

@@ -52,8 +52,9 @@ The **Item Description** system provides detailed information about game items,
     | Step | Action | Image Reference |
     |------|--------|-----------------|
     | 1 | Set **Sprite Frame** in `background` using prepared assets. | ![Step 1](./img/07-item-description/setup-item-big-1.png) |
-    | 2 | Follow **Step 4** of `item-description-small` for payout setup. | [See Small Setup](#prefab-configurations) |
+    | 2 | Follow **Step 4** of `item-description-small` for payout setup. | [See Small Setup](#item-description-small) |
-    | 3 | Follow **Step 4** of `item-description-no-odds` for description setup. | [See No-Odds Setup](#prefab-configurations) |
+    | 3 | Follow **Step 4** of `item-description-no-odds` for description setup. | [See No-Odds Setup](#item-description-no-odds) |
+
 **Tip**:
 - Use the helper tool to configure:
   1. Set **Content Size** and **Cell Item Size** per game design.

docs/02-setup-main-game/05-main-scene/08-free-round.md

@@ -63,7 +63,7 @@ The **Free Round** system manages the display and logic for tracking remaining f
 **Tip**:
 - Follow game design for position and size.
 - Use separate textures for Desktop and Mobile.
-- Ensure the main scene includes the popup panel ([See Popup Panel Guide](/docs/setup-main-game/main-scene/popup-panel#multiple-popup-panel)).
+- Ensure the main scene includes the popup panel ([See Popup Panel Guide](http://localhost:3000/docs/setup-main-game/main-scene/popup-panel#multiple-popup-panel)).
 
 ## Game Result Example
 | Platform | Popup | Action | Result |

docs/02-setup-main-game/05-main-scene/13-game-logo.md

@@ -114,4 +114,3 @@ The **Game Logo** is a key branding element displayed consistently across all pl
 **Tip**:
 - Test the static logo display under slow network conditions to ensure fallback works.
 - Verify animation states (`play` and `idle`) for smooth transitions.
-- [See More Info](/docs/category/game-asset-structure)

docs/02-setup-main-game/05-main-scene/19-gamble.md

@@ -73,9 +73,9 @@ Place the gamble node in the following scene structure:
 ![Backgrounds](../img/05-main-scene/gamble/add-background-gamble.png)
 
 1. Use background scenes for the gamble feature:
-  - `gamble-background-landscape` : [Setup Background Landscape](/docs/setup-main-game/main-scene/background#setup-steps)
+  - `gamble-background-landscape` : [Setup Background Landscape](/docs/setup-main-game/main-scene/background#2-setup-background-landscape)
 
-  - `gamble-background-portrait` : [Setup Background Portrait](/docs/setup-main-game/main-scene/background#setup-steps)
+  - `gamble-background-portrait` : [Setup Background Portrait](/docs/setup-main-game/main-scene/background#3-setup-background-portrait)
 
 2. Attach the `orientation-ui-controller` component to both `gamble-background-landscape` and `gamble-background-portrait` nodes.  
   3. The `gamble-background-portrait` node has a dedicated component for portrait mode:
@@ -87,4 +87,4 @@ Place the gamble node in the following scene structure:
 ## Game Result Example
 
 Make sure the main scene includes the Win Limit Panel.  
-🔗 More Info [Game Result](/docs/setup-main-game/main-scene/win-limit#overview)
+🔗 More Info [Game Result](/docs/setup-main-game/main-scene/win-limit#gamble-win-limit)

docs/03-setup-special-feature/02-free-spin.md

@@ -7,269 +7,6 @@ sidebar_position: 2
 ## Overview
 The **Free Spin (or Free Games) Feature** awards players a set number of spins without requiring additional bets. During these spins, players can still win prizes—often larger than in the base game—without spending any of their own credits.
 ![Free Spin Overview](./img/freespins/fs-trigger.jpg)
-
+## Implementation
-## Implementation Guide
 
 ### Prepare Assets
-
-| Component Type         | Description                                       | Visual |
-|------------------------|---------------------------------------------------|--------|
-| **Core Components**    | Locate the prefabs from the core package.         | ![Core Prefabs](./img/freespins/freespin-prefabs-core.png) |
-| **Game-Specific Components** | Prefabs are already present in the main game scene. | ![Game Prefabs](./img/freespins/freespin-prefabs-game.png) |
-
----
-
-### Setup Scene
-
-#### Structure Free Spins
-
-Your scene should include the following nodes:
-
-- **Trigger**
-- **Retrigger**
-- **Win**
-
-***Example Scene Structure:***
-
-![Scene Structure](./img/freespins/featrue-freespin-in-scenes.png)
-
-|      Property            | Description                                               |
-|------------------------- |----------------------------------------------------------|
-| `transitionStart`        | Triggers the show animation when Free Spins start.<br/>Default: `null`. |
-| `transitionStop`         | Triggers the return animation to the base game.<br/>Default: `null`.    |
-| `nodeActivate`           | Maintains the visual state during Free Spins.             |
-| `freeSideBandContainer`  | Activates the Free Spins side band visual.                |
-
----
-#### Component Configuration
-
-##### Trigger & Retrigger
-
-To configure the Free Spin **trigger** and **retrigger** components, follow these steps:
-
-1. **Add Animations** 
-
-Include the required animations for both the trigger and retrigger elements.
-
-![Add Animation](./img/freespins/add-anim-freespin.png)
-![Add Animation Content](./img/freespins/add-anim-content.png)
-
-| Node Name | Purpose                                 | Location in Core Package                                         |
-|-----------|-----------------------------------------|------------------------------------------------------------------|
-| `content` | Handles zoom-in and zoom-out animations | `assets/core-assets/slotty-core/packages/feature-game/animations` |
-
-![Trigger Config](./img/freespins/freespin-trigger.png)
-
-| Property               | Description                                                              |
-|------------------------|--------------------------------------------------------------------------|
-| `durationPresentation` | Duration (in seconds) the trigger animation plays before auto-stopping   |
-
-2. **Add Background Animation Effect**  
-
-![Effect Example](./img/freespins/effect-explosive.png)
-
-| Prefab Name | Purpose                                         | Location in Core Package                                    |
-|-------------|-------------------------------------------------|-------------------------------------------------------------|
-| `explosive` | Background animation effect triggered           | `assets/core-assets/hyper-core/packages/explosive/prefabs`  |
-
-3. **Configure Particle Effects**  
-
-![Particles](./img/freespins/textture-particles.png)
-![Set Particles Scale](./img/freespins/set-particles-scale.png)
-
-| Node Name   | Purpose                                                                                 | Location in Core Package                                   |
-|-------------|-----------------------------------------------------------------------------------------|------------------------------------------------------------|
-| `particles` | - Particle effects around title and number triggers.<br/>- Set scale to `1` for visibility. | `assets/core-assets/slotty-core/packages/present/particles` |
-
-:::tip
-Set up the **present freespin retrigger** in the same way as the **present freespin trigger**.
-:::
-
-##### 1. present freespin trigger
-    
-Add fonts and textures for Free Spin trigger.
-
-![Trigger](./img/freespins/trigger-freespin.png)
-
-##### 2. present freespin retrigger
-
-Add fonts and textures to show retrigger effect.
-
-![Retrigger](./img/freespins/retrigger-freespin.png)
-
-##### Add Font
-
-![config](./img/freespins/trigger-freespin-font.png)
-
-#### 3. Present Free Spin Win
-
-**Free Spin Win Setup**
-
-![Win](./img/freespins/set-freespin-win.png)
-
-| Property                | Description                                                                                   |
-|-------------------------|-----------------------------------------------------------------------------------------------|
-| `content`               | Node for displaying the win animation content.                                                |
-| `durationPresentWin`    | Duration (in seconds) that the win presentation is shown.                                     |
-| `animation`             | - Animation controller for the win presentation.<br/>- Located at: `assets/core-assets/slotty-core/packages/feature-game/animations` |
-| `clipStartPresentation` | Animation clip played when the win presentation starts.                                       |
-| `clipStopPresentation`  | Animation clip played when the win presentation ends.                                         |
-| `allowPresentWinPoint`  | Enables the display of win points during the presentation.                                    |
-| `durationCountPoint`    | Duration (in seconds) for counting up win points.                                             |
-| `lblTotalWinPoint`      | Label node showing the total win points.                                                      |
-| `lblTotalFreeSpinCount` | Label node showing the total number of free spins awarded.                                    |
-
-- Add congratulatory font and texture for the win display.
-
-![Win](./img/freespins/win-freespin.png)
-
----
-
-:::tip Best Practice
-Follow the visual and font flow as defined by your game's design system.
-:::
-
----
-#### Free Spins Count Box
-
-The **Free Spins Count Box** displays the remaining number of free spins to the player. Follow these steps to set it up:
-
-##### Steps to Add the Count Box
-
-| Step | Description                                                                 | Image                                         |
-|------|-----------------------------------------------------------------------------|-----------------------------------------------|
-| 1    | Locate the `freespins-count-box` prefab in the Core package.                | ![Core Prefab](./img/freespins/find-freespin-box.png) |
-| 2    | Add the `freespins-count-box` prefab to your main game scene.               | ![In Scene](./img/freespins/game-freespin-box.png) |
-| 3    | Verify its appearance in both desktop and mobile modes.                     | ![Mobile Mode](./img/freespins/both-mode-mobile.png) |
-
-##### Platform-Specific Setup
-
-Assign the appropriate node and controller for each platform:
-
-| Platform | Node Name                | Component to Add            | Example Image                                         |
-|----------|--------------------------|-----------------------------|-------------------------------------------------------|
-| Desktop  | `freespins-box-desktop`  | `Platform-ui-controller`    | ![Desktop Controller](./img/freespins/add-script-freespin-counter.png) |
-| Mobile   | `freespins-box-mobile`   | `Platform-ui-controller`    | ![Mobile Controller](./img/freespins/add-script-freespin-counter-mobile.png) |
-
-##### Asset Configuration
-
-Ensure the correct assets are used for each platform:
-
-| Platform | Asset Path                                                        | Example Image                                                                 |
-|----------|-------------------------------------------------------------------|-------------------------------------------------------------------------------|
-| Desktop  | `assets/game-assets/textures/desktop/preloads/main-game/custom-scale` | ![Desktop Assets](./img/freespins/freespin-counter-box-desktop.png) |
-| Mobile   | `assets/game-assets/textures/mobile/preloads/main-game/custom-scale`  | ![Mobile Assets](./img/freespins/freespin-counter-box-mobile.png)  |
-| Common   | Freespins Box Background                                              | ![Common Asset](./img/freespins/freespin-counter-box-common.png) |
-
-##### Font Setup
-
-Set the font for the count box display:
-
-![Font Setup](./img/freespins/set-font-freespin-count-box.png)
-
----
-#### Free Spin Background Setup
-
-##### 1. Add Animation to Animation Provider
-
-Add the Free Spin background animation to your **Animation Provider**.
-
-![Add Animation](./img/freespins/add-anim-background.png)
-
-##### 2. Configure Background Display
-
-Set up the background for both landscape and portrait modes:
-
-- **Landscape Mode**  
-
-![Landscape Background](./img/freespins/set-background-freespin-landscape.png)
-
-- **Portrait Mode**  
-
-![Portrait Background](./img/freespins/set-background-freespin-portrait.png)
-
-
-##### 3. Asset Example
-
-Example background assets for Free Spin:
-
-![Background Assets](./img/freespins/assets-freespin-background.png)
-
-
-#### Sidebands (Optional)
-
-Sidebands are optional visual elements, often used in classic slot game designs.
-
-| Preview | Asset Structure |
-|---------|----------------|
-| ![Sidebands](./img/freespins/freespin-sideband.png) | ![Sideband Assets](./img/freespins/assets-freespind-sideband.png) |
-
-**Setup Steps:**
-
-1. **Add Preference:**  
-    Add the free sideband preference in your configuration.  
-    ![Add Preference](./img/freespins/add-preference-free-sideband.png)
-
-2. **Assign Texture:**  
-    Set the correct texture for the free sideband.  
-    ![Add Texture](./img/freespins/add-texture-free-sideband.png)
-
-**Asset Mapping:**
-
-| Asset Name                | Node/Preference Name    |
-|---------------------------|------------------------|
-| `anim-free-sideband-static` | `particle-free-sideband` |
-| `sideband-back`           | `sideband-back`        |
-| `sideband`                | `sideband`             |
-| `sideband-shine`          | `sideband-shine`       |
-| `sideband-static`         | `liquid`               |
-| `indicator-static`        | `indicator-static`     |
-
----
-
-#### Transition Effects (Optional)
-
-##### Setup: Create Transition Node
-
-1. **Create a new node** in your scene for the transition effect.
-2. **Add the following components** to this node:
-    - `transition`
-    - `transition-scaler`
-3. Configure the transition properties as required for your effect.
-
-![Transition Setup](./img/freespins/setup-transition.png)
-
-| Property           | Description                                |
-|--------------------|--------------------------------------------|
-| `content`          | Target node for transition effects         |
-| `animationName`    | Animation identifier/reference             |
-| `sfxName`          | Sound effect identifier                    |
-| `transitionFrame`  | Frame to trigger transition callback       |
-
-
-##### Asset Setup
-
-1. Add transition animation to the **Animation Provider**.
-2. Match the animation name with the correct node.
-
-![Transition Setup](./img/freespins/add-anim-transition.png)
-
-**add preferrence**
-
-Configure preferences as needed for your transition.
-
-![Transition Setup](./img/freespins/add-preference-transition.png)
-
-**Example Result:**
-
-![Transition Result](./img/freespins/fs-transition.jpg)
-
----
-
-## Final Result Examples
-
-| Phase | Image |
-|-------|-------|
-| Trigger | ![Trigger](./img/freespins/fs-trigger.jpg) |
-| Active Scene | ![Scene](./img/freespins/fs-scene.jpg) |
-| Completion | ![Congrats](./img/freespins/fs-congra.jpg) |

docs/04-game-asset-structure/01-default-assets-structure.md

@@ -79,289 +79,6 @@ Refers to images, audio, and other data that are specifically designed or adjust
 
 ![Asset Platform Manager](./img/assets-platform-manager.png)
 
-#### Custom Scaler
+### Asset Feature Manager
-
-##### Overview
-
-This script generates custom scaling ratios for assets in a Cocos Creator project, particularly handling different scaling needs for desktop and mobile platforms.
-
-##### Configuration Steps
-
-###### Create the Script
-
-- Name the script: `custom-scale-data`
-- Location: `assets/game-assets/scripts/custom-scaler/`
-
-###### Configure the Script
-
-- Refer to the following image for a general setup example:
-
-    ![General Assets Custom Scaler](./img/genernal-custom-scaler.png)
-
-    ```js
-    // custom-scale-data.js
-    cc.CustomScaler.CustomScaleRatio["uuid0"] = 0.75;
-    cc.CustomScaler.CustomScaleRatio["uuid1"] = 0.7;
-    cc.CustomScaler.CustomScaleRatio["uuid2"] = 0.58;
-    ```
-
-##### Asset Scaling Rules
-
-Assets in the project should be scaled according to their type and location:
-
-| Asset Type      | Asset Path Contains | Condition                                 | Scale Ratio |
-|-----------------|---------------------|-------------------------------------------|-------------|
-| Font files      | `fnt-`              | -                                         | 1.0         |
-| Desktop assets  | `desktop`           | Inside `custom-scale` folder              | 1.0         |
-| Desktop assets  | `desktop`           | Outside `custom-scale` folder             | 0.75        |
-| Mobile assets   | `mobile`            | Inside `custom-scale` folder              | 0.7         |
-| Mobile assets   | `mobile`            | Outside `custom-scale` folder             | 0.58        |
-
-**Folder structure:**
-
-```plaintext
-assets/
-├── fnt-arial.png (.jpg)              # remains at 1.0
-├── desktop/
-│   ├── sprite.png (.jpg)             # scaled to 0.75
-│   └── custom-scale/
-│       └── sprite.png  (.jpg)        # remains at 1.0
-└── mobile/
-    ├── sprite.png  (.jpg)            # scaled to 0.58
-    └── custom-scale/
-        └── sprite.png  (.jpg)        # remains at 0.7
-```
-:::tip
-Assets inside the `custom-scale` folder maintain their original quality, ensuring clear and sharp rendering.
-:::
-
-**Example:**
-
-![Assets Custom Scaler](./img/assets-custom-scaler.png)
-
-#### Prefabs
-
-| Desktop Prefab | Mobile Prefab |
-|:--------------:|:-------------:|
-| ![Prefabs Desktop](./img/prefabs-desktop.png) | ![Prefabs Mobile](./img/prefabs-mobile.png) |
-
-
-
-### Asset Features Manager
-
 #### Main Game Asset
-
-##### Overview
-
-Main game assets are stored in the `main-game` folder, organized by platform and loading type:
-
-```plaintext
-    assets/
-    └── game-assets/
-        ├── Font/
-        |    └──main-game
-        ├── Sound/
-        |    └──main-game
-        └── textures/
-            ├── desktop/
-            │   ├── preload/        # Load at startup
-            |   |       └──main-game   
-            │   └── postload/       # Load later
-            |           └──main-game   
-            |
-            └── mobile/
-                ├── preload/        # Load at startup
-                |       └──main-game   
-                └── postload/       # Load later
-                        └──main-game   
-```
-
-- `desktop` and `mobile`: Separate folders for each platform.
-- `preload`: Needed right away.
-- `postload`: Can load after startup.
-- Everything is organized under `main-game`.
-
-
-##### Platform-Specific Structures
-
-| Sound Example | Font Example |
-|:-------------:|:-----------:|
-| ![sound-main-game](./img/sound-main-game.png) | ![font-main-game](./img/font-main-game.png) |
-
-| Desktop Structure | Mobile Structure |
-|:-----------------:|:---------------:|
-| ![Desktop Asset Structure](./img/assets-structure-desktop.png) | ![Mobile Asset Structure](./img/assets-structure-mobile.png) |
-
-:::tip
-When a feature is activated, its assets are loaded directly, bypassing the main game asset folders.
-:::
-
----
-
 #### Feature Game Asset
-
-##### Overview
-
-Feature game assets (e.g., free-game, pickup, bonus, gamble) are stored in a folder named after the feature, and organized by platform (`desktop`, `mobile`) and loading type (`preload`, `postload`).
-
-**Folder structure:**
-```plaintext
-    assets/
-    └── game-assets/
-        ├── Font/
-        |    └──free-game
-        ├── Sound/
-        |    └──free-game
-        └── textures/
-            ├── desktop/
-            │   ├── preload/        # Load at startup
-            |   |     └──free-game   
-            │   └── postload/       # Load later
-            |        └──free-game   
-            |
-            └── mobile/
-                ├── preload/        # Load at startup
-                |     └──free-game   
-                └── postload/       # Load later
-                    └──free-game   
-```
-##### Platform-Specific Structures
-
-| Feature Game Example | Desktop Structure | Mobile Structure |
-|:-----------:|:-----------------:|:---------------:|
-| ![Feature Game](./img/feature-assets.png) | ![Desktop Asset Structure](./img/feature-assets-desktop.png) | ![Mobile Asset Structure](./img/feature-assets-mobile.png) |
-
----
-
-#### Localized Assets
-
-The `localizes/` folder stores language-specific assets (e.g., `zh`, `th`, `id`, etc.), allowing the game to display the correct fonts and textures based on the selected language.
-
-##### Folder structure:
-
-```plaintext
-    assets/
-    └── game-assets/
-        ├── fonts/
-        │   ├── localizes/       # Fonts for each language
-        │   └── preloads/        # Default fonts (usually English) loaded at startup
-        └── textures/
-            ├── desktop/
-            │   ├── localizes/   # Desktop textures for each language
-            │   ├── postloads/   # Desktop textures loaded after startup (default: en)
-            │   └── preloads/    # Desktop textures loaded at startup (default: en)
-            └── mobile/
-                ├── localizes/   # Mobile textures for each language
-                ├── postloads/   # Mobile textures loaded after startup (default: en)
-                └── preloads/    # Mobile textures loaded at startup (default: en)
-```
-
-- Assets in `localizes/` are organized by language code (e.g., `zh`, `th`, `id`).
-- Sprites in `preloads/` and `postloads/` use English (`en`) as the default language.
-
-![Location](./img/localizes-assets.png)
-
----
-
-#### Meta JSON Merger
-
-##### Purpose
-
-Merges JSON metadata files under library/imports/ into one fullMetaData.json.
-
-![Purpose](./img/merge-json-assets.png)
-
-###### Excludes:
-
-- cc.SceneAsset 
-- cc.Prefab
-
-```json
-{
-  "asset1.json": { /* metadata */ },
-  "asset2.json": { /* metadata */ }
-}
-```
----
-
-#### Texture Compression Tool
-
-##### Purpose
-
-Manages and applies compression settings to game textures.
-
-![Compression](./img/compress-over.png)
-
-##### Compression Settings
-| Description | Action Compress Texture |
-|:----------- |:----------------------:|
-| Compresses all textures in:<br/>- `assets/Core`<br/>- `assets/game` | ![Compression](./img/compress-texture.png) |
-| Compresses all textures in:<br/>- `assets/game` only | ![Compression](./img/compress-texture1.png) |
-| Removes all compression settings | ![Compression](./img/compress-texture2.png) |
-
-**Example:**  
-Compression settings for PNG and JPG formats:
-
-![Compression Settings](./img/compress-setting.png)
-
-##### Workflow
-
-1. **Query** texture assets by UUID
-2. **Apply** compression settings to their meta data
-3. **Save** updated meta files
-4. **Log** progress and handle errors in console
-
-##### Benefits
-
-* Reduces texture file sizes
-* Speeds up builds and runtime loading
-* Supports platform-specific formats
-* Batch processing for efficiency
-
----
-
-#### Remove Packable Texture Tool
-
-##### Overview
-
-Removes the `packable` flag from all texture assets to prevent automatic atlas packing.
-
-![Remove Packable](./img/remove-packable-texture.png)
-
-
-##### Why Remove Packable
-
-Removing the `packable` flag gives you:
-- **Better memory management** – load/unload textures individually
-- **Prevents automatic atlas generation** – useful for large or dynamic textures
-
-###### Use Cases
-- Large background images
-- Special effects (particles, dynamic textures)
-- Render textures
-- Dynamically loaded assets
-- High-res UI elements with custom compression needs
-
-##### Query Texture
-
-- Scans `db://assets/**/*` for all texture assets.
-
-**Example:**   
-
-Compression settings for PNG and JPG formats:               
-![Remove Packable](./img/remove-packable.png)
-
----
-### Result
-:::tip
-When running the Extension Tool, you can:
-- Add or update textures
-- Add new messages
-- Update existing messages in the game
-:::
-
-After running the Extension Tool, the console will display a summary of the processed textures and any changes made.
-
-![Result console](./img/result-console.png)
-
-

docs/04-game-asset-structure/02-texture-packer.md

@@ -4,84 +4,4 @@ sidebar_position: 2
 
 # Texture Packer
 
-## Overview
+> To be added
-
-This guide explains how to use a **Texture Packer** workflow to bundle multiple image assets into a single atlas texture file. This enhances performance by reducing draw calls and improving load times.
-
-![Overview](./img/texture-overview.png)
-
----
-
-## Configuration
-
-### Prepare Assets
-
-Place finalized image assets into the `Raw-Assets` folder. These assets will be included in the texture atlas.
-
----
-
-### Create a New Sprite Sheet
-
-1. Launch **TexturePacker**
-2. Drag and drop your image assets
-3. Set **Data Format** to:
-   - `Cocos2d-x` or
-   - `Cocos Creator`
-4. Configure atlas settings such as:
-   - Max size
-   - Padding
-   - Trimming options
-5. Set output location
-6. Configure scaling variants (explained below)
-
-![Settings](./img/setting-texture-packer.png)
-
----
-
-#### Recommended Settings
-
-| Option              | Value            |
-|---------------------|------------------|
-| Trim Mode           | Trim             |
-| Texture Format      | **PNG-32**       |
-| Max Size            | **2048x2048**    |
-| Force Squared       | Enabled          |
-| Export Multipack    | Manual           |
-| Allow Rotation      | Enabled          |
-
----
-
-#### Scaling Variants Settings
-
-**Scaling Variants** allow you to export multiple resolution versions of the same atlas (e.g., desktop vs. mobile).
-
-##### Setup Steps
-
-1. Open the **Scaling Variants** panel  
-2. Set **Preset** to `Custom`  
-3. Click **Add** to create new variants
-
-| Variant Name | Scale | Suffix  |
-|--------------|--------|---------|
-| desktop      | 1.0    | *(none)* |
-| mobile       | 0.7    | `@0.7x`  |
-
-##### Example Scaling Variants 
-
-![Scaling](./img/scaling-variants.png)
-
----
-
-## Export Output
-
-When exporting, TexturePacker generates:
-
-- `.png` — Sprite atlas image
-- `.plist` / `.json` — Metadata with frame coordinates and dimensions
-
-Example:
-
-![folder](./img/texture-folder.png)
-![File](./img/texture-files.png)
-
----

docusaurus.config.ts

@@ -62,12 +62,6 @@ const config: Config = {
         sidebarPath: require.resolve('./sidebars.ts'),
       },
     ],
-    [
-      require.resolve('docusaurus-lunr-search'),
-      {
-        languages: ['en'],
-      },
-    ],
   ],
 
   themes: [
@@ -96,10 +90,6 @@ const config: Config = {
           position: 'left',
           sidebarId: 'apiSidebar',
         },
-        {
-          type: 'search',
-          position: 'right',
-        },
         {
           href: 'https://gitea.plp19.com/dev-public/doc-slot-core-manual',
           label: 'Gitea',
@@ -112,8 +102,8 @@ const config: Config = {
       copyright: `Copyright © ${new Date().getFullYear()} Mercury Studio, Inc.`,
     },
     prism: {
-      theme: prismThemes.vsLight,
+      theme: prismThemes.github,
-      darkTheme: prismThemes.vsDark,
+      darkTheme: prismThemes.dracula,
     },
   } satisfies Preset.ThemeConfig,
 };

package.json

@@ -15,21 +15,19 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@docusaurus/core": "^3.8.1",
+    "@docusaurus/core": "^3.8.0",
-    "@docusaurus/preset-classic": "^3.8.1",
+    "@docusaurus/preset-classic": "^3.8.0",
-    "@docusaurus/theme-mermaid": "^3.8.1",
+    "@docusaurus/theme-mermaid": "^3.8.0",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
-    "docusaurus-lunr-search": "^3.6.0",
-    "lunr": "^2.3.9",
     "prism-react-renderer": "^2.3.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "^3.8.1",
+    "@docusaurus/module-type-aliases": "^3.8.0",
-    "@docusaurus/tsconfig": "^3.8.1",
+    "@docusaurus/tsconfig": "^3.8.0",
-    "@docusaurus/types": "^3.8.1",
+    "@docusaurus/types": "^3.8.0",
     "typescript": "~5.6.2"
   },
   "browserslist": {

src/css/custom.css

@@ -19,13 +19,13 @@
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme='dark'] {
-  --ifm-color-primary: #2e8555;
+  --ifm-color-primary: #25c2a0;
-  --ifm-color-primary-dark: #29784c;
+  --ifm-color-primary-dark: #21af90;
-  --ifm-color-primary-darker: #277148;
+  --ifm-color-primary-darker: #1fa588;
-  --ifm-color-primary-darkest: #205d3b;
+  --ifm-color-primary-darkest: #1a8870;
-  --ifm-color-primary-light: #33925d;
+  --ifm-color-primary-light: #29d5b0;
-  --ifm-color-primary-lighter: #359962;
+  --ifm-color-primary-lighter: #32d8b4;
-  --ifm-color-primary-lightest: #3cad6e;
+  --ifm-color-primary-lightest: #4fddbf;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
 }
 .red-star {

src/pages/index.module.css

@@ -4,32 +4,10 @@
  */
 
 .heroBanner {
-  padding: 8rem;
+  padding: 4rem 0;
   text-align: center;
   position: relative;
   overflow: hidden;
-  background: url('/img/background.jpg');
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-  color: white;
-}
-
-[data-theme='dark'] .heroBanner {
-  background: url('/img/background.jpg');
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.heroLogo {
-  max-width: 300px;
-  /* margin-bottom: 2rem; */
-  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.3));
-}
-
-[data-theme='dark'] .heroLogo {
-  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.5));
 }
 
 @media screen and (max-width: 996px) {
@@ -42,184 +20,4 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 1rem;
 }
-
-.buttons :global(.button) {
-  background: rgba(255, 255, 255, 0.3);
-  border: 2px solid rgba(255, 255, 255, 0.6);
-  color: white;
-  transition: all 0.3s ease;
-  backdrop-filter: blur(5px);
-  font-weight: 500;
-  text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
-  box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
-}
-
-.buttons :global(.button:hover) {
-  background: rgba(255, 255, 255, 0.4);
-  border-color: rgba(255, 255, 255, 0.8);
-  transform: translateY(-2px);
-  box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
-}
-
-[data-theme='dark'] .buttons :global(.button) {
-  background: rgba(255, 255, 255, 0.3);
-  border: 2px solid rgba(255, 255, 255, 0.6);
-  color: white;
-  box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
-  font-weight: 500;
-  text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
-}
-
-[data-theme='dark'] .buttons :global(.button:hover) {
-  background: rgba(255, 255, 255, 0.4);
-  border-color: rgba(255, 255, 255, 0.8);
-  box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
-  transform: translateY(-2px);
-}
-
-.hero__subtitle {
-  color: rgba(255, 255, 255, 0.8);
-  font-size: 1.2rem;
-  margin-bottom: 2rem;
-}
-
-[data-theme='dark'] .hero__subtitle {
-  color: rgba(255, 255, 255, 0.7);
-}
-
-.features {
-  display: flex;
-  align-items: center;
-  padding: 0rem 0;
-  width: 100%;
-  background: var(--ifm-background-color);
-}
-
-.featureIcon {
-  display: block;
-  font-size: 3rem;
-  transition: transform 0.2s ease-in-out;
-}
-
-.featureIcon:hover {
-  transform: scale(1.1);
-}
-
-.text--center {
-  color: var(--ifm-color-emphasis-800);
-}
-
-.text--center h3 {
-  color: var(--ifm-color-emphasis-900);
-}
-
-.text--center p {
-  color: var(--ifm-color-emphasis-700);
-}
-
-[data-theme='dark'] .text--center {
-  color: var(--ifm-color-emphasis-200);
-}
-
-[data-theme='dark'] .text--center h3 {
-  color: var(--ifm-color-emphasis-100);
-}
-
-[data-theme='dark'] .text--center p {
-  color: var(--ifm-color-emphasis-300);
-}
-
-.section {
-  padding: 4rem 0;
-}
-
-.sectionTitle {
-  text-align: center;
-  margin-bottom: 3rem;
-  font-size: 2.5rem;
-  color: #2a2a2a;
-}
-
-.techStack {
-  background: #f8f9fa;
-}
-
-.techGrid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
-  gap: 2rem;
-  padding: 0 1rem;
-}
-
-.techItem {
-  background: white;
-  padding: 1.5rem;
-  border-radius: 8px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  transition: transform 0.2s ease-in-out;
-}
-
-.techItem:hover {
-  transform: translateY(-5px);
-}
-
-.techItem h4 {
-  margin-bottom: 0.5rem;
-  color: #2a2a2a;
-}
-
-.techItem p {
-  margin: 0;
-  color: #666;
-}
-
-.stepsGrid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-  gap: 2rem;
-  padding: 0 1rem;
-}
-
-.stepCard {
-  background: white;
-  padding: 2rem;
-  border-radius: 8px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-  transition: all 0.2s ease-in-out;
-  text-decoration: none;
-  color: inherit;
-}
-
-.stepCard:hover {
-  transform: translateY(-5px);
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-}
-
-.stepCard h3 {
-  margin-bottom: 1rem;
-  color: #2a2a2a;
-}
-
-.stepCard p {
-  margin: 0;
-  color: #666;
-}
-
-@media screen and (max-width: 768px) {
-  .techGrid,
-  .stepsGrid {
-    grid-template-columns: 1fr;
-  }
-  
-  .section {
-    padding: 2rem 0;
-  }
-  
-  .sectionTitle {
-    font-size: 2rem;
-    margin-bottom: 0.5rem;
-  }
-}
-