diff --git a/apps/web-client-eggymon-landipage-net/Dockerfile b/apps/web-client-eggymon-landipage-net/Dockerfile deleted file mode 100644 index fed98436..00000000 --- a/apps/web-client-eggymon-landipage-net/Dockerfile +++ /dev/null @@ -1,59 +0,0 @@ -# ═══════════════════════════════════════════════════════════════════════════════ -# EN: Eggymon Kitchen Landing Page - Multi-stage Docker Build -# VI: Eggymon Kitchen Landing Page - Build Docker đa giai đoạn -# ═══════════════════════════════════════════════════════════════════════════════ - -# ─── Stage 1: Build ────────────────────────────────────────────────────────── -FROM mcr.microsoft.com/dotnet/sdk:10.0-alpine AS build -WORKDIR /src - -# EN: Copy project files first for better layer caching -# VI: Copy file dự án trước để cache layer tốt hơn -COPY src/EggymonLandingPage.Shared/EggymonLandingPage.Shared.csproj src/EggymonLandingPage.Shared/ -COPY src/EggymonLandingPage.Client/EggymonLandingPage.Client.csproj src/EggymonLandingPage.Client/ -COPY src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj src/EggymonLandingPage.Server/ - -# EN: Restore dependencies -# VI: Restore các gói phụ thuộc -RUN dotnet restore src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj - -# EN: Copy all source code -# VI: Copy toàn bộ mã nguồn -COPY . . - -# EN: Build and Publish -# VI: Build và Publish -RUN dotnet publish src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj \ - -c Release \ - -o /app/publish \ - --no-restore - -# ─── Stage 2: Runtime ──────────────────────────────────────────────────────── -FROM mcr.microsoft.com/dotnet/aspnet:10.0-alpine AS runtime -WORKDIR /app - -# EN: Create non-root user for security -# VI: Tạo user non-root cho bảo mật -RUN addgroup -S appgroup && adduser -S appuser -G appgroup - -# EN: Copy published output -# VI: Copy kết quả publish -COPY --from=build /app/publish . - -# EN: Set ownership to non-root user -# VI: Đặt quyền sở hữu cho user non-root -RUN chown -R appuser:appgroup /app - -USER appuser - -# EN: Expose port 8080 (default non-root port) -# VI: Expose cổng 8080 (cổng mặc định non-root) -EXPOSE 8080 -ENV ASPNETCORE_URLS=http://+:8080 - -# EN: Health check -# VI: Kiểm tra sức khỏe -HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \ - CMD wget --no-verbose --tries=1 --spider http://localhost:8080/health || exit 1 - -ENTRYPOINT ["dotnet", "EggymonLandingPage.Server.dll"] diff --git a/apps/web-client-eggymon-landipage-net/EggymonLandingPage.slnx b/apps/web-client-eggymon-landipage-net/EggymonLandingPage.slnx deleted file mode 100644 index 1998498d..00000000 --- a/apps/web-client-eggymon-landipage-net/EggymonLandingPage.slnx +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/apps/web-client-eggymon-landipage-net/README.md b/apps/web-client-eggymon-landipage-net/README.md deleted file mode 100644 index 9b5500ba..00000000 --- a/apps/web-client-eggymon-landipage-net/README.md +++ /dev/null @@ -1,63 +0,0 @@ -# 🥚 Eggymon Kitchen Landing Page - -> **EN:** Multilingual landing page for Eggymon Kitchen — Built with Blazor WebAssembly + ASP.NET Core BFF -> **VI:** Trang landing đa ngôn ngữ cho Eggymon Kitchen — Xây dựng bằng Blazor WebAssembly + ASP.NET Core BFF - -## Architecture - -``` -┌─────────────────────────────────────────────────────────────────┐ -│ EggymonLandingPage.Server │ -│ (ASP.NET Core BFF + YARP Reverse Proxy) │ -│ ┌──────────────────────────────────────────────────────┐ │ -│ │ EggymonLandingPage.Client │ │ -│ │ (Blazor WebAssembly + MudBlazor) │ │ -│ │ ┌──────────────────────────────────────────┐ │ │ -│ │ │ EggymonLandingPage.Shared │ │ │ -│ │ │ (Shared DTOs) │ │ │ -│ │ └──────────────────────────────────────────┘ │ │ -│ └──────────────────────────────────────────────────────┘ │ -└─────────────────────────────────────────────────────────────────┘ -``` - -## Tech Stack - -| Layer | Technology | -|-----------|-------------------------------------| -| UI | Blazor WebAssembly (.NET 10) | -| Components| MudBlazor 8.15 | -| Server | ASP.NET Core BFF + YARP | -| Styling | CSS Variables (Primitives → Semantics → Components) | -| i18n | JSON-based localization (EN/VI) | -| Fonts | Fredoka (headings) + Inter (body) | -| Container | Docker multi-stage (Alpine) | - -## Getting Started - -```bash -# Run in development mode -cd src/EggymonLandingPage.Server -dotnet run - -# Build production -dotnet publish -c Release - -# Docker -docker build -t eggymon-landing . -docker run -p 8080:8080 eggymon-landing -``` - -## Routes - -| Route | Description | -|----------|---------------------| -| `/` | Landing page (EN) | -| `/en-US/`| English version | -| `/vi-VN/`| Vietnamese version | -| `/health`| Health check | - -## Design System - -🎨 **Brand Colors:** Warm Brown + Cream + Egg Yellow -🌙 **Dark Mode:** Full light/dark theme support -📱 **Responsive:** Mobile-first design with CSS Grid diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/App.razor b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/App.razor deleted file mode 100644 index 1d6d8563..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/App.razor +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - Not Found - -

Sorry, there's nothing at this address.

- - - diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Components/LanguageSwitcher.razor b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Components/LanguageSwitcher.razor deleted file mode 100644 index 7c580c80..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Components/LanguageSwitcher.razor +++ /dev/null @@ -1,66 +0,0 @@ -@using System.Globalization -@inject NavigationManager Navigation - - - - - - @GetCurrentLabel() - - - - - - - - 🇻🇳 - Tiếng Việt - - - - - 🇺🇸 - English - - - - - -@code { - private string GetCurrentLabel() - { - var uri = new Uri(Navigation.Uri); - var path = uri.PathAndQuery; - - if (path.StartsWith("/vi", StringComparison.OrdinalIgnoreCase)) - { - return "VI"; - } - return "EN"; - } - - private void SwitchLanguage(string targetCulture) - { - var uri = new Uri(Navigation.Uri); - var path = uri.PathAndQuery; - - var segments = path.Split('/', StringSplitOptions.RemoveEmptyEntries); - - string newPath; - if (segments.Length > 0 && (segments[0].Equals("vi-VN", StringComparison.OrdinalIgnoreCase) || - segments[0].Equals("en-US", StringComparison.OrdinalIgnoreCase) || - segments[0].Equals("vi", StringComparison.OrdinalIgnoreCase) || - segments[0].Equals("en", StringComparison.OrdinalIgnoreCase))) - { - segments[0] = targetCulture; - newPath = "/" + string.Join('/', segments); - } - else - { - if (path == "/") path = ""; - newPath = $"/{targetCulture}{path}"; - } - - Navigation.NavigateTo(newPath, forceLoad: true); - } -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/EggymonLandingPage.Client.csproj b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/EggymonLandingPage.Client.csproj deleted file mode 100644 index 5d6cf6b0..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/EggymonLandingPage.Client.csproj +++ /dev/null @@ -1,22 +0,0 @@ - - - - net10.0 - enable - enable - true - true - - - - - - - - - - - - - - diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Layout/MainLayout.razor b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Layout/MainLayout.razor deleted file mode 100644 index f92cfe94..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Layout/MainLayout.razor +++ /dev/null @@ -1,62 +0,0 @@ -@inherits LayoutComponentBase -@inject IStringLocalizer L - - - - - - - - - - - - - - - - - - - - -
- - @L["Nav_OrderNow"] -
- - - - @Body - - - -@code { - [Inject] private IJSRuntime JSRuntime { get; set; } = default!; - - private bool _isDarkMode = false; - - private MudTheme _theme = new() - { - PaletteLight = new PaletteLight() - { - Primary = "#6B4423", - PrimaryContrastText = "#ffffff", - AppbarBackground = "#FFFFFF", - AppbarText = "#2C2C2C", - Background = "#FAF8F4", - Surface = "#ffffff", - TextPrimary = "#2C2C2C", - ActionDefault = "#2C2C2C", - LinesDefault = "#eeeeee" - }, - }; -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizer.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizer.cs deleted file mode 100644 index b3249286..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizer.cs +++ /dev/null @@ -1,56 +0,0 @@ -using System.Globalization; -using System.Net.Http.Json; -using Microsoft.Extensions.Localization; - -namespace EggymonLandingPage.Client.Localization; - -/// -/// EN: JSON-based string localizer for Blazor WASM. -/// VI: String localizer dựa trên JSON cho Blazor WASM. -/// -public class JsonStringLocalizer : IStringLocalizer -{ - private readonly LocalizationCache _cache; - private readonly string _resourceName; - - public JsonStringLocalizer(LocalizationCache cache, string resourceName) - { - _cache = cache; - _resourceName = resourceName; - } - - public JsonStringLocalizer(LocalizationCache cache) - { - _cache = cache; - _resourceName = "Shared"; - } - - public LocalizedString this[string name] - { - get - { - var value = GetString(name); - return new LocalizedString(name, value ?? name, resourceNotFound: value == null); - } - } - - public LocalizedString this[string name, params object[] arguments] - { - get - { - var format = GetString(name); - var value = string.Format(format ?? name, arguments); - return new LocalizedString(name, value, resourceNotFound: format == null); - } - } - - public IEnumerable GetAllStrings(bool includeParentCultures) - { - return Enumerable.Empty(); - } - - private string? GetString(string name) - { - return _cache.GetString(name); - } -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizerFactory.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizerFactory.cs deleted file mode 100644 index ae4c5050..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/JsonStringLocalizerFactory.cs +++ /dev/null @@ -1,29 +0,0 @@ -using Microsoft.Extensions.Localization; - -namespace EggymonLandingPage.Client.Localization; - -/// -/// EN: Factory for creating JSON string localizers. -/// VI: Factory tạo JSON string localizer. -/// -public class JsonStringLocalizerFactory : IStringLocalizerFactory -{ - private readonly LocalizationCache _cache; - private readonly IServiceProvider _serviceProvider; - - public JsonStringLocalizerFactory(LocalizationCache cache, IServiceProvider serviceProvider) - { - _cache = cache; - _serviceProvider = serviceProvider; - } - - public IStringLocalizer Create(Type resourceSource) - { - return new JsonStringLocalizer(_cache, resourceSource.Name); - } - - public IStringLocalizer Create(string baseName, string location) - { - return new JsonStringLocalizer(_cache, baseName); - } -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/LocalizationCache.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/LocalizationCache.cs deleted file mode 100644 index 752db403..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Localization/LocalizationCache.cs +++ /dev/null @@ -1,54 +0,0 @@ -using System.Globalization; -using System.Net.Http.Json; - -namespace EggymonLandingPage.Client.Localization; - -/// -/// EN: Cache for localization strings loaded from JSON files. -/// VI: Cache cho các chuỗi bản địa hóa được tải từ file JSON. -/// -public class LocalizationCache -{ - private readonly HttpClient _httpClient; - private Dictionary _strings = new(); - private bool _isLoaded; - - public LocalizationCache(HttpClient httpClient) - { - _httpClient = httpClient; - } - - public string? GetString(string key) - { - if (_strings.TryGetValue(key, out var value)) - { - return value; - } - return null; - } - - public async Task LoadAsync(CultureInfo culture) - { - if (_isLoaded) return; - - try - { - var cultureName = culture.Name; - // EN: Map generic culture codes to specific ones - // VI: Map mã ngôn ngữ chung sang mã cụ thể - if (cultureName == "vi") cultureName = "vi-VN"; - if (cultureName == "en") cultureName = "en-US"; - - var loaded = await _httpClient.GetFromJsonAsync>($"/locales/{cultureName}.json?v={DateTime.Now.Ticks}"); - if (loaded != null) - { - _strings = loaded; - _isLoaded = true; - } - } - catch (Exception ex) - { - Console.WriteLine($"Error loading localization for {culture.Name}: {ex.Message}"); - } - } -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Pages/Home.razor b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Pages/Home.razor deleted file mode 100644 index 449398a5..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Pages/Home.razor +++ /dev/null @@ -1,193 +0,0 @@ -@page "/" -@inject IStringLocalizer L - -EggyMon Kitchen - @L["Hero_Headline"] - - -
-
-
@L["Hero_Badge"]
-

@L["Hero_Headline"]

-

@L["Hero_Subline"]

-
- @L["Hero_CTA_Primary"] - @L["Hero_CTA_Secondary"] -
-
-
- EggyMon Kitchen Store -
-
- - -
-
- @L["Features_Tag"] -

@L["Features_Title"]

-

@L["Features_Desc"]

-
- -
- -
-
- -
-

@L["Feature1_Title"]

-

@L["Feature1_Desc"]

-
- - -
-
- -
-

@L["Feature2_Title"]

-

@L["Feature2_Desc"]

-
- - -
-
- -
-

@L["Feature3_Title"]

-

@L["Feature3_Desc"]

-
-
-
- - - - - -
-
- @L["Testimonials_Tag"] -

@L["Testimonials_Title"]

-
- -
-
-

"@L["Testimonial1_Quote"]"

-
-
-

"@L["Testimonial2_Quote"]"

-
-
-

"@L["Testimonial3_Quote"]"

-
-
-
- - -
-

@L["CTA_Title"]

-

@L["CTA_Subtitle"]

-
- - -
-
- - - diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Program.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Program.cs deleted file mode 100644 index 7ea8656f..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/Program.cs +++ /dev/null @@ -1,54 +0,0 @@ -using Microsoft.AspNetCore.Components.Web; -using Microsoft.AspNetCore.Components.WebAssembly.Hosting; -using MudBlazor.Services; -using EggymonLandingPage.Client; -using EggymonLandingPage.Client.Localization; -using Microsoft.Extensions.Localization; -using System.Globalization; - -var builder = WebAssemblyHostBuilder.CreateDefault(args); -builder.RootComponents.Add("#app"); -builder.RootComponents.Add("head::after"); - -// EN: Add HttpClient for API calls -// VI: Thêm HttpClient cho các cuộc gọi API -builder.Services.AddSingleton(sp => new HttpClient { BaseAddress = new Uri(new Uri(builder.HostEnvironment.BaseAddress).GetLeftPart(UriPartial.Authority)) }); - -// EN: Add MudBlazor services -// VI: Thêm các services của MudBlazor -builder.Services.AddMudServices(); - -// EN: Add Localization services -// VI: Thêm services đa ngôn ngữ -builder.Services.AddLocalization(); -builder.Services.AddSingleton(); -builder.Services.AddSingleton(); - -// EN: Build the host -// VI: Build host -var host = builder.Build(); - -// EN: Initialize Localization Cache -// VI: Khởi tạo Localization Cache -var cache = host.Services.GetRequiredService(); - -// EN: Detect culture from BaseAddress (set by from Server) -// VI: Phát hiện ngôn ngữ từ BaseAddress (được set bởi từ Server) -var baseAddress = builder.HostEnvironment.BaseAddress; -var culture = new CultureInfo("en-US"); // Default - -if (baseAddress.Contains("/vi-VN/", StringComparison.OrdinalIgnoreCase)) -{ - culture = new CultureInfo("vi-VN"); -} -else if (baseAddress.Contains("/vi/", StringComparison.OrdinalIgnoreCase)) -{ - culture = new CultureInfo("vi-VN"); -} - -CultureInfo.DefaultThreadCurrentCulture = culture; -CultureInfo.DefaultThreadCurrentUICulture = culture; - -await cache.LoadAsync(culture); - -await host.RunAsync(); diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/_Imports.razor b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/_Imports.razor deleted file mode 100644 index 1e970214..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/_Imports.razor +++ /dev/null @@ -1,14 +0,0 @@ -@using System.Net.Http -@using System.Net.Http.Json -@using Microsoft.AspNetCore.Components.Forms -@using Microsoft.AspNetCore.Components.Routing -@using Microsoft.AspNetCore.Components.Web -@using Microsoft.AspNetCore.Components.Web.Virtualization -@using Microsoft.AspNetCore.Components.WebAssembly.Http -@using Microsoft.JSInterop -@using MudBlazor -@using EggymonLandingPage.Client -@using EggymonLandingPage.Client.Layout -@using EggymonLandingPage.Shared -@using EggymonLandingPage.Client.Components -@using Microsoft.Extensions.Localization diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/css/app.css b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/css/app.css deleted file mode 100644 index 22e39638..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/css/app.css +++ /dev/null @@ -1,766 +0,0 @@ -/* ═══════════════════════════════════════════════════════════════════ - EGGYMON KITCHEN — Design System (matching Pencil design) - Font: Poppins | Colors: #6B4423 (brown), #FF6B35 (orange), - #FAF8F4 (cream), #2C2C2C (dark), #FFFFFF (white) - ═══════════════════════════════════════════════════════════════════ */ - -/* ─── Reset & Base ─── */ -*, -*::before, -*::after { - box-sizing: border-box; - margin: 0; - padding: 0; -} - -:root { - /* EN: Brand Colors / VI: Màu thương hiệu */ - --brown: #6B4423; - --orange: #FF6B35; - --orange-light: #FF6B3520; - --cream: #FAF8F4; - --dark: #2C2C2C; - --gray: #6B6B6B; - --gray-light: #9A9A9A; - --white: #FFFFFF; - --white-dim: #FFFFFF99; - --white-soft: #FFFFFFDD; - --white-glass: #FFFFFF10; - --white-glass2: #FFFFFF20; - --divider-dark: #4A4A4A; - - /* EN: Typography / VI: Kiểu chữ */ - --font: 'Poppins', sans-serif; - - /* EN: Spacing / VI: Khoảng cách */ - --radius-sm: 20px; - --radius-md: 24px; - --radius-lg: 30px; -} - -html, -body { - font-family: var(--font); - color: var(--dark); - background: var(--cream); - line-height: 1.6; - -webkit-font-smoothing: antialiased; - scroll-behavior: smooth; -} - -a { - text-decoration: none; - color: inherit; -} - -img { - max-width: 100%; - display: block; -} - -/* ─── MudBlazor Overrides ─── */ -.mud-appbar { - background: var(--white) !important; - box-shadow: none !important; - border-bottom: 1px solid #eee; -} - -.mud-toolbar { - min-height: 80px !important; - padding: 0 80px !important; -} - -.mud-main-content { - padding-top: 80px; -} - -/* ═══════════════════════════════════════════════════════════════════ - HEADER — Desktop nav with links + Order Now CTA - ═══════════════════════════════════════════════════════════════════ */ -.header-logo { - display: flex; - align-items: center; - gap: 12px; -} - -.header-logo img { - width: 48px; - height: 48px; - object-fit: contain; -} - -.header-logo-text { - font-size: 24px; - font-weight: 700; - color: var(--brown); -} - -.header-nav { - display: flex; - align-items: center; - gap: 40px; -} - -.header-nav a { - font-size: 16px; - font-weight: 500; - color: var(--dark); - transition: color 0.2s; -} - -.header-nav a:hover { - color: var(--orange); -} - -.header-cta { - display: flex; - align-items: center; - gap: 16px; -} - -.btn-order-now { - display: inline-flex; - align-items: center; - padding: 14px 28px; - background: var(--orange); - color: var(--white); - font-family: var(--font); - font-size: 16px; - font-weight: 600; - border: none; - border-radius: var(--radius-lg); - cursor: pointer; - transition: transform 0.2s, box-shadow 0.2s; -} - -.btn-order-now:hover { - transform: translateY(-2px); - box-shadow: 0 8px 24px rgba(255, 107, 53, 0.3); -} - -/* ═══════════════════════════════════════════════════════════════════ - HERO — Dark brown bg, side-by-side layout - ═══════════════════════════════════════════════════════════════════ */ -.hero-section { - display: flex; - align-items: center; - gap: 60px; - padding: 80px; - background: var(--brown); - min-height: 680px; -} - -.hero-content { - display: flex; - flex-direction: column; - gap: 24px; - max-width: 600px; - flex-shrink: 0; -} - -.hero-badge { - display: inline-flex; - align-self: flex-start; - padding: 8px 16px; - background: var(--orange); - color: var(--white); - font-size: 14px; - font-weight: 600; - border-radius: 20px; -} - -.hero-headline { - font-size: 64px; - font-weight: 700; - color: var(--white); - line-height: 1.1; -} - -.hero-subline { - font-size: 20px; - font-weight: 400; - color: var(--white-dim); - line-height: 1.6; -} - -.hero-cta-row { - display: flex; - gap: 16px; -} - -.hero-btn-primary { - display: inline-flex; - align-items: center; - gap: 8px; - padding: 18px 36px; - background: var(--orange); - color: var(--white); - font-family: var(--font); - font-size: 16px; - font-weight: 600; - border: none; - border-radius: var(--radius-lg); - cursor: pointer; - transition: transform 0.2s; -} - -.hero-btn-primary:hover { - transform: translateY(-2px); -} - -.hero-btn-secondary { - display: inline-flex; - align-items: center; - padding: 18px 36px; - background: transparent; - color: var(--white); - font-family: var(--font); - font-size: 16px; - font-weight: 600; - border: 2px solid var(--white); - border-radius: var(--radius-lg); - cursor: pointer; - transition: background 0.2s; -} - -.hero-btn-secondary:hover { - background: rgba(255, 255, 255, 0.1); -} - -.hero-image { - flex: 1; - min-width: 400px; - height: 520px; - border-radius: var(--radius-md); - overflow: hidden; -} - -.hero-image img { - width: 100%; - height: 100%; - object-fit: cover; -} - -/* ═══════════════════════════════════════════════════════════════════ - SECTIONS — Common patterns - ═══════════════════════════════════════════════════════════════════ */ -.section-tag { - font-size: 14px; - font-weight: 600; - color: var(--orange); - letter-spacing: 2px; - text-transform: uppercase; -} - -.section-title { - font-size: 48px; - font-weight: 700; - color: var(--dark); - line-height: 1.2; -} - -.section-title-white { - font-size: 48px; - font-weight: 700; - color: var(--white); - line-height: 1.2; -} - -.section-desc { - font-size: 18px; - font-weight: 400; - color: var(--gray); -} - -.section-desc-white { - font-size: 18px; - font-weight: 400; - color: var(--white-dim); -} - -/* ═══════════════════════════════════════════════════════════════════ - FEATURES — 3 cards, white bg - ═══════════════════════════════════════════════════════════════════ */ -.features-section { - display: flex; - flex-direction: column; - align-items: center; - gap: 48px; - padding: 80px 120px; - background: var(--white); -} - -.features-header { - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - text-align: center; -} - -.features-grid { - display: flex; - gap: 32px; - justify-content: center; -} - -.feature-card { - display: flex; - flex-direction: column; - align-items: center; - gap: 20px; - padding: 32px; - background: var(--cream); - border-radius: var(--radius-md); - width: 320px; - text-align: center; -} - -.feature-icon { - display: flex; - align-items: center; - justify-content: center; - width: 64px; - height: 64px; - background: var(--orange-light); - border-radius: 32px; -} - -.feature-icon .mud-icon-root { - color: var(--orange) !important; -} - -.feature-title { - font-size: 22px; - font-weight: 600; - color: var(--dark); -} - -.feature-desc { - font-size: 15px; - font-weight: 400; - color: var(--gray); - line-height: 1.6; -} - -/* ═══════════════════════════════════════════════════════════════════ - MENU — Dark brown bg, 3 text columns with dividers - ═══════════════════════════════════════════════════════════════════ */ -.menu-section { - display: flex; - flex-direction: column; - align-items: center; - gap: 48px; - padding: 80px 120px; - background: var(--brown); -} - -.menu-header { - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - text-align: center; -} - -.menu-grid { - display: flex; - gap: 40px; - justify-content: center; - width: 100%; - padding: 32px 40px; - background: var(--white-glass); - border-radius: var(--radius-sm); -} - -.menu-column { - display: flex; - flex-direction: column; - gap: 14px; - flex: 1; -} - -.menu-column-title { - font-size: 16px; - font-weight: 700; - color: var(--orange); - letter-spacing: 3px; -} - -.menu-divider-line { - width: 40px; - height: 2px; - background: var(--orange); -} - -.menu-item { - font-size: 15px; - font-weight: 500; - color: var(--white-soft); -} - -.menu-column-separator { - width: 1px; - background: var(--white-glass2); - align-self: stretch; -} - -/* ═══════════════════════════════════════════════════════════════════ - TESTIMONIALS — Cream bg, 3 quote cards (no stars, no avatars) - ═══════════════════════════════════════════════════════════════════ */ -.testimonials-section { - display: flex; - flex-direction: column; - align-items: center; - gap: 48px; - padding: 80px 120px; - background: var(--cream); -} - -.testimonials-header { - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - text-align: center; -} - -.testimonials-grid { - display: flex; - gap: 32px; -} - -.testimonial-card { - display: flex; - flex-direction: column; - gap: 20px; - padding: 32px; - background: var(--white); - border-radius: var(--radius-md); - width: 380px; -} - -.testimonial-quote { - font-size: 16px; - font-weight: 400; - color: var(--dark); - line-height: 1.7; - font-style: italic; -} - -/* ═══════════════════════════════════════════════════════════════════ - CTA — Orange bg, 2 buttons - ═══════════════════════════════════════════════════════════════════ */ -.cta-section { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - gap: 32px; - padding: 80px 120px; - background: var(--orange); - min-height: 400px; - text-align: center; -} - -.cta-title { - font-size: 48px; - font-weight: 700; - color: var(--white); -} - -.cta-subtitle { - font-size: 20px; - font-weight: 400; - color: var(--white-dim); -} - -.cta-btn-row { - display: flex; - gap: 16px; -} - -.cta-btn-primary { - padding: 18px 40px; - background: var(--white); - color: var(--orange); - font-family: var(--font); - font-size: 18px; - font-weight: 600; - border: none; - border-radius: var(--radius-lg); - cursor: pointer; - transition: transform 0.2s; -} - -.cta-btn-primary:hover { - transform: translateY(-2px); -} - -.cta-btn-secondary { - padding: 18px 40px; - background: transparent; - color: var(--white); - font-family: var(--font); - font-size: 18px; - font-weight: 600; - border: 2px solid var(--white); - border-radius: var(--radius-lg); - cursor: pointer; - transition: background 0.2s; -} - -.cta-btn-secondary:hover { - background: rgba(255, 255, 255, 0.1); -} - -/* ═══════════════════════════════════════════════════════════════════ - FOOTER — Dark bg, logo + 3 link columns + divider + legal row - ═══════════════════════════════════════════════════════════════════ */ -.footer { - display: flex; - flex-direction: column; - gap: 40px; - padding: 60px 120px; - background: var(--dark); -} - -.footer-top { - display: flex; - justify-content: space-between; - width: 100%; -} - -.footer-brand { - display: flex; - flex-direction: column; - gap: 16px; - max-width: 320px; -} - -.footer-logo-row { - display: flex; - align-items: center; - gap: 12px; -} - -.footer-logo-row img { - width: 36px; - height: 36px; -} - -.footer-logo-text { - font-size: 20px; - font-weight: 700; - color: var(--white); -} - -.footer-tagline { - font-size: 14px; - font-weight: 400; - color: var(--gray-light); - line-height: 1.6; -} - -.footer-links { - display: flex; - gap: 80px; -} - -.footer-col { - display: flex; - flex-direction: column; - gap: 16px; -} - -.footer-col-title { - font-size: 16px; - font-weight: 600; - color: var(--white); -} - -.footer-col a, -.footer-col span { - font-size: 14px; - font-weight: 400; - color: var(--gray-light); - transition: color 0.2s; -} - -.footer-col a:hover { - color: var(--white); -} - -.footer-divider { - width: 100%; - height: 1px; - background: var(--divider-dark); -} - -.footer-bottom { - display: flex; - justify-content: space-between; - align-items: center; - width: 100%; -} - -.footer-copyright { - font-size: 14px; - font-weight: 400; - color: var(--gray); -} - -.footer-legal { - display: flex; - gap: 24px; -} - -.footer-legal a { - font-size: 14px; - font-weight: 400; - color: var(--gray); - transition: color 0.2s; -} - -.footer-legal a:hover { - color: var(--white); -} - -/* ═══════════════════════════════════════════════════════════════════ - RESPONSIVE - ═══════════════════════════════════════════════════════════════════ */ -@media (max-width: 1200px) { - .hero-section { - flex-direction: column; - padding: 60px 40px; - } - - .hero-image { - min-width: 100%; - height: 400px; - } - - .hero-headline { - font-size: 48px; - } - - .features-section, - .menu-section, - .testimonials-section, - .cta-section { - padding: 60px 40px; - } - - .footer { - padding: 40px; - } - - .footer-links { - gap: 40px; - } - - .mud-toolbar { - padding: 0 40px !important; - } -} - -@media (max-width: 768px) { - .hero-section { - padding: 40px 20px; - min-height: auto; - } - - .hero-headline { - font-size: 36px; - } - - .hero-subline { - font-size: 16px; - } - - .hero-image { - min-width: 100%; - height: 300px; - } - - .hero-cta-row { - flex-direction: column; - } - - .features-grid { - flex-direction: column; - align-items: center; - } - - .feature-card { - width: 100%; - max-width: 400px; - } - - .menu-grid { - flex-direction: column; - } - - .menu-column-separator { - width: 100%; - height: 1px; - } - - .testimonials-grid { - flex-direction: column; - align-items: center; - } - - .testimonial-card { - width: 100%; - max-width: 400px; - } - - .section-title, - .section-title-white, - .cta-title { - font-size: 32px; - } - - .footer-top { - flex-direction: column; - gap: 40px; - } - - .footer-links { - flex-direction: column; - gap: 24px; - } - - .footer-bottom { - flex-direction: column; - gap: 12px; - text-align: center; - } - - .header-nav { - display: none; - } - - .mud-toolbar { - padding: 0 20px !important; - } - - .features-section, - .menu-section, - .testimonials-section, - .cta-section { - padding: 40px 20px; - } - - .footer { - padding: 30px 20px; - } -} - -/* ─── Animation ─── */ -@keyframes spin { - to { - transform: rotate(360deg); - } -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/Logo-Eggymon-Kitchen.png b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/Logo-Eggymon-Kitchen.png deleted file mode 100644 index 26e4059a..00000000 Binary files a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/Logo-Eggymon-Kitchen.png and /dev/null differ diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/eggymon-kitchen-store.png b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/eggymon-kitchen-store.png deleted file mode 100644 index 880f5f8e..00000000 Binary files a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/images/eggymon-kitchen-store.png and /dev/null differ diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/index.html b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/index.html deleted file mode 100644 index fda9dc93..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/index.html +++ /dev/null @@ -1,100 +0,0 @@ - - - - - - - Eggymon Kitchen - Fresh Eggs, Happy Kitchen - - - - - - - - - - - - - - - - - - - - - - - - - -
- - -
- - - - - -

Loading - Eggymon Kitchen...

-
- - -
- - - - - - - - - - - - - \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/en-US.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/en-US.json deleted file mode 100644 index dcea1c92..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/en-US.json +++ /dev/null @@ -1,68 +0,0 @@ -{ - "Nav_Menu": "Menu", - "Nav_About": "About Us", - "Nav_Locations": "Locations", - "Nav_Contact": "Contact", - "Nav_OrderNow": "Order Now", - "Hero_Badge": "🥚 Open 24/7 — Fresh & Delicious", - "Hero_Headline": "Egg-cellent Food,\nMade With Love", - "Hero_Subline": "Welcome to EggyMon Kitchen — your neighborhood comfort food destination. From fluffy omelettes to savory rice bowls, we serve delicious egg-based dishes around the clock.", - "Hero_CTA_Primary": "Order Now", - "Hero_CTA_Secondary": "Learn More", - "Features_Tag": "WHY CHOOSE US", - "Features_Title": "Crafted With Care, Served With Soul", - "Features_Desc": "Every dish at EggyMon Kitchen is prepared fresh with premium ingredients", - "Feature1_Title": "Open 24/7", - "Feature1_Desc": "Craving eggs at 3 AM? We've got you covered. Fresh food, any time of day.", - "Feature2_Title": "Farm Fresh Eggs", - "Feature2_Desc": "We source our eggs from local farms daily for the freshest taste in every bite.", - "Feature3_Title": "Made With Love", - "Feature3_Desc": "Our chefs pour passion into every dish. Taste the difference of home-cooked comfort.", - "Menu_Tag": "OUR MENU", - "Menu_Title": "Our Menu", - "Menu_Desc": "Explore our full range of dishes — from comfort food classics to Vietnamese specialties", - "Menu_Col1_Title": "MÓN CHÍNH", - "Menu_Col1_Item1": "Cheese Foam Milk Tea", - "Menu_Col1_Item2": "Strawberry Milk Tea", - "Menu_Col1_Item3": "Oolong Milk Tea", - "Menu_Col1_Item4": "Bacon Pork Cheeseburger", - "Menu_Col1_Item5": "Crispy Chicken Burger", - "Menu_Col1_Item6": "Beef Burger with Cheese", - "Menu_Col2_Title": "MÓN PHỤ — ĂN VẶT", - "Menu_Col2_Item1": "Salad trộn", - "Menu_Col2_Item2": "Khoai Tây Chiên", - "Menu_Col2_Item3": "Bánh Tráng Trộn", - "Menu_Col2_Item4": "Bánh Lăng", - "Menu_Col2_Item5": "Mực rim me", - "Menu_Col2_Item6": "Chè đậu Xanh", - "Menu_Col2_Item7": "Chè Thập Cẩm", - "Menu_Col3_Title": "ĐẶC BIỆT", - "Menu_Col3_Item1": "Phở Việt", - "Menu_Col3_Item2": "Hủ Tiếu", - "Testimonials_Tag": "TESTIMONIALS", - "Testimonials_Title": "What Our Customers Say", - "Testimonial1_Quote": "Best omelette I've ever had! The eggs are so fresh and fluffy. Now I'm a regular — even at 2 AM!", - "Testimonial2_Quote": "My family's go-to spot for late night cravings. The staff is friendly and the food is always consistent.", - "Testimonial3_Quote": "The shakshuka here reminds me of home. Authentic flavors, generous portions, and the price is right!", - "CTA_Title": "Ready to Try the Best Eggs in Town?", - "CTA_Subtitle": "Visit us today or order online for delivery. Open 24/7 for your convenience!", - "CTA_Btn_Primary": "Order Now", - "CTA_Btn_Secondary": "Find Location", - "Footer_Tagline": "Your neighborhood comfort food destination. Serving egg-cellent dishes 24/7.", - "Footer_Col1_Title": "Company", - "Footer_Col1_Link1": "About Us", - "Footer_Col1_Link2": "Our Menu", - "Footer_Col1_Link3": "Testimonials", - "Footer_Col1_Link4": "Contact", - "Footer_Col2_Title": "Support", - "Footer_Col2_Link1": "Help Center", - "Footer_Col2_Link2": "Order Tracking", - "Footer_Col2_Link3": "Delivery Areas", - "Footer_Col3_Title": "Connect", - "Footer_Col3_Link1": "Facebook", - "Footer_Col3_Link2": "Instagram", - "Footer_Col3_Link3": "TikTok", - "Footer_Copyright": "© 2026 EggyMon Kitchen. All rights reserved.", - "Footer_Privacy": "Privacy Policy", - "Footer_Terms": "Terms of Service" -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/vi-VN.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/vi-VN.json deleted file mode 100644 index d4c7e10f..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Client/wwwroot/locales/vi-VN.json +++ /dev/null @@ -1,68 +0,0 @@ -{ - "Nav_Menu": "Thực đơn", - "Nav_About": "Về chúng tôi", - "Nav_Locations": "Chi nhánh", - "Nav_Contact": "Liên hệ", - "Nav_OrderNow": "Đặt Ngay", - "Hero_Badge": "🥚 Mở 24/7 — Tươi Ngon & Hấp Dẫn", - "Hero_Headline": "Món Trứng Tuyệt Vời,\nNấu Với Tình Yêu", - "Hero_Subline": "Chào mừng đến EggyMon Kitchen — quán ăn quen thuộc của bạn. Từ trứng chiên mềm mịn đến cơm rang thơm ngon, chúng tôi phục vụ 24/7.", - "Hero_CTA_Primary": "Đặt Ngay", - "Hero_CTA_Secondary": "Tìm Hiểu Thêm", - "Features_Tag": "TẠI SAO CHỌN CHÚNG TÔI", - "Features_Title": "Chế Biến Tỉ Mỉ, Phục Vụ Tận Tâm", - "Features_Desc": "Mỗi món ăn tại EggyMon Kitchen đều được chế biến tươi với nguyên liệu cao cấp", - "Feature1_Title": "Mở 24/7", - "Feature1_Desc": "Thèm trứng lúc 3 giờ sáng? Chúng tôi sẵn sàng phục vụ bạn bất cứ lúc nào.", - "Feature2_Title": "Trứng Tươi Từ Trang Trại", - "Feature2_Desc": "Chúng tôi nhập trứng từ trang trại địa phương mỗi ngày để đảm bảo vị tươi ngon nhất.", - "Feature3_Title": "Nấu Với Tình Yêu", - "Feature3_Desc": "Đầu bếp của chúng tôi đổ đam mê vào mỗi món ăn. Hãy nếm thử sự khác biệt.", - "Menu_Tag": "THỰC ĐƠN", - "Menu_Title": "Thực Đơn", - "Menu_Desc": "Khám phá đầy đủ các món — từ comfort food kinh điển đến đặc sản Việt Nam", - "Menu_Col1_Title": "MÓN CHÍNH", - "Menu_Col1_Item1": "Cheese Foam Milk Tea", - "Menu_Col1_Item2": "Strawberry Milk Tea", - "Menu_Col1_Item3": "Oolong Milk Tea", - "Menu_Col1_Item4": "Bacon Pork Cheeseburger", - "Menu_Col1_Item5": "Crispy Chicken Burger", - "Menu_Col1_Item6": "Beef Burger with Cheese", - "Menu_Col2_Title": "MÓN PHỤ — ĂN VẶT", - "Menu_Col2_Item1": "Salad trộn", - "Menu_Col2_Item2": "Khoai Tây Chiên", - "Menu_Col2_Item3": "Bánh Tráng Trộn", - "Menu_Col2_Item4": "Bánh Lăng", - "Menu_Col2_Item5": "Mực rim me", - "Menu_Col2_Item6": "Chè đậu Xanh", - "Menu_Col2_Item7": "Chè Thập Cẩm", - "Menu_Col3_Title": "ĐẶC BIỆT", - "Menu_Col3_Item1": "Phở Việt", - "Menu_Col3_Item2": "Hủ Tiếu", - "Testimonials_Tag": "ĐÁNH GIÁ", - "Testimonials_Title": "Khách Hàng Nói Gì?", - "Testimonial1_Quote": "Trứng chiên ngon nhất mà tôi từng ăn! Trứng rất tươi và xốp. Giờ tôi là khách quen — kể cả lúc 2 giờ sáng!", - "Testimonial2_Quote": "Địa điểm yêu thích của gia đình tôi cho những cơn thèm đêm khuya. Nhân viên thân thiện và đồ ăn luôn ổn định.", - "Testimonial3_Quote": "Món shakshuka ở đây gợi nhớ hương vị quê nhà. Vị đậm đà, phần ăn hào phóng, giá cả hợp lý!", - "CTA_Title": "Sẵn Sàng Thử Trứng Ngon Nhất Thành Phố?", - "CTA_Subtitle": "Ghé thăm chúng tôi hôm nay hoặc đặt hàng trực tuyến. Mở 24/7 để phục vụ bạn!", - "CTA_Btn_Primary": "Đặt Ngay", - "CTA_Btn_Secondary": "Tìm Chi Nhánh", - "Footer_Tagline": "Quán ăn quen thuộc phục vụ món trứng tuyệt vời 24/7.", - "Footer_Col1_Title": "Công Ty", - "Footer_Col1_Link1": "Về Chúng Tôi", - "Footer_Col1_Link2": "Thực Đơn", - "Footer_Col1_Link3": "Đánh Giá", - "Footer_Col1_Link4": "Liên Hệ", - "Footer_Col2_Title": "Hỗ Trợ", - "Footer_Col2_Link1": "Trung Tâm Trợ Giúp", - "Footer_Col2_Link2": "Theo Dõi Đơn Hàng", - "Footer_Col2_Link3": "Khu Vực Giao Hàng", - "Footer_Col3_Title": "Kết Nối", - "Footer_Col3_Link1": "Facebook", - "Footer_Col3_Link2": "Instagram", - "Footer_Col3_Link3": "TikTok", - "Footer_Copyright": "© 2026 EggyMon Kitchen. Bảo lưu mọi quyền.", - "Footer_Privacy": "Chính Sách Bảo Mật", - "Footer_Terms": "Điều Khoản Dịch Vụ" -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj deleted file mode 100644 index a9ed57c7..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/EggymonLandingPage.Server.csproj +++ /dev/null @@ -1,20 +0,0 @@ - - - - net10.0 - enable - enable - - - - - - - - - - - - - - diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Program.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Program.cs deleted file mode 100644 index 958cd723..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Program.cs +++ /dev/null @@ -1,117 +0,0 @@ -/// -/// EN: ASP.NET Core BFF (Backend for Frontend) with YARP Reverse Proxy for Eggymon Landing Page. -/// VI: ASP.NET Core BFF (Backend for Frontend) với YARP Reverse Proxy cho Eggymon Landing Page. -/// - -using Microsoft.AspNetCore.Rewrite; - -var builder = WebApplication.CreateBuilder(args); - -// ═══════════════════════════════════════════════════════════════════════════════ -// EN: Add services to the container -// VI: Thêm các services vào container -// ═══════════════════════════════════════════════════════════════════════════════ - -// EN: Load YARP configuration from yarp.json -// VI: Load cấu hình YARP từ yarp.json -builder.Configuration.AddJsonFile("yarp.json", optional: true, reloadOnChange: true); - -// EN: Add YARP Reverse Proxy -// VI: Thêm YARP Reverse Proxy -builder.Services.AddReverseProxy() - .LoadFromConfig(builder.Configuration.GetSection("ReverseProxy")); - -// EN: Add OpenAPI/Swagger support -// VI: Thêm hỗ trợ OpenAPI/Swagger -builder.Services.AddOpenApi(); - -// EN: Add CORS for Blazor WebAssembly client -// VI: Thêm CORS cho Blazor WebAssembly client -builder.Services.AddCors(options => -{ - options.AddPolicy("BlazorClient", policy => - { - policy.AllowAnyOrigin() - .AllowAnyMethod() - .AllowAnyHeader(); - }); -}); - -// EN: Add health checks -// VI: Thêm health checks -builder.Services.AddHealthChecks(); - -var app = builder.Build(); - -// ═══════════════════════════════════════════════════════════════════════════════ -// EN: Configure the HTTP request pipeline -// VI: Cấu hình HTTP request pipeline -// ═══════════════════════════════════════════════════════════════════════════════ - -if (app.Environment.IsDevelopment()) -{ - app.MapOpenApi(); - app.UseDeveloperExceptionPage(); -} - -app.UseHttpsRedirection(); - -// EN: Enable CORS -// VI: Kích hoạt CORS -app.UseCors("BlazorClient"); - -// EN: Rewrite localized framework/content requests to root -// VI: Viết lại các yêu cầu framework/content từ đường dẫn ngôn ngữ về root -var rewriteOptions = new RewriteOptions() - .AddRewrite(@"^(en-US|vi-VN)/(_framework|_content)/(.*)", "$2/$3", skipRemainingRules: true); -app.UseRewriter(rewriteOptions); - -// EN: Serve static files with fingerprinting support (.NET 10+) -// VI: Phục vụ static files với hỗ trợ fingerprinting (.NET 10+) -app.MapStaticAssets(); - -// EN: Map health check endpoint -// VI: Map endpoint health check -app.MapHealthChecks("/health"); - -// EN: Map YARP Reverse Proxy routes to microservices -// VI: Map các routes YARP Reverse Proxy đến microservices -app.MapReverseProxy(); - -// EN: Localization Support - Serve index.html with dynamic base tag for specific cultures -// VI: Hỗ trợ đa ngôn ngữ - Phục vụ index.html với base tag động cho các ngôn ngữ cụ thể -var supportedCultures = new[] { "en-US", "vi-VN" }; -var localizationOptions = new RequestLocalizationOptions() - .SetDefaultCulture("en-US") - .AddSupportedCultures(supportedCultures) - .AddSupportedUICultures(supportedCultures); - -app.UseRequestLocalization(localizationOptions); - -// EN: Handle mapped culture routes (e.g. /en-US/home, /vi-VN/) -// VI: Xử lý các routes ngôn ngữ (vd: /en-US/home, /vi-VN/) -app.Map("{culture:regex(^(en-US|vi-VN)$)}/{**slug}", async (string culture, HttpContext context, IWebHostEnvironment env) => -{ - var fileInfo = env.WebRootFileProvider.GetFileInfo("index.html"); - if (!fileInfo.Exists) - { - return Results.NotFound("index.html not found in wwwroot. Ensure the Client project is built."); - } - - using var stream = fileInfo.CreateReadStream(); - using var reader = new StreamReader(stream); - var html = await reader.ReadToEndAsync(); - - // EN: Replace base tag for culture-specific routing - // VI: Thay thế base tag cho routing theo ngôn ngữ - var modifiedHtml = html.Replace("", $"") - .Replace("", $""); - - return Results.Content(modifiedHtml, "text/html"); -}); - -// EN: Fallback to index.html for SPA routing (default culture) -// VI: Fallback đến index.html cho SPA routing (ngôn ngữ mặc định) -app.MapFallbackToFile("index.html"); - -app.Run(); diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Properties/launchSettings.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Properties/launchSettings.json deleted file mode 100644 index 22b22cc3..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/Properties/launchSettings.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "profiles": { - "https": { - "commandName": "Project", - "dotnetRunMessages": true, - "launchBrowser": true, - "applicationUrl": "https://localhost:7295;http://localhost:5095", - "environmentVariables": { - "ASPNETCORE_ENVIRONMENT": "Development" - } - }, - "http": { - "commandName": "Project", - "dotnetRunMessages": true, - "launchBrowser": true, - "applicationUrl": "http://localhost:5095", - "environmentVariables": { - "ASPNETCORE_ENVIRONMENT": "Development" - } - } - } -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.Development.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.Development.json deleted file mode 100644 index fc52b051..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.Development.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "Logging": { - "LogLevel": { - "Default": "Information", - "Microsoft.AspNetCore": "Warning" - } - } -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.json deleted file mode 100644 index 5220ddea..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/appsettings.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "Logging": { - "LogLevel": { - "Default": "Information", - "Microsoft.AspNetCore": "Warning" - } - }, - "AllowedHosts": "*" -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/yarp.json b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/yarp.json deleted file mode 100644 index c4876b3b..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Server/yarp.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "ReverseProxy": { - "Routes": {}, - "Clusters": {} - } -} \ No newline at end of file diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/ApiResponse.cs b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/ApiResponse.cs deleted file mode 100644 index 386cf124..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/ApiResponse.cs +++ /dev/null @@ -1,12 +0,0 @@ -namespace EggymonLandingPage.Shared; - -/// -/// EN: Standard API response wrapper. -/// VI: Wrapper response API chuẩn. -/// -public class ApiResponse -{ - public bool Success { get; set; } - public T? Data { get; set; } - public string? Error { get; set; } -} diff --git a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/EggymonLandingPage.Shared.csproj b/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/EggymonLandingPage.Shared.csproj deleted file mode 100644 index 93f5ab4b..00000000 --- a/apps/web-client-eggymon-landipage-net/src/EggymonLandingPage.Shared/EggymonLandingPage.Shared.csproj +++ /dev/null @@ -1,9 +0,0 @@ - - - - net10.0 - enable - enable - - - diff --git a/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/ApiResponseTests.cs b/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/ApiResponseTests.cs deleted file mode 100644 index 9e73c2ed..00000000 --- a/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/ApiResponseTests.cs +++ /dev/null @@ -1,44 +0,0 @@ -using EggymonLandingPage.Shared; -using FluentAssertions; -using Xunit; - -namespace EggymonLandingPage.SmokeTests; - -/// -/// EN: Smoke tests for landing page shared API response model. -/// VI: Smoke tests cho model API response dùng chung của landing page. -/// -public class ApiResponseTests -{ - [Fact] - public void ApiResponse_ShouldStoreSuccessPayload() - { - // Act - var response = new ApiResponse - { - Success = true, - Data = "ok", - }; - - // Assert - response.Success.Should().BeTrue(); - response.Data.Should().Be("ok"); - response.Error.Should().BeNull(); - } - - [Fact] - public void ApiResponse_ShouldStoreErrorMessage() - { - // Act - var response = new ApiResponse - { - Success = false, - Error = "invalid-state", - }; - - // Assert - response.Success.Should().BeFalse(); - response.Data.Should().BeNull(); - response.Error.Should().Be("invalid-state"); - } -} diff --git a/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/EggymonLandingPage.SmokeTests.csproj b/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/EggymonLandingPage.SmokeTests.csproj deleted file mode 100644 index e11fd6a8..00000000 --- a/apps/web-client-eggymon-landipage-net/tests/EggymonLandingPage.SmokeTests/EggymonLandingPage.SmokeTests.csproj +++ /dev/null @@ -1,32 +0,0 @@ - - - - EggymonLandingPage.SmokeTests - EggymonLandingPage.SmokeTests - net10.0 - false - true - enable - enable - - - - - - - - runtime; build; native; contentfiles; analyzers; buildtransitive - all - - - - runtime; build; native; contentfiles; analyzers; buildtransitive - all - - - - - - - - diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/admin-dashboard.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/admin-dashboard.pen deleted file mode 100644 index 27e25bca..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/admin-dashboard.pen +++ /dev/null @@ -1,1674 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "DashboardScreen", - "x": 0, - "y": 0, - "name": "Admin/Dashboard", - "reusable": true, - "clip": true, - "width": 1440, - "height": 1044, - "fill": "$bg-page", - "children": [ - { - "type": "frame", - "id": "SidebarDash", - "name": "Sidebar", - "width": 260, - "height": "fill_container", - "fill": "$bg-surface", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$border-default" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "LogoAreaDash", - "name": "Logo Area", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "LogoIconDash", - "name": "Logo Icon", - "width": 48, - "height": 48, - "fill": "#FFFFFF33", - "cornerRadius": 24, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LogoTextDash", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "BrandNameDash", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "BrandSubDash", - "fill": "#FFFFFFB3", - "content": "Quản lý cửa hàng", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "NavAreaDash", - "name": "Navigation", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 4, - "padding": [ - 16, - 12 - ], - "children": [ - { - "type": "text", - "id": "NavLabelOverview", - "fill": "$text-tertiary", - "content": "TỔNG QUAN", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NavDashboard", - "name": "Nav Dashboard Active", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconDashboard", - "width": 20, - "height": 20, - "iconFontName": "layout-dashboard", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "NavDashText", - "fill": "#FFFFFF", - "content": "Dashboard", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NavLabelStore", - "fill": "$text-tertiary", - "content": "CỬA HÀNG", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NavOrders", - "name": "Nav Orders", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconOrders", - "width": 20, - "height": 20, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavOrdersText", - "fill": "$text-secondary", - "content": "Quản lý đơn hàng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NavStaff", - "name": "Nav Staff", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconStaff", - "width": 20, - "height": 20, - "iconFontName": "users", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavStaffText", - "fill": "$text-secondary", - "content": "Nhân sự", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NavSettings", - "name": "Nav Settings", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconSettings", - "width": 20, - "height": 20, - "iconFontName": "settings-2", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavSettingsText", - "fill": "$text-secondary", - "content": "Cài đặt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NavLabelBiz", - "fill": "$text-tertiary", - "content": "KINH DOANH", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NavReport", - "name": "Nav Report", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconReport", - "width": 20, - "height": 20, - "iconFontName": "bar-chart-2", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavReportText", - "fill": "$text-secondary", - "content": "Báo cáo", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NavLoyalty", - "name": "Nav Loyalty", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IconLoyalty", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavLoyaltyText", - "fill": "$text-secondary", - "content": "Loyalty", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "UserAreaDash", - "name": "User Area", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "DividerDash", - "width": "fill_container", - "height": 1, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "UserRowDash", - "name": "User Row", - "width": "fill_container", - "gap": 12, - "padding": [ - 16, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "AvatarDash", - "width": 40, - "height": 40, - "fill": "$orange-primary", - "cornerRadius": 20, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "AvatarTextDash", - "fill": "#FFFFFF", - "content": "TN", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "UserInfoDash", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "UserNameDash", - "fill": "$text-primary", - "content": "Trần Nhật", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "UserRoleDash", - "fill": "$text-secondary", - "content": "Store Manager", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MainContentDash", - "name": "Main Content", - "width": "fill_container", - "height": "fill_container", - "fill": "$bg-page", - "layout": "vertical", - "gap": 24, - "padding": 32, - "children": [ - { - "type": "frame", - "id": "HeaderRowDash", - "name": "Header", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "HeaderLeftDash", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "BreadcrumbDash", - "fill": "$text-tertiary", - "content": "Tổng quan / Dashboard", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PageTitleDash", - "fill": "$text-primary", - "content": "Dashboard", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "DatePickerDash", - "name": "Date Range Picker", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "gap": 8, - "padding": [ - 8, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "CalendarIconDash", - "width": 18, - "height": 18, - "iconFontName": "calendar", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "DateTextDash", - "fill": "$text-primary", - "content": "Hôm nay, 11/02/2025", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "StatsRowDash", - "name": "Stats Row", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "StatCardRevenue", - "name": "Revenue Card", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "StatLabelRevenue", - "fill": "$text-secondary", - "content": "Doanh thu hôm nay", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "StatValueRevenue", - "fill": "$text-primary", - "content": "4,250,000₫", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "StatBadgeRevenue", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TrendUpRevenue", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "StatChangeRevenue", - "fill": "#16A34A", - "content": "+12.5%", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "StatCardOrders", - "name": "Orders Card", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "StatLabelOrders", - "fill": "$text-secondary", - "content": "Đơn hàng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "StatValueOrders", - "fill": "$text-primary", - "content": "87", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "StatBadgeOrders", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TrendUpOrders", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "StatChangeOrders", - "fill": "#16A34A", - "content": "+8.3%", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "StatCardCustomers", - "name": "Customers Card", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "StatLabelCustomers", - "fill": "$text-secondary", - "content": "Khách hàng mới", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "StatValueCustomers", - "fill": "$text-primary", - "content": "12", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "StatBadgeCustomers", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TrendDownCustomers", - "width": 14, - "height": 14, - "iconFontName": "trending-down", - "iconFontFamily": "lucide", - "fill": "#DC2626" - }, - { - "type": "text", - "id": "StatChangeCustomers", - "fill": "#DC2626", - "content": "-2.1%", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "StatCardAverage", - "name": "Average Card", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "StatLabelAverage", - "fill": "$text-secondary", - "content": "Trung bình/đơn", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "StatValueAverage", - "fill": "$text-primary", - "content": "48,850₫", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "StatBadgeAverage", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TrendUpAverage", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "StatChangeAverage", - "fill": "#16A34A", - "content": "+5.7%", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MiddleRowDash", - "name": "Charts Row", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "RevenueChartCard", - "name": "Revenue Chart", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 16, - "padding": 20, - "children": [ - { - "type": "text", - "id": "ChartTitleDash", - "fill": "$text-primary", - "content": "Biểu đồ doanh thu", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "ChartAreaDash", - "name": "Chart Bars", - "width": "fill_container", - "height": 160, - "gap": 8, - "padding": [ - 0, - 10 - ], - "alignItems": "end", - "children": [ - { - "type": "frame", - "id": "BarMon", - "width": "fill_container", - "height": 100, - "fill": "$orange-primary", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarTue", - "width": "fill_container", - "height": 130, - "fill": "$orange-primary", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarWed", - "width": "fill_container", - "height": 90, - "fill": "$orange-primary", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarThu", - "width": "fill_container", - "height": 145, - "fill": "$orange-primary", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarFri", - "width": "fill_container", - "height": 155, - "fill": "$orange-primary", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarSat", - "width": "fill_container", - "height": 160, - "fill": "$orange-light", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - }, - { - "type": "frame", - "id": "BarSun", - "width": "fill_container", - "height": 110, - "fill": "$orange-light", - "cornerRadius": [ - 4, - 4, - 0, - 0 - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "PopularItemsCard", - "name": "Popular Items", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "text", - "id": "PopularTitle", - "fill": "$text-primary", - "content": "Món bán chạy", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "PopItem1", - "width": "fill_container", - "gap": 12, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rank1Frame", - "width": 28, - "height": 28, - "fill": "$orange-primary", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rank1Text", - "fill": "#FFFFFF", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "PopName1", - "fill": "$text-primary", - "content": "Combo bánh mì đặc biệt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PopQty1", - "fill": "$text-secondary", - "content": "342 phần", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "PopItem2", - "width": "fill_container", - "gap": 12, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rank2Frame", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rank2Text", - "fill": "$text-primary", - "content": "2", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "PopName2", - "fill": "$text-primary", - "content": "Trà sữa oolong", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PopQty2", - "fill": "$text-secondary", - "content": "298 phần", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "PopItem3", - "width": "fill_container", - "gap": 12, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rank3Frame", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rank3Text", - "fill": "$text-primary", - "content": "3", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "PopName3", - "fill": "$text-primary", - "content": "Cơm trưa đặc biệt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PopQty3", - "fill": "$text-secondary", - "content": "256 phần", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "PopItem4", - "width": "fill_container", - "gap": 12, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rank4Frame", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rank4Text", - "fill": "$text-primary", - "content": "4", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "PopName4", - "fill": "$text-primary", - "content": "Omelette phô mai", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PopQty4", - "fill": "$text-secondary", - "content": "234 phần", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "PopItem5", - "width": "fill_container", - "gap": 12, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rank5Frame", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rank5Text", - "fill": "$text-primary", - "content": "5", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "PopName5", - "fill": "$text-primary", - "content": "Bánh mì trứng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "PopQty5", - "fill": "$text-secondary", - "content": "198 phần", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "RecentOrdersCard", - "name": "Recent Orders", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "text", - "id": "RecentOrdersTitle", - "fill": "$text-primary", - "content": "Đơn hàng gần đây", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "TableHeaderDash", - "name": "Table Header", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": [ - 10, - 10, - 0, - 0 - ], - "padding": [ - 12, - 16 - ], - "children": [ - { - "type": "text", - "id": "ThOrderId", - "fill": "$text-secondary", - "content": "Mã đơn", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "ThCustomer", - "fill": "$text-secondary", - "content": "Khách hàng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "ThItems", - "fill": "$text-secondary", - "content": "Món", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "ThTotal", - "fill": "$text-secondary", - "content": "Tổng tiền", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "ThStatus", - "fill": "$text-secondary", - "content": "Trạng thái", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "ThTime", - "fill": "$text-secondary", - "content": "Thời gian", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TableRow1Dash", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 12, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Td1OrderId", - "fill": "$text-primary", - "content": "#EK-0087", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Td1Customer", - "fill": "$text-primary", - "content": "Nguyễn Văn B", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td1Items", - "fill": "$text-secondary", - "content": "Combo bánh mì x2, Trà sữa x1", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td1Total", - "fill": "$text-primary", - "content": "185,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Td1Status", - "width": 130, - "children": [ - { - "type": "frame", - "id": "Badge1Dash", - "fill": "#DBEAFE", - "cornerRadius": 20, - "padding": [ - 4, - 12 - ], - "children": [ - { - "type": "text", - "id": "Badge1Text", - "fill": "#2563EB", - "content": "Đang chế biến", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "Td1Time", - "fill": "$text-secondary", - "content": "14:32", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "TableRow2Dash", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 12, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Td2OrderId", - "fill": "$text-primary", - "content": "#EK-0086", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Td2Customer", - "fill": "$text-primary", - "content": "Trần Thị C", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td2Items", - "fill": "$text-secondary", - "content": "Cơm trưa đặc biệt x1", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td2Total", - "fill": "$text-primary", - "content": "55,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Td2Status", - "width": 130, - "children": [ - { - "type": "frame", - "id": "Badge2Dash", - "fill": "#DCFCE7", - "cornerRadius": 20, - "padding": [ - 4, - 12 - ], - "children": [ - { - "type": "text", - "id": "Badge2Text", - "fill": "#16A34A", - "content": "Hoàn thành", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "Td2Time", - "fill": "$text-secondary", - "content": "14:15", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "TableRow3Dash", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 12, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Td3OrderId", - "fill": "$text-primary", - "content": "#EK-0085", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Td3Customer", - "fill": "$text-primary", - "content": "Walk-in", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td3Items", - "fill": "$text-secondary", - "content": "Omelette phô mai x2", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td3Total", - "fill": "$text-primary", - "content": "120,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Td3Status", - "width": 130, - "children": [ - { - "type": "frame", - "id": "Badge3Dash", - "fill": "#FFEDD5", - "cornerRadius": 20, - "padding": [ - 4, - 12 - ], - "children": [ - { - "type": "text", - "id": "Badge3Text", - "fill": "#EA580C", - "content": "Chờ lấy", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "Td3Time", - "fill": "$text-secondary", - "content": "13:50", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "TableRow4Dash", - "width": "fill_container", - "padding": [ - 12, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Td4OrderId", - "fill": "$text-primary", - "content": "#EK-0084", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Td4Customer", - "fill": "$text-primary", - "content": "App - Lê D", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td4Items", - "fill": "$text-secondary", - "content": "Bánh mì trứng x3", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Td4Total", - "fill": "$text-primary", - "content": "90,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Td4Status", - "width": 130, - "children": [ - { - "type": "frame", - "id": "Badge4Dash", - "fill": "#FEE2E2", - "cornerRadius": 20, - "padding": [ - 4, - 12 - ], - "children": [ - { - "type": "text", - "id": "Badge4Text", - "fill": "#DC2626", - "content": "Đã hủy", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "Td4Time", - "fill": "$text-secondary", - "content": "13:30", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/order-management.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/order-management.pen deleted file mode 100644 index 25c92633..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/order-management.pen +++ /dev/null @@ -1,306 +0,0 @@ -{ - "version": "2.6", - "children": [ - { - "type": "frame", - "id": "OrderScreen", - "name": "Admin/OrderManagement", - "reusable": true, - "width": 1440, - "height": 900, - "fill": "$bg-page", - "layout": "horizontal", - "clip": true, - "children": [ - { - "type": "frame", - "id": "SidebarOrder", - "name": "Sidebar", - "width": 260, - "height": "fill_container", - "fill": "$bg-surface", - "layout": "vertical", - "stroke": {"align": "inside", "fill": "$border-default", "thickness": {"right": 1}}, - "children": [ - { - "type": "frame", - "id": "LogoAreaOrd", - "width": "fill_container", - "fill": {"type": "linear_gradient", "stops": [{"color": "#6B4423", "position": 0}, {"color": "#FF6B35", "position": 1}]}, - "padding": 20, - "layout": "vertical", - "gap": 12, - "children": [ - {"type": "frame", "id": "LogoIconOrd", "width": 48, "height": 48, "cornerRadius": 24, "fill": "#FFFFFF33", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "LogoTxOrd", "content": "EK", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 20, "fontWeight": "bold"}]}, - {"type": "text", "id": "BrandNameOrd", "content": "EggyMon Kitchen", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "bold"}, - {"type": "text", "id": "BrandSubOrd", "content": "Quản lý cửa hàng", "fill": "#FFFFFFB3", "fontFamily": "Poppins", "fontSize": 11} - ] - }, - { - "type": "frame", - "id": "NavAreaOrd", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "padding": [16, 12], - "gap": 4, - "children": [ - {"type": "text", "id": "NvLblOvOrd", "content": "TỔNG QUAN", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [12, 8]}, - {"type": "frame", "id": "NvDashOrd", "width": "fill_container", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcDshOrd", "iconFontFamily": "lucide", "iconFontName": "layout-dashboard", "width": 20, "height": 20, "fill": "$text-secondary"}, {"type": "text", "id": "TxDshOrd", "content": "Dashboard", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]}, - {"type": "text", "id": "NvLblStOrd", "content": "CỬA HÀNG", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [16, 8, 12, 8]}, - {"type": "frame", "id": "NvOrdActive", "width": "fill_container", "fill": "$orange-primary", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcOrdAct", "iconFontFamily": "lucide", "iconFontName": "shopping-bag", "width": 20, "height": 20, "fill": "#FFFFFF"}, {"type": "text", "id": "TxOrdAct", "content": "Quản lý đơn hàng", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]}, - {"type": "frame", "id": "NvStfOrd", "width": "fill_container", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcStfOrd", "iconFontFamily": "lucide", "iconFontName": "users", "width": 20, "height": 20, "fill": "$text-secondary"}, {"type": "text", "id": "TxStfOrd", "content": "Nhân sự", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]}, - {"type": "frame", "id": "NvSetOrd", "width": "fill_container", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcSetOrd", "iconFontFamily": "lucide", "iconFontName": "settings-2", "width": 20, "height": 20, "fill": "$text-secondary"}, {"type": "text", "id": "TxSetOrd", "content": "Cài đặt", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]}, - {"type": "text", "id": "NvLblBzOrd", "content": "KINH DOANH", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [16, 8, 12, 8]}, - {"type": "frame", "id": "NvRptOrd", "width": "fill_container", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcRptOrd", "iconFontFamily": "lucide", "iconFontName": "bar-chart-2", "width": 20, "height": 20, "fill": "$text-secondary"}, {"type": "text", "id": "TxRptOrd", "content": "Báo cáo", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]}, - {"type": "frame", "id": "NvLoyOrd", "width": "fill_container", "cornerRadius": 10, "padding": [12, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [{"type": "icon_font", "id": "IcLoyOrd", "iconFontFamily": "lucide", "iconFontName": "gift", "width": 20, "height": 20, "fill": "$text-secondary"}, {"type": "text", "id": "TxLoyOrd", "content": "Loyalty", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"}]} - ] - }, - { - "type": "frame", - "id": "UserAreaOrd", - "width": "fill_container", - "layout": "vertical", - "children": [ - {"type": "frame", "id": "DividerOrd", "width": "fill_container", "height": 1, "fill": "$border-default"}, - {"type": "frame", "id": "UserRowOrd", "width": "fill_container", "padding": [16, 20], "layout": "horizontal", "gap": 12, "alignItems": "center", "children": [ - {"type": "frame", "id": "AvatarOrd", "width": 40, "height": 40, "cornerRadius": 20, "fill": "$orange-primary", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "AvTxOrd", "content": "TN", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "bold"}]}, - {"type": "frame", "id": "UsrInfoOrd", "layout": "vertical", "gap": 2, "children": [{"type": "text", "id": "UsrNmOrd", "content": "Trần Nhật", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "600"}, {"type": "text", "id": "UsrRlOrd", "content": "Store Manager", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 12}]} - ]} - ] - } - ] - }, - { - "type": "frame", - "id": "MainContentOrd", - "name": "Main Content", - "width": "fill_container", - "height": "fill_container", - "fill": "$bg-page", - "layout": "vertical", - "padding": 32, - "gap": 20, - "children": [ - {"type": "text", "id": "TitleOrd", "content": "Quản lý đơn hàng", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 24, "fontWeight": "bold"}, - { - "type": "frame", - "id": "StatusTabs", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "padding": 4, - "layout": "horizontal", - "gap": 0, - "children": [ - {"type": "frame", "id": "TabAll", "fill": "$orange-primary", "cornerRadius": 10, "padding": [8, 16], "children": [{"type": "text", "id": "TabAllTx", "content": "Tất cả (87)", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500"}]}, - {"type": "frame", "id": "TabPending", "padding": [8, 16], "children": [{"type": "text", "id": "TabPendTx", "content": "Chờ xác nhận (5)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "TabCooking", "padding": [8, 16], "children": [{"type": "text", "id": "TabCookTx", "content": "Đang chế biến (12)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "TabReady", "padding": [8, 16], "children": [{"type": "text", "id": "TabReadyTx", "content": "Chờ lấy (8)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "TabDone", "padding": [8, 16], "children": [{"type": "text", "id": "TabDoneTx", "content": "Hoàn thành (58)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "TabCancel", "padding": [8, 16], "children": [{"type": "text", "id": "TabCancelTx", "content": "Đã hủy (4)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]} - ] - }, - { - "type": "frame", - "id": "FilterBarOrd", - "width": "fill_container", - "layout": "horizontal", - "gap": 12, - "children": [ - {"type": "frame", "id": "SearchOrd", "width": 300, "height": 42, "fill": "$bg-surface", "cornerRadius": 10, "stroke": {"align": "inside", "fill": "$border-default", "thickness": 1}, "padding": [0, 16], "layout": "horizontal", "gap": 8, "alignItems": "center", "children": [ - {"type": "icon_font", "id": "IcSrchOrd", "iconFontFamily": "lucide", "iconFontName": "search", "width": 18, "height": 18, "fill": "$text-tertiary"}, - {"type": "text", "id": "SrchPlcOrd", "content": "Tìm đơn hàng...", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 14} - ]}, - {"type": "frame", "id": "DateFilterOrd", "width": 200, "height": 42, "fill": "$bg-surface", "cornerRadius": 10, "stroke": {"align": "inside", "fill": "$border-default", "thickness": 1}, "padding": [0, 16], "layout": "horizontal", "gap": 8, "alignItems": "center", "children": [ - {"type": "icon_font", "id": "IcCalOrd", "iconFontFamily": "lucide", "iconFontName": "calendar", "width": 18, "height": 18, "fill": "$text-tertiary"}, - {"type": "text", "id": "DateTxOrd", "content": "Hôm nay", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ]} - ] - }, - { - "type": "frame", - "id": "OrdersTable", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "OrdTblHeader", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": [14, 14, 0, 0], - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "children": [ - {"type": "text", "id": "OThCode", "content": "Mã đơn", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 110}, - {"type": "text", "id": "OThTime", "content": "Thời gian", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 90}, - {"type": "text", "id": "OThCust", "content": "Khách hàng", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 150}, - {"type": "text", "id": "OThItems", "content": "Món", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": "fill_container"}, - {"type": "text", "id": "OThTotal", "content": "Tổng", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 120}, - {"type": "text", "id": "OThStatus", "content": "Trạng thái", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 140}, - {"type": "text", "id": "OThAction", "content": "Hành động", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 90} - ] - }, - { - "type": "frame", - "id": "OrdRow1", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - {"type": "text", "id": "Or1Code", "content": "#EK-0087", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 110}, - {"type": "text", "id": "Or1Time", "content": "14:32", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": 90}, - {"type": "text", "id": "Or1Cust", "content": "Nguyễn Văn B", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "width": 150}, - {"type": "text", "id": "Or1Items", "content": "Combo bánh mì x2, Trà sữa x1", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": "fill_container"}, - {"type": "text", "id": "Or1Total", "content": "185,000₫", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 120}, - {"type": "frame", "id": "Or1Stat", "width": 140, "children": [{"type": "frame", "id": "Or1Badge", "fill": "#FEF3C7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "Or1BdgTx", "content": "Chờ xác nhận", "fill": "#D97706", "fontFamily": "Poppins", "fontSize": 12}]}]}, - {"type": "frame", "id": "Or1Acts", "width": 90, "layout": "horizontal", "gap": 8, "children": [ - {"type": "icon_font", "id": "Or1Eye", "iconFontFamily": "lucide", "iconFontName": "eye", "width": 18, "height": 18, "fill": "$text-secondary"}, - {"type": "icon_font", "id": "Or1More", "iconFontFamily": "lucide", "iconFontName": "more-vertical", "width": 18, "height": 18, "fill": "$text-secondary"} - ]} - ] - }, - { - "type": "frame", - "id": "OrdRow2", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - {"type": "text", "id": "Or2Code", "content": "#EK-0086", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 110}, - {"type": "text", "id": "Or2Time", "content": "14:15", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": 90}, - {"type": "text", "id": "Or2Cust", "content": "Walk-in", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "width": 150}, - {"type": "text", "id": "Or2Items", "content": "Cơm trưa đặc biệt x1", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": "fill_container"}, - {"type": "text", "id": "Or2Total", "content": "55,000₫", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 120}, - {"type": "frame", "id": "Or2Stat", "width": 140, "children": [{"type": "frame", "id": "Or2Badge", "fill": "#DBEAFE", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "Or2BdgTx", "content": "Đang chế biến", "fill": "#2563EB", "fontFamily": "Poppins", "fontSize": 12}]}]}, - {"type": "frame", "id": "Or2Acts", "width": 90, "layout": "horizontal", "gap": 8, "children": [ - {"type": "icon_font", "id": "Or2Eye", "iconFontFamily": "lucide", "iconFontName": "eye", "width": 18, "height": 18, "fill": "$text-secondary"}, - {"type": "icon_font", "id": "Or2More", "iconFontFamily": "lucide", "iconFontName": "more-vertical", "width": 18, "height": 18, "fill": "$text-secondary"} - ]} - ] - }, - { - "type": "frame", - "id": "OrdRow3", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - {"type": "text", "id": "Or3Code", "content": "#EK-0085", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 110}, - {"type": "text", "id": "Or3Time", "content": "13:50", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": 90}, - {"type": "text", "id": "Or3Cust", "content": "Trần Thị C", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "width": 150}, - {"type": "text", "id": "Or3Items", "content": "Omelette phô mai x2", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": "fill_container"}, - {"type": "text", "id": "Or3Total", "content": "120,000₫", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 120}, - {"type": "frame", "id": "Or3Stat", "width": 140, "children": [{"type": "frame", "id": "Or3Badge", "fill": "#FFEDD5", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "Or3BdgTx", "content": "Chờ lấy", "fill": "#EA580C", "fontFamily": "Poppins", "fontSize": 12}]}]}, - {"type": "frame", "id": "Or3Acts", "width": 90, "layout": "horizontal", "gap": 8, "children": [ - {"type": "icon_font", "id": "Or3Eye", "iconFontFamily": "lucide", "iconFontName": "eye", "width": 18, "height": 18, "fill": "$text-secondary"}, - {"type": "icon_font", "id": "Or3More", "iconFontFamily": "lucide", "iconFontName": "more-vertical", "width": 18, "height": 18, "fill": "$text-secondary"} - ]} - ] - }, - { - "type": "frame", - "id": "OrdRow4", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - {"type": "text", "id": "Or4Code", "content": "#EK-0084", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 110}, - {"type": "text", "id": "Or4Time", "content": "13:30", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": 90}, - {"type": "text", "id": "Or4Cust", "content": "App - Lê D", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "width": 150}, - {"type": "text", "id": "Or4Items", "content": "Bánh mì trứng x3", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": "fill_container"}, - {"type": "text", "id": "Or4Total", "content": "90,000₫", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 120}, - {"type": "frame", "id": "Or4Stat", "width": 140, "children": [{"type": "frame", "id": "Or4Badge", "fill": "#DCFCE7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "Or4BdgTx", "content": "Hoàn thành", "fill": "#16A34A", "fontFamily": "Poppins", "fontSize": 12}]}]}, - {"type": "frame", "id": "Or4Acts", "width": 90, "layout": "horizontal", "gap": 8, "children": [ - {"type": "icon_font", "id": "Or4Eye", "iconFontFamily": "lucide", "iconFontName": "eye", "width": 18, "height": 18, "fill": "$text-secondary"}, - {"type": "icon_font", "id": "Or4More", "iconFontFamily": "lucide", "iconFontName": "more-vertical", "width": 18, "height": 18, "fill": "$text-secondary"} - ]} - ] - }, - { - "type": "frame", - "id": "OrdRow5", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - {"type": "text", "id": "Or5Code", "content": "#EK-0083", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 110}, - {"type": "text", "id": "Or5Time", "content": "12:45", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": 90}, - {"type": "text", "id": "Or5Cust", "content": "Walk-in", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "width": 150}, - {"type": "text", "id": "Or5Items", "content": "Trà sữa oolong x2", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "width": "fill_container"}, - {"type": "text", "id": "Or5Total", "content": "70,000₫", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500", "width": 120}, - {"type": "frame", "id": "Or5Stat", "width": 140, "children": [{"type": "frame", "id": "Or5Badge", "fill": "#FEE2E2", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "Or5BdgTx", "content": "Đã hủy", "fill": "#DC2626", "fontFamily": "Poppins", "fontSize": 12}]}]}, - {"type": "frame", "id": "Or5Acts", "width": 90, "layout": "horizontal", "gap": 8, "children": [ - {"type": "icon_font", "id": "Or5Eye", "iconFontFamily": "lucide", "iconFontName": "eye", "width": 18, "height": 18, "fill": "$text-secondary"}, - {"type": "icon_font", "id": "Or5More", "iconFontFamily": "lucide", "iconFontName": "more-vertical", "width": 18, "height": 18, "fill": "$text-secondary"} - ]} - ] - }, - { - "type": "frame", - "id": "PaginationOrd", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - {"type": "text", "id": "PagInfoOrd", "content": "Hiển thị 1-5 / 87 đơn hàng", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}, - { - "type": "frame", - "id": "PagCtrlOrd", - "layout": "horizontal", - "gap": 4, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "PgPrevOrd", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$bg-interactive", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "IcPvOrd", "iconFontFamily": "lucide", "iconFontName": "chevron-left", "width": 16, "height": 16, "fill": "$text-secondary"}]}, - {"type": "frame", "id": "PgP1Ord", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$orange-primary", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "P1TxOrd", "content": "1", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500"}]}, - {"type": "frame", "id": "PgP2Ord", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "P2TxOrd", "content": "2", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PgP3Ord", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "P3TxOrd", "content": "3", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PgElOrd", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "ElTxOrd", "content": "...", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PgP18Ord", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "P18TxOrd", "content": "18", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PgNxtOrd", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$bg-interactive", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "IcNxOrd", "iconFontFamily": "lucide", "iconFontName": "chevron-right", "width": 16, "height": 16, "fill": "$text-secondary"}]} - ] - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": {"type": "color", "value": "#FAF8F4"}, - "bg-surface": {"type": "color", "value": "#FFFFFF"}, - "bg-elevated": {"type": "color", "value": "#FFF8F0"}, - "bg-interactive": {"type": "color", "value": "#F5EDE4"}, - "brown-primary": {"type": "color", "value": "#6B4423"}, - "brown-dark": {"type": "color", "value": "#4A2E15"}, - "orange-primary": {"type": "color", "value": "#FF6B35"}, - "orange-light": {"type": "color", "value": "#FF8A5C"}, - "text-primary": {"type": "color", "value": "#2C2C2C"}, - "text-secondary": {"type": "color", "value": "#6B6B6B"}, - "text-tertiary": {"type": "color", "value": "#9B9B9B"}, - "border-default": {"type": "color", "value": "#E5DDD4"}, - "border-subtle": {"type": "color", "value": "#F0EAE2"}, - "success": {"type": "color", "value": "#22C55E"}, - "warning": {"type": "color", "value": "#F59E0B"}, - "error": {"type": "color", "value": "#EF4444"} - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/revenue-report.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/revenue-report.pen deleted file mode 100644 index 9870a3b1..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/revenue-report.pen +++ /dev/null @@ -1,1762 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "RevenueScreen", - "x": 0, - "y": 0, - "name": "Admin/RevenueReport", - "reusable": true, - "clip": true, - "width": 1440, - "height": 1035, - "fill": "$bg-page", - "children": [ - { - "type": "frame", - "id": "SidebarRev", - "name": "Sidebar", - "width": 260, - "height": "fill_container", - "fill": "$bg-surface", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$border-default" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "LogoAreaRev", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "LogoIconRev", - "width": 48, - "height": 48, - "fill": "#FFFFFF33", - "cornerRadius": 24, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LogoTxRev", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "BrandNameRev", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "BrandSubRev", - "fill": "#FFFFFFB3", - "content": "Quản lý cửa hàng", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "NavAreaRev", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 4, - "padding": [ - 16, - 12 - ], - "children": [ - { - "type": "text", - "id": "NvLblOvRev", - "fill": "$text-tertiary", - "content": "TỔNG QUAN", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvDashRev", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcDshRev", - "width": 20, - "height": 20, - "iconFontName": "layout-dashboard", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxDshRev", - "fill": "$text-secondary", - "content": "Dashboard", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NvLblStRev", - "fill": "$text-tertiary", - "content": "CỬA HÀNG", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvOrdRev", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcOrdRev", - "width": 20, - "height": 20, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxOrdRev", - "fill": "$text-secondary", - "content": "Quản lý đơn hàng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvStfRev", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcStfRev", - "width": 20, - "height": 20, - "iconFontName": "users", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxStfRev", - "fill": "$text-secondary", - "content": "Nhân sự", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvSetRev", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcSetRev", - "width": 20, - "height": 20, - "iconFontName": "settings-2", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxSetRev", - "fill": "$text-secondary", - "content": "Cài đặt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NvLblBzRev", - "fill": "$text-tertiary", - "content": "KINH DOANH", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvRptActive", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcRptAct", - "width": 20, - "height": 20, - "iconFontName": "bar-chart-2", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "TxRptAct", - "fill": "#FFFFFF", - "content": "Báo cáo", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvLoyRev", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcLoyRev", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxLoyRev", - "fill": "$text-secondary", - "content": "Loyalty", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "UserAreaRev", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "DividerRev", - "width": "fill_container", - "height": 1, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "UserRowRev", - "width": "fill_container", - "gap": 12, - "padding": [ - 16, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "AvatarRev", - "width": 40, - "height": 40, - "fill": "$orange-primary", - "cornerRadius": 20, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "AvTxRev", - "fill": "#FFFFFF", - "content": "TN", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "UsrInfoRev", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "UsrNmRev", - "fill": "$text-primary", - "content": "Trần Nhật", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "UsrRlRev", - "fill": "$text-secondary", - "content": "Store Manager", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MainContentRev", - "name": "Main Content", - "width": "fill_container", - "height": "fill_container", - "fill": "$bg-page", - "layout": "vertical", - "gap": 20, - "padding": 32, - "children": [ - { - "type": "frame", - "id": "HeaderRev", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TitleRev", - "fill": "$text-primary", - "content": "Báo cáo & Phân tích", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "HeaderActionsRev", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "DatePickerRev", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "gap": 8, - "padding": [ - 8, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcCalRev", - "width": 18, - "height": 18, - "iconFontName": "calendar", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "DateTxRev", - "fill": "$text-primary", - "content": "01/01 - 31/01/2025", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "ExportBtnRev", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "gap": 8, - "padding": [ - 8, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcDlRev", - "width": 18, - "height": 18, - "iconFontName": "download", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "ExportTxRev", - "fill": "$text-secondary", - "content": "Xuất báo cáo", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "StatsRowRev", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "RevStatTotal", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "RevLbl1", - "fill": "$text-secondary", - "content": "Tổng doanh thu tháng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "RevVal1", - "fill": "$text-primary", - "content": "127,500,000₫", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "RevBdg1", - "fill": "#DCFCE7", - "cornerRadius": 20, - "gap": 4, - "padding": [ - 4, - 12 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RevTrUp1", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "RevChg1", - "fill": "#16A34A", - "content": "+15.3% so với tháng trước", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "RevStatOrders", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "RevLbl2", - "fill": "$text-secondary", - "content": "Tổng đơn hàng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "RevVal2", - "fill": "$text-primary", - "content": "2,450", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "RevBdg2", - "fill": "#DCFCE7", - "cornerRadius": 20, - "gap": 4, - "padding": [ - 4, - 12 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RevTrUp2", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "RevChg2", - "fill": "#16A34A", - "content": "+8.7% so với tháng trước", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "RevStatAvg", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "padding": 20, - "children": [ - { - "type": "text", - "id": "RevLbl3", - "fill": "$text-secondary", - "content": "Trung bình/ngày", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "RevVal3", - "fill": "$text-primary", - "content": "4,250,000₫", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "RevBdg3", - "fill": "#DCFCE7", - "cornerRadius": 20, - "gap": 4, - "padding": [ - 4, - 12 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RevTrUp3", - "width": 14, - "height": 14, - "iconFontName": "trending-up", - "iconFontFamily": "lucide", - "fill": "#16A34A" - }, - { - "type": "text", - "id": "RevChg3", - "fill": "#16A34A", - "content": "+12.1% so với tháng trước", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "ChartCardRev", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "frame", - "id": "ChartHeaderRev", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ChartTitleRev", - "fill": "$text-primary", - "content": "Doanh thu theo ngày", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "PeriodTabs", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": 2, - "children": [ - { - "type": "frame", - "id": "Tab7Days", - "fill": "$bg-surface", - "cornerRadius": 6, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "Tab7Tx", - "fill": "$text-primary", - "content": "7 ngày", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Tab30Days", - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "Tab30Tx", - "fill": "$text-secondary", - "content": "30 ngày", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Tab3Months", - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "Tab3MTx", - "fill": "$text-secondary", - "content": "3 tháng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "ChartBarsRev", - "width": "fill_container", - "height": 200, - "gap": 16, - "padding": [ - 10, - 20 - ], - "justifyContent": "center", - "alignItems": "end", - "children": [ - { - "type": "frame", - "id": "BarColT2", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT2", - "width": 60, - "height": 140, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT2", - "fill": "$text-secondary", - "content": "T2", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColT3", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT3", - "width": 60, - "height": 110, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT3", - "fill": "$text-secondary", - "content": "T3", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColT4", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT4", - "width": 60, - "height": 160, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT4", - "fill": "$text-secondary", - "content": "T4", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColT5", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT5", - "width": 60, - "height": 130, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT5", - "fill": "$text-secondary", - "content": "T5", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColT6", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT6", - "width": 60, - "height": 175, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT6", - "fill": "$text-secondary", - "content": "T6", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColT7", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectT7", - "width": 60, - "height": 190, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblT7", - "fill": "$text-secondary", - "content": "T7", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "BarColCN", - "layout": "vertical", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BarRectCN", - "width": 60, - "height": 95, - "cornerRadius": [ - 6, - 6, - 0, - 0 - ] - }, - { - "type": "text", - "id": "BarLblCN", - "fill": "$text-secondary", - "content": "CN", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "BottomRowRev", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "TopProductsCard", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 12, - "padding": 24, - "children": [ - { - "type": "text", - "id": "TopProdTitle", - "fill": "$text-primary", - "content": "Top 10 món bán chạy", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "TopTblHeader", - "width": "fill_container", - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TpThRank", - "fill": "$text-secondary", - "content": "#", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "TpThName", - "fill": "$text-secondary", - "content": "Tên món", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "TpThQty", - "fill": "$text-secondary", - "content": "SL bán", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "TpThRevenue", - "fill": "$text-secondary", - "content": "Doanh thu", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TpRow1", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rk1Fr", - "width": 28, - "height": 28, - "fill": "$orange-primary", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rk1Tx", - "fill": "#FFFFFF", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "Tp1Name", - "fill": "$text-primary", - "content": "Combo bánh mì đặc biệt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp1Qty", - "fill": "$text-secondary", - "content": "342", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp1Rev", - "fill": "$text-primary", - "content": "51,300,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "TpRow2", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rk2Fr", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rk2Tx", - "fill": "$text-primary", - "content": "2", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "Tp2Name", - "fill": "$text-primary", - "content": "Trà sữa oolong", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp2Qty", - "fill": "$text-secondary", - "content": "298", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp2Rev", - "fill": "$text-primary", - "content": "11,920,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "TpRow3", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rk3Fr", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rk3Tx", - "fill": "$text-primary", - "content": "3", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "Tp3Name", - "fill": "$text-primary", - "content": "Cơm trưa đặc biệt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp3Qty", - "fill": "$text-secondary", - "content": "256", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp3Rev", - "fill": "$text-primary", - "content": "14,080,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "TpRow4", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$border-subtle" - }, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rk4Fr", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rk4Tx", - "fill": "$text-primary", - "content": "4", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "Tp4Name", - "fill": "$text-primary", - "content": "Omelette phô mai", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp4Qty", - "fill": "$text-secondary", - "content": "234", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp4Rev", - "fill": "$text-primary", - "content": "14,040,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "TpRow5", - "width": "fill_container", - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rk5Fr", - "width": 28, - "height": 28, - "fill": "$bg-elevated", - "cornerRadius": 14, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Rk5Tx", - "fill": "$text-primary", - "content": "5", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "Tp5Name", - "fill": "$text-primary", - "content": "Bánh mì trứng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp5Qty", - "fill": "$text-secondary", - "content": "198", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Tp5Rev", - "fill": "$text-primary", - "content": "5,940,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "CategoryCard", - "width": 380, - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 20, - "padding": 24, - "children": [ - { - "type": "text", - "id": "CatTitle", - "fill": "$text-primary", - "content": "Phân loại danh mục", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "CatCircles", - "width": "fill_container", - "gap": 12, - "padding": [ - 16, - 0 - ], - "justifyContent": "center", - "alignItems": "end", - "children": [ - { - "type": "frame", - "id": "CircleDrink", - "width": 100, - "height": 100, - "fill": "$orange-primary", - "cornerRadius": 50, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CirDrinkTx", - "fill": "#FFFFFF", - "content": "45%", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "CircleMain", - "width": 84, - "height": 84, - "fill": "$brown-primary", - "cornerRadius": 42, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CirMainTx", - "fill": "#FFFFFF", - "content": "30%", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "CircleSnack", - "width": 68, - "height": 68, - "fill": "$orange-light", - "cornerRadius": 34, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CirSnkTx", - "fill": "#FFFFFF", - "content": "15%", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "CircleCombo", - "width": 52, - "height": 52, - "fill": "$bg-interactive", - "cornerRadius": 26, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CirCmbTx", - "fill": "$text-primary", - "content": "10%", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "bold" - } - ] - } - ] - }, - { - "type": "frame", - "id": "CatLegend", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "frame", - "id": "Leg1", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Dot1", - "width": 12, - "height": 12, - "fill": "$orange-primary", - "cornerRadius": 6 - }, - { - "type": "text", - "id": "Leg1Nm", - "fill": "$text-primary", - "content": "Đồ uống", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Leg1Vl", - "fill": "$text-secondary", - "content": "57,375,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Leg2", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Dot2", - "width": 12, - "height": 12, - "fill": "$brown-primary", - "cornerRadius": 6 - }, - { - "type": "text", - "id": "Leg2Nm", - "fill": "$text-primary", - "content": "Món chính", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Leg2Vl", - "fill": "$text-secondary", - "content": "38,250,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Leg3", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Dot3", - "width": 12, - "height": 12, - "fill": "$orange-light", - "cornerRadius": 6 - }, - { - "type": "text", - "id": "Leg3Nm", - "fill": "$text-primary", - "content": "Ăn vặt", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Leg3Vl", - "fill": "$text-secondary", - "content": "19,125,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Leg4", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Dot4", - "width": 12, - "height": 12, - "fill": "$bg-interactive", - "cornerRadius": 6 - }, - { - "type": "text", - "id": "Leg4Nm", - "fill": "$text-primary", - "content": "Combo", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Leg4Vl", - "fill": "$text-secondary", - "content": "12,750,000₫", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/staff-management.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/staff-management.pen deleted file mode 100644 index 091c2363..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/staff-management.pen +++ /dev/null @@ -1,506 +0,0 @@ -{ - "version": "2.6", - "children": [ - { - "type": "frame", - "id": "StaffScreen", - "name": "Admin/StaffManagement", - "reusable": true, - "width": 1440, - "height": 900, - "fill": "$bg-page", - "layout": "horizontal", - "clip": true, - "children": [ - { - "type": "frame", - "id": "SidebarStaff", - "name": "Sidebar", - "width": 260, - "height": "fill_container", - "fill": "$bg-surface", - "layout": "vertical", - "stroke": {"align": "inside", "fill": "$border-default", "thickness": {"right": 1}}, - "children": [ - { - "type": "frame", - "id": "LogoAreaStaff", - "name": "Logo Area", - "width": "fill_container", - "fill": {"type": "linear_gradient", "stops": [{"color": "#6B4423", "position": 0}, {"color": "#FF6B35", "position": 1}]}, - "padding": 20, - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "LogoIconStaff", - "width": 48, - "height": 48, - "cornerRadius": 24, - "fill": "#FFFFFF33", - "layout": "horizontal", - "justifyContent": "center", - "alignItems": "center", - "children": [ - {"type": "text", "id": "LogoTextStaff", "content": "EK", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 20, "fontWeight": "bold"} - ] - }, - {"type": "text", "id": "BrandNameStaff", "content": "EggyMon Kitchen", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "bold"}, - {"type": "text", "id": "BrandSubStaff", "content": "Quản lý cửa hàng", "fill": "#FFFFFFB3", "fontFamily": "Poppins", "fontSize": 11} - ] - }, - { - "type": "frame", - "id": "NavAreaStaff", - "name": "Navigation", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "padding": [16, 12], - "gap": 4, - "children": [ - {"type": "text", "id": "NavLblOverviewSt", "content": "TỔNG QUAN", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [12, 8]}, - { - "type": "frame", - "id": "NavDashSt", - "width": "fill_container", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcDashSt", "iconFontFamily": "lucide", "iconFontName": "layout-dashboard", "width": 20, "height": 20, "fill": "$text-secondary"}, - {"type": "text", "id": "TxDashSt", "content": "Dashboard", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - }, - {"type": "text", "id": "NavLblStoreSt", "content": "CỬA HÀNG", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [16, 8, 12, 8]}, - { - "type": "frame", - "id": "NavOrdersSt", - "width": "fill_container", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcOrdersSt", "iconFontFamily": "lucide", "iconFontName": "shopping-bag", "width": 20, "height": 20, "fill": "$text-secondary"}, - {"type": "text", "id": "TxOrdersSt", "content": "Quản lý đơn hàng", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - }, - { - "type": "frame", - "id": "NavStaffActive", - "name": "Nav Staff Active", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcStaffSt", "iconFontFamily": "lucide", "iconFontName": "users", "width": 20, "height": 20, "fill": "#FFFFFF"}, - {"type": "text", "id": "TxStaffSt", "content": "Nhân sự", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - }, - { - "type": "frame", - "id": "NavSettingsSt", - "width": "fill_container", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcSettingsSt", "iconFontFamily": "lucide", "iconFontName": "settings-2", "width": 20, "height": 20, "fill": "$text-secondary"}, - {"type": "text", "id": "TxSettingsSt", "content": "Cài đặt", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - }, - {"type": "text", "id": "NavLblBizSt", "content": "KINH DOANH", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "600", "letterSpacing": 1, "padding": [16, 8, 12, 8]}, - { - "type": "frame", - "id": "NavReportSt", - "width": "fill_container", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcReportSt", "iconFontFamily": "lucide", "iconFontName": "bar-chart-2", "width": 20, "height": 20, "fill": "$text-secondary"}, - {"type": "text", "id": "TxReportSt", "content": "Báo cáo", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - }, - { - "type": "frame", - "id": "NavLoyaltySt", - "width": "fill_container", - "cornerRadius": 10, - "padding": [12, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcLoyaltySt", "iconFontFamily": "lucide", "iconFontName": "gift", "width": 20, "height": 20, "fill": "$text-secondary"}, - {"type": "text", "id": "TxLoyaltySt", "content": "Loyalty", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "500"} - ] - } - ] - }, - { - "type": "frame", - "id": "UserAreaStaff", - "width": "fill_container", - "layout": "vertical", - "children": [ - {"type": "frame", "id": "DividerStaff", "width": "fill_container", "height": 1, "fill": "$border-default"}, - { - "type": "frame", - "id": "UserRowStaff", - "width": "fill_container", - "padding": [16, 20], - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "AvatarStaff", - "width": 40, - "height": 40, - "cornerRadius": 20, - "fill": "$orange-primary", - "layout": "horizontal", - "justifyContent": "center", - "alignItems": "center", - "children": [{"type": "text", "id": "AvTextStaff", "content": "TN", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "bold"}] - }, - { - "type": "frame", - "id": "UserInfoStaff", - "layout": "vertical", - "gap": 2, - "children": [ - {"type": "text", "id": "UserNameStaff", "content": "Trần Nhật", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "600"}, - {"type": "text", "id": "UserRoleStaff", "content": "Store Manager", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 12} - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MainContentStaff", - "name": "Main Content", - "width": "fill_container", - "height": "fill_container", - "fill": "$bg-page", - "layout": "vertical", - "padding": 32, - "gap": 24, - "children": [ - { - "type": "frame", - "id": "HeaderStaff", - "width": "fill_container", - "layout": "horizontal", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - {"type": "text", "id": "TitleStaff", "content": "Quản lý nhân sự", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 24, "fontWeight": "bold"}, - { - "type": "frame", - "id": "AddStaffBtn", - "fill": "$orange-primary", - "cornerRadius": 10, - "padding": [10, 20], - "layout": "horizontal", - "gap": 8, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcPlusStaff", "iconFontFamily": "lucide", "iconFontName": "plus", "width": 18, "height": 18, "fill": "#FFFFFF"}, - {"type": "text", "id": "BtnTextStaff", "content": "Thêm nhân viên", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 14, "fontWeight": "600"} - ] - } - ] - }, - { - "type": "frame", - "id": "FilterBarStaff", - "width": "fill_container", - "layout": "horizontal", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "SearchStaff", - "width": 300, - "height": 42, - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": {"align": "inside", "fill": "$border-default", "thickness": 1}, - "padding": [0, 16], - "layout": "horizontal", - "gap": 8, - "alignItems": "center", - "children": [ - {"type": "icon_font", "id": "IcSearchStaff", "iconFontFamily": "lucide", "iconFontName": "search", "width": 18, "height": 18, "fill": "$text-tertiary"}, - {"type": "text", "id": "SearchPlcStaff", "content": "Tìm kiếm nhân viên...", "fill": "$text-tertiary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - { - "type": "frame", - "id": "FilterPosition", - "width": 160, - "height": 42, - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": {"align": "inside", "fill": "$border-default", "thickness": 1}, - "padding": [0, 16], - "layout": "horizontal", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - {"type": "text", "id": "FilterPosText", "content": "Vị trí", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14}, - {"type": "icon_font", "id": "IcChevPos", "iconFontFamily": "lucide", "iconFontName": "chevron-down", "width": 16, "height": 16, "fill": "$text-tertiary"} - ] - }, - { - "type": "frame", - "id": "FilterStatus", - "width": 160, - "height": 42, - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": {"align": "inside", "fill": "$border-default", "thickness": 1}, - "padding": [0, 16], - "layout": "horizontal", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - {"type": "text", "id": "FilterStatText", "content": "Trạng thái", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14}, - {"type": "icon_font", "id": "IcChevStat", "iconFontFamily": "lucide", "iconFontName": "chevron-down", "width": 16, "height": 16, "fill": "$text-tertiary"} - ] - } - ] - }, - { - "type": "frame", - "id": "StaffTableCard", - "name": "Staff Table", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "StaffTableHeader", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": [14, 14, 0, 0], - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "children": [ - {"type": "text", "id": "StThEmployee", "content": "Nhân viên", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 220}, - {"type": "text", "id": "StThPosition", "content": "Vị trí", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 150}, - {"type": "text", "id": "StThPhone", "content": "SĐT", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 150}, - {"type": "text", "id": "StThShift", "content": "Ca làm", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": 180}, - {"type": "text", "id": "StThStatus", "content": "Trạng thái", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "600", "width": "fill_container"} - ] - }, - { - "type": "frame", - "id": "StRow1", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - { - "type": "frame", - "id": "StEmp1Cell", - "width": 220, - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "StAv1", "width": 32, "height": 32, "cornerRadius": 16, "fill": "#E8D5C4", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "StAv1Tx", "content": "NT", "fill": "$brown-primary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "bold"}]}, - {"type": "text", "id": "StName1", "content": "Nguyễn Thu", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - {"type": "text", "id": "StPos1", "content": "Pha chế", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StPhone1", "content": "0912 345 678", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StShift1", "content": "Sáng (7-14h)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 180}, - {"type": "frame", "id": "StStat1", "width": "fill_container", "children": [{"type": "frame", "id": "StBadge1", "fill": "#DCFCE7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "StBdgTx1", "content": "Đang làm", "fill": "#16A34A", "fontFamily": "Poppins", "fontSize": 12}]}]} - ] - }, - { - "type": "frame", - "id": "StRow2", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - { - "type": "frame", - "id": "StEmp2Cell", - "width": 220, - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "StAv2", "width": 32, "height": 32, "cornerRadius": 16, "fill": "#D4E0ED", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "StAv2Tx", "content": "LH", "fill": "#2563EB", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "bold"}]}, - {"type": "text", "id": "StName2", "content": "Lê Hoàng", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - {"type": "text", "id": "StPos2", "content": "Thu ngân", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StPhone2", "content": "0903 456 789", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StShift2", "content": "Chiều (14-21h)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 180}, - {"type": "frame", "id": "StStat2", "width": "fill_container", "children": [{"type": "frame", "id": "StBadge2", "fill": "#DCFCE7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "StBdgTx2", "content": "Đang làm", "fill": "#16A34A", "fontFamily": "Poppins", "fontSize": 12}]}]} - ] - }, - { - "type": "frame", - "id": "StRow3", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - { - "type": "frame", - "id": "StEmp3Cell", - "width": 220, - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "StAv3", "width": 32, "height": 32, "cornerRadius": 16, "fill": "#FEF3C7", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "StAv3Tx", "content": "PL", "fill": "#D97706", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "bold"}]}, - {"type": "text", "id": "StName3", "content": "Phạm Linh", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - {"type": "text", "id": "StPos3", "content": "Phục vụ", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StPhone3", "content": "0987 654 321", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StShift3", "content": "Tối (17-23h)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 180}, - {"type": "frame", "id": "StStat3", "width": "fill_container", "children": [{"type": "frame", "id": "StBadge3", "fill": "#FEF3C7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "StBdgTx3", "content": "Nghỉ phép", "fill": "#D97706", "fontFamily": "Poppins", "fontSize": 12}]}]} - ] - }, - { - "type": "frame", - "id": "StRow4", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - { - "type": "frame", - "id": "StEmp4Cell", - "width": 220, - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "StAv4", "width": 32, "height": 32, "cornerRadius": 16, "fill": "#E8D5C4", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "StAv4Tx", "content": "TK", "fill": "$brown-primary", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "bold"}]}, - {"type": "text", "id": "StName4", "content": "Trần Kiên", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - {"type": "text", "id": "StPos4", "content": "Bếp trưởng", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StPhone4", "content": "0934 567 890", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StShift4", "content": "Sáng (7-14h)", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 180}, - {"type": "frame", "id": "StStat4", "width": "fill_container", "children": [{"type": "frame", "id": "StBadge4", "fill": "#DCFCE7", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "StBdgTx4", "content": "Đang làm", "fill": "#16A34A", "fontFamily": "Poppins", "fontSize": 12}]}]} - ] - }, - { - "type": "frame", - "id": "StRow5", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "alignItems": "center", - "stroke": {"align": "inside", "fill": "$border-subtle", "thickness": {"bottom": 1}}, - "children": [ - { - "type": "frame", - "id": "StEmp5Cell", - "width": 220, - "layout": "horizontal", - "gap": 12, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "StAv5", "width": 32, "height": 32, "cornerRadius": 16, "fill": "#DBEAFE", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "StAv5Tx", "content": "NN", "fill": "#2563EB", "fontFamily": "Poppins", "fontSize": 11, "fontWeight": "bold"}]}, - {"type": "text", "id": "StName5", "content": "Ngô Ngọc", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14} - ] - }, - {"type": "text", "id": "StPos5", "content": "Phục vụ", "fill": "$text-primary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StPhone5", "content": "0967 890 123", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 150}, - {"type": "text", "id": "StShift5", "content": "Toàn thời gian", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 14, "width": 180}, - {"type": "frame", "id": "StStat5", "width": "fill_container", "children": [{"type": "frame", "id": "StBadge5", "fill": "#DBEAFE", "cornerRadius": 20, "padding": [4, 12], "children": [{"type": "text", "id": "StBdgTx5", "content": "Thử việc", "fill": "#2563EB", "fontFamily": "Poppins", "fontSize": 12}]}]} - ] - }, - { - "type": "frame", - "id": "PaginationStaff", - "width": "fill_container", - "padding": [14, 20], - "layout": "horizontal", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - {"type": "text", "id": "PagInfoStaff", "content": "Hiển thị 1-5 / 12 nhân viên", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}, - { - "type": "frame", - "id": "PagCtrlStaff", - "layout": "horizontal", - "gap": 4, - "alignItems": "center", - "children": [ - {"type": "frame", "id": "PagPrevSt", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$bg-interactive", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "IcPrevSt", "iconFontFamily": "lucide", "iconFontName": "chevron-left", "width": 16, "height": 16, "fill": "$text-secondary"}]}, - {"type": "frame", "id": "PagPage1St", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$orange-primary", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Pg1TxSt", "content": "1", "fill": "#FFFFFF", "fontFamily": "Poppins", "fontSize": 13, "fontWeight": "500"}]}, - {"type": "frame", "id": "PagPage2St", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Pg2TxSt", "content": "2", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PagPage3St", "width": 32, "height": 32, "cornerRadius": 8, "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Pg3TxSt", "content": "3", "fill": "$text-secondary", "fontFamily": "Poppins", "fontSize": 13}]}, - {"type": "frame", "id": "PagNextSt", "width": 32, "height": 32, "cornerRadius": 8, "fill": "$bg-interactive", "layout": "horizontal", "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "IcNextSt", "iconFontFamily": "lucide", "iconFontName": "chevron-right", "width": 16, "height": 16, "fill": "$text-secondary"}]} - ] - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": {"type": "color", "value": "#FAF8F4"}, - "bg-surface": {"type": "color", "value": "#FFFFFF"}, - "bg-elevated": {"type": "color", "value": "#FFF8F0"}, - "bg-interactive": {"type": "color", "value": "#F5EDE4"}, - "brown-primary": {"type": "color", "value": "#6B4423"}, - "brown-dark": {"type": "color", "value": "#4A2E15"}, - "orange-primary": {"type": "color", "value": "#FF6B35"}, - "orange-light": {"type": "color", "value": "#FF8A5C"}, - "text-primary": {"type": "color", "value": "#2C2C2C"}, - "text-secondary": {"type": "color", "value": "#6B6B6B"}, - "text-tertiary": {"type": "color", "value": "#9B9B9B"}, - "border-default": {"type": "color", "value": "#E5DDD4"}, - "border-subtle": {"type": "color", "value": "#F0EAE2"}, - "success": {"type": "color", "value": "#22C55E"}, - "warning": {"type": "color", "value": "#F59E0B"}, - "error": {"type": "color", "value": "#EF4444"} - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/store-settings.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/store-settings.pen deleted file mode 100644 index eac8e951..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/admin/store-settings.pen +++ /dev/null @@ -1,2002 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "SettingsScreen", - "x": 0, - "y": 0, - "name": "Admin/StoreSettings", - "reusable": true, - "clip": true, - "width": 1440, - "height": 1192, - "fill": "$bg-page", - "children": [ - { - "type": "frame", - "id": "SidebarSettings", - "name": "Sidebar", - "width": 260, - "height": "fill_container", - "fill": "$bg-surface", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$border-default" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "LogoAreaSet", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "LogoIconSet", - "width": 48, - "height": 48, - "fill": "#FFFFFF33", - "cornerRadius": 24, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LogoTxSet", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "BrandNameSet", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "BrandSubSet", - "fill": "#FFFFFFB3", - "content": "Quản lý cửa hàng", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "NavAreaSet", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 4, - "padding": [ - 16, - 12 - ], - "children": [ - { - "type": "text", - "id": "NvLblOvSet", - "fill": "$text-tertiary", - "content": "TỔNG QUAN", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvDashSet", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcDshSet", - "width": 20, - "height": 20, - "iconFontName": "layout-dashboard", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxDshSet", - "fill": "$text-secondary", - "content": "Dashboard", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NvLblStSet", - "fill": "$text-tertiary", - "content": "CỬA HÀNG", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvOrdSet", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcOrdSet", - "width": 20, - "height": 20, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxOrdSet", - "fill": "$text-secondary", - "content": "Quản lý đơn hàng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvStfSet", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcStfSet", - "width": 20, - "height": 20, - "iconFontName": "users", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxStfSet", - "fill": "$text-secondary", - "content": "Nhân sự", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvSetActive", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcSetAct", - "width": 20, - "height": 20, - "iconFontName": "settings-2", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "TxSetAct", - "fill": "#FFFFFF", - "content": "Cài đặt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "NvLblBzSet", - "fill": "$text-tertiary", - "content": "KINH DOANH", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "NvRptSet", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcRptSet", - "width": 20, - "height": 20, - "iconFontName": "bar-chart-2", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxRptSet", - "fill": "$text-secondary", - "content": "Báo cáo", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NvLoySet", - "width": "fill_container", - "cornerRadius": 10, - "gap": 12, - "padding": [ - 12, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcLoySet", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TxLoySet", - "fill": "$text-secondary", - "content": "Loyalty", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "UserAreaSet", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "DividerSet", - "width": "fill_container", - "height": 1, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "UserRowSet", - "width": "fill_container", - "gap": 12, - "padding": [ - 16, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "AvatarSet", - "width": 40, - "height": 40, - "fill": "$orange-primary", - "cornerRadius": 20, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "AvTxSet", - "fill": "#FFFFFF", - "content": "TN", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "UsrInfoSet", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "UsrNmSet", - "fill": "$text-primary", - "content": "Trần Nhật", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "UsrRlSet", - "fill": "$text-secondary", - "content": "Store Manager", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MainContentSet", - "name": "Main Content", - "width": "fill_container", - "height": "fill_container", - "fill": "$bg-page", - "layout": "vertical", - "gap": 24, - "padding": 32, - "children": [ - { - "type": "frame", - "id": "HeaderSet", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TitleSet", - "fill": "$text-primary", - "content": "Cài đặt cửa hàng", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - }, - { - "type": "frame", - "id": "SaveBtnSet", - "fill": "$orange-primary", - "cornerRadius": 10, - "gap": 8, - "padding": [ - 10, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcSaveSet", - "width": 18, - "height": 18, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "SaveTxSet", - "fill": "#FFFFFF", - "content": "Lưu thay đổi", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "TwoColLayout", - "width": "fill_container", - "height": "fill_container", - "gap": 24, - "children": [ - { - "type": "frame", - "id": "LeftColSet", - "width": "fill_container", - "layout": "vertical", - "gap": 24, - "children": [ - { - "type": "frame", - "id": "StoreInfoCard", - "name": "Store Info", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 20, - "padding": 24, - "children": [ - { - "type": "text", - "id": "InfoTitle", - "fill": "$text-primary", - "content": "Thông tin cửa hàng", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "InputName", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblName", - "fill": "$text-secondary", - "content": "Tên cửa hàng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldName", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValName", - "fill": "$text-primary", - "content": "EggyMon Kitchen - Chi nhánh 1", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "InputAddr", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblAddr", - "fill": "$text-secondary", - "content": "Địa chỉ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldAddr", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValAddr", - "fill": "$text-primary", - "content": "123 Nguyễn Huệ, Q.1, TP.HCM", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "InputRowPhEmail", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "InputPhone", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblPhone", - "fill": "$text-secondary", - "content": "Số điện thoại", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldPhone", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValPhone", - "fill": "$text-primary", - "content": "0912 345 678", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "InputEmail", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblEmail", - "fill": "$text-secondary", - "content": "Email", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldEmail", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValEmail", - "fill": "$text-primary", - "content": "chinhanh1@eggymon.vn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "HoursCard", - "name": "Opening Hours", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "HoursTitle", - "fill": "$text-primary", - "content": "Giờ hoạt động", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "DayMon", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblMon", - "fill": "$text-primary", - "content": "Thứ 2", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeMon", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartMon", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsMonVal", - "fill": "$text-primary", - "content": "07:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepMon", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndMon", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeMonVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleMon", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotMon", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DayTue", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblTue", - "fill": "$text-primary", - "content": "Thứ 3", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeTue", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartTue", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsTueVal", - "fill": "$text-primary", - "content": "07:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepTue", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndTue", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeTueVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleTue", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotTue", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DayWed", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblWed", - "fill": "$text-primary", - "content": "Thứ 4", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeWed", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartWed", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsWedVal", - "fill": "$text-primary", - "content": "07:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepWed", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndWed", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeWedVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleWed", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotWed", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DayThu", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblThu", - "fill": "$text-primary", - "content": "Thứ 5", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeThu", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartThu", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsThuVal", - "fill": "$text-primary", - "content": "07:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepThu", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndThu", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeThuVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleThu", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotThu", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DayFri", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblFri", - "fill": "$text-primary", - "content": "Thứ 6", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeFri", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartFri", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsFriVal", - "fill": "$text-primary", - "content": "07:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepFri", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndFri", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeFriVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleFri", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotFri", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DaySat", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblSat", - "fill": "$text-primary", - "content": "Thứ 7", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeSat", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartSat", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsSatVal", - "fill": "$text-primary", - "content": "08:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepSat", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndSat", - "width": 80, - "height": 36, - "fill": "$bg-page", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeSatVal", - "fill": "$text-primary", - "content": "22:00", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleSat", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotSat", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "DaySun", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "DayLblSun", - "fill": "$text-tertiary", - "content": "Chủ nhật", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TimeSun", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TmStartSun", - "width": 80, - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TsSunVal", - "fill": "$text-tertiary", - "content": "--:--", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "TmSepSun", - "fill": "$text-tertiary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "TmEndSun", - "width": 80, - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TeSunVal", - "fill": "$text-tertiary", - "content": "--:--", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToggleSun", - "width": 44, - "height": 24, - "fill": "$border-default", - "cornerRadius": 12, - "padding": [ - 0, - 2 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TogDotSun", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "RightColSet", - "width": 380, - "layout": "vertical", - "gap": 24, - "children": [ - { - "type": "frame", - "id": "StoreImageArea", - "width": "fill_container", - "height": 200, - "fill": "$bg-interactive", - "cornerRadius": 14, - "layout": "vertical", - "gap": 8, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcImgUpload", - "width": 48, - "height": 48, - "iconFontName": "image", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "UploadText", - "fill": "$text-tertiary", - "content": "Tải ảnh cửa hàng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "UploadHint", - "fill": "$text-tertiary", - "content": "PNG, JPG (tối đa 5MB)", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "SocialCard", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "SocialTitle", - "fill": "$text-primary", - "content": "Mạng xã hội", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "InputFb", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblFb", - "fill": "$text-secondary", - "content": "Facebook", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldFb", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValFb", - "fill": "$text-tertiary", - "content": "facebook.com/eggymonkitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "InputIg", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblIg", - "fill": "$text-secondary", - "content": "Instagram", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldIg", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValIg", - "fill": "$text-tertiary", - "content": "@eggymonkitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "InputTk", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblTk", - "fill": "$text-secondary", - "content": "TikTok", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldTk", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValTk", - "fill": "$text-tertiary", - "content": "@eggymonkitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "TaxPayCard", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 14, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "TaxTitle", - "fill": "$text-primary", - "content": "Thuế & Thanh toán", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "InputTax", - "width": "fill_container", - "layout": "vertical", - "gap": 6, - "children": [ - { - "type": "text", - "id": "LblTax", - "fill": "$text-secondary", - "content": "Thuế suất", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "FldTax", - "width": "fill_container", - "height": 42, - "fill": "$bg-page", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ValTax", - "fill": "$text-primary", - "content": "10%", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "LblPayMethod", - "fill": "$text-secondary", - "content": "Phương thức thanh toán", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "CheckboxGroup", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "frame", - "id": "CbCash", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CbCashBox", - "width": 20, - "height": 20, - "fill": "$orange-primary", - "cornerRadius": 4, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcCbCash", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "text", - "id": "CbCashTx", - "fill": "$text-primary", - "content": "Tiền mặt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "CbTransfer", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CbTransBox", - "width": 20, - "height": 20, - "fill": "$orange-primary", - "cornerRadius": 4, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcCbTrans", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "text", - "id": "CbTransTx", - "fill": "$text-primary", - "content": "Chuyển khoản", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "CbEwallet", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CbEwalBox", - "width": 20, - "height": 20, - "fill": "$orange-primary", - "cornerRadius": 4, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "IcCbEwal", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "text", - "id": "CbEwalTx", - "fill": "$text-primary", - "content": "Ví điện tử (MoMo, ZaloPay)", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "CbCard", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CbCardBox", - "width": 20, - "height": 20, - "cornerRadius": 4, - "stroke": { - "align": "inside", - "thickness": 1.5, - "fill": "$border-default" - } - }, - { - "type": "text", - "id": "CbCardTx", - "fill": "$text-primary", - "content": "Thẻ tín dụng/ghi nợ", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/forgot-password.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/forgot-password.pen deleted file mode 100644 index 05174385..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/forgot-password.pen +++ /dev/null @@ -1,259 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "ForgotScreen", - "x": 0, - "y": 0, - "name": "Auth/ForgotPassword", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "gap": 32, - "padding": [ - 56, - 24, - 32, - 24 - ], - "children": [ - { - "type": "frame", - "id": "ForgotTopBar", - "width": "fill_container", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ForgotBackBtn", - "width": 40, - "height": 40, - "fill": "$bg-elevated", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ForgotBackIcon", - "width": 20, - "height": 20, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ForgotContent", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": [ - 0, - 32 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ForgotIconWrap", - "width": 80, - "height": 80, - "fill": "$bg-elevated", - "cornerRadius": 20, - "layout": "vertical", - "padding": 20, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ForgotKeyIcon", - "width": 40, - "height": 40, - "iconFontName": "key", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "text", - "id": "ForgotTitle", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Quên mật khẩu?", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 26, - "fontWeight": "700" - }, - { - "type": "text", - "id": "ForgotSubtitle", - "fill": "$text-secondary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Nhập email hoặc số điện thoại để nhận mã xác nhận", - "lineHeight": 1.4, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "ForgotForm", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "ForgotEmailField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ForgotEmailIcon", - "width": 20, - "height": 20, - "iconFontName": "mail", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "ForgotEmailPlaceholder", - "fill": "$text-tertiary", - "content": "Email hoặc số điện thoại", - "fontFamily": "Poppins", - "fontSize": 15 - } - ] - }, - { - "type": "frame", - "id": "ForgotButton", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ForgotButtonText", - "fill": "#FFFFFF", - "content": "Gửi mã xác nhận", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ForgotSpacer", - "width": 1, - "height": "fill_container" - }, - { - "type": "text", - "id": "ForgotFooterLink", - "fill": "$orange-primary", - "content": "Quay lại đăng nhập", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/login.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/login.pen deleted file mode 100644 index 08335fa4..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/login.pen +++ /dev/null @@ -1,429 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "LoginScreen", - "x": 0, - "y": 0, - "name": "Auth/Login", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "gap": 24, - "padding": [ - 56, - 24, - 32, - 24 - ], - "children": [ - { - "type": "frame", - "id": "LoginHeader", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "LoginLogo", - "width": 64, - "height": 64, - "fill": "$brown-primary", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LoginLogoText", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - } - ] - }, - { - "type": "text", - "id": "LoginTitle", - "fill": "$text-primary", - "content": "Chào mừng trở lại!", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 26, - "fontWeight": "700" - }, - { - "type": "text", - "id": "LoginSubtitle", - "fill": "$text-secondary", - "content": "Đăng nhập vào EggyMon Kitchen", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "LoginForm", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "LoginEmailField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "LoginEmailIcon", - "width": 20, - "height": 20, - "iconFontName": "mail", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "LoginEmailPlaceholder", - "fill": "$text-tertiary", - "content": "Email hoặc số điện thoại", - "fontFamily": "Poppins", - "fontSize": 15 - } - ] - }, - { - "type": "frame", - "id": "LoginPasswordField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "LoginPasswordIcon", - "width": 20, - "height": 20, - "iconFontName": "lock", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "LoginPasswordPlaceholder", - "fill": "$text-tertiary", - "content": "Mật khẩu", - "fontFamily": "Poppins", - "fontSize": 15 - }, - { - "type": "icon_font", - "id": "LoginPasswordEye", - "width": 20, - "height": 20, - "iconFontName": "eye-off", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - } - ] - }, - { - "type": "text", - "id": "LoginForgotLink", - "fill": "$orange-primary", - "content": "Quên mật khẩu?", - "textAlign": "right", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "LoginActions", - "width": "fill_container", - "layout": "vertical", - "gap": 20, - "children": [ - { - "type": "frame", - "id": "LoginButton", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LoginButtonText", - "fill": "#FFFFFF", - "content": "Đăng nhập", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "LoginDivider", - "width": "fill_container", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "LoginDividerLeft", - "width": "fill_container", - "height": 1, - "fill": "$border-default" - }, - { - "type": "text", - "id": "LoginDividerText", - "fill": "$text-tertiary", - "content": "hoặc", - "fontFamily": "Poppins", - "fontSize": 13 - }, - { - "type": "frame", - "id": "LoginDividerRight", - "width": "fill_container", - "height": 1, - "fill": "$border-default" - } - ] - }, - { - "type": "frame", - "id": "LoginSocialRow", - "width": "fill_container", - "gap": 16, - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "LoginGoogleBtn", - "width": 52, - "height": 52, - "fill": "#FFFFFF", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "kUZ2H", - "name": "googleG", - "fill": "#EA4335", - "content": "G", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "700" - } - ] - }, - { - "type": "frame", - "id": "LoginFacebookBtn", - "width": 52, - "height": 52, - "fill": "#FFFFFF", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Ul8Tr", - "name": "facebookIcon", - "width": 22, - "height": 22, - "iconFontName": "facebook", - "iconFontFamily": "lucide", - "fill": "#1877F2" - } - ] - }, - { - "type": "frame", - "id": "LoginAppleBtn", - "width": 52, - "height": 52, - "fill": "#FFFFFF", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "d2CMB", - "name": "appleIcon", - "width": 22, - "height": 22, - "iconFontName": "apple", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "LoginSpacer", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "LoginFooter", - "gap": 4, - "justifyContent": "center", - "children": [ - { - "type": "text", - "id": "LoginFooterText", - "fill": "$text-secondary", - "content": "Chưa có tài khoản?", - "fontFamily": "Poppins", - "fontSize": 14 - }, - { - "type": "text", - "id": "LoginFooterLink", - "fill": "$orange-primary", - "content": "Đăng ký ngay", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/otp-verify.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/otp-verify.pen deleted file mode 100644 index 77edbd1a..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/otp-verify.pen +++ /dev/null @@ -1,357 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "OtpScreen", - "x": 0, - "y": 0, - "name": "Auth/OtpVerify", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "gap": 24, - "padding": [ - 56, - 24, - 32, - 24 - ], - "children": [ - { - "type": "frame", - "id": "OtpTopBar", - "width": "fill_container", - "padding": [ - 0, - 0, - 16, - 0 - ], - "children": [ - { - "type": "frame", - "id": "OtpBackBtn", - "width": 40, - "height": 40, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 1, - "fill": "#000000" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "OtpBackIcon", - "width": 20, - "height": 20, - "iconFontName": "chevron-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - } - ] - }, - { - "type": "frame", - "id": "OtpContent", - "width": "fill_container", - "layout": "vertical", - "gap": 20, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "OtpIconWrap", - "width": 80, - "height": 80, - "fill": "$bg-elevated", - "cornerRadius": 20, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "OtpShieldIcon", - "width": 40, - "height": 40, - "iconFontName": "shield-check", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "text", - "id": "OtpTitle", - "fill": "$text-primary", - "content": "Nhập mã xác nhận", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 26, - "fontWeight": "700" - }, - { - "type": "text", - "id": "OtpSubtitle", - "fill": "$text-secondary", - "content": "Mã OTP đã được gửi đến 0912***456", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "OtpInputRow", - "width": "fill_container", - "gap": 12, - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "OtpBox1", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 2, - "fill": "$orange-primary" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OtpDigit1", - "fill": "$text-primary", - "content": "4", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "OtpBox2", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 2, - "fill": "$orange-primary" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OtpDigit2", - "fill": "$text-primary", - "content": "7", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "OtpBox3", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 2, - "fill": "$orange-primary" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OtpDigit3", - "fill": "$text-primary", - "content": "2", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "OtpBox4", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 1.5, - "fill": "#000000" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center" - }, - { - "type": "frame", - "id": "OtpBox5", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 1.5, - "fill": "#000000" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center" - }, - { - "type": "frame", - "id": "OtpBox6", - "width": 52, - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 1.5, - "fill": "#000000" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center" - } - ] - }, - { - "type": "text", - "id": "OtpTimer", - "fill": "$text-secondary", - "content": "Gửi lại mã sau 00:45", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 13 - }, - { - "type": "frame", - "id": "OtpButton", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OtpButtonText", - "fill": "#FFFFFF", - "content": "Xác nhận", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "OtpResendLink", - "fill": "$orange-primary", - "content": "Gửi lại mã OTP", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "OtpSpacer", - "width": 1, - "height": "fill_container" - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/pin-entry.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/pin-entry.pen deleted file mode 100644 index 5da7ab00..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/pin-entry.pen +++ /dev/null @@ -1,562 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "PinScreen", - "x": 0, - "y": 0, - "name": "Auth/PinEntry", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "gap": 32, - "padding": [ - 56, - 24, - 32, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "PinHeader", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "PinLogo", - "width": 64, - "height": 64, - "fill": "$brown-primary", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PinLogoText", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - } - ] - }, - { - "type": "text", - "id": "PinTitle", - "fill": "$text-primary", - "content": "Nhập mã PIN", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 26, - "fontWeight": "700" - }, - { - "type": "text", - "id": "PinSubtitle", - "fill": "$text-secondary", - "content": "Nhập mã PIN 6 số để truy cập", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "PinDotsRow", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "PinDot1", - "width": 16, - "height": 16, - "fill": "$orange-primary", - "cornerRadius": 8 - }, - { - "type": "frame", - "id": "PinDot2", - "width": 16, - "height": 16, - "fill": "$orange-primary", - "cornerRadius": 8 - }, - { - "type": "frame", - "id": "PinDot3", - "width": 16, - "height": 16, - "fill": "$orange-primary", - "cornerRadius": 8 - }, - { - "type": "frame", - "id": "PinDot4", - "width": 16, - "height": 16, - "fill": "$border-default", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 2, - "fill": "$border-default" - } - }, - { - "type": "frame", - "id": "PinDot5", - "width": 16, - "height": 16, - "fill": "$border-default", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 2, - "fill": "$border-default" - } - }, - { - "type": "frame", - "id": "PinDot6", - "width": 16, - "height": 16, - "fill": "$border-default", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 2, - "fill": "$border-default" - } - } - ] - }, - { - "type": "frame", - "id": "PinSpacer", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "PinNumpad", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "PinRow1", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "PinKey1", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "3UVCU", - "name": "num1", - "fill": "$text-primary", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey2", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "q1PUd", - "name": "num2", - "fill": "$text-primary", - "content": "2", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey3", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Fq93Z", - "name": "num3", - "fill": "$text-primary", - "content": "3", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "PinRow2", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "PinKey4", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "GUYyP", - "name": "num4", - "fill": "$text-primary", - "content": "4", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey5", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ryXMU", - "name": "num5", - "fill": "$text-primary", - "content": "5", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey6", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "KEWRy", - "name": "num6", - "fill": "$text-primary", - "content": "6", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "PinRow3", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "PinKey7", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dyDQH", - "name": "num7", - "fill": "$text-primary", - "content": "7", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey8", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Kzfef", - "name": "num8", - "fill": "$text-primary", - "content": "8", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKey9", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "bXeXd", - "name": "num9", - "fill": "$text-primary", - "content": "9", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "PinRow4", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "PinKeyDelete", - "width": 72, - "height": 72, - "fill": "$bg-interactive", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "xjJtr", - "name": "delIcon", - "width": 24, - "height": 24, - "iconFontName": "delete", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - } - ] - }, - { - "type": "frame", - "id": "PinKey0", - "width": 72, - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Ra3cU", - "name": "num0", - "fill": "$text-primary", - "content": "0", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PinKeyEnter", - "width": 72, - "height": 72, - "fill": "$orange-primary", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "hzhLh", - "name": "enterIcon", - "width": 24, - "height": 24, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "PinFooter", - "gap": 16, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PinSwitchUser", - "fill": "$orange-primary", - "content": "Đổi người dùng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "PinFooterDivider", - "width": 1, - "height": 16, - "fill": "$border-default" - }, - { - "type": "text", - "id": "PinForgotPin", - "fill": "$orange-primary", - "content": "Quên PIN?", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/register.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/register.pen deleted file mode 100644 index 2307da3b..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/auth/register.pen +++ /dev/null @@ -1,415 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "RegisterScreen", - "x": 0, - "y": 0, - "name": "Auth/Register", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "gap": 20, - "padding": [ - 48, - 24, - 32, - 24 - ], - "children": [ - { - "type": "frame", - "id": "RegisterHeader", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "RegisterLogo", - "width": 64, - "height": 64, - "fill": "$brown-primary", - "cornerRadius": 16, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "RegisterLogoText", - "fill": "#FFFFFF", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - } - ] - }, - { - "type": "text", - "id": "RegisterTitle", - "fill": "$text-primary", - "content": "Tạo tài khoản", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 26, - "fontWeight": "700" - }, - { - "type": "text", - "id": "RegisterSubtitle", - "fill": "$text-secondary", - "content": "Đăng ký để nhận ưu đãi đặc biệt", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "RegisterForm", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "RegisterNameField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RegisterNameIcon", - "width": 20, - "height": 20, - "iconFontName": "user", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "RegisterNamePlaceholder", - "fill": "$text-tertiary", - "content": "Họ và tên", - "fontFamily": "Poppins", - "fontSize": 15 - } - ] - }, - { - "type": "frame", - "id": "RegisterEmailField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RegisterEmailIcon", - "width": 20, - "height": 20, - "iconFontName": "mail", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "RegisterEmailPlaceholder", - "fill": "$text-tertiary", - "content": "Email", - "fontFamily": "Poppins", - "fontSize": 15 - } - ] - }, - { - "type": "frame", - "id": "RegisterPhoneField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RegisterPhoneIcon", - "width": 20, - "height": 20, - "iconFontName": "phone", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "RegisterPhonePlaceholder", - "fill": "$text-tertiary", - "content": "Số điện thoại", - "fontFamily": "Poppins", - "fontSize": 15 - } - ] - }, - { - "type": "frame", - "id": "RegisterPasswordField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 8, - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RegisterPasswordIcon", - "width": 20, - "height": 20, - "iconFontName": "lock", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "RegisterPasswordPlaceholder", - "fill": "$text-tertiary", - "content": "Mật khẩu", - "fontFamily": "Poppins", - "fontSize": 15 - }, - { - "type": "icon_font", - "id": "RegisterPasswordEye", - "width": 20, - "height": 20, - "iconFontName": "eye-off", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - } - ] - }, - { - "type": "frame", - "id": "RegisterConfirmField", - "width": "fill_container", - "height": 52, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 8, - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RegisterConfirmIcon", - "width": 20, - "height": 20, - "iconFontName": "lock", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "RegisterConfirmPlaceholder", - "fill": "$text-tertiary", - "content": "Xác nhận mật khẩu", - "fontFamily": "Poppins", - "fontSize": 15 - }, - { - "type": "icon_font", - "id": "RegisterConfirmEye", - "width": 20, - "height": 20, - "iconFontName": "eye-off", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - } - ] - } - ] - }, - { - "type": "frame", - "id": "RegisterTermsRow", - "width": "fill_container", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "RegisterCheckbox", - "width": 22, - "height": 22, - "fill": "$bg-elevated", - "cornerRadius": 4, - "stroke": { - "thickness": 1.5, - "fill": "$text-tertiary" - } - }, - { - "type": "text", - "id": "RegisterTermsText", - "fill": "$text-secondary", - "content": "Tôi đồng ý với Điều khoản sử dụng", - "fontFamily": "Poppins", - "fontSize": 13 - } - ] - }, - { - "type": "frame", - "id": "RegisterButton", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "RegisterButtonText", - "fill": "#FFFFFF", - "content": "Đăng ký", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "RegisterSpacer", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "RegisterFooter", - "gap": 4, - "justifyContent": "center", - "children": [ - { - "type": "text", - "id": "RegisterFooterText", - "fill": "$text-secondary", - "content": "Đã có tài khoản?", - "fontFamily": "Poppins", - "fontSize": 14 - }, - { - "type": "text", - "id": "RegisterFooterLink", - "fill": "$orange-primary", - "content": "Đăng nhập", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-mobile.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-mobile.pen deleted file mode 100644 index 940e7b9b..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-mobile.pen +++ /dev/null @@ -1,1395 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "mob01", - "x": 0, - "y": 0, - "name": "Eggymon Kitchen Landing Page — Mobile", - "width": 390, - "fill": "#FAF8F4", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "mobHdr", - "name": "Header", - "width": "fill_container", - "height": 64, - "fill": "#FFFFFF", - "padding": [ - 0, - 20 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobLogo", - "name": "Logo Area", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobLogoImg", - "name": "headerLogo", - "width": 36, - "height": 36, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "mobLogoTxt", - "name": "logoText", - "fill": "#6B4423", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "mobMenu", - "name": "Hamburger Menu", - "width": 40, - "height": 40, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mobMenuIcon", - "name": "menuIcon", - "width": 24, - "height": 24, - "iconFontName": "menu", - "iconFontFamily": "lucide", - "fill": "#2C2C2C" - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobHero", - "name": "Hero Section", - "width": "fill_container", - "fill": "#6B4423", - "layout": "vertical", - "gap": 24, - "padding": [ - 48, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobHeroImg", - "name": "Hero Image", - "width": "fill_container", - "height": 240, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/eggymon-kitchen-store.png", - "mode": "fill" - }, - "cornerRadius": 16 - }, - { - "type": "frame", - "id": "mobHeroContent", - "name": "Hero Content", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobBadge", - "name": "badge", - "fill": "#FF6B35", - "cornerRadius": 16, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "mobBadgeTxt", - "name": "badgeText", - "fill": "#FFFFFF", - "content": "🥚 Open 24/7", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "mobHeadline", - "name": "headline", - "fill": "#FFFFFF", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Egg-cellent Food,\nMade With Love", - "lineHeight": 1.15, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 32, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "mobSubline", - "name": "subline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Your neighborhood comfort food destination. Fluffy omelettes to savory rice bowls, around the clock.", - "lineHeight": 1.6, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "mobCtaRow", - "name": "CTA Row", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobPrimBtn", - "name": "primaryBtn", - "width": "fill_container", - "fill": "#FF6B35", - "cornerRadius": 30, - "padding": [ - 16, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobPrimTxt", - "name": "primaryText", - "fill": "#FFFFFF", - "content": "View Our Menu", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "mobSecBtn", - "name": "secondaryBtn", - "width": "fill_container", - "fill": "transparent", - "cornerRadius": 30, - "stroke": { - "thickness": 2, - "fill": "#FFFFFF" - }, - "padding": [ - 16, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobSecTxt", - "name": "secondaryText", - "fill": "#FFFFFF", - "content": "Order Online", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobFeat", - "name": "Features Section", - "width": "fill_container", - "fill": "#FFFFFF", - "layout": "vertical", - "gap": 32, - "padding": [ - 48, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobFeatHdr", - "name": "Features Header", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobFeatTag", - "name": "featTag", - "fill": "#FF6B35", - "content": "Why Choose Us", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "mobFeatTitle", - "name": "featTitle", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Made With Love,\nServed Fresh Daily", - "lineHeight": 1.15, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 28, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "mobFeatGrid", - "name": "Features Grid", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "mobF1", - "name": "feat1", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "gap": 12, - "padding": 24, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobF1Ico", - "name": "feat1Icon", - "width": 52, - "height": 52, - "fill": "#FF6B3520", - "cornerRadius": 26, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mobF1IcoIn", - "name": "feat1IconInner", - "width": 24, - "height": 24, - "iconFontName": "clock-3", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "frame", - "id": "mobF1Body", - "name": "feat1Body", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "mobF1Ttl", - "name": "feat1Title", - "fill": "#2C2C2C", - "content": "Open 24/7", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobF1Desc", - "name": "feat1Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Fresh food, any time of day or night.", - "lineHeight": 1.5, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobF2", - "name": "feat2", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "gap": 12, - "padding": 24, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobF2Ico", - "name": "feat2Icon", - "width": 52, - "height": 52, - "fill": "#FF6B3520", - "cornerRadius": 26, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mobF2IcoIn", - "name": "feat2IconInner", - "width": 24, - "height": 24, - "iconFontName": "egg", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "frame", - "id": "mobF2Body", - "name": "feat2Body", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "mobF2Ttl", - "name": "feat2Title", - "fill": "#2C2C2C", - "content": "Farm Fresh Eggs", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobF2Desc", - "name": "feat2Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Sourced from local farms daily for the freshest taste.", - "lineHeight": 1.5, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobF3", - "name": "feat3", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "gap": 12, - "padding": 24, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobF3Ico", - "name": "feat3Icon", - "width": 52, - "height": 52, - "fill": "#FF6B3520", - "cornerRadius": 26, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mobF3IcoIn", - "name": "feat3IconInner", - "width": 24, - "height": 24, - "iconFontName": "heart", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "frame", - "id": "mobF3Body", - "name": "feat3Body", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "mobF3Ttl", - "name": "feat3Title", - "fill": "#2C2C2C", - "content": "Made With Love", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobF3Desc", - "name": "feat3Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Passion in every dish. Home-cooked comfort at its best.", - "lineHeight": 1.5, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobMenuSec", - "name": "Menu Section", - "width": "fill_container", - "fill": "#6B4423", - "layout": "vertical", - "gap": 32, - "padding": [ - 48, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobMenuHdr", - "name": "Menu Header", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobMenuTag", - "name": "menuTag", - "fill": "#FF6B35", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "mobMenuTtl", - "name": "menuTitle", - "fill": "#FFFFFF", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 32, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "mobMenuDesc", - "name": "menuDesc", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Comfort food classics to Vietnamese specialties", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobMenuGrid", - "name": "Menu Grid", - "width": "fill_container", - "fill": "#FFFFFF10", - "cornerRadius": 16, - "layout": "vertical", - "gap": 24, - "padding": 24, - "children": [ - { - "type": "frame", - "id": "mobCol1", - "name": "Món Chính Col", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobC1Ttl", - "name": "c1title", - "fill": "#FF6B35", - "content": "MÓN CHÍNH", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "mobC1Div", - "name": "c1div", - "fill": "#FF6B35", - "width": 32, - "height": 2 - }, - { - "type": "text", - "id": "mobC1i1", - "name": "c1i1", - "fill": "#FFFFFFDD", - "content": "Cheese Foam Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC1i2", - "name": "c1i2", - "fill": "#FFFFFFDD", - "content": "Strawberry Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC1i3", - "name": "c1i3", - "fill": "#FFFFFFDD", - "content": "Oolong Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC1i4", - "name": "c1i4", - "fill": "#FFFFFFDD", - "content": "Bacon Pork Cheeseburger", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC1i5", - "name": "c1i5", - "fill": "#FFFFFFDD", - "content": "Crispy Chicken Burger", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC1i6", - "name": "c1i6", - "fill": "#FFFFFFDD", - "content": "Beef Burger with Cheese", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "rectangle", - "id": "mobDiv1", - "name": "Divider 1", - "fill": "#FFFFFF20", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "mobCol2", - "name": "Món Phụ Col", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobC2Ttl", - "name": "c2title", - "fill": "#FF6B35", - "content": "MÓN PHỤ — ĂN VẶT", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "mobC2Div", - "name": "c2div", - "fill": "#FF6B35", - "width": 32, - "height": 2 - }, - { - "type": "text", - "id": "mobC2i1", - "name": "c2i1", - "fill": "#FFFFFFDD", - "content": "Salad trộn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i2", - "name": "c2i2", - "fill": "#FFFFFFDD", - "content": "Khoai Tây Chiên", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i3", - "name": "c2i3", - "fill": "#FFFFFFDD", - "content": "Bánh Tráng Trộn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i4", - "name": "c2i4", - "fill": "#FFFFFFDD", - "content": "Bánh Lăng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i5", - "name": "c2i5", - "fill": "#FFFFFFDD", - "content": "Mực rim me", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i6", - "name": "c2i6", - "fill": "#FFFFFFDD", - "content": "Chè đậu Xanh", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC2i7", - "name": "c2i7", - "fill": "#FFFFFFDD", - "content": "Chè Thập Cẩm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "rectangle", - "id": "mobDiv2", - "name": "Divider 2", - "fill": "#FFFFFF20", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "mobCol3", - "name": "Đặc Biệt Col", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobC3Ttl", - "name": "c3title", - "fill": "#FF6B35", - "content": "ĐẶC BIỆT", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "mobC3Div", - "name": "c3div", - "fill": "#FF6B35", - "width": 32, - "height": 2 - }, - { - "type": "text", - "id": "mobC3i1", - "name": "c3i1", - "fill": "#FFFFFFDD", - "content": "Phở Việt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "mobC3i2", - "name": "c3i2", - "fill": "#FFFFFFDD", - "content": "Hủ Tiếu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobTest", - "name": "Testimonials Section", - "width": "fill_container", - "fill": "#FAF8F4", - "layout": "vertical", - "gap": 32, - "padding": [ - 48, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobTestHdr", - "name": "Test Header", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobTestTag", - "name": "testTag", - "fill": "#FF6B35", - "content": "Testimonials", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "mobTestTtl", - "name": "testTitle", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "What Our Customers Say", - "lineHeight": 1.15, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 28, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "mobTestGrid", - "name": "Test Grid", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "mobT1", - "name": "test1", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "mobT1Q", - "name": "test1Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"Best omelette I've ever had! The eggs are so fresh and fluffy. Now I'm a regular — even at 2 AM!\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobT2", - "name": "test2", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "mobT2Q", - "name": "test2Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"My family's go-to spot for late night cravings. Friendly staff, consistent food.\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobT3", - "name": "test3", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "text", - "id": "mobT3Q", - "name": "test3Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"The shakshuka reminds me of home. Authentic flavors, generous portions, great price!\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobCta", - "name": "CTA Section", - "width": "fill_container", - "fill": "#FF6B35", - "layout": "vertical", - "gap": 24, - "padding": [ - 48, - 24 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobCtaTtl", - "name": "ctaTitle", - "fill": "#FFFFFF", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Ready to Try the Best Eggs in Town?", - "lineHeight": 1.2, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 28, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "mobCtaSub", - "name": "ctaSubline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Visit us or order online. Open 24/7!", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "mobCtaBtns", - "name": "ctaBtnRow", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "mobCtaB1", - "name": "ctaBtn1", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 30, - "padding": [ - 16, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobCtaB1T", - "name": "ctaBtn1Text", - "fill": "#FF6B35", - "content": "Order Now", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "mobCtaB2", - "name": "ctaBtn2", - "width": "fill_container", - "fill": "transparent", - "cornerRadius": 30, - "stroke": { - "thickness": 2, - "fill": "#FFFFFF" - }, - "padding": [ - 16, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobCtaB2T", - "name": "ctaBtn2Text", - "fill": "#FFFFFF", - "content": "Find Location", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mobFtr", - "name": "Footer", - "width": "fill_container", - "fill": "#2C2C2C", - "layout": "vertical", - "gap": 32, - "padding": [ - 40, - 24 - ], - "children": [ - { - "type": "frame", - "id": "mobFtrBrand", - "name": "footerBrand", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "mobFtrLogoRow", - "name": "footerLogoRow", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mobFtrLogoImg", - "name": "footerLogo", - "width": 32, - "height": 32, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "mobFtrLogoTxt", - "name": "footerLogoText", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "mobFtrTag", - "name": "footerTagline", - "fill": "#9A9A9A", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Your neighborhood comfort food destination. Serving egg-cellent dishes 24/7.", - "lineHeight": 1.5, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobFtrLinks", - "name": "footerLinks", - "width": "fill_container", - "layout": "vertical", - "gap": 32, - "children": [ - { - "type": "frame", - "id": "mobFtrC1", - "name": "footerCol1", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobFC1T", - "name": "footerCol1Title", - "fill": "#FFFFFF", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobFC1L1", - "name": "footerCol1Link1", - "fill": "#9A9A9A", - "content": "Breakfast", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC1L2", - "name": "footerCol1Link2", - "fill": "#9A9A9A", - "content": "Lunch", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC1L3", - "name": "footerCol1Link3", - "fill": "#9A9A9A", - "content": "Dinner", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC1L4", - "name": "footerCol1Link4", - "fill": "#9A9A9A", - "content": "Drinks", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobFtrC2", - "name": "footerCol2", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobFC2T", - "name": "footerCol2Title", - "fill": "#FFFFFF", - "content": "Company", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobFC2L1", - "name": "footerCol2Link1", - "fill": "#9A9A9A", - "content": "About Us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC2L2", - "name": "footerCol2Link2", - "fill": "#9A9A9A", - "content": "Locations", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC2L3", - "name": "footerCol2Link3", - "fill": "#9A9A9A", - "content": "Careers", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC2L4", - "name": "footerCol2Link4", - "fill": "#9A9A9A", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mobFtrC3", - "name": "footerCol3", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "mobFC3T", - "name": "footerCol3Title", - "fill": "#FFFFFF", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "mobFC3L1", - "name": "footerCol3Link1", - "fill": "#9A9A9A", - "content": "+1 770 409 0003", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC3L2", - "name": "footerCol3Link2", - "fill": "#9A9A9A", - "content": "contact@eggymon.us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFC3L3", - "name": "footerCol3Link3", - "fill": "#9A9A9A", - "content": "eggymon.us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "mobFtrDiv", - "name": "footerDivider", - "fill": "#4A4A4A", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "mobFtrBot", - "name": "footerBottom", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mobFtrCopy", - "name": "footerCopy", - "fill": "#6B6B6B", - "content": "© 2026 EggyMon Kitchen. All rights reserved.", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "mobFtrLegal", - "name": "footerLegal", - "gap": 16, - "children": [ - { - "type": "text", - "id": "mobFtrPrv", - "name": "footerPrivacy", - "fill": "#6B6B6B", - "content": "Privacy Policy", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "mobFtrTrm", - "name": "footerTerms", - "fill": "#6B6B6B", - "content": "Terms of Service", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-tablet.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-tablet.pen deleted file mode 100644 index 3729cc86..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage-tablet.pen +++ /dev/null @@ -1,1422 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "tab01", - "x": 0, - "y": 0, - "name": "Eggymon Kitchen Landing Page — Tablet", - "width": 768, - "fill": "#FAF8F4", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "tabHdr", - "name": "Header", - "width": "fill_container", - "height": 72, - "fill": "#FFFFFF", - "padding": [ - 0, - 40 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabLogo", - "name": "Logo Area", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabLogoImg", - "name": "headerLogo", - "width": 40, - "height": 40, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "tabLogoTxt", - "name": "logoText", - "fill": "#6B4423", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "tabNav", - "name": "Nav Links", - "gap": 28, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabNavMenu", - "name": "navMenu", - "fill": "#2C2C2C", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabNavAbout", - "name": "navAbout", - "fill": "#2C2C2C", - "content": "About", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabNavLoc", - "name": "navLocation", - "fill": "#2C2C2C", - "content": "Locations", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "tabCta", - "name": "CTA Area", - "children": [ - { - "type": "frame", - "id": "tabOrderBtn", - "name": "orderBtn", - "fill": "#FF6B35", - "cornerRadius": 24, - "padding": [ - 12, - 24 - ], - "children": [ - { - "type": "text", - "id": "tabOrderTxt", - "name": "orderText", - "fill": "#FFFFFF", - "content": "Order Now", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabHero", - "name": "Hero Section", - "width": "fill_container", - "fill": "#6B4423", - "layout": "vertical", - "gap": 32, - "padding": [ - 60, - 40 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabHeroImg", - "name": "Hero Image", - "width": "fill_container", - "height": 340, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/eggymon-kitchen-store.png", - "mode": "fill" - }, - "cornerRadius": 20 - }, - { - "type": "frame", - "id": "tabHeroContent", - "name": "Hero Content", - "width": "fill_container", - "layout": "vertical", - "gap": 20, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabBadge", - "name": "badge", - "fill": "#FF6B35", - "cornerRadius": 20, - "padding": [ - 8, - 16 - ], - "children": [ - { - "type": "text", - "id": "tabBadgeTxt", - "name": "badgeText", - "fill": "#FFFFFF", - "content": "🥚 Open 24/7 — Fresh & Delicious", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "tabHeadline", - "name": "headline", - "fill": "#FFFFFF", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Egg-cellent Food,\nMade With Love", - "lineHeight": 1.15, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 44, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "tabSubline", - "name": "subline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Welcome to EggyMon Kitchen — your neighborhood comfort food destination. From fluffy omelettes to savory rice bowls, around the clock.", - "lineHeight": 1.6, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "tabHeroCtaRow", - "name": "CTA Row", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "tabPrimBtn", - "name": "primaryBtn", - "fill": "#FF6B35", - "cornerRadius": 30, - "padding": [ - 16, - 32 - ], - "children": [ - { - "type": "text", - "id": "tabPrimTxt", - "name": "primaryText", - "fill": "#FFFFFF", - "content": "View Our Menu", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "tabSecBtn", - "name": "secondaryBtn", - "fill": "transparent", - "cornerRadius": 30, - "stroke": { - "thickness": 2, - "fill": "#FFFFFF" - }, - "padding": [ - 16, - 32 - ], - "children": [ - { - "type": "text", - "id": "tabSecTxt", - "name": "secondaryText", - "fill": "#FFFFFF", - "content": "Order Online", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabFeat", - "name": "Features Section", - "width": "fill_container", - "fill": "#FFFFFF", - "layout": "vertical", - "gap": 40, - "padding": [ - 60, - 40 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabFeatHdr", - "name": "Features Header", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabFeatTag", - "name": "featTag", - "fill": "#FF6B35", - "content": "Why Choose Us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "tabFeatTtl", - "name": "featTitle", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Crafted With Care, Served With Soul", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "tabFeatDesc", - "name": "featDesc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Every dish at EggyMon Kitchen is prepared fresh with premium ingredients", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabFeatGrid", - "name": "Features Grid", - "width": "fill_container", - "gap": 20, - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "tabF1", - "name": "feat1", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabF1Ico", - "name": "feat1Icon", - "width": 56, - "height": 56, - "fill": "#FF6B3520", - "cornerRadius": 28, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "tabF1IcoIn", - "name": "feat1IconInner", - "width": 26, - "height": 26, - "iconFontName": "clock-3", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "tabF1Ttl", - "name": "feat1Title", - "fill": "#2C2C2C", - "content": "Open 24/7", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabF1Desc", - "name": "feat1Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Craving eggs at 3 AM? We've got you covered.", - "lineHeight": 1.5, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabF2", - "name": "feat2", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabF2Ico", - "name": "feat2Icon", - "width": 56, - "height": 56, - "fill": "#FF6B3520", - "cornerRadius": 28, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "tabF2IcoIn", - "name": "feat2IconInner", - "width": 26, - "height": 26, - "iconFontName": "egg", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "tabF2Ttl", - "name": "feat2Title", - "fill": "#2C2C2C", - "content": "Farm Fresh Eggs", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabF2Desc", - "name": "feat2Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Sourced from local farms daily for the freshest taste.", - "lineHeight": 1.5, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabF3", - "name": "feat3", - "width": "fill_container", - "fill": "#FAF8F4", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabF3Ico", - "name": "feat3Icon", - "width": 56, - "height": 56, - "fill": "#FF6B3520", - "cornerRadius": 28, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "tabF3IcoIn", - "name": "feat3IconInner", - "width": 26, - "height": 26, - "iconFontName": "heart", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "tabF3Ttl", - "name": "feat3Title", - "fill": "#2C2C2C", - "content": "Made With Love", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabF3Desc", - "name": "feat3Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Our chefs pour passion into every dish. Home-cooked comfort.", - "lineHeight": 1.5, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabMenuSec", - "name": "Menu Section", - "width": "fill_container", - "fill": "#6B4423", - "layout": "vertical", - "gap": 36, - "padding": [ - 60, - 40 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabMenuHdr", - "name": "Menu Header", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabMenuTag", - "name": "menuTag", - "fill": "#FF6B35", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "tabMenuTtl", - "name": "menuTitle", - "fill": "#FFFFFF", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "tabMenuDesc", - "name": "menuDesc", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Explore our full range of dishes — from comfort food classics to Vietnamese specialties", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabMenuGrid", - "name": "Full Menu Grid", - "width": "fill_container", - "fill": "#FFFFFF10", - "cornerRadius": 16, - "gap": 32, - "padding": [ - 28, - 32 - ], - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "tabMCol1", - "name": "Món Chính Col", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabMC1Ttl", - "name": "c1title", - "fill": "#FF6B35", - "content": "MÓN CHÍNH", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "tabMC1Div", - "name": "c1div", - "fill": "#FF6B35", - "width": 36, - "height": 2 - }, - { - "type": "text", - "id": "tabMC1i1", - "name": "c1i1", - "fill": "#FFFFFFDD", - "content": "Cheese Foam Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC1i2", - "name": "c1i2", - "fill": "#FFFFFFDD", - "content": "Strawberry Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC1i3", - "name": "c1i3", - "fill": "#FFFFFFDD", - "content": "Oolong Milk Tea", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC1i4", - "name": "c1i4", - "fill": "#FFFFFFDD", - "content": "Bacon Pork Cheeseburger", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC1i5", - "name": "c1i5", - "fill": "#FFFFFFDD", - "content": "Crispy Chicken Burger", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC1i6", - "name": "c1i6", - "fill": "#FFFFFFDD", - "content": "Beef Burger with Cheese", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "rectangle", - "id": "tabMDiv1", - "name": "Divider 1", - "fill": "#FFFFFF20", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "tabMCol2", - "name": "Món Phụ Col", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabMC2Ttl", - "name": "c2title", - "fill": "#FF6B35", - "content": "MÓN PHỤ — ĂN VẶT", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "tabMC2Div", - "name": "c2div", - "fill": "#FF6B35", - "width": 36, - "height": 2 - }, - { - "type": "text", - "id": "tabMC2i1", - "name": "c2i1", - "fill": "#FFFFFFDD", - "content": "Salad trộn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i2", - "name": "c2i2", - "fill": "#FFFFFFDD", - "content": "Khoai Tây Chiên", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i3", - "name": "c2i3", - "fill": "#FFFFFFDD", - "content": "Bánh Tráng Trộn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i4", - "name": "c2i4", - "fill": "#FFFFFFDD", - "content": "Bánh Lăng", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i5", - "name": "c2i5", - "fill": "#FFFFFFDD", - "content": "Mực rim me", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i6", - "name": "c2i6", - "fill": "#FFFFFFDD", - "content": "Chè đậu Xanh", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC2i7", - "name": "c2i7", - "fill": "#FFFFFFDD", - "content": "Chè Thập Cẩm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabMenuSpecial", - "name": "Special Menu Row", - "width": "fill_container", - "fill": "#FFFFFF10", - "cornerRadius": 16, - "padding": [ - 28, - 32 - ], - "children": [ - { - "type": "frame", - "id": "tabMCol3", - "name": "Đặc Biệt Col", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabMC3Ttl", - "name": "c3title", - "fill": "#FF6B35", - "content": "ĐẶC BIỆT", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "bold", - "letterSpacing": 2 - }, - { - "type": "rectangle", - "id": "tabMC3Div", - "name": "c3div", - "fill": "#FF6B35", - "width": 36, - "height": 2 - }, - { - "type": "text", - "id": "tabMC3i1", - "name": "c3i1", - "fill": "#FFFFFFDD", - "content": "Phở Việt", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "tabMC3i2", - "name": "c3i2", - "fill": "#FFFFFFDD", - "content": "Hủ Tiếu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabTest", - "name": "Testimonials Section", - "width": "fill_container", - "fill": "#FAF8F4", - "layout": "vertical", - "gap": 36, - "padding": [ - 60, - 40 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabTestHdr", - "name": "Test Header", - "layout": "vertical", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabTestTag", - "name": "testTag", - "fill": "#FF6B35", - "content": "Testimonials", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "tabTestTtl", - "name": "testTitle", - "fill": "#2C2C2C", - "content": "What Our Customers Say", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "tabTestTopRow", - "name": "Test Row 1", - "width": "fill_container", - "gap": 20, - "children": [ - { - "type": "frame", - "id": "tabT1", - "name": "test1", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "children": [ - { - "type": "text", - "id": "tabT1Q", - "name": "test1Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"Best omelette I've ever had! The eggs are so fresh and fluffy. Now I'm a regular — even at 2 AM!\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabT2", - "name": "test2", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "children": [ - { - "type": "text", - "id": "tabT2Q", - "name": "test2Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"My family's go-to spot for late night cravings. The staff is friendly and the food is always consistent.\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabT3", - "name": "test3", - "width": "fill_container", - "fill": "#FFFFFF", - "cornerRadius": 20, - "layout": "vertical", - "gap": 16, - "padding": 28, - "children": [ - { - "type": "text", - "id": "tabT3Q", - "name": "test3Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"The shakshuka here reminds me of home. Authentic flavors, generous portions, and the price is right!\"", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabCtaSec", - "name": "CTA Section", - "width": "fill_container", - "fill": "#FF6B35", - "layout": "vertical", - "gap": 28, - "padding": [ - 60, - 40 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabCtaTtl", - "name": "ctaTitle", - "fill": "#FFFFFF", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Ready to Try the Best Eggs in Town?", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "tabCtaSub", - "name": "ctaSubline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Visit us today or order online for delivery. Open 24/7 for your convenience!", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "tabCtaBtns", - "name": "ctaBtnRow", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "tabCtaB1", - "name": "ctaBtn1", - "fill": "#FFFFFF", - "cornerRadius": 30, - "padding": [ - 16, - 36 - ], - "children": [ - { - "type": "text", - "id": "tabCtaB1T", - "name": "ctaBtn1Text", - "fill": "#FF6B35", - "content": "Order Now", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "tabCtaB2", - "name": "ctaBtn2", - "fill": "transparent", - "cornerRadius": 30, - "stroke": { - "thickness": 2, - "fill": "#FFFFFF" - }, - "padding": [ - 16, - 36 - ], - "children": [ - { - "type": "text", - "id": "tabCtaB2T", - "name": "ctaBtn2Text", - "fill": "#FFFFFF", - "content": "Find Location", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "tabFtr", - "name": "Footer", - "width": "fill_container", - "fill": "#2C2C2C", - "layout": "vertical", - "gap": 36, - "padding": [ - 48, - 40 - ], - "children": [ - { - "type": "frame", - "id": "tabFtrTop", - "name": "footerTop", - "width": "fill_container", - "gap": 40, - "children": [ - { - "type": "frame", - "id": "tabFtrBrand", - "name": "footerBrand", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "tabFtrLogoRow", - "name": "footerLogoRow", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "tabFtrLogoImg", - "name": "footerLogo", - "width": 36, - "height": 36, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "tabFtrLogoTxt", - "name": "footerLogoText", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "tabFtrTag", - "name": "footerTagline", - "fill": "#9A9A9A", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Your neighborhood comfort food destination. Serving egg-cellent dishes 24/7.", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabFtrLinks", - "name": "footerLinks", - "gap": 48, - "children": [ - { - "type": "frame", - "id": "tabFtrC1", - "name": "footerCol1", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabFC1T", - "name": "footerCol1Title", - "fill": "#FFFFFF", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabFC1L1", - "name": "footerCol1Link1", - "fill": "#9A9A9A", - "content": "Breakfast", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC1L2", - "name": "footerCol1Link2", - "fill": "#9A9A9A", - "content": "Lunch", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC1L3", - "name": "footerCol1Link3", - "fill": "#9A9A9A", - "content": "Dinner", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC1L4", - "name": "footerCol1Link4", - "fill": "#9A9A9A", - "content": "Drinks", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabFtrC2", - "name": "footerCol2", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabFC2T", - "name": "footerCol2Title", - "fill": "#FFFFFF", - "content": "Company", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabFC2L1", - "name": "footerCol2Link1", - "fill": "#9A9A9A", - "content": "About Us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC2L2", - "name": "footerCol2Link2", - "fill": "#9A9A9A", - "content": "Locations", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC2L3", - "name": "footerCol2Link3", - "fill": "#9A9A9A", - "content": "Careers", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC2L4", - "name": "footerCol2Link4", - "fill": "#9A9A9A", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "tabFtrC3", - "name": "footerCol3", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "text", - "id": "tabFC3T", - "name": "footerCol3Title", - "fill": "#FFFFFF", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "tabFC3L1", - "name": "footerCol3Link1", - "fill": "#9A9A9A", - "content": "+1 770 409 0003", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC3L2", - "name": "footerCol3Link2", - "fill": "#9A9A9A", - "content": "contact@eggymon.us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFC3L3", - "name": "footerCol3Link3", - "fill": "#9A9A9A", - "content": "eggymon.us", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "tabFtrDiv", - "name": "footerDivider", - "fill": "#4A4A4A", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "tabFtrBot", - "name": "footerBottom", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "tabFtrCopy", - "name": "footerCopy", - "fill": "#6B6B6B", - "content": "© 2026 EggyMon Kitchen. All rights reserved.", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "tabFtrLegal", - "name": "footerLegal", - "gap": 20, - "children": [ - { - "type": "text", - "id": "tabFtrPrv", - "name": "footerPrivacy", - "fill": "#6B6B6B", - "content": "Privacy Policy", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tabFtrTrm", - "name": "footerTerms", - "fill": "#6B6B6B", - "content": "Terms of Service", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage.pen deleted file mode 100644 index 8f803a67..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/eggymon-landipage.pen +++ /dev/null @@ -1,1416 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "tYc23", - "x": 0, - "y": 1, - "name": "Eggymon Kitchen Landing Page", - "width": 1440, - "fill": "#FAF8F4", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "beCg8", - "name": "Header", - "width": "fill_container", - "height": 80, - "fill": "#FFFFFF", - "padding": [ - 0, - 80 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "nPBSF", - "name": "Logo Area", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "0Azbk", - "name": "headerLogo", - "width": 48, - "height": 48, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "YgnbN", - "name": "logoText", - "fill": "#6B4423", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "KKcdM", - "name": "Nav Links", - "gap": 40, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "pPdwG", - "name": "navMenu", - "fill": "#2C2C2C", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "500" - }, - { - "type": "text", - "id": "SqOt7", - "name": "navAbout", - "fill": "#2C2C2C", - "content": "About Us", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "500" - }, - { - "type": "text", - "id": "JhnlW", - "name": "navLocation", - "fill": "#2C2C2C", - "content": "Locations", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "500" - }, - { - "type": "text", - "id": "ALoSJ", - "name": "navContact", - "fill": "#2C2C2C", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "pbdfP", - "name": "CTA Area", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "SsU8r", - "name": "orderBtn", - "fill": "#FF6B35", - "cornerRadius": 30, - "padding": [ - 14, - 28 - ], - "children": [ - { - "type": "text", - "id": "3nX4L", - "name": "orderText", - "fill": "#FFFFFF", - "content": "Order Now", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "4PoZJ", - "name": "Hero Section", - "width": "fill_container", - "height": 680, - "fill": "#6B4423", - "gap": 60, - "padding": 80, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "PlCMv", - "name": "Hero Content", - "width": 600, - "layout": "vertical", - "gap": 24, - "children": [ - { - "type": "frame", - "id": "29sbe", - "name": "badge", - "fill": "#FF6B35", - "cornerRadius": 20, - "padding": [ - 8, - 16 - ], - "children": [ - { - "type": "text", - "id": "N5eBx", - "name": "badgeText", - "fill": "#FFFFFF", - "content": "🥚 Open 24/7 — Fresh & Delicious", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "vv2Ti", - "name": "headline", - "fill": "#FFFFFF", - "content": "Egg-cellent Food,\nMade With Love", - "lineHeight": 1.1, - "fontFamily": "Poppins", - "fontSize": 64, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "ghMxR", - "name": "subline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Welcome to EggyMon Kitchen — your neighborhood comfort food destination. From fluffy omelettes to savory rice bowls, we serve delicious egg-based dishes around the clock.", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "K0Drj", - "name": "CTA Row", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "5BJ4h", - "name": "primaryBtn", - "fill": "#FF6B35", - "cornerRadius": 30, - "padding": [ - 18, - 36 - ], - "children": [ - { - "type": "text", - "id": "b5vOq", - "name": "primaryText", - "fill": "#FFFFFF", - "content": "View Our Menu", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "0EQ02", - "name": "secondaryBtn", - "fill": "transparent", - "cornerRadius": 30, - "padding": [ - 18, - 36 - ], - "children": [ - { - "type": "text", - "id": "4zOxN", - "name": "secondaryText", - "fill": "#FFFFFF", - "content": "Order Online", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "hZEB7", - "name": "Hero Image", - "width": 580, - "height": 520, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/eggymon-kitchen-store.png", - "mode": "fill" - }, - "cornerRadius": 24 - } - ] - }, - { - "type": "frame", - "id": "m2vE4", - "name": "Features Section", - "width": "fill_container", - "fill": "#FFFFFF", - "layout": "vertical", - "gap": 48, - "padding": [ - 80, - 120 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "e20nl", - "name": "Features Header", - "layout": "vertical", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "YeDdD", - "name": "featTag", - "fill": "#FF6B35", - "content": "Why Choose Us", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "NyA0M", - "name": "featTitle", - "fill": "#2C2C2C", - "content": "Crafted With Care, Served With Soul", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 48, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "0CJCz", - "name": "featDesc", - "fill": "#6B6B6B", - "content": "Every dish at EggyMon Kitchen is prepared fresh with premium ingredients", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "ft7xQ", - "name": "Features Grid", - "gap": 32, - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "bFULQ", - "name": "feat1", - "width": 320, - "fill": "#FAF8F4", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "pp5ur", - "name": "feat1Icon", - "width": 64, - "height": 64, - "fill": "#FF6B3520", - "cornerRadius": 32, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "5XeTR", - "name": "feat1IconInner", - "width": 28, - "height": 28, - "iconFontName": "clock-3", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "FmRb1", - "name": "feat1Title", - "fill": "#2C2C2C", - "content": "Open 24/7", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - }, - { - "type": "text", - "id": "sU177", - "name": "feat1Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Craving eggs at 3 AM? We've got you covered. Fresh food, any time of day.", - "lineHeight": 1.6, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "i9pYr", - "name": "feat2", - "width": 320, - "fill": "#FAF8F4", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "pDLVz", - "name": "feat2Icon", - "width": 64, - "height": 64, - "fill": "#FF6B3520", - "cornerRadius": 32, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "wsATe", - "name": "feat2IconInner", - "width": 28, - "height": 28, - "iconFontName": "egg", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "6CIlo", - "name": "feat2Title", - "fill": "#2C2C2C", - "content": "Farm Fresh Eggs", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - }, - { - "type": "text", - "id": "3dtC8", - "name": "feat2Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "We source our eggs from local farms daily for the freshest taste in every bite.", - "lineHeight": 1.6, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "B3uKX", - "name": "feat3", - "width": 320, - "fill": "#FAF8F4", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "T70zY", - "name": "feat3Icon", - "width": 64, - "height": 64, - "fill": "#FF6B3520", - "cornerRadius": 32, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mP0Oo", - "name": "feat3IconInner", - "width": 28, - "height": 28, - "iconFontName": "heart", - "iconFontFamily": "lucide", - "fill": "#FF6B35" - } - ] - }, - { - "type": "text", - "id": "PAlks", - "name": "feat3Title", - "fill": "#2C2C2C", - "content": "Made With Love", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "600" - }, - { - "type": "text", - "id": "nhGxY", - "name": "feat3Desc", - "fill": "#6B6B6B", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Our chefs pour passion into every dish. Taste the difference of home-cooked comfort.", - "lineHeight": 1.6, - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "FkFZR", - "name": "Menu Section", - "width": "fill_container", - "fill": "#6B4423", - "layout": "vertical", - "gap": 48, - "padding": [ - 80, - 120 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "1Ux5Z", - "name": "Menu Header", - "layout": "vertical", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "O41LN", - "name": "menuTag", - "fill": "#FF6B35", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "2hp7L", - "name": "menuTitle", - "fill": "#FFFFFF", - "content": "Our Menu", - "fontFamily": "Poppins", - "fontSize": 48, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "IjMXy", - "name": "menuDesc", - "fill": "#FFFFFF99", - "content": "Explore our full range of dishes — from comfort food classics to Vietnamese specialties", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "e3iaV", - "name": "Full Menu Grid", - "width": "fill_container", - "fill": "#FFFFFF10", - "cornerRadius": 20, - "gap": 40, - "padding": [ - 32, - 40 - ], - "justifyContent": "center", - "children": [ - { - "type": "frame", - "id": "GVWQ2", - "name": "Món Chính Col", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "children": [ - { - "type": "text", - "id": "TohIe", - "name": "c1title", - "fill": "#FF6B35", - "content": "MÓN CHÍNH", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold", - "letterSpacing": 3 - }, - { - "type": "rectangle", - "id": "fnYG6", - "name": "c1div", - "fill": "#FF6B35", - "width": 40, - "height": 2 - }, - { - "type": "text", - "id": "P5zjb", - "name": "c1i1", - "fill": "#FFFFFFDD", - "content": "Cheese Foam Milk Tea", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "eUWSw", - "name": "c1i2", - "fill": "#FFFFFFDD", - "content": "Strawberry Milk Tea", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "ndMfk", - "name": "c1i3", - "fill": "#FFFFFFDD", - "content": "Oolong Milk Tea", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "toG38", - "name": "c1i4", - "fill": "#FFFFFFDD", - "content": "Bacon Pork Cheeseburger", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "iEVuT", - "name": "c1i5", - "fill": "#FFFFFFDD", - "content": "Crispy Chicken Burger", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "1yVXp", - "name": "c1i6", - "fill": "#FFFFFFDD", - "content": "Beef Burger with Cheese", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - } - ] - }, - { - "type": "rectangle", - "id": "v3kBY", - "name": "Divider 1", - "fill": "#FFFFFF20", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "dmUsN", - "name": "Món Phụ Col", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "children": [ - { - "type": "text", - "id": "2P2V3", - "name": "c2title", - "fill": "#FF6B35", - "content": "MÓN PHỤ — ĂN VẶT", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold", - "letterSpacing": 3 - }, - { - "type": "rectangle", - "id": "cmiwR", - "name": "c2div", - "fill": "#FF6B35", - "width": 40, - "height": 2 - }, - { - "type": "text", - "id": "2aAeH", - "name": "c2i1", - "fill": "#FFFFFFDD", - "content": "Salad trộn", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "hTH16", - "name": "c2i2", - "fill": "#FFFFFFDD", - "content": "Khoai Tây Chiên", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "gl2pL", - "name": "c2i3", - "fill": "#FFFFFFDD", - "content": "Bánh Tráng Trộn", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "r3q3D", - "name": "c2i4", - "fill": "#FFFFFFDD", - "content": "Bánh Lăng", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "rbZVU", - "name": "c2i5", - "fill": "#FFFFFFDD", - "content": "Mực rim me", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "xKLP6", - "name": "c2i6", - "fill": "#FFFFFFDD", - "content": "Chè đậu Xanh", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "bFzGj", - "name": "c2i7", - "fill": "#FFFFFFDD", - "content": "Chè Thập Cẩm", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - } - ] - }, - { - "type": "rectangle", - "id": "ui6IT", - "name": "Divider 2", - "fill": "#FFFFFF20", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "b8p8j", - "name": "Đặc Biệt Col", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "children": [ - { - "type": "text", - "id": "JLSZk", - "name": "c3title", - "fill": "#FF6B35", - "content": "ĐẶC BIỆT", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "bold", - "letterSpacing": 3 - }, - { - "type": "rectangle", - "id": "4MvAY", - "name": "c3div", - "fill": "#FF6B35", - "width": 40, - "height": 2 - }, - { - "type": "text", - "id": "Z9JNT", - "name": "c3i1", - "fill": "#FFFFFFDD", - "content": "Phở Việt", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Iz2VJ", - "name": "c3i2", - "fill": "#FFFFFFDD", - "content": "Hủ Tiếu", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "6INph", - "name": "Testimonials Section", - "width": "fill_container", - "fill": "#FAF8F4", - "layout": "vertical", - "gap": 48, - "padding": [ - 80, - 120 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "z8MpZ", - "name": "Test Header", - "layout": "vertical", - "gap": 16, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "qU9Ab", - "name": "testTag", - "fill": "#FF6B35", - "content": "Testimonials", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600", - "letterSpacing": 2 - }, - { - "type": "text", - "id": "vk2HJ", - "name": "testTitle", - "fill": "#2C2C2C", - "content": "What Our Customers Say", - "fontFamily": "Poppins", - "fontSize": 48, - "fontWeight": "bold" - } - ] - }, - { - "type": "frame", - "id": "xqtXU", - "name": "Test Grid", - "gap": 32, - "children": [ - { - "type": "frame", - "id": "uVysW", - "name": "test1", - "width": 380, - "fill": "#FFFFFF", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "children": [ - { - "type": "text", - "id": "6R03p", - "name": "test1Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"Best omelette I've ever had! The eggs are so fresh and fluffy. Now I'm a regular — even at 2 AM!\"", - "lineHeight": 1.7, - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "23xEt", - "name": "test2", - "width": 380, - "fill": "#FFFFFF", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "children": [ - { - "type": "text", - "id": "M0SaR", - "name": "test2Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"My family's go-to spot for late night cravings. The staff is friendly and the food is always consistent.\"", - "lineHeight": 1.7, - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "0WHWk", - "name": "test3", - "width": 380, - "fill": "#FFFFFF", - "cornerRadius": 24, - "layout": "vertical", - "gap": 20, - "padding": 32, - "children": [ - { - "type": "text", - "id": "7aRdT", - "name": "test3Quote", - "fill": "#2C2C2C", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "\"The shakshuka here reminds me of home. Authentic flavors, generous portions, and the price is right!\"", - "lineHeight": 1.7, - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "fJXAF", - "name": "CTA Section", - "width": "fill_container", - "height": 400, - "fill": "#FF6B35", - "layout": "vertical", - "gap": 32, - "padding": [ - 80, - 120 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ztRrc", - "name": "ctaTitle", - "fill": "#FFFFFF", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Ready to Try the Best Eggs in Town?", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 48, - "fontWeight": "bold" - }, - { - "type": "text", - "id": "kAsO7", - "name": "ctaSubline", - "fill": "#FFFFFF99", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Visit us today or order online for delivery. Open 24/7 for your convenience!", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "lVJc5", - "name": "ctaBtnRow", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "KA6sS", - "name": "ctaBtn1", - "fill": "#FFFFFF", - "cornerRadius": 30, - "padding": [ - 18, - 40 - ], - "children": [ - { - "type": "text", - "id": "Xsktt", - "name": "ctaBtn1Text", - "fill": "#FF6B35", - "content": "Order Now", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "kjkxr", - "name": "ctaBtn2", - "fill": "transparent", - "cornerRadius": 30, - "stroke": { - "thickness": 2, - "fill": "#FFFFFF" - }, - "padding": [ - 18, - 40 - ], - "children": [ - { - "type": "text", - "id": "vAxSy", - "name": "ctaBtn2Text", - "fill": "#FFFFFF", - "content": "Find Location", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "68VtF", - "name": "Footer", - "width": "fill_container", - "fill": "#2C2C2C", - "layout": "vertical", - "gap": 40, - "padding": [ - 60, - 120 - ], - "children": [ - { - "type": "frame", - "id": "vC0Ae", - "name": "footerTop", - "width": "fill_container", - "justifyContent": "space_between", - "children": [ - { - "type": "frame", - "id": "bXIwf", - "name": "footerBrand", - "width": 320, - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "Apt4J", - "name": "footerLogoRow", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "g6ixm", - "name": "footerLogo", - "width": 40, - "height": 40, - "fill": { - "type": "image", - "enabled": true, - "url": "./images/Logo-Eggymon-Kitchen.png", - "mode": "fit" - } - }, - { - "type": "text", - "id": "l88yM", - "name": "footerLogoText", - "fill": "#FFFFFF", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "bold" - } - ] - }, - { - "type": "text", - "id": "jahLf", - "name": "footerTagline", - "fill": "#9A9A9A", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Your neighborhood comfort food destination. Serving egg-cellent dishes 24/7.", - "lineHeight": 1.6, - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "MJU6e", - "name": "footerLinks", - "gap": 80, - "children": [ - { - "type": "frame", - "id": "7NVeh", - "name": "footerCol1", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "text", - "id": "iSYaQ", - "name": "footerCol1Title", - "fill": "#FFFFFF", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "text", - "id": "CCDJI", - "name": "footerCol1Link1", - "fill": "#9A9A9A", - "content": "Breakfast", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "3BnKL", - "name": "footerCol1Link2", - "fill": "#9A9A9A", - "content": "Lunch", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "C1sC4", - "name": "footerCol1Link3", - "fill": "#9A9A9A", - "content": "Dinner", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "W12qP", - "name": "footerCol1Link4", - "fill": "#9A9A9A", - "content": "Drinks", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "1puge", - "name": "footerCol2", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "text", - "id": "HWbNA", - "name": "footerCol2Title", - "fill": "#FFFFFF", - "content": "Company", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "text", - "id": "6aVvs", - "name": "footerCol2Link1", - "fill": "#9A9A9A", - "content": "About Us", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "dkkNf", - "name": "footerCol2Link2", - "fill": "#9A9A9A", - "content": "Locations", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "WdeMU", - "name": "footerCol2Link3", - "fill": "#9A9A9A", - "content": "Careers", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "It6RW", - "name": "footerCol2Link4", - "fill": "#9A9A9A", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "5vs7c", - "name": "footerCol3", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "text", - "id": "9VqJn", - "name": "footerCol3Title", - "fill": "#FFFFFF", - "content": "Contact", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "text", - "id": "IaBMq", - "name": "footerCol3Link1", - "fill": "#9A9A9A", - "content": "+1 770 409 0003", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "tinXp", - "name": "footerCol3Link2", - "fill": "#9A9A9A", - "content": "contact@eggymon.us", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "feNgs", - "name": "footerCol3Link3", - "fill": "#9A9A9A", - "content": "1/2 mile N. of Beaver Ruin Rd.", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "8wGw3", - "name": "newLink", - "fill": "#9A9A9A", - "content": "eggymon.us", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "hDDYt", - "name": "footerDivider", - "fill": "#4A4A4A", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "bq0hM", - "name": "footerBottom", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "6si8T", - "name": "footerCopy", - "fill": "#6B6B6B", - "content": "© 2026 EggyMon Kitchen. All rights reserved.", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "sfGeS", - "name": "footerLegal", - "gap": 24, - "children": [ - { - "type": "text", - "id": "2ONnS", - "name": "footerPrivacy", - "fill": "#6B6B6B", - "content": "Privacy Policy", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "HNfUV", - "name": "footerTerms", - "fill": "#6B6B6B", - "content": "Terms of Service", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/images/Logo-Eggymon-Kitchen.png b/pencil-design/src/pages/eggymon-kitchen-landingpage/images/Logo-Eggymon-Kitchen.png deleted file mode 100644 index 26e4059a..00000000 Binary files a/pencil-design/src/pages/eggymon-kitchen-landingpage/images/Logo-Eggymon-Kitchen.png and /dev/null differ diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/images/eggymon-kitchen-store.png b/pencil-design/src/pages/eggymon-kitchen-landingpage/images/eggymon-kitchen-store.png deleted file mode 100644 index 880f5f8e..00000000 Binary files a/pencil-design/src/pages/eggymon-kitchen-landingpage/images/eggymon-kitchen-store.png and /dev/null differ diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/membership-card.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/membership-card.pen deleted file mode 100644 index 2bbb1938..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/membership-card.pen +++ /dev/null @@ -1,940 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "MembershipCardScreen", - "x": 0, - "y": 0, - "name": "Screen/MembershipCard", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "MemberCardTopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "MemberCardBackIcon", - "name": "BackIcon", - "width": 24, - "height": 24, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "MemberCardTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Thẻ thành viên", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "MemberCardSettingsIcon", - "name": "SettingsIcon", - "width": 24, - "height": 24, - "iconFontName": "settings", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - }, - { - "type": "frame", - "id": "MemberCardContent", - "name": "Content", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": [ - 12, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "MembershipCardFrame", - "name": "MembershipCard", - "width": "fill_container", - "height": 190, - "fill": "$brown-primary", - "cornerRadius": 20, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000020", - "offset": { - "x": 0, - "y": 4 - }, - "blur": 16, - "spread": -2 - }, - "layout": "vertical", - "gap": 14, - "padding": [ - 22, - 20 - ], - "justifyContent": "space_between", - "children": [ - { - "type": "frame", - "id": "CardTopRow", - "name": "CardTopRow", - "width": "fill_container", - "gap": 12, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CardLogoRow", - "name": "LogoRow", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CardLogo", - "name": "Logo", - "width": 36, - "height": 36, - "fill": "#FFFFFF", - "cornerRadius": 8, - "layout": "vertical", - "children": [ - { - "type": "text", - "id": "CardLogoText", - "name": "LogoText", - "content": "EK", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "700" - } - ] - }, - { - "type": "text", - "id": "CardBrandName", - "name": "BrandName", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "GV2KT", - "name": "logoIcon", - "width": 28, - "height": 28, - "iconFontName": "coffee", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "Pd7fO", - "name": "logoText", - "fill": "#FFFFFF", - "content": "Eggymon Kitchen", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TierBadge", - "name": "TierBadge", - "fill": { - "type": "gradient", - "gradientType": "linear", - "enabled": true, - "rotation": 135, - "size": { - "height": 1 - }, - "colors": [ - { - "color": "#FFD700", - "position": 0 - }, - { - "color": "#FFC700", - "position": 1 - } - ] - }, - "cornerRadius": 12, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000010", - "offset": { - "x": 0, - "y": 2 - }, - "blur": 4 - }, - "gap": 4, - "padding": [ - 5, - 10 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TierBadgeIcon", - "name": "TierIcon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "text", - "id": "TierBadgeText", - "name": "TierText", - "content": "Gold Member", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "700" - }, - { - "type": "icon_font", - "id": "8eSos", - "name": "tierIcon", - "width": 14, - "height": 14, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "#8B6914" - }, - { - "type": "text", - "id": "fANNn", - "name": "tierText", - "fill": "#8B6914", - "content": "Vàng", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "700" - } - ] - } - ] - }, - { - "type": "frame", - "id": "CardMiddleSection", - "name": "MiddleSection", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "MemberName", - "name": "MemberName", - "fill": "#FFFFFF", - "content": "Nguyễn Văn A", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "text", - "id": "MemberId", - "name": "MemberId", - "fill": "#DCC8AF", - "content": "EK-2024-001234", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "frame", - "id": "CardBottomRow", - "name": "BottomRow", - "width": "fill_container", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CardPoints", - "name": "Points", - "fill": "#FFFFFF", - "content": "2,450 điểm", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "700" - }, - { - "type": "text", - "id": "YKSsI", - "name": "pointsLabel", - "fill": "#D4C4B0", - "content": "Điểm tích lũy", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "O4mLl", - "name": "pointsIcon", - "width": 14, - "height": 14, - "iconFontName": "zap", - "iconFontFamily": "lucide", - "fill": "#FFD700" - } - ] - } - ] - }, - { - "type": "frame", - "id": "QRCodeSection", - "name": "QRCodeSection", - "layout": "vertical", - "gap": 8, - "padding": [ - 8, - 0, - 0, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "QRCodeFrame", - "name": "QRCodeFrame", - "width": 160, - "height": 160, - "fill": "#FFFFFF", - "cornerRadius": 16, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000008", - "offset": { - "x": 0, - "y": 2 - }, - "blur": 8 - }, - "layout": "vertical", - "gap": 12, - "padding": 16, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "QRCodeIcon", - "name": "QRIcon", - "width": 90, - "height": 90, - "iconFontName": "qr-code", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "QRCodeLabel", - "name": "QRLabel", - "fill": "$text-secondary", - "content": "QR Code", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "text", - "id": "QRScanText", - "name": "ScanText", - "fill": "$text-secondary", - "content": "Quét mã để tích điểm", - "fontFamily": "Poppins", - "fontSize": 13 - } - ] - }, - { - "type": "frame", - "id": "QuickActionsRow", - "name": "QuickActions", - "width": "fill_container", - "gap": 20, - "padding": [ - 0, - 20 - ], - "justifyContent": "space_around", - "children": [ - { - "type": "frame", - "id": "ActionHistory", - "name": "ActionHistory", - "layout": "vertical", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ActionHistoryIconBg", - "name": "IconBg", - "width": 44, - "height": 44, - "fill": "$bg-elevated", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ActionHistoryIcon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "j5qFJ", - "name": "historyIcon", - "width": 20, - "height": 20, - "iconFontName": "history", - "iconFontFamily": "lucide", - "fill": "$brown-primary" - } - ] - }, - { - "type": "text", - "id": "ActionHistoryLabel", - "name": "Label", - "fill": "$text-primary", - "content": "Lịch sử", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "ActionRewards", - "name": "ActionRewards", - "layout": "vertical", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ActionRewardsIconBg", - "name": "IconBg", - "width": 44, - "height": 44, - "fill": "$bg-elevated", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ActionRewardsIcon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "jyeYW", - "name": "rewardsIcon", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "text", - "id": "ActionRewardsLabel", - "name": "Label", - "fill": "$text-primary", - "content": "Ưu đãi", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "ActionReferral", - "name": "ActionReferral", - "layout": "vertical", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ActionReferralIconBg", - "name": "IconBg", - "width": 44, - "height": 44, - "fill": "$bg-elevated", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ActionReferralIcon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "641iq", - "name": "referralIcon", - "width": 20, - "height": 20, - "iconFontName": "users", - "iconFontFamily": "lucide", - "fill": "$brown-primary" - } - ] - }, - { - "type": "text", - "id": "ActionReferralLabel", - "name": "Label", - "fill": "$text-primary", - "content": "Giới thiệu", - "fontFamily": "Poppins", - "fontSize": 11, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "RecentActivitySection", - "name": "RecentActivity", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "padding": [ - 0, - 20, - 20, - 20 - ], - "children": [ - { - "type": "text", - "id": "RecentActivityTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Hoạt động gần đây", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "ActivityItem1", - "name": "ActivityItem1", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 12, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Activity1IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#DCFCE7", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Activity1Icon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "lCR3h", - "name": "activity1Icon", - "width": 18, - "height": 18, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Activity1Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "text", - "id": "Activity1Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Mua hàng - Combo bánh mì", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Activity1Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "10/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Activity1Points", - "name": "Points", - "fill": "$success", - "content": "+50 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "ActivityItem2", - "name": "ActivityItem2", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 12, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Activity2IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#FFF3E0", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Activity2Icon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "cDqsu", - "name": "activity2Icon", - "width": 18, - "height": 18, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$warning" - } - ] - }, - { - "type": "frame", - "id": "Activity2Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "text", - "id": "Activity2Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Đổi ưu đãi - Giảm 20%", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Activity2Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "08/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Activity2Points", - "name": "Points", - "fill": "$error", - "content": "-100 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "ActivityItem3", - "name": "ActivityItem3", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 12, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Activity3IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#DCFCE7", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Activity3Icon", - "name": "Icon", - "width": 0, - "height": 0, - "iconFontFamily": "lucide" - }, - { - "type": "icon_font", - "id": "DDn1O", - "name": "activity3Icon", - "width": 18, - "height": 18, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Activity3Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "text", - "id": "Activity3Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Mua hàng - Trà sữa", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Activity3Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "05/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Activity3Points", - "name": "Points", - "fill": "$success", - "content": "+30 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/points-history.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/points-history.pen deleted file mode 100644 index 3779e2cf..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/points-history.pen +++ /dev/null @@ -1,799 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "PointsHistoryScreen", - "x": 0, - "y": 0, - "name": "Screen/PointsHistory", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "PointsTopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "PointsBackIcon", - "name": "BackIcon", - "width": 24, - "height": 24, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "PointsTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Lịch sử điểm", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "PointsFilterIcon", - "name": "FilterIcon", - "width": 24, - "height": 24, - "iconFontName": "sliders-horizontal", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - }, - { - "type": "frame", - "id": "PointsScrollContent", - "name": "ScrollContent", - "width": "fill_container", - "layout": "vertical", - "gap": 20, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "PointsSummaryCard", - "name": "SummaryCard", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "gap": 16, - "padding": 20, - "children": [ - { - "type": "text", - "id": "SummaryLabel", - "name": "Label", - "fill": "$text-secondary", - "content": "Tổng điểm hiện tại", - "fontFamily": "Poppins", - "fontSize": 14 - }, - { - "type": "text", - "id": "SummaryTotal", - "name": "TotalPoints", - "fill": "$orange-primary", - "content": "2,450", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "700" - }, - { - "type": "frame", - "id": "SummaryStatsRow", - "name": "StatsRow", - "width": "fill_container", - "gap": 20, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "SummaryEarned", - "name": "Earned", - "layout": "vertical", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "EarnedLabel", - "name": "Label", - "fill": "$text-tertiary", - "content": "Đã tích", - "fontFamily": "Poppins", - "fontSize": 12 - }, - { - "type": "text", - "id": "EarnedValue", - "name": "Value", - "fill": "$success", - "content": "3,200", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "SummaryDivider", - "name": "Divider", - "width": 1, - "height": 40, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "SummaryUsed", - "name": "Used", - "layout": "vertical", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "UsedLabel", - "name": "Label", - "fill": "$text-tertiary", - "content": "Đã dùng", - "fontFamily": "Poppins", - "fontSize": 12 - }, - { - "type": "text", - "id": "UsedValue", - "name": "Value", - "fill": "$text-secondary", - "content": "750", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MonthFilterTabs", - "name": "MonthFilter", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "MonthTab1", - "name": "TabT1", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab1Text", - "fill": "$text-secondary", - "content": "T1", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "MonthTab2", - "name": "TabT2", - "fill": "$orange-primary", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab2Text", - "fill": "$bg-surface", - "content": "T2", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "MonthTab3", - "name": "TabT3", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab3Text", - "fill": "$text-secondary", - "content": "T3", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "MonthTab4", - "name": "TabT4", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab4Text", - "fill": "$text-secondary", - "content": "T4", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "MonthTab5", - "name": "TabT5", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab5Text", - "fill": "$text-secondary", - "content": "T5", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "MonthTab6", - "name": "TabT6", - "fill": "$bg-interactive", - "cornerRadius": 8, - "padding": [ - 6, - 12 - ], - "children": [ - { - "type": "text", - "id": "MonthTab6Text", - "fill": "$text-secondary", - "content": "T6", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "TransactionList", - "name": "TransactionList", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "TxItem1", - "name": "Transaction1", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 14, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Tx1IconBg", - "name": "IconBg", - "width": 40, - "height": 40, - "fill": "#DCFCE7", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Tx1Icon", - "name": "Icon", - "width": 24, - "height": 24, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Tx1Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Tx1Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Mua hàng - Combo bánh mì", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Tx1Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "10/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Tx1Points", - "name": "Points", - "fill": "$success", - "content": "+50 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TxItem2", - "name": "Transaction2", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 14, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Tx2IconBg", - "name": "IconBg", - "width": 40, - "height": 40, - "fill": "#FFF3E0", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Tx2Icon", - "name": "Icon", - "width": 24, - "height": 24, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$warning" - } - ] - }, - { - "type": "frame", - "id": "Tx2Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Tx2Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Đổi ưu đãi - Giảm 20%", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Tx2Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "08/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Tx2Points", - "name": "Points", - "fill": "$orange-primary", - "content": "-100 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TxItem3", - "name": "Transaction3", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 14, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Tx3IconBg", - "name": "IconBg", - "width": 40, - "height": 40, - "fill": "#DCFCE7", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Tx3Icon", - "name": "Icon", - "width": 24, - "height": 24, - "iconFontName": "coffee", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Tx3Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Tx3Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Mua hàng - Trà sữa", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Tx3Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "05/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Tx3Points", - "name": "Points", - "fill": "$success", - "content": "+30 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TxItem4", - "name": "Transaction4", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 14, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Tx4IconBg", - "name": "IconBg", - "width": 40, - "height": 40, - "fill": "#FFF3E0", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Tx4Icon", - "name": "Icon", - "width": 24, - "height": 24, - "iconFontName": "cake", - "iconFontFamily": "lucide", - "fill": "$warning" - } - ] - }, - { - "type": "frame", - "id": "Tx4Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Tx4Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Thưởng sinh nhật", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Tx4Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "01/02/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Tx4Points", - "name": "Points", - "fill": "$success", - "content": "+200 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TxItem5", - "name": "Transaction5", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": [ - 14, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Tx5IconBg", - "name": "IconBg", - "width": 40, - "height": 40, - "fill": "#DCFCE7", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Tx5Icon", - "name": "Icon", - "width": 24, - "height": 24, - "iconFontName": "utensils", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Tx5Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Tx5Desc", - "name": "Description", - "fill": "$text-primary", - "content": "Mua hàng - Cơm trưa", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Tx5Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "28/01/2025", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "text", - "id": "Tx5Points", - "name": "Points", - "fill": "$success", - "content": "+45 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/referral-program.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/referral-program.pen deleted file mode 100644 index a5a40f12..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/referral-program.pen +++ /dev/null @@ -1,997 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "ReferralProgramScreen", - "x": 0, - "y": 0, - "name": "Screen/ReferralProgram", - "reusable": true, - "width": 390, - "height": 1022, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "ReferralTopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 12, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ReferralBackIcon", - "name": "BackIcon", - "width": 24, - "height": 24, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "ReferralScreenTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Giới thiệu bạn bè", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "ReferralTopBarSpacer", - "name": "Spacer", - "width": "fill_container", - "height": 24 - } - ] - }, - { - "type": "frame", - "id": "ReferralScrollContent", - "name": "ScrollContent", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "padding": [ - 16, - 16, - 32, - 16 - ], - "children": [ - { - "type": "frame", - "id": "ReferralHeroBanner", - "name": "HeroBanner", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 20, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "layout": "vertical", - "gap": 8, - "padding": 18, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "HeroIconBg", - "name": "IconBg", - "width": 56, - "height": 56, - "fill": "$bg-interactive", - "cornerRadius": 28, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "HeroUsersIcon", - "name": "Icon", - "width": 28, - "height": 28, - "iconFontName": "users", - "iconFontFamily": "lucide", - "fill": "$brown-primary" - } - ] - }, - { - "type": "text", - "id": "HeroTitle", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Giới thiệu bạn bè", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 19, - "fontWeight": "600" - }, - { - "type": "text", - "id": "HeroSubtitle", - "name": "Subtitle", - "fill": "$text-secondary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Nhận 100 điểm cho mỗi bạn bè đăng ký!", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 13 - } - ] - }, - { - "type": "frame", - "id": "ReferralCodeCard", - "name": "ReferralCodeCard", - "width": "fill_container", - "fill": "$brown-primary", - "cornerRadius": 16, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#FFFFFF33" - }, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#6B442320", - "offset": { - "x": 0, - "y": 4 - }, - "blur": 12 - }, - "layout": "vertical", - "gap": 14, - "padding": 16, - "children": [ - { - "type": "text", - "id": "CodeLabel", - "name": "Label", - "fill": "#FFFFFFCC", - "content": "Mã giới thiệu của bạn", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600", - "letterSpacing": 0.3 - }, - { - "type": "frame", - "id": "CodeBox", - "name": "CodeBox", - "width": "fill_container", - "fill": "#FFFFFF1A", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#FFFFFF1A" - }, - "layout": "vertical", - "padding": [ - 14, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CodeValue", - "name": "Code", - "fill": "#FFFFFF", - "content": "EGGY-VAN-A2024", - "textAlign": "center", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700", - "letterSpacing": 1 - } - ] - }, - { - "type": "frame", - "id": "CodeActionRow", - "name": "ActionRow", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "CopyButton", - "name": "CopyButton", - "width": "fill_container", - "height": 44, - "fill": "#FFFFFF1A", - "cornerRadius": 10, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#FFFFFF1A" - }, - "gap": 6, - "padding": [ - 12, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "CopyIcon", - "name": "Icon", - "width": 16, - "height": 16, - "iconFontName": "copy", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "CopyText", - "name": "Text", - "fill": "#FFFFFF", - "content": "Sao chép", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "ShareButton", - "name": "ShareButton", - "width": "fill_container", - "height": 44, - "fill": "$orange-primary", - "cornerRadius": 10, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#FF6B3533", - "offset": { - "x": 0, - "y": 2 - }, - "blur": 4 - }, - "gap": 6, - "padding": [ - 12, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ShareIcon", - "name": "Icon", - "width": 16, - "height": 16, - "iconFontName": "share-2", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "ShareText", - "name": "Text", - "fill": "#FFFFFF", - "content": "Chia sẻ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "ReferralStatsRow", - "name": "StatsRow", - "width": "fill_container", - "gap": 10, - "children": [ - { - "type": "frame", - "id": "StatReferred", - "name": "Referred", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000008", - "offset": { - "x": 0, - "y": 1 - }, - "blur": 3 - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "StatReferredLabel", - "name": "Label", - "fill": "$text-secondary", - "content": "Đã giới thiệu", - "fontFamily": "Poppins", - "fontSize": 12 - }, - { - "type": "text", - "id": "StatReferredValue", - "name": "Value", - "fill": "$text-primary", - "content": "5", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - } - ] - }, - { - "type": "frame", - "id": "StatPointsEarned", - "name": "PointsEarned", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000008", - "offset": { - "x": 0, - "y": 1 - }, - "blur": 3 - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "StatPointsLabel", - "name": "Label", - "fill": "$text-secondary", - "content": "Điểm nhận", - "fontFamily": "Poppins", - "fontSize": 12 - }, - { - "type": "text", - "id": "StatPointsValue", - "name": "Value", - "fill": "$orange-primary", - "content": "500", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - } - ] - } - ] - }, - { - "type": "frame", - "id": "HowItWorksSection", - "name": "HowItWorks", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "layout": "vertical", - "gap": 12, - "padding": 16, - "children": [ - { - "type": "text", - "id": "HowItWorksTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Cách thức hoạt động", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600", - "letterSpacing": 0.2 - }, - { - "type": "frame", - "id": "Step1", - "name": "Step1", - "width": "fill_container", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step1IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "$bg-elevated", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step1Icon", - "name": "Icon", - "width": 18, - "height": 18, - "iconFontName": "share", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Step1Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step1Label", - "name": "Label", - "fill": "$text-tertiary", - "content": "Bước 1", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500", - "letterSpacing": 0.5 - }, - { - "type": "text", - "id": "Step1Text", - "name": "Text", - "fill": "$text-primary", - "content": "Chia sẻ mã cho bạn bè", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step2", - "name": "Step2", - "width": "fill_container", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step2IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "$bg-elevated", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step2Icon", - "name": "Icon", - "width": 18, - "height": 18, - "iconFontName": "user-plus", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Step2Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step2Label", - "name": "Label", - "fill": "$text-tertiary", - "content": "Bước 2", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500", - "letterSpacing": 0.5 - }, - { - "type": "text", - "id": "Step2Text", - "name": "Text", - "fill": "$text-primary", - "content": "Bạn bè đăng ký & mua hàng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step3", - "name": "Step3", - "width": "fill_container", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step3IconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "$bg-elevated", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step3Icon", - "name": "Icon", - "width": 18, - "height": 18, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Step3Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step3Label", - "name": "Label", - "fill": "$text-tertiary", - "content": "Bước 3", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500", - "letterSpacing": 0.5 - }, - { - "type": "text", - "id": "Step3Text", - "name": "Text", - "fill": "$text-primary", - "content": "Cả hai nhận 100 điểm!", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "FriendsListSection", - "name": "FriendsList", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "children": [ - { - "type": "text", - "id": "FriendsListTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Bạn bè đã giới thiệu", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600", - "letterSpacing": 0.2 - }, - { - "type": "frame", - "id": "FriendItem1", - "name": "Friend1", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 10, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Friend1Avatar", - "name": "Avatar", - "width": 44, - "height": 44, - "fill": "$bg-interactive", - "cornerRadius": 24, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Friend1Initial", - "name": "Initial", - "fill": "$brown-primary", - "content": "TB", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "Friend1Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "justifyContent": "center", - "children": [ - { - "type": "text", - "id": "Friend1Name", - "name": "Name", - "fill": "$text-primary", - "content": "Trần Bình", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Friend1Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "Tham gia 05/01/2025", - "fontFamily": "Poppins", - "fontSize": 11 - } - ] - }, - { - "type": "text", - "id": "Friend1Points", - "name": "Points", - "fill": "$success", - "content": "+100 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "FriendItem2", - "name": "Friend2", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 10, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Friend2Avatar", - "name": "Avatar", - "width": 44, - "height": 44, - "fill": "$bg-interactive", - "cornerRadius": 24, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Friend2Initial", - "name": "Initial", - "fill": "$brown-primary", - "content": "LH", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "Friend2Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "justifyContent": "center", - "children": [ - { - "type": "text", - "id": "Friend2Name", - "name": "Name", - "fill": "$text-primary", - "content": "Lê Hương", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Friend2Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "Tham gia 20/12/2024", - "fontFamily": "Poppins", - "fontSize": 11 - } - ] - }, - { - "type": "text", - "id": "Friend2Points", - "name": "Points", - "fill": "$success", - "content": "+100 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "FriendItem3", - "name": "Friend3", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-subtle" - }, - "gap": 10, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Friend3Avatar", - "name": "Avatar", - "width": 44, - "height": 44, - "fill": "$bg-interactive", - "cornerRadius": 24, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Friend3Initial", - "name": "Initial", - "fill": "$brown-primary", - "content": "PM", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "Friend3Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "justifyContent": "center", - "children": [ - { - "type": "text", - "id": "Friend3Name", - "name": "Name", - "fill": "$text-primary", - "content": "Phạm Minh", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Friend3Date", - "name": "Date", - "fill": "$text-tertiary", - "content": "Tham gia 15/11/2024", - "fontFamily": "Poppins", - "fontSize": 11 - } - ] - }, - { - "type": "text", - "id": "Friend3Points", - "name": "Points", - "fill": "$success", - "content": "+100 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/rewards-catalog.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/rewards-catalog.pen deleted file mode 100644 index 7f63b381..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/rewards-catalog.pen +++ /dev/null @@ -1,979 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "RewardsCatalogScreen", - "x": 0, - "y": 0, - "name": "Screen/RewardsCatalog", - "reusable": true, - "width": 390, - "height": 911, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "RewardsTopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RewardsBackIcon", - "name": "BackIcon", - "width": 24, - "height": 24, - "iconFontName": "chevron-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "frame", - "id": "wU2Gs", - "name": "titleWrapper", - "width": "fill_container", - "height": "fill_container", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "RewardsScreenTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Đổi thưởng", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - }, - { - "type": "icon_font", - "id": "RewardsFilterIcon", - "name": "FilterIcon", - "width": 24, - "height": 24, - "iconFontName": "sliders-horizontal", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - }, - { - "type": "frame", - "id": "RewardsScrollContent", - "name": "ScrollContent", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": [ - 16, - 20, - 20, - 20 - ], - "children": [ - { - "type": "frame", - "id": "PointsBalanceBar", - "name": "PointsBalance", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 12, - "padding": [ - 14, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BalanceLeft", - "name": "Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "BalanceIcon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "coins", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - }, - { - "type": "text", - "id": "BalanceText", - "name": "Text", - "fill": "$text-primary", - "content": "Bạn có 2,450 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "BalanceArrow", - "name": "Arrow", - "width": 20, - "height": 20, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - } - ] - }, - { - "type": "frame", - "id": "CategoryTabs", - "name": "CategoryTabs", - "width": "fill_container", - "gap": 8, - "children": [ - { - "type": "frame", - "id": "CatTabAll", - "name": "TabAll", - "fill": "$orange-primary", - "cornerRadius": 20, - "padding": [ - 8, - 14 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CatTabAllText", - "fill": "#FFFFFF", - "content": "Tất cả", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "CatTabDiscount", - "name": "TabDiscount", - "fill": "$bg-interactive", - "cornerRadius": 20, - "padding": [ - 8, - 14 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CatTabDiscountText", - "fill": "$text-secondary", - "content": "Giảm giá", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatTabFree", - "name": "TabFree", - "fill": "$bg-interactive", - "cornerRadius": 20, - "padding": [ - 8, - 14 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CatTabFreeText", - "fill": "$text-secondary", - "content": "Miễn phí", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatTabGifts", - "name": "TabGifts", - "fill": "$bg-interactive", - "cornerRadius": 20, - "padding": [ - 8, - 14 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CatTabGiftsText", - "fill": "$text-secondary", - "content": "Quà tặng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "RewardsGrid", - "name": "RewardsGrid", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "4yWVT", - "name": "row1", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "RewardCard1", - "name": "RewardCoffee", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward1ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward1Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "coffee", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Reward1Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward1Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "1 ly cà phê miễn phí", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward1Points", - "name": "Points", - "fill": "$orange-primary", - "content": "200 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward1Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward1BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "RewardCard2", - "name": "RewardDiscount", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward2ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward2Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "percent", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Reward2Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward2Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Giảm 20% đơn tiếp theo", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward2Points", - "name": "Points", - "fill": "$orange-primary", - "content": "100 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward2Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward2BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "Dw1Yp", - "name": "row2", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "RewardCard3", - "name": "RewardCombo", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward3ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward3Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "sandwich", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Reward3Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward3Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Combo bánh + nước -50%", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward3Points", - "name": "Points", - "fill": "$orange-primary", - "content": "350 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward3Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward3BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "RewardCard4", - "name": "RewardShirt", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward4ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward4Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "shirt", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - }, - { - "type": "frame", - "id": "Reward4Tag", - "name": "Tag", - "fill": "$error", - "cornerRadius": 6, - "padding": [ - 3, - 8 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward4TagText", - "fill": "#FFFFFF", - "content": "Sắp hết", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Reward4Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward4Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Áo thun EggyMon", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward4Points", - "name": "Points", - "fill": "$orange-primary", - "content": "500 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward4Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward4BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "x81EV", - "name": "row3", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "RewardCard5", - "name": "RewardMealSet", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward5ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward5Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "utensils", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Reward5Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward5Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Set ăn miễn phí", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward5Points", - "name": "Points", - "fill": "$orange-primary", - "content": "800 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward5Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward5BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "RewardCard6", - "name": "RewardVIP", - "width": 166, - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "Reward6ImageArea", - "name": "ImageArea", - "width": "fill_container", - "height": 100, - "fill": "#FFE5D9", - "cornerRadius": [ - 16, - 16, - 0, - 0 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Reward6Icon", - "name": "Icon", - "width": 48, - "height": 48, - "iconFontName": "crown", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - } - ] - }, - { - "type": "frame", - "id": "Reward6Info", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "text", - "id": "Reward6Title", - "name": "Title", - "fill": "$text-primary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Nâng hạng VIP", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Reward6Points", - "name": "Points", - "fill": "$orange-primary", - "content": "1000 điểm", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "Reward6Button", - "name": "Button", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Reward6BtnText", - "name": "BtnText", - "fill": "#FFFFFF", - "content": "Đổi ngay", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/tier-progress.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/tier-progress.pen deleted file mode 100644 index cb98a618..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/loyalty/tier-progress.pen +++ /dev/null @@ -1,693 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "TierProgressScreen", - "x": 0, - "y": 0, - "name": "Screen/TierProgress", - "reusable": true, - "width": 390, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "TierTopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "gap": 8, - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TierBackIcon", - "name": "BackIcon", - "width": 24, - "height": 24, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "TierScreenTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Hạng thành viên", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "TierScrollContent", - "name": "ScrollContent", - "width": "fill_container", - "layout": "vertical", - "gap": 24, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "CurrentTierCard", - "name": "CurrentTierCard", - "width": "fill_container", - "fill": "#FFD700", - "cornerRadius": 20, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000015", - "offset": { - "x": 0, - "y": 4 - }, - "blur": 12 - }, - "layout": "vertical", - "gap": 16, - "padding": 24, - "children": [ - { - "type": "icon_font", - "id": "TierCrownIcon", - "name": "CrownIcon", - "width": 32, - "height": 32, - "iconFontName": "crown", - "iconFontFamily": "lucide", - "fill": "#1F2937" - }, - { - "type": "text", - "id": "TierCurrentLabel", - "name": "TierLabel", - "fill": "#1F2937", - "content": "Gold Member", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "700" - }, - { - "type": "text", - "id": "TierMemberName", - "name": "MemberName", - "fill": "#374151", - "content": "Nguyễn Văn A", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "500" - }, - { - "type": "text", - "id": "TierPointsProgress", - "name": "PointsProgress", - "fill": "#4B5563", - "content": "2,450 / 5,000 điểm", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "TierProgressBarBg", - "name": "ProgressBarBg", - "width": "fill_container", - "height": 12, - "fill": "#FFFFFF66", - "cornerRadius": 6, - "children": [ - { - "type": "frame", - "id": "TierProgressBarFill", - "name": "ProgressBarFill", - "width": 148, - "height": 12, - "fill": "#FFFFFF", - "cornerRadius": 6 - } - ] - }, - { - "type": "text", - "id": "TierRemainingText", - "name": "RemainingText", - "fill": "#6B7280", - "content": "Còn 2,550 điểm để lên Platinum", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - }, - { - "type": "frame", - "id": "TierRoadmapSection", - "name": "TierRoadmap", - "width": "fill_container", - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TierRoadmapBronze", - "name": "BronzeTier", - "width": "fill_container", - "fill": "#F9FAFB", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#E5E7EB" - }, - "gap": 12, - "padding": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "BronzeIconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#CD7F32", - "cornerRadius": 18, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "BronzeCheckIcon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "frame", - "id": "BronzeInfo", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "BronzeName", - "name": "Name", - "fill": "#1F2937", - "content": "Bronze", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "BronzeDesc", - "name": "Description", - "fill": "#6B7280", - "content": "0 điểm - Tích điểm cơ bản", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - } - ] - }, - { - "type": "frame", - "id": "TierConnectorLine1", - "name": "Connector1", - "width": 2, - "height": 20, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "TierRoadmapSilver", - "name": "SilverTier", - "width": "fill_container", - "fill": "#F9FAFB", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#E5E7EB" - }, - "gap": 12, - "padding": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "SilverIconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#C0C0C0", - "cornerRadius": 18, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "SilverCheckIcon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "frame", - "id": "SilverInfo", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "SilverName", - "name": "Name", - "fill": "#1F2937", - "content": "Silver", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "SilverDesc", - "name": "Description", - "fill": "#6B7280", - "content": "500 điểm - Giảm 5% mọi đơn", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - } - ] - }, - { - "type": "frame", - "id": "TierConnectorLine2", - "name": "Connector2", - "width": 2, - "height": 20, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "TierRoadmapGold", - "name": "GoldTier", - "width": "fill_container", - "fill": "#FFF8E1", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 2, - "fill": "#FFD700" - }, - "gap": 12, - "padding": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "GoldIconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#FFD700", - "cornerRadius": 18, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "GoldStarIcon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "#1F2937" - } - ] - }, - { - "type": "frame", - "id": "GoldInfo", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "GoldName", - "name": "Name", - "fill": "#1F2937", - "content": "Gold (Hiện tại)", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "700" - }, - { - "type": "text", - "id": "GoldDesc", - "name": "Description", - "fill": "#1F2937", - "content": "2,000 điểm - Giảm 10%, x2 điểm", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - } - ] - }, - { - "type": "frame", - "id": "TierConnectorLine3", - "name": "Connector3", - "width": 2, - "height": 20, - "fill": "$border-default" - }, - { - "type": "frame", - "id": "TierRoadmapPlatinum", - "name": "PlatinumTier", - "opacity": 0.6, - "width": "fill_container", - "fill": "#F9FAFB", - "cornerRadius": 12, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#E5E7EB" - }, - "gap": 12, - "padding": 16, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "PlatinumIconBg", - "name": "IconBg", - "width": 36, - "height": 36, - "fill": "#A78BFA", - "cornerRadius": 18, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "PlatinumLockIcon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "lock", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - } - ] - }, - { - "type": "frame", - "id": "PlatinumInfo", - "name": "Info", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "PlatinumName", - "name": "Name", - "fill": "#1F2937", - "content": "Platinum", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "PlatinumDesc", - "name": "Description", - "fill": "#6B7280", - "content": "5,000 điểm - Giảm 15%, x3 điểm, VIP", - "fontFamily": "Poppins", - "fontSize": 12 - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "GoldBenefitsSection", - "name": "GoldBenefits", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "effect": { - "type": "shadow", - "shadowType": "outer", - "color": "#00000010", - "offset": { - "x": 0, - "y": 2 - }, - "blur": 8 - }, - "layout": "vertical", - "gap": 16, - "padding": 20, - "children": [ - { - "type": "text", - "id": "BenefitsTitle", - "name": "Title", - "fill": "$text-primary", - "content": "Quyền lợi Gold", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "Benefit1", - "name": "Benefit1", - "width": "fill_container", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Benefit1Icon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "tag", - "iconFontFamily": "lucide", - "fill": "#10B981" - }, - { - "type": "text", - "id": "Benefit1Text", - "name": "Text", - "fill": "$text-primary", - "content": "Giảm 10% tất cả đơn hàng", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "Benefit2", - "name": "Benefit2", - "width": "fill_container", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Benefit2Icon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "zap", - "iconFontFamily": "lucide", - "fill": "#F59E0B" - }, - { - "type": "text", - "id": "Benefit2Text", - "name": "Text", - "fill": "$text-primary", - "content": "Tích điểm x2", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Benefit3", - "name": "Benefit3", - "width": "fill_container", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Benefit3Icon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "#EC4899" - }, - { - "type": "text", - "id": "Benefit3Text", - "name": "Text", - "fill": "$text-primary", - "content": "Ưu đãi sinh nhật đặc biệt", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - }, - { - "type": "frame", - "id": "Benefit4", - "name": "Benefit4", - "width": "fill_container", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Benefit4Icon", - "name": "Icon", - "width": 20, - "height": 20, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "#8B5CF6" - }, - { - "type": "text", - "id": "Benefit4Text", - "name": "Text", - "fill": "$text-primary", - "content": "Ưu tiên phục vụ", - "fontFamily": "Poppins", - "fontSize": 14 - } - ] - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/cart-checkout.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/cart-checkout.pen deleted file mode 100644 index 95b9f9c1..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/cart-checkout.pen +++ /dev/null @@ -1,1015 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "CartCheckoutScreen", - "x": 0, - "y": 0, - "name": "POS/CartCheckout", - "reusable": true, - "width": 390, - "height": 844, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "CartTopBar", - "name": "CartTopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "CartBackIcon", - "name": "CartBackIcon", - "width": 24, - "height": 24, - "iconFontName": "arrow-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "CartTopTitle", - "name": "CartTopTitle", - "fill": "$text-primary", - "content": "Giỏ hàng", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "text", - "id": "CartClearAll", - "name": "CartClearAll", - "fill": "$orange-primary", - "content": "Xóa tất cả", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CartScrollContent", - "name": "CartScrollContent", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": [ - 16, - 16, - 80, - 16 - ], - "children": [ - { - "type": "frame", - "id": "CartItem1", - "name": "CartItem1", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "CartItem1Img", - "name": "CartItem1Img", - "width": 60, - "height": 60, - "fill": "#FFE5D9", - "cornerRadius": 10 - }, - { - "type": "frame", - "id": "CartItem1Info", - "name": "CartItem1Info", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "CartItem1Name", - "name": "CartItem1Name", - "fill": "$text-primary", - "content": "Cơm trứng chiên", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "CartItem1Options", - "name": "CartItem1Options", - "fill": "$text-secondary", - "content": "Vừa, +Trứng", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "CartItem1Bottom", - "name": "CartItem1Bottom", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem1Qty", - "name": "CartItem1Qty", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem1QtyMinus", - "name": "CartItem1QtyMinus", - "width": 28, - "height": 28, - "fill": "$bg-interactive", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem1MinusText", - "name": "CartItem1MinusText", - "fill": "$text-primary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "CartItem1QtyNum", - "name": "CartItem1QtyNum", - "fill": "$text-primary", - "content": "2", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "CartItem1QtyPlus", - "name": "CartItem1QtyPlus", - "width": 28, - "height": 28, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem1PlusText", - "name": "CartItem1PlusText", - "fill": "#FFFFFF", - "content": "+", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "text", - "id": "CartItem1Price", - "name": "CartItem1Price", - "fill": "$orange-primary", - "content": "100,000d", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "700" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "CartItem2", - "name": "CartItem2", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "CartItem2Img", - "name": "CartItem2Img", - "width": 60, - "height": 60, - "fill": "#E5F0FF", - "cornerRadius": 10 - }, - { - "type": "frame", - "id": "CartItem2Info", - "name": "CartItem2Info", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "CartItem2Name", - "name": "CartItem2Name", - "fill": "$text-primary", - "content": "Trà sữa oolong", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "CartItem2Options", - "name": "CartItem2Options", - "fill": "$text-secondary", - "content": "Size L", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "CartItem2Bottom", - "name": "CartItem2Bottom", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem2Qty", - "name": "CartItem2Qty", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem2QtyMinus", - "name": "CartItem2QtyMinus", - "width": 28, - "height": 28, - "fill": "$bg-interactive", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem2MinusText", - "name": "CartItem2MinusText", - "fill": "$text-primary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "CartItem2QtyNum", - "name": "CartItem2QtyNum", - "fill": "$text-primary", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "CartItem2QtyPlus", - "name": "CartItem2QtyPlus", - "width": 28, - "height": 28, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem2PlusText", - "name": "CartItem2PlusText", - "fill": "#FFFFFF", - "content": "+", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "text", - "id": "CartItem2Price", - "name": "CartItem2Price", - "fill": "$orange-primary", - "content": "40,000d", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "700" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "CartItem3", - "name": "CartItem3", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "gap": 12, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "CartItem3Img", - "name": "CartItem3Img", - "width": 60, - "height": 60, - "fill": "#F0FFE5", - "cornerRadius": 10 - }, - { - "type": "frame", - "id": "CartItem3Info", - "name": "CartItem3Info", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "CartItem3Name", - "name": "CartItem3Name", - "fill": "$text-primary", - "content": "Bánh mì trứng ốp la", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "CartItem3Options", - "name": "CartItem3Options", - "fill": "$text-secondary", - "content": "Ghi chú: Không hành", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "CartItem3Bottom", - "name": "CartItem3Bottom", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem3Qty", - "name": "CartItem3Qty", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "CartItem3QtyMinus", - "name": "CartItem3QtyMinus", - "width": 28, - "height": 28, - "fill": "$bg-interactive", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem3MinusText", - "name": "CartItem3MinusText", - "fill": "$text-primary", - "content": "-", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "text", - "id": "CartItem3QtyNum", - "name": "CartItem3QtyNum", - "fill": "$text-primary", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "CartItem3QtyPlus", - "name": "CartItem3QtyPlus", - "width": 28, - "height": 28, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartItem3PlusText", - "name": "CartItem3PlusText", - "fill": "#FFFFFF", - "content": "+", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "text", - "id": "CartItem3Price", - "name": "CartItem3Price", - "fill": "$orange-primary", - "content": "25,000d", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "700" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "VoucherSection", - "name": "VoucherSection", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 8, - "padding": [ - 10, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "VoucherIcon", - "name": "VoucherIcon", - "width": 20, - "height": 20, - "iconFontName": "ticket", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - }, - { - "type": "text", - "id": "VoucherInput", - "name": "VoucherInput", - "fill": "$text-tertiary", - "content": "Nhập mã giảm giá", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "VoucherApply", - "name": "VoucherApply", - "fill": "$orange-primary", - "cornerRadius": 8, - "padding": [ - 6, - 14 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "VoucherApplyText", - "name": "VoucherApplyText", - "fill": "#FFFFFF", - "content": "Áp dụng", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "LoyaltyRow", - "name": "LoyaltyRow", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 12, - "padding": [ - 12, - 14 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "LoyaltyLeft", - "name": "LoyaltyLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "LoyaltyIcon", - "name": "LoyaltyIcon", - "width": 20, - "height": 20, - "iconFontName": "gift", - "iconFontFamily": "lucide", - "fill": "$success" - }, - { - "type": "text", - "id": "LoyaltyText", - "name": "LoyaltyText", - "fill": "$text-primary", - "content": "Dùng 200 điểm (-20,000đ)", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "LoyaltyToggle", - "name": "LoyaltyToggle", - "width": 44, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "padding": 2, - "justifyContent": "end", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "LoyaltyToggleThumb", - "name": "LoyaltyToggleThumb", - "width": 20, - "height": 20, - "fill": "#FFFFFF", - "cornerRadius": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "OrderTypeSection", - "name": "OrderTypeSection", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "OrderTypeDineIn", - "name": "OrderTypeDineIn", - "width": "fill_container", - "height": 56, - "fill": "$orange-primary", - "cornerRadius": 12, - "gap": 8, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "DineInIcon", - "name": "DineInIcon", - "width": 24, - "height": 24, - "iconFontName": "utensils", - "iconFontFamily": "lucide", - "fill": "#FFFFFF" - }, - { - "type": "text", - "id": "DineInText", - "name": "DineInText", - "fill": "#FFFFFF", - "content": "Tại quán", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "OrderTypeTakeaway", - "name": "OrderTypeTakeaway", - "width": "fill_container", - "height": 56, - "fill": "$bg-interactive", - "cornerRadius": 12, - "gap": 8, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TakeawayIcon", - "name": "TakeawayIcon", - "width": 24, - "height": 24, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "TakeawayText", - "name": "TakeawayText", - "fill": "$text-secondary", - "content": "Mang đi", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "PickupTimeSection", - "name": "PickupTimeSection", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "PickupNow", - "name": "PickupNow", - "width": "fill_container", - "height": 44, - "fill": "$orange-primary", - "cornerRadius": 10, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PickupNowText", - "name": "PickupNowText", - "fill": "#FFFFFF", - "content": "Nhận ngay", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PickupSchedule", - "name": "PickupSchedule", - "width": "fill_container", - "height": 44, - "fill": "$bg-interactive", - "cornerRadius": 10, - "gap": 6, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PickupScheduleText", - "name": "PickupScheduleText", - "fill": "$text-secondary", - "content": "Đặt trước", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "PickupScheduleTime", - "name": "PickupScheduleTime", - "fill": "$text-primary", - "content": "15:30", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "PriceSummary", - "name": "PriceSummary", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 10, - "padding": 20, - "children": [ - { - "type": "frame", - "id": "SummarySubtotal", - "name": "SummarySubtotal", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "SubtotalLabel", - "name": "SubtotalLabel", - "fill": "$text-secondary", - "content": "Tạm tính", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "SubtotalValue", - "name": "SubtotalValue", - "fill": "$text-primary", - "content": "165,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "SummaryVoucher", - "name": "SummaryVoucher", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "VoucherDiscLabel", - "name": "VoucherDiscLabel", - "fill": "$text-secondary", - "content": "Giảm giá voucher", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "VoucherDiscValue", - "name": "VoucherDiscValue", - "fill": "$success", - "content": "-15,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "SummaryLoyalty", - "name": "SummaryLoyalty", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LoyaltyDiscLabel", - "name": "LoyaltyDiscLabel", - "fill": "$text-secondary", - "content": "Điểm loyalty", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "LoyaltyDiscValue", - "name": "LoyaltyDiscValue", - "fill": "$success", - "content": "-20,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "SummaryDivider", - "name": "SummaryDivider", - "width": "fill_container", - "height": 1, - "fill": "$border-subtle" - }, - { - "type": "frame", - "id": "SummaryTotal", - "name": "SummaryTotal", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "TotalLabel", - "name": "TotalLabel", - "fill": "$text-primary", - "content": "Tổng cộng", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "700" - }, - { - "type": "text", - "id": "TotalValue", - "name": "TotalValue", - "fill": "$orange-primary", - "content": "130,000d", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "CartBottomBar", - "name": "CartBottomBar", - "width": "fill_container", - "height": 80, - "fill": "$bg-surface", - "layout": "vertical", - "padding": [ - 12, - 20 - ], - "children": [ - { - "type": "frame", - "id": "CheckoutBtn", - "name": "CheckoutBtn", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CheckoutBtnText", - "name": "CheckoutBtnText", - "fill": "#FFFFFF", - "content": "Đặt hàng - 130,000đ", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/item-detail.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/item-detail.pen deleted file mode 100644 index 0e6cd3fa..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/item-detail.pen +++ /dev/null @@ -1,854 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "ItemDetailScreen", - "x": 0, - "y": 0, - "name": "POS/ItemDetail", - "reusable": true, - "width": 390, - "height": 1176, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "DetailTopBar", - "name": "DetailTopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "DetailBackIcon", - "name": "DetailBackIcon", - "width": 24, - "height": 24, - "iconFontName": "chevron-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "DetailTopTitle", - "name": "DetailTopTitle", - "fill": "$text-primary", - "content": "Chi tiết món", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "DetailFavIcon", - "name": "DetailFavIcon", - "width": 24, - "height": 24, - "iconFontName": "heart", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - } - ] - }, - { - "type": "frame", - "id": "DetailScrollContent", - "name": "DetailScrollContent", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "DetailImageArea", - "name": "DetailImageArea", - "metadata": { - "type": "unsplash", - "username": "madeline_sd", - "link": "https://unsplash.com/@madeline_sd", - "author": "Madeline Liu" - }, - "width": "fill_container", - "height": 240, - "fill": { - "type": "image", - "enabled": true, - "url": "https://images.unsplash.com/photo-1717749790652-f3db782af52e?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w4NDM0ODN8MHwxfHJhbmRvbXx8fHx8fHx8fDE3NzA4MjA1ODV8&ixlib=rb-4.1.0&q=80&w=1080", - "mode": "fill" - }, - "cornerRadius": [ - 0, - 0, - 24, - 24 - ], - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center" - }, - { - "type": "frame", - "id": "DetailInfoSection", - "name": "DetailInfoSection", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": 20, - "children": [ - { - "type": "text", - "id": "DetailItemTitle", - "name": "DetailItemTitle", - "fill": "$text-primary", - "content": "Cơm trứng chiên đặc biệt", - "fontFamily": "Poppins", - "fontSize": 22, - "fontWeight": "700" - }, - { - "type": "frame", - "id": "DetailMetaRow", - "name": "DetailMetaRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "DetailRatingGroup", - "name": "DetailRatingGroup", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "jItXZ", - "name": "DetailStarIcon", - "width": 14, - "height": 14, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$warning" - }, - { - "type": "text", - "id": "aTYHX", - "name": "DetailRatingText", - "fill": "$text-secondary", - "content": "4.8", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "DetailTimeGroup", - "name": "DetailTimeGroup", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "su4KQ", - "name": "DetailClockIcon", - "width": 14, - "height": 14, - "iconFontName": "clock-3", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "KK8z7", - "name": "DetailTimeText", - "fill": "$text-secondary", - "content": "15-20 phút", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "DetailPrice", - "name": "DetailPrice", - "fill": "$orange-primary", - "content": "45,000d", - "fontFamily": "Poppins", - "fontSize": 24, - "fontWeight": "700" - }, - { - "type": "text", - "id": "DetailDesc", - "name": "DetailDesc", - "fill": "$text-secondary", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Cơm trắng dẻo thơm với trứng chiên vàng giòn, kèm xúc xích, rau xà lách và nước tương đặc biệt.", - "lineHeight": 1.5, - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "SizeSection", - "name": "SizeSection", - "width": "fill_container", - "layout": "vertical", - "gap": 12, - "padding": [ - 12, - 20 - ], - "children": [ - { - "type": "text", - "id": "SizeLabel", - "name": "SizeLabel", - "fill": "$text-primary", - "content": "Kích cỡ", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "SizeOptions", - "name": "SizeOptions", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "SizeSmall", - "name": "SizeSmall", - "width": "fill_container", - "height": 42, - "fill": "$bg-interactive", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "8sOQJ", - "name": "SizeSmallText", - "fill": "$text-secondary", - "content": "Nhỏ", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "SizeMedium", - "name": "SizeMedium", - "width": "fill_container", - "height": 42, - "fill": "$orange-primary", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LsatE", - "name": "SizeMediumText", - "fill": "$bg-surface", - "content": "Vừa", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "SizeLarge", - "name": "SizeLarge", - "width": "fill_container", - "height": 42, - "fill": "$bg-interactive", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "C5HoM", - "name": "SizeLargeText", - "fill": "$text-secondary", - "content": "Lớn +10,000đ", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "ToppingSection", - "name": "ToppingSection", - "width": "fill_container", - "layout": "vertical", - "gap": 14, - "padding": [ - 12, - 20 - ], - "children": [ - { - "type": "text", - "id": "ToppingLabel", - "name": "ToppingLabel", - "fill": "$text-primary", - "content": "Thêm topping", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "Topping1", - "name": "Topping1", - "width": "fill_container", - "height": 44, - "padding": [ - 0, - 4 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Topping1Left", - "name": "Topping1Left", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "82R7Z", - "name": "Topping1Check", - "width": 20, - "height": 20, - "cornerRadius": 6, - "stroke": { - "thickness": 2, - "fill": "$border-default" - } - }, - { - "type": "text", - "id": "shhUO", - "name": "Topping1Name", - "fill": "$text-primary", - "content": "Trứng ốp la", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "Topping1Price", - "name": "Topping1Price", - "fill": "$text-secondary", - "content": "+5,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Topping2", - "name": "Topping2", - "width": "fill_container", - "height": 44, - "padding": [ - 0, - 4 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Topping2Left", - "name": "Topping2Left", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "V0gge", - "name": "Topping2Check", - "width": 20, - "height": 20, - "fill": "$orange-primary", - "cornerRadius": 6, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "6UlRe", - "name": "t2Icon", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - }, - { - "type": "text", - "id": "hHSLJ", - "name": "Topping2Name", - "fill": "$text-primary", - "content": "Phô mai", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "Topping2Price", - "name": "Topping2Price", - "fill": "$text-secondary", - "content": "+8,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Topping3", - "name": "Topping3", - "width": "fill_container", - "height": 44, - "padding": [ - 0, - 4 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Topping3Left", - "name": "Topping3Left", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "raejk", - "name": "Topping3Check", - "width": 20, - "height": 20, - "cornerRadius": 6, - "stroke": { - "thickness": 2, - "fill": "$border-default" - } - }, - { - "type": "text", - "id": "j1UGc", - "name": "Topping3Name", - "fill": "$text-primary", - "content": "Xúc xích", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "Topping3Price", - "name": "Topping3Price", - "fill": "$text-secondary", - "content": "+6,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Topping4", - "name": "Topping4", - "width": "fill_container", - "height": 44, - "padding": [ - 0, - 4 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Topping4Left", - "name": "Topping4Left", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "RrI77", - "name": "Topping4Check", - "width": 20, - "height": 20, - "cornerRadius": 6, - "stroke": { - "thickness": 2, - "fill": "$border-default" - } - }, - { - "type": "text", - "id": "GjPTt", - "name": "Topping4Name", - "fill": "$text-primary", - "content": "Rau củ", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "text", - "id": "Topping4Price", - "name": "Topping4Price", - "fill": "$text-secondary", - "content": "+3,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "NoteSection", - "name": "NoteSection", - "width": "fill_container", - "layout": "vertical", - "gap": 10, - "padding": [ - 12, - 20, - 20, - 20 - ], - "children": [ - { - "type": "text", - "id": "NoteLabel", - "name": "NoteLabel", - "fill": "$text-primary", - "content": "Ghi chú đặc biệt", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "NoteInput", - "name": "NoteInput", - "width": "fill_container", - "height": 72, - "fill": "$bg-elevated", - "cornerRadius": 12, - "stroke": { - "thickness": 1.5, - "fill": "$border-default" - }, - "padding": [ - 12, - 14 - ], - "children": [ - { - "type": "text", - "id": "NotePlaceholder", - "name": "NotePlaceholder", - "fill": "$text-tertiary", - "content": "VD: Ít muối, không hành...", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "QtySection", - "name": "QtySection", - "width": "fill_container", - "gap": 20, - "padding": [ - 12, - 20, - 20, - 20 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "QtyMinus", - "name": "QtyMinus", - "width": 40, - "height": 40, - "fill": "$bg-interactive", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "QtyMinusIcon", - "name": "QtyMinusIcon", - "width": 20, - "height": 20, - "iconFontName": "minus", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - } - ] - }, - { - "type": "text", - "id": "QtyValue", - "name": "QtyValue", - "fill": "$text-primary", - "content": "1", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700" - }, - { - "type": "frame", - "id": "QtyPlus", - "name": "QtyPlus", - "width": 40, - "height": 40, - "fill": "$orange-primary", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "QtyPlusIcon", - "name": "QtyPlusIcon", - "width": 20, - "height": 20, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "DetailBottomBar", - "name": "DetailBottomBar", - "width": "fill_container", - "height": 80, - "fill": "$bg-surface", - "padding": [ - 16, - 20 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "DetailTotalGroup", - "name": "DetailTotalGroup", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "DetailTotalLabel", - "name": "DetailTotalLabel", - "fill": "$text-secondary", - "content": "Tổng cộng", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "DetailTotalPrice", - "name": "DetailTotalPrice", - "fill": "$text-primary", - "content": "55,000d", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700" - } - ] - }, - { - "type": "frame", - "id": "AddToCartBtn", - "name": "AddToCartBtn", - "width": 200, - "height": 50, - "fill": "$orange-primary", - "cornerRadius": 30, - "gap": 8, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "AddToCartIcon", - "name": "AddToCartIcon", - "width": 20, - "height": 20, - "iconFontName": "shopping-cart", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - }, - { - "type": "text", - "id": "AddToCartText", - "name": "AddToCartText", - "fill": "$bg-surface", - "content": "Thêm vào giỏ", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/menu-browse.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/menu-browse.pen deleted file mode 100644 index fb811f16..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/menu-browse.pen +++ /dev/null @@ -1,1053 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "MenuBrowseScreen", - "x": 0, - "y": 0, - "name": "POS/MenuBrowse", - "reusable": true, - "width": 390, - "height": 1079, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "TopBar", - "name": "TopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "MenuIcon", - "name": "MenuIcon", - "width": 24, - "height": 24, - "iconFontName": "menu", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "TopBarTitle", - "name": "TopBarTitle", - "fill": "$text-primary", - "content": "EggyMon Kitchen", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "CartIconWrapper", - "name": "CartIconWrapper", - "width": 40, - "height": 40, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "CartIcon", - "name": "CartIcon", - "width": 24, - "height": 24, - "iconFontName": "shopping-cart", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "frame", - "id": "CartBadge", - "name": "CartBadge", - "width": 18, - "height": 18, - "fill": "$orange-primary", - "cornerRadius": 9, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CartBadgeText", - "name": "CartBadgeText", - "content": "3", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "700" - }, - { - "type": "text", - "id": "fOWkI", - "name": "badgeText", - "fill": "$bg-surface", - "content": "3", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "700" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "ContentScroll", - "name": "ContentScroll", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": [ - 12, - 16 - ], - "children": [ - { - "type": "frame", - "id": "SearchBar", - "name": "SearchBar", - "width": "fill_container", - "height": 44, - "fill": "$bg-elevated", - "cornerRadius": 12, - "gap": 8, - "padding": [ - 0, - 12 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "SearchIcon", - "name": "SearchIcon", - "width": 20, - "height": 20, - "iconFontName": "search", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "text", - "id": "SearchPlaceholder", - "name": "SearchPlaceholder", - "fill": "$text-tertiary", - "content": "Tìm món...", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "CategoryTabs", - "name": "CategoryTabs", - "width": "fill_container", - "height": 36, - "gap": 8, - "children": [ - { - "type": "frame", - "id": "CatAll", - "name": "CatAll", - "height": 36, - "fill": "$orange-primary", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CF72W", - "name": "allText", - "fill": "$bg-surface", - "content": "Tất cả", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "CatMain", - "name": "CatMain", - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dHJWk", - "name": "mainText", - "fill": "$text-primary", - "content": "Món chính", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatDrink", - "name": "CatDrink", - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "KA3Si", - "name": "drinkText", - "fill": "$text-primary", - "content": "Đồ uống", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatSnack", - "name": "CatSnack", - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "BXRiu", - "name": "snackText", - "fill": "$text-primary", - "content": "Ăn vặt", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatCombo", - "name": "CatCombo", - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "WM7WW", - "name": "comboText", - "fill": "$text-primary", - "content": "Combo", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "CatDessert", - "name": "CatDessert", - "height": 36, - "fill": "$bg-interactive", - "cornerRadius": 18, - "layout": "vertical", - "padding": [ - 6, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "GHibU", - "name": "dessertText", - "fill": "$text-primary", - "content": "Tráng miệng", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "FeaturedBanner", - "name": "FeaturedBanner", - "width": "fill_container", - "height": 120, - "fill": "$brown-primary", - "cornerRadius": 16, - "layout": "vertical", - "gap": 4, - "padding": 20, - "children": [ - { - "type": "text", - "id": "BannerTitle", - "name": "BannerTitle", - "fill": "$bg-surface", - "content": "Combo trưa giảm 30%", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700" - }, - { - "type": "text", - "id": "BannerPrice", - "name": "BannerPrice", - "fill": "$orange-light", - "content": "Chỉ 69,000đ", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "MenuGridRow1", - "name": "MenuGridRow1", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "MenuItem1", - "name": "MenuItem1", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "zt7kq", - "name": "item1Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "CsHDM", - "name": "item1Name", - "fill": "$text-primary", - "content": "Cơm gà teriyaki", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "89Hob", - "name": "priceRow1", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "1pzQZ", - "name": "item1Price", - "fill": "$orange-primary", - "content": "45,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "9BC9k", - "name": "item1Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "92Faw", - "name": "item1AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MenuItem2", - "name": "MenuItem2", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "y6EKg", - "name": "item2Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "MVXlO", - "name": "item2Name", - "fill": "$text-primary", - "content": "Phở bò", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "25Sdf", - "name": "priceRow2", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CPIeK", - "name": "item2Price", - "fill": "$orange-primary", - "content": "50,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "YWKW6", - "name": "item2Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "URAJW", - "name": "item2AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MenuGridRow2", - "name": "MenuGridRow2", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "MenuItem3", - "name": "MenuItem3", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "GM4Gu", - "name": "item3Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "Upoxv", - "name": "item3Name", - "fill": "$text-primary", - "content": "Bún chả", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "Yh7LM", - "name": "priceRow3", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "qrMZA", - "name": "item3Price", - "fill": "$orange-primary", - "content": "42,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "ijsNs", - "name": "item3Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dgaNU", - "name": "item3AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MenuItem4", - "name": "MenuItem4", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "0ZFUG", - "name": "item4Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "KgqY6", - "name": "item4Name", - "fill": "$text-primary", - "content": "Bánh mì thịt", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "AW0w1", - "name": "priceRow4", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "6eCJ4", - "name": "item4Price", - "fill": "$orange-primary", - "content": "25,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "yQz43", - "name": "item4Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "v14Wm", - "name": "item4AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MenuGridRow3", - "name": "MenuGridRow3", - "width": "fill_container", - "gap": 12, - "children": [ - { - "type": "frame", - "id": "MenuItem5", - "name": "MenuItem5", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "8zzN0", - "name": "item5Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "R1mte", - "name": "item5Name", - "fill": "$text-primary", - "content": "Trà sữa trân châu", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "14HRJ", - "name": "priceRow5", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "bZ8KW", - "name": "item5Price", - "fill": "$orange-primary", - "content": "35,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "FUAte", - "name": "item5Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "4G4VS", - "name": "item5AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "MenuItem6", - "name": "MenuItem6", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "Yo0RH", - "name": "item6Img", - "width": "fill_container", - "height": 120, - "fill": "$bg-elevated", - "cornerRadius": 12 - }, - { - "type": "text", - "id": "ZcVLk", - "name": "item6Name", - "fill": "$text-primary", - "content": "Cà phê sữa đá", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "PCyz5", - "name": "priceRow6", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "oVw0w", - "name": "item6Price", - "fill": "$orange-primary", - "content": "30,000đ", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "QfORC", - "name": "item6Add", - "width": 32, - "height": 32, - "fill": "$orange-primary", - "cornerRadius": 8, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "0qBJX", - "name": "item6AddIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "BottomNavBar", - "name": "BottomNavBar", - "width": "fill_container", - "height": 64, - "fill": "$bg-surface", - "padding": [ - 8, - 0 - ], - "justifyContent": "space_around", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "NavHome", - "name": "NavHome", - "layout": "vertical", - "gap": 2, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "NavHomeIcon", - "name": "NavHomeIcon", - "width": 24, - "height": 24, - "iconFontName": "house", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - }, - { - "type": "text", - "id": "NavHomeText", - "name": "NavHomeText", - "fill": "$orange-primary", - "content": "Home", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "NavMenu", - "name": "NavMenu", - "layout": "vertical", - "gap": 2, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "NavMenuIcon", - "name": "NavMenuIcon", - "width": 24, - "height": 24, - "iconFontName": "utensils", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavMenuText", - "name": "NavMenuText", - "fill": "$text-secondary", - "content": "Menu", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NavOrders", - "name": "NavOrders", - "layout": "vertical", - "gap": 2, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "NavOrdersIcon", - "name": "NavOrdersIcon", - "width": 24, - "height": 24, - "iconFontName": "shopping-bag", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavOrdersText", - "name": "NavOrdersText", - "fill": "$text-secondary", - "content": "Orders", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "NavProfile", - "name": "NavProfile", - "layout": "vertical", - "gap": 2, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "NavProfileIcon", - "name": "NavProfileIcon", - "width": 24, - "height": 24, - "iconFontName": "user", - "iconFontFamily": "lucide", - "fill": "$text-secondary" - }, - { - "type": "text", - "id": "NavProfileText", - "name": "NavProfileText", - "fill": "$text-secondary", - "content": "Profile", - "fontFamily": "Poppins", - "fontSize": 10, - "fontWeight": "500" - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-complete.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-complete.pen deleted file mode 100644 index d1ea229c..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-complete.pen +++ /dev/null @@ -1,483 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "OrderCompleteScreen", - "x": 0, - "y": 0, - "name": "POS/OrderComplete", - "reusable": true, - "width": 390, - "height": 952, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "CompleteScrollContent", - "name": "CompleteScrollContent", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 20, - "padding": [ - 40, - 20, - 20, - 20 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "SuccessIconWrap", - "name": "SuccessIconWrap", - "width": 100, - "height": 100, - "fill": "#22C55E20", - "cornerRadius": 50, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "SuccessCheckIcon", - "name": "SuccessCheckIcon", - "width": 48, - "height": 48, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "$success" - } - ] - }, - { - "type": "text", - "id": "CompleteTitle", - "name": "CompleteTitle", - "fill": "$text-primary", - "content": "Đơn hàng sẵn sàng!", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 24, - "fontWeight": "700" - }, - { - "type": "text", - "id": "CompleteSubtitle", - "name": "CompleteSubtitle", - "fill": "$text-secondary", - "content": "Vui lòng đến quầy nhận món", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "OrderInfoCard", - "name": "OrderInfoCard", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 20, - "layout": "vertical", - "gap": 12, - "padding": 24, - "children": [ - { - "type": "text", - "id": "OrderInfoLabel", - "name": "OrderInfoLabel", - "fill": "$text-secondary", - "content": "Mã đơn hàng", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "OrderInfoId", - "name": "OrderInfoId", - "fill": "$text-primary", - "content": "#EK-0087", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 28, - "fontWeight": "700" - }, - { - "type": "frame", - "id": "CustomerNameRow", - "name": "CustomerNameRow", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CustomerNameLabel", - "name": "CustomerNameLabel", - "fill": "$text-secondary", - "content": "Tên khách", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "CustomerNameValue", - "name": "CustomerNameValue", - "fill": "$text-primary", - "content": "Nguyễn Văn A", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "OrderTypeRow", - "name": "OrderTypeRow", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OrderTypeLabel", - "name": "OrderTypeLabel", - "fill": "$text-secondary", - "content": "Hình thức", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "OrderTypeValue", - "name": "OrderTypeValue", - "fill": "$text-primary", - "content": "Tại quán", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "OrderInfoDivider", - "name": "OrderInfoDivider", - "width": "fill_container", - "height": 1, - "fill": "$border-subtle" - }, - { - "type": "text", - "id": "ItemsSummary", - "name": "ItemsSummary", - "fill": "$text-primary", - "content": "3 mon - 130,000d", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 15, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "PickupNumberCard", - "name": "PickupNumberCard", - "width": "fill_container", - "fill": "$orange-primary", - "cornerRadius": 20, - "layout": "vertical", - "gap": 4, - "padding": [ - 24, - 20 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PickupNumberLabel", - "name": "PickupNumberLabel", - "fill": "$bg-surface", - "content": "Số thứ tự", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "PickupNumberValue", - "name": "PickupNumberValue", - "fill": "$bg-surface", - "content": "087", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 64, - "fontWeight": "800" - } - ] - }, - { - "type": "frame", - "id": "RatingSection", - "name": "RatingSection", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "gap": 12, - "padding": 20, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "RatingSectionTitle", - "name": "RatingSectionTitle", - "fill": "$text-primary", - "content": "Đánh giá trải nghiệm", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "StarRow", - "name": "StarRow", - "gap": 8, - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "RatingStar1", - "name": "RatingStar1", - "width": 32, - "height": 32, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "icon_font", - "id": "RatingStar2", - "name": "RatingStar2", - "width": 32, - "height": 32, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "icon_font", - "id": "RatingStar3", - "name": "RatingStar3", - "width": 32, - "height": 32, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "icon_font", - "id": "RatingStar4", - "name": "RatingStar4", - "width": 32, - "height": 32, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - }, - { - "type": "icon_font", - "id": "RatingStar5", - "name": "RatingStar5", - "width": 32, - "height": 32, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$text-tertiary" - } - ] - }, - { - "type": "frame", - "id": "RatingTextArea", - "name": "RatingTextArea", - "width": "fill_container", - "height": 72, - "fill": "$bg-surface", - "cornerRadius": 12, - "padding": [ - 12, - 14 - ], - "children": [ - { - "type": "text", - "id": "RatingPlaceholder", - "name": "RatingPlaceholder", - "fill": "$text-tertiary", - "content": "Chia sẻ cảm nhận của bạn...", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "CompleteBottomBar", - "name": "CompleteBottomBar", - "width": "fill_container", - "fill": "$bg-surface", - "layout": "vertical", - "gap": 10, - "padding": [ - 12, - 20, - 20, - 20 - ], - "children": [ - { - "type": "frame", - "id": "OrderMoreBtn", - "name": "OrderMoreBtn", - "width": "fill_container", - "height": 52, - "fill": "$orange-primary", - "cornerRadius": 30, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OrderMoreText", - "name": "OrderMoreText", - "fill": "$bg-surface", - "content": "Đặt thêm món", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 16, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "GoHomeBtn", - "name": "GoHomeBtn", - "width": "fill_container", - "height": 44, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$border-default" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "GoHomeText", - "name": "GoHomeText", - "fill": "$text-primary", - "content": "Về trang chủ", - "textAlign": "center", - "fontFamily": "Inter", - "fontSize": 15, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file diff --git a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-tracking.pen b/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-tracking.pen deleted file mode 100644 index 059c5f11..00000000 --- a/pencil-design/src/pages/eggymon-kitchen-landingpage/pos/order-tracking.pen +++ /dev/null @@ -1,787 +0,0 @@ -{ - "version": "2.7", - "children": [ - { - "type": "frame", - "id": "OrderTrackingScreen", - "x": 0, - "y": 0, - "name": "POS/OrderTracking", - "reusable": true, - "width": 390, - "height": 903, - "fill": "$bg-page", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "TrackTopBar", - "name": "TrackTopBar", - "width": "fill_container", - "height": 56, - "fill": "$bg-surface", - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "TrackBackIcon", - "name": "TrackBackIcon", - "width": 24, - "height": 24, - "iconFontName": "chevron-left", - "iconFontFamily": "lucide", - "fill": "$text-primary" - }, - { - "type": "text", - "id": "TrackTopTitle", - "name": "TrackTopTitle", - "fill": "$text-primary", - "content": "Theo dõi đơn hàng", - "fontFamily": "Poppins", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "TrackPhoneIcon", - "name": "TrackPhoneIcon", - "width": 24, - "height": 24, - "iconFontName": "phone", - "iconFontFamily": "lucide", - "fill": "$text-primary" - } - ] - }, - { - "type": "frame", - "id": "TrackScrollContent", - "name": "TrackScrollContent", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": [ - 16, - 16, - 24, - 16 - ], - "children": [ - { - "type": "frame", - "id": "OrderIdRow", - "name": "OrderIdRow", - "width": "fill_container", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "OrderIdText", - "name": "OrderIdText", - "fill": "$text-primary", - "content": "#EK-0087", - "fontFamily": "Poppins", - "fontSize": 20, - "fontWeight": "700" - }, - { - "type": "text", - "id": "OrderTimeText", - "name": "OrderTimeText", - "fill": "$text-secondary", - "content": "14:32 - 10/02/2025", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "StatusTimeline", - "name": "StatusTimeline", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "padding": 20, - "children": [ - { - "type": "frame", - "id": "Step1", - "name": "Step1", - "width": "fill_container", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "Step1DotCol", - "name": "Step1DotCol", - "width": 24, - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step1Dot", - "name": "Step1Dot", - "width": 24, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step1Check", - "name": "Step1Check", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - }, - { - "type": "frame", - "id": "Step1Line", - "name": "Step1Line", - "width": 2, - "height": 28, - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Step1Content", - "name": "Step1Content", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step1Title", - "name": "Step1Title", - "fill": "$text-primary", - "content": "Đã nhận đơn", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Step1Time", - "name": "Step1Time", - "fill": "$text-secondary", - "content": "14:32", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step2", - "name": "Step2", - "width": "fill_container", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "Step2DotCol", - "name": "Step2DotCol", - "width": 24, - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step2Dot", - "name": "Step2Dot", - "width": 24, - "height": 24, - "fill": "$success", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step2Check", - "name": "Step2Check", - "width": 14, - "height": 14, - "iconFontName": "check", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - }, - { - "type": "frame", - "id": "Step2Line", - "name": "Step2Line", - "width": 2, - "height": 28, - "fill": "$success" - } - ] - }, - { - "type": "frame", - "id": "Step2Content", - "name": "Step2Content", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step2Title", - "name": "Step2Title", - "fill": "$text-primary", - "content": "Đã xác nhận", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Step2Time", - "name": "Step2Time", - "fill": "$text-secondary", - "content": "14:33", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step3", - "name": "Step3", - "width": "fill_container", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "Step3DotCol", - "name": "Step3DotCol", - "width": 24, - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step3Dot", - "name": "Step3Dot", - "width": 24, - "height": 24, - "fill": "$orange-primary", - "cornerRadius": 12, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Step3ActiveIcon", - "name": "Step3ActiveIcon", - "width": 16, - "height": 16, - "iconFontName": "loader", - "iconFontFamily": "lucide", - "fill": "$bg-surface" - } - ] - }, - { - "type": "frame", - "id": "Step3Line", - "name": "Step3Line", - "width": 2, - "height": 28, - "fill": "$border-default" - } - ] - }, - { - "type": "frame", - "id": "Step3Content", - "name": "Step3Content", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step3Title", - "name": "Step3Title", - "fill": "$orange-primary", - "content": "Đang chế biến", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Step3Time", - "name": "Step3Time", - "fill": "$text-secondary", - "content": "Dự kiến 10-15 phút", - "fontFamily": "Poppins", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step4", - "name": "Step4", - "width": "fill_container", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "Step4DotCol", - "name": "Step4DotCol", - "width": 24, - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step4Dot", - "name": "Step4Dot", - "width": 24, - "height": 24, - "cornerRadius": 12, - "stroke": { - "thickness": 2, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center" - }, - { - "type": "frame", - "id": "Step4Line", - "name": "Step4Line", - "width": 2, - "height": 28, - "fill": "$border-default" - } - ] - }, - { - "type": "frame", - "id": "Step4Content", - "name": "Step4Content", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step4Title", - "name": "Step4Title", - "fill": "$text-tertiary", - "content": "Sẵn sàng lấy", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Step5", - "name": "Step5", - "width": "fill_container", - "gap": 14, - "children": [ - { - "type": "frame", - "id": "Step5DotCol", - "name": "Step5DotCol", - "width": 24, - "layout": "vertical", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Step5Dot", - "name": "Step5Dot", - "width": 24, - "height": 24, - "cornerRadius": 12, - "stroke": { - "thickness": 2, - "fill": "$border-default" - }, - "justifyContent": "center", - "alignItems": "center" - } - ] - }, - { - "type": "frame", - "id": "Step5Content", - "name": "Step5Content", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "Step5Title", - "name": "Step5Title", - "fill": "$text-tertiary", - "content": "Hoàn thành", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "EstimatedTimeCard", - "name": "EstimatedTimeCard", - "width": "fill_container", - "fill": "$bg-elevated", - "cornerRadius": 16, - "layout": "vertical", - "gap": 8, - "padding": 20, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "EstClockIcon", - "name": "EstClockIcon", - "width": 20, - "height": 20, - "iconFontName": "timer", - "iconFontFamily": "lucide", - "fill": "$orange-primary" - }, - { - "type": "text", - "id": "EstLabel", - "name": "EstLabel", - "fill": "$text-secondary", - "content": "Dự kiến hoàn thành", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "EstTime", - "name": "EstTime", - "fill": "$orange-primary", - "content": "14:47", - "fontFamily": "Poppins", - "fontSize": 36, - "fontWeight": "700" - }, - { - "type": "text", - "id": "EstRemaining", - "name": "EstRemaining", - "fill": "$text-tertiary", - "content": "Còn khoảng 12 phút", - "fontFamily": "Poppins", - "fontSize": 13, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "ProgressBarBg", - "name": "ProgressBarBg", - "width": "fill_container", - "height": 6, - "fill": "$border-subtle", - "cornerRadius": 3, - "children": [ - { - "type": "frame", - "id": "ProgressBarFill", - "name": "ProgressBarFill", - "width": "fill_container", - "height": 6, - "fill": "$orange-primary", - "cornerRadius": 3 - } - ] - } - ] - }, - { - "type": "frame", - "id": "OrderDetailsCard", - "name": "OrderDetailsCard", - "width": "fill_container", - "fill": "$bg-surface", - "cornerRadius": 16, - "layout": "vertical", - "gap": 12, - "padding": [ - 16, - 20 - ], - "children": [ - { - "type": "text", - "id": "OrderDetailsTitle", - "name": "OrderDetailsTitle", - "fill": "$text-primary", - "content": "Chi tiết đơn hàng", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "OrderDetailItem1", - "name": "OrderDetailItem1", - "width": "fill_container", - "children": [ - { - "type": "text", - "id": "ODItem1Name", - "name": "ODItem1Name", - "fill": "$text-primary", - "content": "Cơm trứng chiên x2", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "ODItem1Price", - "name": "ODItem1Price", - "fill": "$text-primary", - "content": "100,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "OrderDetailItem2", - "name": "OrderDetailItem2", - "width": "fill_container", - "children": [ - { - "type": "text", - "id": "ODItem2Name", - "name": "ODItem2Name", - "fill": "$text-primary", - "content": "Trà sữa oolong x1", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "ODItem2Price", - "name": "ODItem2Price", - "fill": "$text-primary", - "content": "40,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "OrderDetailItem3", - "name": "OrderDetailItem3", - "width": "fill_container", - "children": [ - { - "type": "text", - "id": "ODItem3Name", - "name": "ODItem3Name", - "fill": "$text-primary", - "content": "Bánh mì trứng ốp la x1", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "ODItem3Price", - "name": "ODItem3Price", - "fill": "$text-primary", - "content": "25,000d", - "fontFamily": "Poppins", - "fontSize": 14, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "OrderDetailDivider", - "name": "OrderDetailDivider", - "width": "fill_container", - "height": 1, - "fill": "$border-subtle" - }, - { - "type": "frame", - "id": "OrderDetailTotal", - "name": "OrderDetailTotal", - "width": "fill_container", - "children": [ - { - "type": "text", - "id": "ODTotalLabel", - "name": "ODTotalLabel", - "fill": "$text-primary", - "content": "Tổng cộng", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "700" - }, - { - "type": "text", - "id": "ODTotalValue", - "name": "ODTotalValue", - "fill": "$orange-primary", - "content": "130,000d", - "fontFamily": "Poppins", - "fontSize": 16, - "fontWeight": "700" - } - ] - } - ] - }, - { - "type": "frame", - "id": "CancelOrderBtn", - "name": "CancelOrderBtn", - "width": "fill_container", - "height": 48, - "fill": "$bg-surface", - "cornerRadius": 12, - "stroke": { - "thickness": 1, - "fill": "$border-default" - }, - "layout": "vertical", - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "CancelOrderText", - "name": "CancelOrderText", - "fill": "$error", - "content": "Hủy đơn", - "fontFamily": "Poppins", - "fontSize": 15, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ], - "variables": { - "bg-page": { - "type": "color", - "value": "#FAF8F4" - }, - "bg-surface": { - "type": "color", - "value": "#FFFFFF" - }, - "bg-elevated": { - "type": "color", - "value": "#FFF8F0" - }, - "bg-interactive": { - "type": "color", - "value": "#F5EDE4" - }, - "brown-primary": { - "type": "color", - "value": "#6B4423" - }, - "brown-dark": { - "type": "color", - "value": "#4A2E15" - }, - "orange-primary": { - "type": "color", - "value": "#FF6B35" - }, - "orange-light": { - "type": "color", - "value": "#FF8A5C" - }, - "text-primary": { - "type": "color", - "value": "#2C2C2C" - }, - "text-secondary": { - "type": "color", - "value": "#6B6B6B" - }, - "text-tertiary": { - "type": "color", - "value": "#9B9B9B" - }, - "border-default": { - "type": "color", - "value": "#E5DDD4" - }, - "border-subtle": { - "type": "color", - "value": "#F0EAE2" - }, - "success": { - "type": "color", - "value": "#22C55E" - }, - "warning": { - "type": "color", - "value": "#F59E0B" - }, - "error": { - "type": "color", - "value": "#EF4444" - } - } -} \ No newline at end of file