Folder structure
This page shows what lives in which file of the theme, and which file to open for a given task.
The theme's folders
Both the full version and the starter kit are standard Laravel 13 applications. The tree below shows the full version; the starter kit has the same layout but without the sample pages and data.
full-version/
├── app/
│ ├── Http/Controllers/ Controllers of the Blade pages
│ ├── Livewire/ Livewire pages and components
│ └── Support/ Helper classes (JsonDatabase: sample data)
├── config/acun-ui.php Acun UI settings
├── lang/ The application's translations (tr.json, en.json)
├── packages/acun-ui/ The Acun UI packages (below)
├── public/build/ Compiled CSS and JavaScript
├── resources/
│ ├── css/acun-ui.css Tailwind, Acun UI and the @source lines
│ ├── js/acun-ui.js Acun UI's JavaScript
│ ├── js/app.js The application's own JavaScript
│ ├── menu/main.json The admin panel's menu
│ ├── data/ Sample data (JSON)
│ └── views/ Blade views (below)
├── routes/web.php Admin panel routes (/admin)
├── routes/front.php Storefront routes
├── composer.json Registers the packages/acun-ui folder as a local repository
├── package.json Build tools (Vite, Tailwind)
└── vite.config.js Vite entries, fonts, PRO alias
Views
resources/views/
├── layouts/
│ ├── admin/
│ │ ├── vertical.blade.php Panel layout with a side menu
│ │ ├── horizontal.blade.php Panel layout with a top menu
│ │ ├── blank.blade.php Page without the panel: sign-in, registration, errors
│ │ └── sections/ navbar, sidebar, footer: top bar, menu, page footer
│ └── front/
│ ├── theme-1.blade.php … The storefront's three themes (theme-1, theme-2, theme-3)
│ └── sections/ classic, modern, default under navbar/ and footer/
├── admin/ Admin panel pages
├── front/ Storefront pages: home, products, categories, cart, checkout
├── livewire/ Views of the Livewire components
├── components/ The application's own Blade components (logo, sign-in screen…)
└── partials/ Small pieces (favicon)
A panel page goes under resources/views/admin/ and uses the layout with @extends('layouts.admin.vertical'). Livewire pages use the same layout with #[Layout('layouts.admin.vertical')]. Details: Your first page.
Which file to open?
| What you want to do | File |
|---|---|
| Add a page to the menu | resources/menu/main.json (Menu) |
| Create a new panel page | resources/views/admin/ and routes/web.php |
| Change the logo, top bar, page footer | resources/views/layouts/admin/sections/ |
| Change the colors, default appearance | resources/css/acun-ui.css and config/acun-ui.php (Customization) |
| Translate interface texts | lang/tr.json, lang/en.json (Languages and translation) |
| Override a component's view | A copy with the same name under resources/views/components/ui/ |
The Acun UI packages
Acun UI consists of three packages, shipped in the packages/acun-ui/ folder. composer install and npm install link these folders under vendor/acunsoft/ and node_modules/@acunsoft/. You don't edit the package files; an update replaces the folder as a whole. Look here when you want to see a component's props or source.
Look and behavior come from @acunsoft/acun-ui-core; the components' markup and server side come from acunsoft/acun-ui-free. PRO classes are in the same Acun\Ui\… namespace as the free package; your code doesn't need to tell which package a class comes from.
@acunsoft/acun-ui-core (acun-ui-core/)
The theme layer (CSS) and the core JavaScript. It doesn't depend on Laravel.
node_modules/@acunsoft/acun-ui-core/
├── css/panel.css Theme (@theme), layout and menu: @import '@acunsoft/acun-ui-core'
├── js/index.js Entry point: import '@acunsoft/acun-ui-core'; sets up window.AcunUI
├── js/core/ Runtime, event names, reading the settings, loading heavy components, Livewire integration
├── js/behavior/ Scroll lock, focus trapping and restoring, layer manager, Livewire fixes
├── js/components/ Alpine components of acun:drawer and acun:modal (acunDrawer, acunModal)
├── js/appearance/ Theme, primary color and menu; Alpine stores (sidebar, navbar, customizer, brand, appearance)
├── js/boot.js The theme file: applies the appearance before the first paint
└── vite/index.js vite.config.js helpers (woff2Only)
acunsoft/acun-ui-free (acun-ui-free/)
The free Blade components (acun:*) and their server side.
vendor/acunsoft/acun-ui-free/
├── config/acun-ui.php Layout, language, JavaScript URLs and DataTable defaults for PRO (publishable)
├── dist/acun-ui-boot.js, acun-ui.js The theme file and the Vite-free shared JavaScript (@acunUiScripts)
├── lang/tr.json The package's Turkish translations
├── resources/icons/heroicons.php Icon set of acun:icon
├── resources/views/components/ui/ acun:* components (with layout/ and nav/ subfolders)
├── routes/assets.php, locale.php URL of the dist/ files (/acun-ui/{file}) and the language choice
└── src/
├── Http/ AssetController (serves the dist/ files with a one-year cache), LocaleController, SetLocale
├── Livewire/Concerns/WithToasts.php $this->toast() shortcuts
├── Menu/Menu.php JSON menu reader (acun:menu)
└── Support/ Assets (@acunUiScripts), Fonts (@acunFonts), Layout (Layout::page), Toast (Toast::flash), Icon
acunsoft/acun-ui-pro (acun-ui-pro/, PRO)
PRO components, DataTable, form modal and search, with their own CSS and JavaScript.
vendor/acunsoft/acun-ui-pro/
├── dist/acun-ui-pro.js Vite-free PRO JavaScript (@acunUiScripts)
├── lang/tr.json The package's Turkish translations
├── resources/css/acun-ui-pro.css DataTable and form modal styles
├── resources/js/index.js Entry point: import '@acunsoft/acun-ui-pro' (Vite alias)
├── resources/js/panel/ Form guard, chart, map, date range, lazyLibrary
├── resources/js/ui/ Heavy components: combobox, file upload, DataTable, unsaved-changes manager
├── resources/js/form-modal.js Form modal manager (initDirtyForms)
├── resources/views/components/ui/ PRO acun:* components (with the same names)
├── resources/views/components/data-table/ DataTable views
├── routes/assets.php, datatable.php URL of acun-ui-pro.js; DataTable download and print routes
└── src/
├── DataTable/ DataTable, Column, Filter, Action, BulkAction, export…
├── Form/ InteractsWithFormModal, FormMode, FormActionState
├── Livewire/Concerns/WithListing.php
├── Search/ Search: Normalizer, SearchField, drivers, searchColumn() migration macro
└── Support/ComboboxOptions.php
Learn more
- Quick start: getting the theme running.
- CSS, JavaScript and build: the files in
resources/cssandresources/jsin detail. - Configuration: the
config/acun-ui.phpsettings.