Overview

This guide walks you through rebranding the entire DayOneMart solution as your own — the web storefront, the admin panel, and both Flutter apps. It is organized so a store owner can complete the web sections without touching code, and the app sections give exact file paths and commands for whoever builds your mobile apps.

• Logos & identity — business name, logo, favicon, app name, app icons
• Colors — brand colors for the storefront, admin panel, and both apps
• Content — banners, policy pages, onboarding text, translations, email templates

Where Everything Is Set

One reference table for every brand asset across the three products:

Web — Business Name, Logo & Colors (No Code)

1 2 3 4

Fields on this screen

1. Business Name — shown in the storefront header, emails, and browser title.
2. Logo — the main brand logo (JPG/PNG, max 2 MB, ~120 × 80 px).
3. Icon — the favicon shown in the browser tab.
4. Admin Primary & Secondary Color — accent colors used across the UI.

Step-by-Step

1. Log in to the Admin Panel Use the administrator account created during installation, then open Settings → Business Setup → Basic Info.
2. Set the Business Name Type your store name. It appears in the storefront header and footer, the browser tab title, invoices, and every transactional email.
3. Upload your Logo Click the Logo upload field and choose a transparent PNG (~300 × 80 px works well). Transparent backgrounds look correct in both light and dark headers. Keep the file under ~200 KB for fast page loads.
4. Upload your Icon (favicon) Choose a square PNG (512 × 512 px recommended). This becomes the browser-tab icon for the storefront and admin panel.
5. Set the Primary and Secondary colors Enter your brand's hex values (e.g. #0EA5E9). These drive buttons, links, badges, and highlights across the storefront and admin panel.
6. Save Changes apply on the next page load — no rebuild, redeploy, or cache clear needed.

Web — Content & Pages (No Code)

All customer-facing content is managed from the Admin Panel and served to the storefront and both apps:

Editing a Policy Page

1. Open the page builder — Admin Panel → Website Setup → select the page (e.g. Privacy Policy).
2. Write your content — the rich-text editor supports headings, lists, links, and images.
3. Save and verify — open the page on the storefront footer, then check the same content appears in the app under Account → Privacy Policy (it is fetched from /api/v1/customer/app-screen/privacy).

Email Templates

• Logo, business name, and colors used in emails come from Business Setup — set them once as described above.
• Template text is managed in Admin Panel → Settings → email template configuration.
• Developers can restyle the HTML directly: Mailable classes live in app/Mail/, Blade views in resources/views/emails/.

Mobile Apps — Rename the App & Change the Bundle ID

Do this once per app (Customer and Deliveryman), before registering the apps with Firebase — the bundle ID you choose here must match the one you register there.

Step 1 — Android: display name

Edit android/app/src/main/AndroidManifest.xml and change the label:

<application
    android:label="YourStore"
    ... >

Step 2 — Android: application ID (package name)

Edit android/app/build.gradle.kts and set your reverse-domain ID:

defaultConfig {
    applicationId = "com.yourcompany.yourstore"
    ...
}

Step 3 — iOS: display name and bundle identifier

1. Open the workspace — open ios/Runner.xcworkspace in Xcode.
2. Set the Bundle Identifier — select the Runner target → Signing & Capabilities → set Bundle Identifier to com.yourcompany.yourstore.
3. Set the Display Name — in the General tab set Display Name (or edit CFBundleDisplayName / CFBundleName in ios/Runner/Info.plist).

Step 4 — Re-register with Firebase

Firebase config files are tied to the bundle ID. After renaming, register the new IDs in your Firebase project and replace android/app/google-services.json and ios/Runner/GoogleService-Info.plist, or re-run flutterfire configure. Then rebuild:

flutter clean
flutter pub get
flutter run

Mobile Apps — App Icon

The fastest way is the flutter_launcher_icons package, which generates every required size from one image:

1. Prepare your icon A 1024 × 1024 px PNG, no transparency for iOS (Apple requires an opaque icon). Save it as assets/images/app_icon.png in the app project.
2. Add the dev dependency and config to pubspec.yaml:

   dev_dependencies:
     flutter_launcher_icons: ^0.14.0
   
   flutter_launcher_icons:
     android: true
     ios: true
     image_path: "assets/images/app_icon.png"
   

