dwindown/dewemoji
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update pricing UX, billing flows, and API rules

Browse Source
This commit is contained in:
Dwindi Ramadhana
2026-02-12 00:52:40 +07:00
parent cf065fab1e
commit a905256353
202 changed files with 22348 additions and 301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
app/resources/views/layouts/app.blade.php Normal file
View File

@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Dewemoji') }}</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="font-sans antialiased">
<div class="min-h-screen bg-gray-100">
@include('layouts.navigation')
<!-- Page Heading -->
@isset($header)
<header class="bg-white shadow">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
{{ $header }}
</div>
</header>
@endisset
<!-- Page Content -->
<main>
{{ $slot }}
</main>
</div>
</body>
</html>

144
app/resources/views/layouts/guest.blade.php Normal file
View File

@@ -0,0 +1,144 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>@yield('title', config('app.name', 'Dewemoji'))</title>
<link rel="icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/logo/logo-mark-128.png">
<link rel="icon" type="image/png" sizes="192x192" href="/assets/logo/logo-mark-512.png">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/logo/logo-mark-512.png">
<script>
(() => {
const stored = localStorage.getItem('dewemoji_theme');
const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
const mode = stored || (prefersDark ? 'dark' : 'light');
const root = document.documentElement;
root.classList.toggle('dark', mode === 'dark');
root.classList.toggle('theme-light', mode !== 'dark');
})();
</script>
<link rel="preload" href="/assets/fonts/PlusJakartaSans-Regular.ttf" as="font" type="font/ttf" crossorigin>
<script src="https://unpkg.com/lucide@latest"></script>
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
darkMode: 'class',
theme: {
extend: {
fontFamily: {
sans: ['"Plus Jakarta Sans"', 'system-ui', 'sans-serif'],
display: ['"Plus Jakarta Sans"', 'system-ui', 'sans-serif'],
},
colors: {
brand: {
sun: '#fcb735',
sunSoft: '#ffda9c',
ocean: '#2053ff',
oceanSoft: '#356cf0',
},
},
},
},
};
</script>
<!-- Scripts -->
@vite(['resources/js/app.js'])
<style>
@font-face {
font-family: "Plus Jakarta Sans";
src: url("/assets/fonts/PlusJakartaSans-Regular.ttf") format("truetype");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Plus Jakarta Sans";
src: url("/assets/fonts/PlusJakartaSans-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Plus Jakarta Sans";
src: url("/assets/fonts/PlusJakartaSans-SemiBold.ttf") format("truetype");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Plus Jakarta Sans";
src: url("/assets/fonts/PlusJakartaSans-Bold.ttf") format("truetype");
font-weight: 700;
font-style: normal;
font-display: swap;
}
</style>
</head>
<body class="min-h-screen bg-slate-50 text-slate-900 dark:bg-slate-950 dark:text-slate-100 antialiased" style="font-family: 'Plus Jakarta Sans', system-ui, sans-serif;">
<div class="fixed inset-0 -z-10 pointer-events-none">
<div class="absolute top-[-15%] right-[-10%] w-[360px] h-[360px] bg-blue-500/10 blur-[120px]"></div>
<div class="absolute bottom-[-15%] left-[-10%] w-[420px] h-[420px] bg-amber-500/10 blur-[140px]"></div>
</div>
<div class="min-h-screen flex flex-col items-center justify-center px-6 py-12">
<div class="w-full max-w-md">
<div class="flex items-center justify-between mb-8">
<a href="/" class="inline-flex items-center gap-3">
<span class="w-12 h-12 rounded-2xl bg-gradient-to-br from-white to-gray-200 dark:from-white/20 dark:to-white/5 flex items-center justify-center shadow-lg">
<img src="/assets/logo/logo-mark.svg" alt="Dewemoji logo" class="w-7 h-7 object-contain" />
</span>
<span class="font-semibold text-lg">Dewemoji</span>
</a>
<button id="theme-toggle" class="w-10 h-10 rounded-full border border-slate-200 dark:border-white/10 bg-white/70 dark:bg-white/5 flex items-center justify-center text-slate-500 dark:text-slate-200 hover:text-slate-900 dark:hover:text-white transition-colors">
<span class="sr-only">Toggle theme</span>
<i data-lucide="moon" class="w-4 h-4" data-theme-icon="dark"></i>
<i data-lucide="sun" class="w-4 h-4 hidden" data-theme-icon="light"></i>
</button>
</div>
<div class="w-full rounded-2xl border border-slate-200/70 dark:border-white/10 bg-white/90 dark:bg-slate-900/70 shadow-xl backdrop-blur px-6 py-6">
{{ $slot }}
</div>
</div>
</div>
<script>lucide.createIcons();</script>
<script>
(() => {
const root = document.documentElement;
const toggle = document.getElementById('theme-toggle');
const iconDark = document.querySelector('[data-theme-icon="dark"]');
const iconLight = document.querySelector('[data-theme-icon="light"]');
const setTheme = (mode) => {
root.classList.toggle('dark', mode === 'dark');
root.classList.toggle('theme-light', mode !== 'dark');
if (iconDark && iconLight) {
iconDark.classList.toggle('hidden', mode !== 'dark');
iconLight.classList.toggle('hidden', mode === 'dark');
}
localStorage.setItem('dewemoji_theme', mode);
};
const stored = localStorage.getItem('dewemoji_theme');
if (stored) {
setTheme(stored);
} else {
setTheme(root.classList.contains('dark') ? 'dark' : 'light');
}
toggle?.addEventListener('click', () => {
const next = root.classList.contains('dark') ? 'light' : 'dark';
setTheme(next);
});
})();
</script>
</body>
</html>

100
app/resources/views/layouts/navigation.blade.php Normal file
View File

@@ -0,0 +1,100 @@
<nav x-data="{ open: false }" class="bg-white border-b border-gray-100">
<!-- Primary Navigation Menu -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex">
<!-- Logo -->
<div class="shrink-0 flex items-center">
<a href="{{ route('dashboard.overview') }}">
<x-application-logo class="block h-9 w-auto fill-current text-gray-800" />
</a>
</div>
<!-- Navigation Links -->
<div class="hidden space-x-8 sm:-my-px sm:ms-10 sm:flex">
<x-nav-link :href="route('dashboard.overview')" :active="request()->routeIs('dashboard.*')">
{{ __('Dashboard') }}
</x-nav-link>
</div>
</div>
<!-- Settings Dropdown -->
<div class="hidden sm:flex sm:items-center sm:ms-6">
<x-dropdown align="right" width="48">
<x-slot name="trigger">
<button class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-gray-500 bg-white hover:text-gray-700 focus:outline-none transition ease-in-out duration-150">
<div>{{ Auth::user()->name }}</div>
<div class="ms-1">
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</div>
</button>
</x-slot>
<x-slot name="content">
<x-dropdown-link :href="route('profile.edit')">
{{ __('Profile') }}
</x-dropdown-link>
<!-- Authentication -->
<form method="POST" action="{{ route('logout') }}">
@csrf
<x-dropdown-link :href="route('logout')"
onclick="event.preventDefault();
this.closest('form').submit();">
{{ __('Log Out') }}
</x-dropdown-link>
</form>
</x-slot>
</x-dropdown>
</div>
<!-- Hamburger -->
<div class="-me-2 flex items-center sm:hidden">
<button @click="open = ! open" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
<svg class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24">
<path :class="{'hidden': open, 'inline-flex': ! open }" class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
<path :class="{'hidden': ! open, 'inline-flex': open }" class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
</div>
</div>
<!-- Responsive Navigation Menu -->
<div :class="{'block': open, 'hidden': ! open}" class="hidden sm:hidden">
<div class="pt-2 pb-3 space-y-1">
<x-responsive-nav-link :href="route('dashboard.overview')" :active="request()->routeIs('dashboard.*')">
{{ __('Dashboard') }}
</x-responsive-nav-link>
</div>
<!-- Responsive Settings Options -->
<div class="pt-4 pb-1 border-t border-gray-200">
<div class="px-4">
<div class="font-medium text-base text-gray-800">{{ Auth::user()->name }}</div>
<div class="font-medium text-sm text-gray-500">{{ Auth::user()->email }}</div>
</div>
<div class="mt-3 space-y-1">
<x-responsive-nav-link :href="route('profile.edit')">
{{ __('Profile') }}
</x-responsive-nav-link>
<!-- Authentication -->
<form method="POST" action="{{ route('logout') }}">
@csrf
<x-responsive-nav-link :href="route('logout')"
onclick="event.preventDefault();
this.closest('form').submit();">
{{ __('Log Out') }}
</x-responsive-nav-link>
</form>
</div>
</div>
</div>
</nav>