{"id":23655160,"url":"https://github.com/melasistema/hydephp-layouts-manager","last_synced_at":"2025-09-01T06:32:46.922Z","repository":{"id":269964257,"uuid":"908780024","full_name":"melasistema/hydephp-layouts-manager","owner":"melasistema","description":"Effortless HydePHP Layouts and Components Management. HydePHP Layouts Manager is a powerful Composer package that simplifies the way you manage layouts and reusable components within your HydePHP projects.","archived":false,"fork":false,"pushed_at":"2024-12-27T01:10:13.000Z","size":473,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-12-27T13:46:56.053Z","etag":null,"topics":["flowbite","hyde","hydephp","layoutmanager","layouts","tailwindcss","theme-switcher","themes"],"latest_commit_sha":null,"homepage":"https://hydephp.melasistema.com","language":"Blade","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/melasistema.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-12-27T00:26:38.000Z","updated_at":"2024-12-27T09:57:57.000Z","dependencies_parsed_at":"2024-12-27T13:47:02.331Z","dependency_job_id":"fd0d956c-b8ae-4ea2-b540-c4573986274b","html_url":"https://github.com/melasistema/hydephp-layouts-manager","commit_stats":null,"previous_names":["melasistema/hydephp-layouts-manager"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/melasistema%2Fhydephp-layouts-manager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/melasistema%2Fhydephp-layouts-manager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/melasistema%2Fhydephp-layouts-manager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/melasistema%2Fhydephp-layouts-manager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/melasistema","download_url":"https://codeload.github.com/melasistema/hydephp-layouts-manager/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":231670160,"owners_count":18408699,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flowbite","hyde","hydephp","layoutmanager","layouts","tailwindcss","theme-switcher","themes"],"created_at":"2024-12-28T19:51:27.427Z","updated_at":"2025-09-01T06:32:46.882Z","avatar_url":"https://github.com/melasistema.png","language":"Blade","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# HydePHP Layouts Manager\n\n**Simplify layout and component management in your HydePHP projects.**\n\nHydePHP Layouts Manager is a powerful package designed to simplify the management of layouts and reusable components in your [HydePHP](https://hydephp.github.io/) projects. It provides an intuitive way to organize and customize themes, layouts, and components with centralized presets and easy override, enhancing your workflow while keeping your codebase clean and maintainable.\n\n![HydePHP Layouts Manager](resources/images/mixed/header-melasistema-hydephp-v03.jpg)\n\n**Check it out in action:** [HydePHP Layouts Manager](https://hydephp.melasistema.com)\n\n## 🌟 Features\n\n-   **Dynamic Layout Management**: Seamlessly switch and manage layouts across your HydePHP site for a consistent and adaptable design.\n\n-   **Reusable Components**: Craft modular, customizable components with intuitive default attributes, enabling flexibility and reuse.\n\n-   **Font Manager**: Typography is more than text—it's the voice of your design. With access to 1,790 font families from Google Fonts, you can shape the personality of your site to reflect your identity. Let every word speak volumes, with fonts tailored to inspire, inform, or captivate.\n\n-   **CLI Tools**: Streamline your workflow with powerful commands for listing layouts, merging configurations, and automating essential tasks.\n\n-   **Built-in Flowbite Support**: Enhance your site with beautiful, pre-designed components from the [Flowbite](https://flowbite.com/) library, perfectly integrated for ease of use.\n\n-   **Customizable Themes**: Transform and extend your layouts with fully customizable themes, tailored to your vision.\n\n## 📋 Requirements\n\nBefore installing this package, make sure your project meets the following prerequisites:\n\n### Core Requirements\n\n-   **HydePHP Framework**: This package is specifically designed for projects built with [HydePHP](https://hydephp.github.io/). Ensure you are using version `^1.7` or higher.\n-   **PHP Version**: Your project must be running PHP 8.1 or newer to guarantee compatibility with both HydePHP and this package.\n-   **Composer**: Ensure that Composer is installed and configured in your development environment for dependency management.\n\n### Font Manager Requirements\n\n-   **Internet Connection**: An active internet connection is essential for the Font Manager to dynamically fetch font families from Google Fonts.\n-   **Environment Configuration**: Set the `DEFAULT_LAYOUT` variable in your `.env` file to ensure the correct fonts are applied and mapped based on your selected layout. This allows centralized and dynamic typography management.\n\n----------\n\n### Why These Requirements Matter\n\nThese prerequisites ensure that the package functions as intended, especially for dynamic font management, layout switching, and integration with HydePHP. Proper setup guarantees a seamless and feature-rich experience.\n\n----------\n\n## 🛠️ Installation\n\n### 1. Install via Composer\n\nUse Composer to add the package to your project:\n\n```bash\ncomposer require melasistema/hyde-layouts-manager\n```\n\n----------\n\n### 2. Set the Default Layout in `.env`\n\nTo ensure the package works as intended, add the `DEFAULT_LAYOUT` variable to your project's `.env` file.\nThis value is critical for enabling dynamic typography management.\n\n```env\nDEFAULT_LAYOUT=melasistema\n```\n\nYou can change this value to `hyde` or any custom layout defined in HydePHP Layouts Manager. Refer to the [README Usage Section](https://github.com/melasistema/hydephp-layouts-manager/blob/master/README.md/#usage) for more details.\n\n----------\n\n### 2. Publish the Configuration\n\nPublish the package's configuration file to your app's `config` directory for customization:\n\n```bash\nphp hyde vendor:publish --provider=\"Melasistema\\HydeLayoutsManager\\HydeLayoutsManagerServiceProvider\" --tag=\"hyde-layouts-manager-config\"\n```\n\n----------\n\n### 3. Merge Tailwind Configuration\n\n#### **Manual Merge**\n\nManually include the Layouts Manager configuration in your `tailwind.config.js` file:\n\n```javascript\nconst defaultTheme = require('tailwindcss/defaultTheme');\nconst HydeLayoutsManagerConfig = require('./tailwind-layouts-manager.config.js');\n\nmodule.exports = {\n    darkMode: 'class',\n    content: [\n        './_pages/**/*.blade.php',\n        './resources/views/**/*.blade.php',\n        './vendor/hyde/framework/resources/views/**/*.blade.php',\n        ...HydeLayoutsManagerConfig.content,\n    ],\n    safelist: [\n        ...HydeLayoutsManagerConfig.safelist\n    ],\n    theme: {\n        extend: {\n            typography: {},\n            colors: {},\n            ...HydeLayoutsManagerConfig.theme.extend,\n        },\n    },\n\n    plugins: [\n        require('@tailwindcss/typography'),\n        ...HydeLayoutsManagerConfig.plugins\n    ],\n};\n```\n\n#### **Automated Merge**\n\nAutomate the process with the `tailwind:merge` command. This replaces your existing `tailwind.config.js` file with the default configuration from HydeLayoutsManager.\n\n**⚠️ Warning:** This will overwrite your existing file. Back it up if you have custom configurations.\n\nRun the command:\n\n```bash\nphp hyde tailwind:merge\n```\n\n----------\n\n### 4. Install Required JavaScript Dependencies\n\nThe default theme and components shipped with HydeLayoutsManager use **Flowbite**. You can add these dependencies manually or by using the `package-json:merge` command.\n\n#### **Manual Installation**\n\nAdd the following Flowbite dependencies to your `package.json` file:\n\n```json\n\"devDependencies\": {\n  \"flowbite\": \"^2.5.2\"\n}\n```\n\nThen, install the dependencies:\n\n```bash\nnpm install\n```\n\n#### **Automated Merge**\n\nUse the `package-json:merge` command to automatically merge the Flowbite dependencies into your existing `package.json`.\n\n**⚠️ Safe in Fresh Projects:** This command modifies your `package.json`. Ensure to back it up if you have custom dependencies.\n\nRun the command:\n\n```bash\nphp hyde package-json:merge\n```\n\nAfterward, run:\n\n```bash\nnpm install\n```\n\n----------\n\n### 5. Add Flowbite Styles and Scripts to Laravel Mix Webpack\n\nAdd Flowbite styles and scripts in you `webpack.mix.js` file:\n\n```js\nlet mix = require('laravel-mix');\n\nmix.css('node_modules/flowbite/dist/flowbite.css', 'app.css')\n    .js('node_modules/flowbite/dist/flowbite.js', 'app.js')\n    .js('resources/assets/app.js', 'app.js')\n    .postCss('resources/assets/app.css', 'app.css', [\n        require('tailwindcss'),\n        require('autoprefixer'),\n    ])\n    .setPublicPath('_site/media')\n    .copyDirectory('_site/media', '_media')\n```\n\nRun the Laravel Mix build:\n\n```bash\nnpm run dev\n```\n\n----------\n\n### 6. Modify the @extends Directive \n\nAdd dynamic @extends() directive to your pages for the \"Layout Switching\" es. `index.blade.php`:\n\n```php\n@php($title = 'Home')\n\n@extends(config('hyde-layouts-manager.layouts.' . config('hyde-layouts-manager.default_layout') . '.app', 'hyde::layouts.app'))\n\n@section('content')\n// page content\n@endsection\n```\n\nIf you are using a post page, you can use the active layout blog post feed:\n\n```php\n@include('hyde-layouts-manager::layouts.'.config('hyde-layouts-manager.default_layout').'.posts.blog-post-feed')\n```\n\n----------\n\n### 7. (Optional) Publish Views\n\nIf you want to customize the default views, publish them to your application:\n\n```bash\nphp hyde vendor:publish --provider=\"Melasistema\\HydeLayoutsManager\\HydeLayoutsManagerServiceProvider\" --tag=\"hyde-layouts-manager-views\"\n```\n\n----------\n\n### Final Steps\n\nAfter completing the installation, you’re ready to build dynamic layouts and reusable components with **HydePHP Layouts Manager**! 🎉\n\n----------\n\n\n## 🧩 Usage\n\n### Setting the Default Layout\n\nThe default layout for your site is determined by the `DEFAULT_LAYOUT` value in the `.env` file. This ensures centralized and dynamic configuration across all functionality, including the \"HydePHP Layouts Manager\" and \"Typo Manager.\"\n\nTo set or switch the default layout, update your `.env` file:\n\n```env\nDEFAULT_LAYOUT=melasistema  # Use 'hyde' for the default Hyde layout or any custom layout like defined in the configuration file.\n``` \n\n\u003e **Note**: Setting this value in the `.env` file is crucial for proper functionality, as the Tailwind JavaScript configuration uses `process.env` to dynamically apply styles and fonts.\n\n### Customizing Layouts\n\nLayouts are defined in the `layouts` section of the configuration file. Each layout can include unique views, styles, scripts, and navigation settings:\n\n```php\n'layouts' =\u003e [\n    'melasistema' =\u003e [\n        'app' =\u003e 'hyde-layouts-manager::layouts.melasistema.app',\n        'page' =\u003e 'hyde-layouts-manager::layouts.melasistema.page',\n        'post' =\u003e 'hyde-layouts-manager::layouts.melasistema.post',\n        'styles' =\u003e 'vendor/hyde-layouts-manager/css/melasistema/app.css',\n        'scripts' =\u003e 'vendor/hyde-layouts-manager/js/melasistema/app.js',\n    ],\n],\n```\n\n\u003e **Tip**: Define multiple layouts (Themes) in the configuration file to suit different pages or sections of your site, and switch them easily via the `.env` file.\n\n## 📋 Example Project Structure\n\nBelow is an example of how your project could be structured after installing the package:\n\n```plaintext\nmy-hyde-project/\n├── config/\n│   └── hyde-layouts-manager.php\n|   └── hyde-layouts-manager-fonts.json\n├── resources/\n│   └── views/\n│       └── vendor/\n│           └── hyde-layouts-manager/\n│               ├── components/\n│               │   └── flowbite/\n│               │      └── hero-sections/\n│               │          └── jumbotron.blade.php\n│               │   \n│               └── layouts/\n│                   └── melasistema/\n│                       └── app.blade.php\n└── tailwind-layouts-manager.config.js`\n```\n----------\n\n## 🆎 Managing Typography\n\nTypography is a crucial aspect of design, shaping the visual identity and readability of your site. The Font Manager in HydePHP Layouts Manager provides access to 1,790 [Google Fonts](https://fonts.google.com/), enabling you to customize and manage fonts dynamically. Each Layout (Theme) can have its own font settings and mapping, allowing you to tailor typography to match your design vision. \n\nfile: `config/hyde-layouts-manager-fonts.json`\n\n```json\n{\n  \"layouts\": {\n    \"melasistema\": {\n      \"use_google_fonts\": true,\n      \"families\": {\n        \"primary\": \"Nunito Sans:wght@400;600;700\",\n        \"secondary\": \"Poppins:wght@500;600;700\",\n        \"display\": \"Fredoka:wght@400;600\",\n        \"heading\": \"Nunito:wght@600;700\",\n        \"subheading\": \"Karla:wght@400;600\",\n        \"accent\": \"Pacifico:wght@400\",\n        \"code\": \"Fira Code:wght@400;500\",\n        \"small\": \"Raleway:wght@400;600\",\n        \"special\": \"Indie Flower:wght@400\"\n      },\n      \"typography_mapping\": {\n        \"h1\": \"display\",\n        \"h2\": \"heading\",\n        \"h3\": \"subheading\",\n        \"h4\": \"subheading\",\n        \"h5\": \"secondary\",\n        \"h6\": \"secondary\",\n        \"p\": \"primary\",\n        \"small\": \"small\",\n        \"code\": \"code\",\n        \"blockquote\": \"accent\",\n        \"label\": \"secondary\",\n        \"button\": \"heading\",\n        \"special\": \"special\"\n      },\n      \"custom_css\": {}\n    }\n  }\n}\n```\n\n\u003e **Note**: If you want to use a layout without Typo Manager (Google Fonts CDN) you can set `use_google_fonts` to `false` and empty the `families` and `typography_mapping` arrays to fall back to `system-ui` fonts.\n\u003e `npm run dev` to compile the assets it's required after those changes.\n\n----------\n\n## 🧩 Using Components\n\nComponents are reusable UI elements with configurable defaults. The package provides a method to dynamically render components in your Blade templates.\n\n----------\n\n### **Using `renderComponent()`**\n\nThe `renderComponent()` method, provided by the `HydePHP Layouts Manager`, dynamically renders components with the ability to override default configurations. Keep in mind that all preset groups are merged into the `settings`.\n\n#### Example: Overriding the `Jumbotron` Component\n\nHere's an example of how to override the `Jumbotron` component's `default` presets using the `styleKey`:\n\n```php\n{!! app('layout.manager')-\u003erenderComponent('flowbite.hero-sections.jumbotron', [\n    'styleKey' =\u003e 'default',\n    'settings' =\u003e [\n        'applyContentMaxWidth' =\u003e true,\n        'showPrimaryButton' =\u003e false,\n        'showSecondaryButton' =\u003e false,\n        'padding' =\u003e 'py-8 md:py-32 px-0 md:px-16',\n        'bgImageUrl' =\u003e asset('hyde-hat-jumbotron.png'),\n        'darkBgImageUrl' =\u003e asset('hyde-hat-jumbotron.png'),\n        'bgImageAdditionalClasses' =\u003e 'bg-contain bg-no-repeat',\n        'headingType' =\u003e 'h2',\n        'headingTextFontFamily' =\u003e 'secondary',\n        'headingText' =\u003e 'Whatever it is your\\'re\n            \u003cspan class=\"text-purple-500 text-8xl\"\u003estyle\u003c/span\u003e,\n            \u003cbr\u003ewe\\'ve got you covered!' ,\n        'headingTextAlign' =\u003e 'right',\n        'subHeadingText' =\u003e 'Save \u003cspan class=\"text-purple-500\"\u003epresets\u003c/span\u003e,\n            \u003cspan class=\"text-purple-500\"\u003eoverride\u003c/span\u003e with ease, and design\n            \u003cspan class=\"text-purple-500\"\u003ewithout limits\u003c/span\u003e.',\n        'subHeadingTextFontFamily' =\u003e 'subheading',\n        'subHeadingTextAlign' =\u003e 'right',\n        'subHeadingTextExtraClasses' =\u003e 'pt-8',\n    ]\n]) !!}\n``` \n\nThis method fetches the component configuration from the `hyde-layouts-manager.php` configuration file using the `presets` that can be defined with the `styleKey`, allowing you to:\n\n1.  Define multiple `presets` for each component.\n2.  Override settings dynamically at runtime.\n\n----------\n\n### **Configuring Components**\n\nYou can customize or create multiple presets settings for components in the `hyde-layouts-manager.php` configuration file within the `styles` array. For example:\n\n```php\n'components' =\u003e [\n    'flowbite' =\u003e [\n        'carousel' =\u003e [\n            'default-slider' =\u003e [ // Preset identifier for the component\n                'view' =\u003e 'hyde-layouts-manager::components.flowbite.carousel.default-slider', // Blade view path\n                'styles' =\u003e [ // Define different style presets\n                    'default' =\u003e [ // Default style preset\n                        'config' =\u003e [\n                            'layout' =\u003e [ // Layout options for the component\n                                'showIndicators' =\u003e true,   // Show slide indicators\n                                'showControls' =\u003e true,     // Show next/previous controls\n                                'rounded' =\u003e false,         // Enable/disable rounded corners\n                            ],\n                            'settings' =\u003e [], // Additional settings for customization\n                            'images' =\u003e [ // Default images for the carousel\n                                'hyde-layouts-manager/carousel/example/carousel-1.svg',\n                                'hyde-layouts-manager/carousel/example/carousel-2.svg',\n                                'hyde-layouts-manager/carousel/example/carousel-3.svg',\n                                'hyde-layouts-manager/carousel/example/carousel-4.svg',\n                                'hyde-layouts-manager/carousel/example/carousel-5.svg',\n                            ],\n                        ]\n                    ],\n                ]\n            ],\n        ],\n    ],\n],\n```\n\n### Key Parts of the Configuration\n\n1.  **`components`**: The top-level key for all components.\n2.  **`flowbite`**: The namespace or grouping for Flowbite-based components.\n3.  **`carousel`**: The specific component being configured.\n4.  **`default-slider`**: The identifier for this specific preset of the carousel.\n5.  **`view`**: Specifies the Blade template used to render this preset.\n6.  **`styles`**: Contains all available style presets for this component.\n    -   **`default`**: The name of the style preset (you can define multiple presets here).\n7.  **`config`**: Holds the customizable settings for the component:\n    -   **`layout`**: Layout options like showing indicators or controls.\n    -   **`settings`**: Additional configuration options that can be extended.\n    -   **`images`**: Default images to be used in the carousel.\n\n----------\n\n#### **Benefits of `renderComponent()`**\n\n-   **Dynamic Overrides:** Easily override defaults for individual component instances.\n-   **Centralized Configuration:** Maintain consistent default values in the configuration file.\n-   **Flexibility:** Simplifies re-usability for components across projects.\n\n----------\n\nBy leveraging these methods, you can build scalable and easily customizable layouts with HydeLayoutsManager. 🎉\n\n### CLI Tools\n\nThe package includes several Artisan commands to streamline your workflow:\n\n-   **List Layouts**: Display available layouts:\n\n    ```php\n    php hyde layouts:list\n    ```\n\n-   **Merge Package JSON**: Merge dependencies into your `package.json`:\n\n    ```php\n    php hyde package-json:merge\n    ```\n\n-   **Merge Tailwind Config**: Merge Tailwind configurations into your `tailwind.config.js` file:\n\n    ```php\n    php hyde tailwind:merge\n    ```\n\n\n## Customization\n\n### Adding New Layouts\n\nYou can add custom layouts by defining them in the `layouts` section of the configuration file and placing the corresponding Blade templates in `resources/views/vendor/hyde-layouts-manager`.\n\n### Overriding Default Components templates\n\nTo customize components, publish the views and edit the files in `resources/views/vendor/hyde-layouts-manager/components`.\n\n### Dynamic Branding (with shipped default MelaSistema layout)\n\n#### Customizing the Navigation Brand\n\nThe navigation brand (logo) can be customized through the `navigation.brand` configuration. You can use a text-based logo, an image logo, or a custom HTML logo. You can also configure the logo's behavior in light and dark themes. Below is an example configuration:\n\n```php\n'navigation' =\u003e [  \n    'brand' =\u003e [  \n        'type' =\u003e 'custom', // Accepted values: 'text', 'image', 'custom' \n        'url' =\u003e '/',  \n        'lightLogo' =\u003e 'media/hyde-layouts-manager/logo/logo-navigation-light.png', // Path to the light logo \n        'darkLogo' =\u003e 'media/hyde-layouts-manager/logo/logo-navigation-dark.png', // Path to the dark logo \n        'logoHeight' =\u003e 'h-10', // Adjust the logo height (e.g., 'h-10' for height 2.5rem) \n    ],  \n    'navbarLink' =\u003e [  \n        'color' =\u003e 'text-gray-700', // Normal state link color \n        'darkColor' =\u003e 'text-gray-400', // Dark theme link color \n        'hoverColor' =\u003e 'text-purple-500', // Hover state link color \n        'darkHoverColor' =\u003e 'text-purple-500', // Dark theme hover color \n    ],  \n],`\n```\n\n#### Customizing the Call to Action (CTA)\n\nYou can configure a CTA button in the navigation to link to an external URL or trigger actions. Below is an example configuration for the CTA button:\n\n```php\n'navigation' =\u003e [\n    'cta' =\u003e [\n        'enabled' =\u003e true, // Set to false to disable the CTA button\n        'text' =\u003e 'Get Started', // Button text\n        'textColor' =\u003e 'text-white', // Text color for the CTA button\n        'url' =\u003e 'https://github.com/melasistema/hydephp-layouts-manager', // URL to redirect\n        'urlTarget' =\u003e '_blank', // Define the link's target (_blank for a new tab)\n        'bgColor' =\u003e 'bg-purple-500', // Background color for the CTA button\n        'darkBgColor' =\u003e 'bg-purple-500', // Dark theme background color\n        'hoverBgColor' =\u003e 'bg-purple-800', // Hover state background color\n        'darkHoverBgColor' =\u003e 'bg-purple-800', // Dark theme hover color\n        'focusRingColor' =\u003e 'ring-purple-800', // Focus ring color\n        'darkFocusRingColor' =\u003e 'ring-purple-800', // Dark theme focus ring color\n        'extraClasses' =\u003e 'focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-4 py-2 text-center', // Extra classes for styling\n    ],\n],\n``` \n\n#### Customizing Social Media Links\n\nSocial media links can be customized to include icons that link to your social platforms. The configuration allows you to toggle the visibility of each platform (e.g., GitHub, LinkedIn) and adjust the icon colors for light and dark themes. Below is an example configuration:\n\n```php\n'navigation' =\u003e [\n    'social' =\u003e [\n        'enabled' =\u003e true, // Enable or disable the social media icons section\n        'platforms' =\u003e [\n            'github' =\u003e [\n                'enabled' =\u003e true, // Enable GitHub link\n                'url' =\u003e 'https://github.com/melasistema', // Link to your GitHub profile\n                'icon' =\u003e '\u003csvg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 32 32\"\u003e\u003cpath d=\"M16,2.345c7.735,0,14,6.265,14,14-.002,6.015-3.839,11.359-9.537,13.282...\"\u003e\u003c/path\u003e\u003c/svg\u003e',\n                'iconColor' =\u003e 'text-gray-700', // Light theme icon color\n                'darkIconColor' =\u003e 'text-white', // Dark theme icon color\n            ],\n            'linkedin' =\u003e [\n                'enabled' =\u003e true, // Enable LinkedIn link\n                'url' =\u003e 'https://www.linkedin.com/in/luca-visciola/', // Link to your LinkedIn profile\n                'icon' =\u003e '\u003csvg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 32 32\"\u003e\u003cpath d=\"M26.111,3H5.889c-1.595,0-2.889,1.293-2.889,2.889...\"\u003e\u003c/path\u003e\u003c/svg\u003e',\n                'iconColor' =\u003e 'text-gray-700', // Light theme icon color\n                'darkIconColor' =\u003e 'text-white', // Dark theme icon color\n            ],\n            'facebook' =\u003e [\n                'enabled' =\u003e false, // Disable Facebook link\n                'url' =\u003e 'https://facebook.com', // Facebook URL\n                'icon' =\u003e '\u003csvg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"22\" viewBox=\"0 0 32 32\"\u003e\u003cpath d=\"M16,2c-7.732,0-14,6.268-14,14...\"\u003e\u003c/path\u003e\u003c/svg\u003e',\n                'iconColor' =\u003e 'text-gray-700',\n                'darkIconColor' =\u003e 'text-white',\n            ],\n        ],\n    ],\n],\n```\n\n### Footer Customization\n\nThe footer can be customized to match your branding, colors, and content. You can set background and text colors for both light and dark themes, as well as modify the footer links and description. Below is an example configuration:\n\n```php\n'footer' =\u003e [\n    'view' =\u003e 'vendor.hyde-layouts-manager.layouts.melasistema.footer', // Path to the Blade view for the footer\n    'default' =\u003e [\n        'bgColor' =\u003e 'bg-white', // Light theme background color for the footer\n        'darkBgColor' =\u003e 'dark:bg-gray-800', // Dark theme background color\n        'textColor' =\u003e 'text-gray-900', // Light theme text color\n        'darkTextColor' =\u003e 'dark:text-white', // Dark theme text color\n        'description' =\u003e 'Manage your layouts and reusable components with ease.', // Footer description text\n        'links' =\u003e [\n            [\n                'title' =\u003e 'GitHub', // Footer link title\n                'url' =\u003e 'https://github.com/melasistema/hydephp-layouts-manager', // Link URL\n            ],\n            [\n                'title' =\u003e 'About Me',\n                'url' =\u003e 'https://github.com/melasistema',\n            ],\n        ],\n    ],\n],\n```\n\nWith these options, you have full control over the navigation brand, CTA button, social media links, and footer content, ensuring your site is fully customizable and reflects your brand’s identity.\n\n## 🌟 Credits\n\nThis project is made possible by the inspiration, contributions, and tools of an incredible community. A heartfelt thank you to:\n\n-   **👨‍💻 Author**: [Luca Visciola](https://github.com/melasistema) – Passionate developer and creator of Hyde Layouts Manager. Reach out at [info@melasistema.com](mailto:info@melasistema.com) for inquiries or feedback.\n\n-   **🚀 Inspired by HydePHP**: The foundation of this project stems from the brilliance of [Caen De Silva](https://github.com/caendesilva). Discover the magic of static site generation at [HydePHP GitHub](https://github.com/hydephp/hyde).\n\n-   **🎨 Boosted by Flowbite**: This package features beautiful UI components and layouts, made even better with tools from [Flowbite](https://flowbite.com/).\n\n\n### 🙌 Special Thanks\n\nTo the open-source community and all contributors—your dedication and collaboration inspire innovation and make projects like this possible. 🌟\n\n\n## 📝 License\n\nThis package is licensed under the MIT License. See the [LICENSE](./LICENSE.md) file for details.\n\n----------\n\n## 📖 Changelog\n\nAll notable changes to this project are documented in [CHANGELOG](./CHANGELOG.md).\n\nThe format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),\nand this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).\n\n----------\n\n## 💡 Contributing\n\nWe welcome contributions! Feel free to open an issue or submit a pull request on [GitHub](https://github.com/melasistema/hydephp-layouts-manager).\n\n----------\n\n## Support\n\nIf you encounter any issues or have questions, please open an issue on [GitHub](https://github.com/melasistema/hydephp-layouts-manager).","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmelasistema%2Fhydephp-layouts-manager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmelasistema%2Fhydephp-layouts-manager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmelasistema%2Fhydephp-layouts-manager/lists"}