3. Generate the icons:

   flutter pub get
   dart run flutter_launcher_icons
   

   This overwrites android/app/src/main/res/mipmap-*/ic_launcher.png and ios/Runner/Assets.xcassets/AppIcon.appiconset/ automatically.
4. Verify Run flutter run and check the icon on the device's home screen / app drawer.

Prefer manual control? Replace the images directly in the two folders above using your own generated sizes.

Mobile Apps — Splash Screen

• Android: edit android/app/src/main/res/drawable/launch_background.xml and replace the referenced drawable with your logo image.
• iOS: replace the images in ios/Runner/Assets.xcassets/LaunchImage.imageset/ (1x / 2x / 3x sizes).
• Automated alternative: the flutter_native_splash package generates both platforms from one config — add it to pubspec.yaml, set color and image, and run dart run flutter_native_splash:create.
• The in-app animated splash (after the native splash) lives in lib/features/splash/ — swap the Lottie/logo asset there if you want to change it.

Mobile Apps — Theme Colors

1. Open the theme folder Both apps define their theme in lib/config/theme/ — colors, typography, and component themes for light and dark mode.
2. Replace the seed / primary colors Set the same hex values you entered in the web installer (Theme Setup) or in Business Setup, so web and mobile branding match. Every widget reads colors via Theme.of(context), so the change propagates app-wide.
3. Hot-reload to preview Run flutter run and press r after each tweak. Check both light and dark modes (the Deliveryman App has a theme toggle in Settings).

Mobile Apps — Text, Images & Animations

UI Text (Translations)

Every user-visible string lives in the ARB localization files — edit the English source and any other languages you support, then regenerate:

# 1. Edit the strings
lib/l10n/arb/app_en.arb     (plus app_es / app_ar / app_hi / app_bn)

# 2. Regenerate the localization classes
flutter gen-l10n

Images & Illustrations

• Static images / logos: assets/images/ (SVGs under assets/images/svg/)
• Lottie animations (splash, empty states, success screens): assets/json/ — replace the .json files with your own from lottiefiles.com
• Asset references are code-generated — after adding or renaming files run dart run build_runner build --delete-conflicting-outputs to refresh assets.gen.dart

Onboarding Screens

The first-run onboarding flow lives in lib/features/onboarding/. Swap the illustration assets and edit the title/subtitle strings in the ARB files to tell your own story.

Currency Symbol (Deliveryman App)

The Customer App takes currency from the backend config; the Deliveryman App also allows a local override — see Deliveryman App → Configuration → Currency Symbol.

Advanced Web Theming (Developers)

For visual changes beyond the admin settings, the web UI is styled with Tailwind CSS 4 driven by CSS variables:

• Color tokens and design variables: resources/css/app.css (Tailwind v4 @theme configuration)
• Admin panel pages: resources/js/AdminPanel/Pages/; storefront pages: resources/js/StoreFront/Pages/
• Shared UI components: resources/js/components/ (add Shadcn components with npm run shadcn:admin / npm run shadcn:storefront)
• After any code-level change, rebuild assets: npm run build

White-Label Checklist

Work through this list top to bottom for a complete rebrand:

• Business name set in Admin Panel → Business Setup
• Logo uploaded (transparent PNG) and visible on the storefront header
• Favicon uploaded and visible in the browser tab
• Primary + secondary brand colors set (web) and matched in both apps' lib/config/theme/
• Homepage banners replaced with your own campaigns
• About / Privacy / Terms / Refund / Cancellation pages written
• FAQ entries and support contact details updated
• Email templates reviewed with your name and logo
• Both apps renamed (Android label + iOS display name)
• Both apps' bundle IDs changed and re-registered with Firebase
• App icons generated for both apps (Android + iOS)
• Splash screens replaced (native + in-app)
• Onboarding screens and Lottie animations customized
• ARB translation strings reviewed for your store's tone

Need help? Reach us via the item’s Support tab on CodeCanyon or dayonesoft.com or visit our website for support.