PluginProbe
Easy Invoice – Invoice Generator, PDF Quotes & Payments / 2.4.3
Easy Invoice – Invoice Generator, PDF Quotes & Payments v2.4.3
2.4.3 2.4.4 2.4.2 2.4.0 2.4.1 2.3.8 2.3.7 2.3.6 2.3.5 2.3.4 2.3.3 2.3.2 2.3.1 2.2.0 2.1.21 2.1.20 2.1.19 2.1.18 2.1.0 2.1.1 2.1.10 2.1.11 2.1.12 2.1.13 2.1.14 All 60 releases
easy-invoice / templates / main-template.php

main-template.php in Easy Invoice – Invoice Generator, PDF Quotes & Payments 2.4.3, at templates/main-template.php

771 lines 46.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 if ( ! defined( 'ABSPATH' ) ) {
3 exit;
4 }
5 $current_page = isset($_GET['page']) ? sanitize_text_field($_GET['page']) : 'easy-invoice';
6
7 // Function to check if current page is a subpage of a main menu
8 function is_subpage_of($current_page, $main_page) {
9 // Check if current page starts with the main page slug
10 $current_page = $current_page ?? '';
11 $main_page = $main_page ?? '';
12 return strpos($current_page, $main_page) === 0;
13 }
14
15 // Function to get the active menu class
16 function get_menu_class($current_page, $menu_page, $is_active = false) {
17 if ($is_active) {
18 return 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600';
19 }
20 return 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700';
21 }
22
23 // Function to get the active icon class
24 function get_icon_class($current_page, $menu_page, $is_active = false) {
25 if ($is_active) {
26 return 'text-indigo-600';
27 }
28 return 'text-gray-400 group-hover:text-indigo-500';
29 }
30
31 // Determine which menu should be active
32 $is_dashboard_active = $current_page === 'easy-invoice';
33 $is_invoices_active = in_array($current_page, [
34 'easy-invoice-all', // All invoices
35 'easy-invoice-builder', // Invoice builder
36 'easy-invoice-preview' // Invoice preview
37 ]);
38 $is_quotes_active = in_array($current_page, [
39 'easy-quote-all', // All quotes
40 'easy-invoice-quote-builder', // Quote builder
41 'easy-quote-preview' // Quote preview
42 ]);
43 $is_payments_active = in_array($current_page, [
44 'easy-invoice-payments', // All payments
45 'easy-invoice-payment-new' // Add new payment
46 ]);
47 $is_clients_active = in_array($current_page, [
48 'easy-invoice-clients', // All clients
49 'easy-invoice-client-edit', // Edit client
50 'easy-invoice-client-view' // View client
51 ]);
52 $is_item_library_active = in_array($current_page, [
53 'easy-invoice-pro-item-library', // Item Library (Pro)
54 'easy-invoice-item-library' // Item Library (alternative)
55 ]);
56 $is_templates_active = in_array($current_page, [
57 'easy-invoice-templates', // Template Builder (Pro)
58 'easy-invoice-template-builder' // Template Builder page
59 ]);
60 $is_reports_active = $current_page === 'easy-invoice-reports';
61 $is_settings_active = in_array($current_page, [
62 'easy-invoice-settings', // Main settings
63 'easy-invoice-email-settings', // Email settings
64 'easy-invoice-email-settings-general',
65 'easy-invoice-email-settings-invoice',
66 'easy-invoice-email-settings-quote',
67 'easy-invoice-email-settings-payment',
68 'easy-invoice-email-settings-payment-reminder',
69 'easy-invoice-pro-settings', // Pro settings
70 'easy-invoice-pro-translations' // Pro translations
71 ]);
72 // The "Addons" sidebar entry is only active on the Addons grid itself.
73 // Per-addon settings pages (Time Tracking / Smart Reminders / White-Label /
74 // Team & Audit / Webhooks) are now top-level sidebar entries — each highlights
75 // itself; the parent Addons row should NOT also light up.
76 $is_addons_active = ($current_page === 'easy-invoice-addons');
77 ?>
78
79 <?php
80 /*
81 * The sidebar is 256px wide and fixed. It used to carry no responsive classes at
82 * all, and the content wrapper below was an unconditional `pl-64` — so on a 390px
83 * phone the sidebar ate 256px and left ~134px for the actual page. Stat cards
84 * became unreadable slivers, tables collapsed to a column of checkboxes, and every
85 * screen overflowed horizontally.
86 *
87 * It is now an off-canvas drawer under `lg` (slid out by default, toggled by the
88 * button below) and pinned open from `lg` up, which is the behaviour it always had
89 * on desktop. The toggle script near the bottom of this file adds and removes
90 * `-translate-x-full` on the sidebar to slide it; `lg:translate-x-0` overrides that
91 * from 1024px up, so the drawer state is irrelevant on desktop.
92 */
93 ?>
94 <button type="button" id="ei-sidebar-toggle"
95 class="lg:hidden fixed top-3 left-3 z-[60] inline-flex items-center justify-center w-11 h-11 rounded-md bg-white border border-gray-300 shadow-sm text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
96 aria-controls="ei-app-sidebar" aria-expanded="false">
97 <span class="sr-only"><?php esc_html_e('Toggle Easy Invoice navigation', 'easy-invoice'); ?></span>
98 <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
99 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
100 </svg>
101 </button>
102
103 <div id="ei-sidebar-backdrop" class="lg:hidden fixed inset-0 bg-gray-900 bg-opacity-50 z-40 hidden" aria-hidden="true"></div>
104
105 <div id="ei-app-sidebar" class="fixed inset-y-0 left-0 w-64 bg-white shadow-lg border-r border-gray-200 ei-app-sidebar flex flex-col z-50 transform -translate-x-full transition-transform duration-200 ease-in-out lg:translate-x-0">
106
107 <div class="ei-app-sidebar-top flex flex-col items-center justify-center px-4 py-2 border-b border-gray-200 box-border flex-shrink-0">
108 <?php
109 /**
110 * Default logo HTML. Addons (White-Label) can short-circuit this to
111 * inject a custom image/label without touching this template.
112 *
113 * Filter: easy_invoice_admin_logo_html
114 * Args: ($default_html)
115 */
116 $default_logo_html = '<div class="flex items-center space-x-2 mb-1">'
117 . '<div class="flex items-center justify-center w-8 h-8 rounded ei-app-logo-mark">'
118 . easy_invoice_logo_mark_svg(32)
119 . '</div>'
120 . '<span class="text-lg font-semibold text-gray-900 ei-app-logo-label">' . esc_html__('Easy Invoice', 'easy-invoice') . '</span>'
121 . '</div>';
122 // wp_kses_post() drops <svg>; the logo list keeps the mark intact.
123 echo easy_invoice_kses_logo(apply_filters('easy_invoice_admin_logo_html', $default_logo_html));
124 ?>
125 <?php if (apply_filters('easy_invoice_admin_show_back_to_wp', true)): ?>
126 <a href="<?php echo esc_url(admin_url()); ?>" target="_blank" class="inline-flex items-center text-xs text-gray-500 hover:text-gray-700 transition-colors duration-200">
127 <svg class="w-3 h-3 mr-1" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
128 <path d="M19 12H5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
129 <path d="M12 19L5 12L12 5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
130 </svg>
131 <?php esc_html_e( 'Back to WordPress', 'easy-invoice' ); ?>
132 </a>
133 <?php endif; ?>
134
135
136 <?php if (apply_filters('easy_invoice_admin_show_version_badges', true)): ?>
137 <div class="mt-1 flex flex-wrap items-center justify-center gap-1.5">
138
139 <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-700 border border-gray-200">
140 <svg class="w-2.5 h-2.5 mr-1 text-gray-500" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
141 <path d="M12 2L2 7L12 12L22 7L12 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
142 <path d="M2 17L12 22L22 17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
143 <path d="M2 12L12 17L22 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
144 </svg>
145 v<?php echo esc_html(EASY_INVOICE_VERSION); ?>
146 </span>
147
148 <?php if (defined('EASY_INVOICE_PRO_VERSION') && function_exists('is_plugin_active') && is_plugin_active('easy-invoice-pro/easy-invoice-pro.php')): ?>
149
150 <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-700 border border-green-200">
151 <svg class="w-2.5 h-2.5 mr-1 text-green-500" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
152 <path d="M9 12L11 14L15 10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
153 <path d="M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
154 </svg>
155 <?php /* translators: %s: Pro plugin version. */ echo esc_html( sprintf( __( 'Pro v%s', 'easy-invoice' ), EASY_INVOICE_PRO_VERSION ) ); ?>
156 </span>
157 <?php endif; ?>
158 </div>
159 <?php endif; // easy_invoice_admin_show_version_badges ?>
160 </div>
161
162
163 <nav class="ei-app-sidebar-nav flex-1 min-h-0 overflow-y-auto mt-6 px-3 pb-4 space-y-2">
164
165 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice')); ?>"
166 class="<?php echo esc_attr($is_dashboard_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
167 <svg class="<?php echo $is_dashboard_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
168 <path d="M3 13H9V19H3V13Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
169 <path d="M9 13H15V19H9V13Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
170 <path d="M15 13H21V19H15V13Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
171 <path d="M3 5H9V11H3V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
172 <path d="M9 5H15V11H9V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
173 <path d="M15 5H21V11H15V5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
174 </svg>
175 <?php esc_html_e( 'Dashboard', 'easy-invoice' ); ?>
176 </a>
177
178
179 <?php
180 // A sidebar entry is drawn only when the current user can open the page it
181 // leads to: administrators can open everything; a team member with an EI role
182 // (Pro Team Roles) is mapped through the same filter the menu uses.
183 $ei_can_open = static function ($slug) {
184 return current_user_can((string) apply_filters('easy_invoice_menu_capability', 'manage_options', $slug));
185 };
186 ?>
187 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-all')); ?>"
188 class="<?php echo esc_attr($is_invoices_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
189 <svg class="<?php echo $is_invoices_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
190 <path d="M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
191 <path d="M14 2V8H20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
192 <path d="M12 11V19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
193 <path d="M14.5 13H10.75a1.75 1.75 0 0 0 0 3.5h2.5a1.75 1.75 0 0 1 0 3.5H9.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
194 </svg>
195 <?php esc_html_e( 'Invoices', 'easy-invoice' ); ?>
196 </a>
197
198
199 <?php if ($ei_can_open('easy-quote-all')) : ?>
200 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-quote-all')); ?>"
201 class="<?php echo esc_attr($is_quotes_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
202 <svg class="<?php echo $is_quotes_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
203 <path d="M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
204 <path d="M14 2V8H20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
205 <path d="M8.5 15.5L11 18L16 13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
206 </svg>
207 <?php esc_html_e( 'Quotes', 'easy-invoice' ); ?>
208 </a>
209 <?php endif; ?>
210
211
212 <?php if ($ei_can_open('easy-invoice-payments')) : ?>
213 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-payments')); ?>"
214 class="<?php echo esc_attr($is_payments_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
215 <svg class="<?php echo $is_payments_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
216 <rect x="1" y="4" width="22" height="16" rx="2" ry="2" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
217 <line x1="1" y1="10" x2="23" y2="10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
218 </svg>
219 <?php esc_html_e( 'Payments', 'easy-invoice' ); ?>
220 </a>
221 <?php endif; ?>
222
223
224 <?php if ($ei_can_open('easy-invoice-clients')) : ?>
225 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-clients')); ?>"
226 class="<?php echo esc_attr($is_clients_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
227 <svg class="<?php echo $is_clients_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
228 <path d="M17 21V19C17 17.9391 16.5786 16.9217 15.8284 16.1716C15.0783 15.4214 14.0609 15 13 15H5C3.93913 15 2.92172 15.4214 2.17157 16.1716C1.42143 16.9217 1 17.9391 1 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
229 <circle cx="9" cy="7" r="4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
230 <path d="M23 21V19C23 18.1137 22.6485 17.2628 22.0237 16.6425C21.3989 16.0221 20.5471 15.6722 19.66 15.6722C18.7729 15.6722 17.9211 16.0221 17.2963 16.6425C16.6715 17.2628 16.32 18.1137 16.32 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
231 <path d="M16.32 11.6722C18.36 11.6722 20 10.0322 20 7.99219C20 5.95219 18.36 4.31219 16.32 4.31219" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
232 </svg>
233 <?php esc_html_e( 'Clients', 'easy-invoice' ); ?>
234 </a>
235 <?php endif; ?>
236
237 <?php
238 // Item Library + Template Builder sidebar entries were here.
239 // They've been moved BELOW the Addons menu — see the per-addon
240 // sidebar loop further down in this file (lines ~365). The loop
241 // automatically renders a sidebar entry for every enabled addon
242 // whose registry entry has a non-empty settings_url, so the two
243 // explicit blocks are no longer needed (and were creating
244 // visual duplication with the loop).
245 ?>
246
247 <?php
248 // Reports — addon-gated (PERSONAL tier).
249 //
250 // When the addon is loaded, the per-addon sidebar loop further
251 // down in this file (after the Addons menu entry) renders the
252 // Reports link automatically — so this block only handles the
253 // Free-user upsell state. Showing it twice (here AND via the
254 // loop) was the cause of the "2 Reports pages" duplicate.
255 ?>
256 <?php if (!easy_invoice_has_pro()): ?>
257
258 <a href="#" id="reports-menu-link"
259 class="text-gray-600 hover:bg-indigo-50 hover:text-indigo-700 group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
260 <svg class="text-gray-400 group-hover:text-indigo-500 mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
261 <path d="M18 20V10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
262 <path d="M12 20V4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
263 <path d="M6 20V14" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
264 </svg>
265 <?php esc_html_e( 'Reports', 'easy-invoice' ); ?>
266 <span class="ml-auto inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-purple-600 text-white shadow-sm">
267 <svg class="w-4 h-4 mr-1 text-white" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
268 <path d="M12 8L15 13.2L18 10.5L17.3 14H6.7L6 10.5L9 13.2L12 8M12 4L8.5 10L3 5L5 16H19L21 5L15.5 10L12 4Z"/>
269 </svg>
270 <?php esc_html_e( 'Pro', 'easy-invoice' ); ?>
271 </span>
272 </a>
273 <?php endif; ?>
274
275
276 <?php if ($ei_can_open('easy-invoice-settings')) : ?>
277 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-settings')); ?>"
278 class="<?php echo esc_attr($is_settings_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
279 <svg class="<?php echo $is_settings_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
280 <circle cx="12" cy="12" r="3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
281 <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
282 </svg>
283 <?php esc_html_e( 'Settings', 'easy-invoice' ); ?>
284 </a>
285 <?php endif; ?>
286
287 <?php $is_import_active = ( 'easy-invoice-import' === $current_page ); ?>
288 <?php if ($ei_can_open('easy-invoice-import')) : ?>
289 <a href="<?php echo esc_url( admin_url( 'admin.php?page=easy-invoice-import' ) ); ?>"
290 class="<?php echo esc_attr( $is_import_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700' ); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
291 <svg class="<?php echo $is_import_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" aria-hidden="true">
292 <path d="M12 3v12m0 0l-4-4m4 4l4-4M4 17v2a2 2 0 002 2h12a2 2 0 002-2v-2" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
293 </svg>
294 <?php esc_html_e( 'Import', 'easy-invoice' ); ?>
295 </a>
296 <?php endif; ?>
297
298
299 <?php
300 // Check if Pro plugin is active and get license status
301 $show_license_badge = false;
302 $license_status = 'inactive';
303 $license_text = __( 'Deactivated', 'easy-invoice' );
304
305 if (easy_invoice_has_pro()) {
306 $license_key = \EasyInvoicePro\Updater\License::get_license_key();
307 $is_valid = \EasyInvoicePro\Updater\License::has_valid_license();
308 $is_expired = \EasyInvoicePro\Updater\License::has_license_expired();
309
310 // Always show badge for Pro version
311 $show_license_badge = true;
312
313 if (!empty($license_key)) {
314 if ($is_valid && !$is_expired) {
315 $license_status = 'activated';
316 $license_text = __( 'Activated', 'easy-invoice' );
317 } elseif ($is_expired) {
318 $license_status = 'expired';
319 $license_text = __( 'Expired', 'easy-invoice' );
320 } else {
321 $license_status = 'inactive';
322 $license_text = __( 'Deactivated', 'easy-invoice' );
323 }
324 } else {
325 // No license key entered
326 $license_status = 'inactive';
327 $license_text = __( 'Inactive', 'easy-invoice' );
328 }
329 } else {
330 // Free version - show Free badge
331 $show_license_badge = true;
332 $license_status = 'free';
333 $license_text = __( 'Free', 'easy-invoice' );
334 }
335 ?>
336 <?php if ($ei_can_open('easy-invoice-license')) : ?>
337 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-license')); ?>"
338 class="<?php echo esc_attr(($current_page === 'easy-invoice-license') ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
339
340 <svg class="<?php echo ($current_page === 'easy-invoice-license') ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
341 <circle cx="7.5" cy="15.5" r="5.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
342 <path d="M21 2L11.5 11.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
343 <path d="M15.5 7.5L18.5 10.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
344 </svg>
345 <span class="flex-1"><?php esc_html_e( 'License', 'easy-invoice' ); ?></span>
346 <?php if ($show_license_badge): ?>
347 <span class="license-status-badge <?php echo esc_attr($license_status); ?>">
348 <span class="status-dot"></span>
349 <?php echo esc_html( $license_text ); ?>
350 </span>
351 <?php endif; ?>
352 </a>
353 <?php endif; ?>
354
355
356 <?php
357 $show_free_vs_pro = !easy_invoice_has_pro();
358
359 if ($show_free_vs_pro):
360 ?>
361 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-free-vs-pro')); ?>"
362 class="<?php echo esc_attr(($current_page === 'easy-invoice-free-vs-pro') ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
363 <svg class="<?php echo ($current_page === 'easy-invoice-free-vs-pro') ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
364 <path d="M3 6L21 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
365 <path d="M3 12L21 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
366 <path d="M3 18L21 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
367 <path d="M9 3L9 21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
368 <path d="M15 3L15 21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
369 </svg>
370 <span class="flex-1"><?php esc_html_e('Free vs Pro', 'easy-invoice'); ?></span>
371 <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-purple-100 text-purple-800">
372 <?php esc_html_e('Compare', 'easy-invoice'); ?>
373 </span>
374 </a>
375 <?php endif; ?>
376
377 <?php
378 // Per-addon sidebar entries. Show every enabled addon that has
379 // its own dedicated page (Smart Reminders, Time Tracking,
380 // White Label, etc. — anything whose settings_url is NOT a
381 // deep-link into the main Settings page). Addons whose settings
382 // live inside Settings → <section> (Secure Links → Advanced,
383 // Partial Payments → Invoice, etc.) are intentionally excluded:
384 // the main Settings page's section nav is already the
385 // navigation aid for those, and a sidebar entry would be a
386 // duplicate path to the same place. Users still reach those
387 // via the "Settings →" link on the addon card.
388 if (class_exists('\\EasyInvoice\\Addons\\AddonRegistry') && class_exists('\\EasyInvoice\\Addons\\AddonManager')):
389 foreach (\EasyInvoice\Addons\AddonRegistry::all() as $ei_addon):
390 if (empty($ei_addon['settings_url'])) continue;
391 if (!\EasyInvoice\Addons\AddonManager::isEnabled($ei_addon['id'])) continue;
392 if (!\EasyInvoice\Addons\AddonManager::userCanAccess($ei_addon['id'])) continue;
393
394 // Skip addons whose settings_url deep-links into the
395 // main Settings page (easy-invoice-settings). Those
396 // are accessed via the card's "Settings →" link only.
397 $ei_addon_parsed = wp_parse_url($ei_addon['settings_url']);
398 $ei_addon_query = [];
399 if (!empty($ei_addon_parsed['query'])) {
400 parse_str($ei_addon_parsed['query'], $ei_addon_query);
401 }
402 $ei_addon_slug = $ei_addon_query['page'] ?? '';
403 if ($ei_addon_slug === 'easy-invoice-settings') continue;
404 if (!$ei_can_open($ei_addon_slug)) continue;
405
406 $ei_addon_active = ($current_page === $ei_addon_slug);
407 $ei_addon_icon = !empty($ei_addon['icon']) ? $ei_addon['icon'] : 'dashicons-admin-plugins';
408 $ei_addon_label = !empty($ei_addon['short_name']) ? $ei_addon['short_name'] : $ei_addon['name'];
409 ?>
410 <a href="<?php echo esc_url($ei_addon['settings_url']); ?>"
411 class="<?php echo $ei_addon_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'; ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200"
412 title="<?php echo esc_attr($ei_addon['name']); ?>">
413 <span class="dashicons <?php echo esc_attr($ei_addon_icon); ?> mr-3 flex-shrink-0 h-5 w-5 <?php echo $ei_addon_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?>" style="font-size:20px;width:20px;height:20px;line-height:20px;"></span>
414 <span class="flex-1 truncate"><?php echo esc_html($ei_addon_label); ?></span>
415 </a>
416 <?php
417 endforeach;
418 endif;
419 ?>
420
421
422 <?php if ($ei_can_open('easy-invoice-addons')) : ?>
423 <a href="<?php echo esc_url(admin_url('admin.php?page=easy-invoice-addons')); ?>"
424 class="<?php echo esc_attr($is_addons_active ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'); ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
425 <svg class="<?php echo $is_addons_active ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
426 <rect x="3" y="3" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
427 <rect x="14" y="3" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
428 <rect x="3" y="14" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
429 <path d="M17.5 14V21M14 17.5H21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
430 </svg>
431 <span class="flex-1"><?php esc_html_e('Addons', 'easy-invoice'); ?></span>
432 <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-indigo-100 text-indigo-700">
433 <?php esc_html_e('New', 'easy-invoice'); ?>
434 </span>
435 </a>
436 <?php endif; ?>
437
438
439 <?php if (apply_filters('easy_invoice_show_upgrade_prompts', true)) : ?>
440 <a href="<?php echo esc_url('https://www.facebook.com/groups/mantrabraincommunity'); ?>"
441 target="_blank"
442 rel="noopener noreferrer"
443 class="<?php echo ($current_page === 'easy-invoice-join-community') ? 'bg-indigo-50 text-indigo-700 border-r-2 border-indigo-600' : 'text-gray-600 hover:bg-indigo-50 hover:text-indigo-700'; ?> group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
444 <svg class="<?php echo ($current_page === 'easy-invoice-join-community') ? 'text-indigo-600' : 'text-gray-400 group-hover:text-indigo-500'; ?> mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
445 <path d="M18 2H15C13.6739 2 12.4021 2.52678 11.4645 3.46447C10.5268 4.40215 10 5.67392 10 7V10H7V14H10V22H14V14H17L18 10H14V7C14 6.73478 14.1054 6.48043 14.2929 6.29289C14.4804 6.10536 14.7348 6 15 6H18V2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
446 </svg>
447 <span class="flex-1"><?php esc_html_e('Join Community', 'easy-invoice'); ?></span>
448 <svg class="flex-shrink-0 h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
449 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
450 </svg>
451 </a>
452 <?php endif; ?>
453
454
455 <?php
456 /**
457 * Filter the sidebar help link. Pro's White Label addon points it at
458 * the agency's own support page.
459 *
460 * @param string $url
461 */
462 $ei_help_url = apply_filters('easy_invoice_help_link_url', 'https://easy-invoice.matrixaddons.com/docs/');
463 ?>
464 <a href="<?php echo esc_url($ei_help_url); ?>"
465 target="_blank"
466 rel="noopener noreferrer"
467 class="text-gray-600 hover:bg-indigo-50 hover:text-indigo-700 group flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-all duration-200">
468 <svg class="text-gray-400 group-hover:text-indigo-500 mr-3 flex-shrink-0 h-5 w-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
469 <path d="M4 19.5V4.5C4 3.4 4.9 2.5 6 2.5H19C19.5 2.5 20 3 20 3.5V20.5C20 21 19.5 21.5 19 21.5H6C4.9 21.5 4 20.6 4 19.5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
470 <path d="M8 7H16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
471 <path d="M8 11H16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
472 <path d="M8 15H13" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
473 </svg>
474 <span class="flex-1"><?php esc_html_e('Documentation', 'easy-invoice'); ?></span>
475 <svg class="flex-shrink-0 h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
476 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
477 </svg>
478 </a>
479
480 </nav>
481
482
483 <div class="ei-app-sidebar-foot border-t border-gray-200 p-4 flex-shrink-0 bg-white">
484 <div class="relative">
485 <button type="button" id="user-dropdown-button" class="flex items-center w-full text-left hover:bg-gray-50 rounded-lg p-2 transition-colors duration-200">
486 <div class="flex-shrink-0">
487 <div class="h-8 w-8 rounded-full bg-gray-200 flex items-center justify-center">
488 <span class="text-gray-600 font-medium text-sm"><?php echo esc_html(substr(wp_get_current_user()->display_name, 0, 1)); ?></span>
489 </div>
490 </div>
491 <div class="ml-3 flex-1">
492 <p class="text-sm font-medium text-gray-700"><?php echo esc_html(wp_get_current_user()->display_name); ?></p>
493 <p class="text-xs text-gray-500"><?php echo esc_html(wp_get_current_user()->user_email); ?></p>
494 </div>
495 <div class="flex-shrink-0">
496 <svg class="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
497 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
498 </svg>
499 </div>
500 </button>
501
502
503 <div id="user-dropdown-menu" class="hidden absolute bottom-full left-0 right-0 mb-2 bg-white border border-gray-200 rounded-lg shadow-lg z-50">
504 <div class="py-1">
505 <a href="<?php echo esc_url(admin_url()); ?>" target="_blank" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 transition-colors duration-200">
506 <svg class="mr-3 h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
507 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
508 </svg>
509 <?php esc_html_e('Back to WordPress', 'easy-invoice'); ?>
510 </a>
511 <a href="<?php echo esc_url(wp_logout_url()); ?>" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 transition-colors duration-200">
512 <svg class="mr-3 h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
513 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"></path>
514 </svg>
515 <?php esc_html_e('Logout', 'easy-invoice'); ?>
516 </a>
517 </div>
518 </div>
519 </div>
520 </div>
521 </div>
522
523 <?php
524 /*
525 * The old mobile menu button lived here. Removed in favour of #ei-sidebar-toggle
526 * at the top of this file, because this one could not work:
527 *
528 * - Its handler bound to `document.querySelector('button[aria-expanded="false"]')`,
529 * i.e. the first such button anywhere in the document — not reliably this one.
530 * - It toggled a `hidden` class the sidebar never had. The sidebar had no
531 * responsive rules at all, so it was always open; toggling `hidden` removed it
532 * outright while the content kept its unconditional `pl-64`, leaving a 256px
533 * empty gutter.
534 * - It was `sm:hidden`, so it only appeared below 640px, while the layout
535 * actually breaks below 1024px.
536 */
537 ?>
538
539 <script>
540 document.addEventListener('DOMContentLoaded', function() {
541 /* Sidebar drawer is handled by the #ei-sidebar-toggle script above. */
542
543 // Handle Reports menu click for premium feature
544 const reportsMenuLink = document.getElementById('reports-menu-link');
545 if (reportsMenuLink) {
546 reportsMenuLink.addEventListener('click', function(e) {
547 e.preventDefault();
548 // Show premium popup using the proper confirmation modal
549 if (typeof EasyInvoiceConfirmation !== 'undefined') {
550 EasyInvoiceConfirmation.showFeatureUpgrade(
551 <?php echo wp_json_encode( __( 'Detailed Reports', 'easy-invoice' ) ); ?>,
552 <?php echo wp_json_encode( __( 'Get comprehensive insights into your business with detailed reports including revenue analysis, payment statistics, invoice status tracking, and monthly revenue charts. Upgrade to Easy Invoice Pro to unlock advanced reporting features.', 'easy-invoice' ) ); ?>
553 );
554 } else {
555 // Fallback to alert if confirmation modal is not available
556 alert('<?php echo esc_js(__('Detailed Reports is a premium feature. Upgrade to Easy Invoice Pro to unlock advanced reporting features including revenue analysis, payment statistics, and monthly revenue charts.', 'easy-invoice')); ?>');
557 }
558 });
559 }
560
561 // Handle user dropdown
562 const userDropdownButton = document.getElementById('user-dropdown-button');
563 const userDropdownMenu = document.getElementById('user-dropdown-menu');
564
565 if (userDropdownButton && userDropdownMenu) {
566 userDropdownButton.addEventListener('click', function(e) {
567 e.preventDefault();
568 e.stopPropagation();
569 userDropdownMenu.classList.toggle('hidden');
570 });
571
572 // Close dropdown when clicking outside
573 document.addEventListener('click', function(e) {
574 if (!userDropdownButton.contains(e.target) && !userDropdownMenu.contains(e.target)) {
575 userDropdownMenu.classList.add('hidden');
576 }
577 });
578
579 // Close dropdown when pressing Escape key
580 document.addEventListener('keydown', function(e) {
581 if (e.key === 'Escape') {
582 userDropdownMenu.classList.add('hidden');
583 }
584 });
585 }
586 });
587 </script>
588
589 <style>
590 html.wp-toolbar {
591 padding-top: 0 !important;
592 }
593 /* Matches hideAdminUi: hidden admin bar must not reserve body padding or main content shifts vs fixed sidebar */
594 body.easy-invoice-admin-body.admin-bar {
595 padding-top: 0 !important;
596 }
597 body.easy-invoice-admin-body.admin-bar #wpbody,
598 body.easy-invoice-admin-body.admin-bar #wpbody-content {
599 padding-top: 0 !important;
600 }
601
602 /* Keep any admin notice clear of the fixed sidebar.
603 *
604 * WordPress prints `admin_notices` output into #wpbody-content BEFORE this
605 * template's markup, so a notice sits outside the `.lg:pl-64` content column and
606 * runs edge to edge underneath the 16rem fixed sidebar — the first words of every
607 * line get covered. disableAdminNoticesOnEasyInvoicePages() suppresses most
608 * notices on our screens, but not all of them: WordPress core prints some
609 * (php_update_notice, update-nag) outside that hook, and any notice we
610 * deliberately keep would be clipped the same way. Indenting them costs nothing
611 * when there are none to show. */
612 @media (min-width: 1024px) {
613 body.easy-invoice-admin-body #wpbody-content > .notice,
614 body.easy-invoice-admin-body #wpbody-content > .updated,
615 body.easy-invoice-admin-body #wpbody-content > .update-nag,
616 body.easy-invoice-admin-body #wpbody-content > .error {
617 margin-left: 17rem;
618 margin-right: 1rem;
619 }
620 }
621
622 /* Full-height app shell — works WITH the global
623 `#wpbody-content { display: flex; flex-direction: column; min-height: 100vh }`
624 rule defined in easy-invoice.css. Because the parent is a flex
625 column, the wrapper can't rely on `height: 100%` alone (flex
626 children stay at content height unless given `flex-grow`). We give
627 the wrapper `flex: 1` so it expands to fill whatever vertical space
628 the flex column offers, and a `min-height: 100vh` floor so short
629 pages still paint the bg-gray-50 all the way down to the viewport
630 bottom. Removing the previous html → body → wpwrap → wpcontent
631 chain that wasn't doing anything useful in the flex-column world. */
632 .easy-invoice-admin {
633 flex: 1;
634 min-height: 100vh;
635 }
636
637 /*
638 * Below `lg` the sidebar collapses to a drawer and #ei-sidebar-toggle is pinned at
639 * top-left. Every page header starts hard against the left edge, so without this
640 * the toggle sat on top of the page title ("Invoices" rendered as "voices") and on
641 * top of the builders' "Back to invoices" link.
642 *
643 * Reserve the toggle's width (44px) plus its offset so headers start clear of it.
644 * Both header variants are covered: `.ei-app-page-header` is used by the eight
645 * list/settings screens, `.ei-app-header-sync` by the invoice and quote builders.
646 */
647 @media (max-width: 1023px) {
648 /* !important is needed here, not for weight games: five of these headers
649 (invoice/quote listings, payments, clients, reports) set `padding-left`
650 in an inline style attribute, which a stylesheet rule cannot otherwise
651 beat. Those inline paddings pair with a negative margin to bleed the
652 header full-width, so they cannot simply be removed. */
653 .ei-app-page-header,
654 .ei-app-header-sync {
655 padding-left: 3.75rem !important;
656 }
657 }
658
659 /* Custom color for active icons */
660 .group:hover svg {
661 color: rgb(79 70 229) !important;
662 }
663
664 /* Active state icon color */
665 .bg-indigo-50 svg {
666 color: rgb(79 70 229) !important;
667 }
668
669 /* Hover state for non-active items */
670 .group:hover:not(.bg-indigo-50) svg {
671 color: rgb(79 70 229) !important;
672 }
673
674 /* Sidebar scrollbar — slim, only visible on hover/scroll. Firefox uses scrollbar-* */
675 .ei-app-sidebar-nav {
676 scrollbar-width: thin;
677 scrollbar-color: rgba(156, 163, 175, 0) transparent;
678 transition: scrollbar-color 0.2s ease;
679 }
680 .ei-app-sidebar-nav:hover {
681 scrollbar-color: rgba(156, 163, 175, 0.5) transparent;
682 }
683 /* WebKit (Chrome / Safari / Edge) */
684 .ei-app-sidebar-nav::-webkit-scrollbar {
685 width: 8px;
686 }
687 .ei-app-sidebar-nav::-webkit-scrollbar-track {
688 background: transparent;
689 }
690 .ei-app-sidebar-nav::-webkit-scrollbar-thumb {
691 background-color: transparent;
692 border-radius: 4px;
693 border: 2px solid transparent;
694 background-clip: content-box;
695 transition: background-color 0.2s ease;
696 }
697 .ei-app-sidebar-nav:hover::-webkit-scrollbar-thumb {
698 background-color: rgba(156, 163, 175, 0.45);
699 }
700 .ei-app-sidebar-nav::-webkit-scrollbar-thumb:hover {
701 background-color: rgba(107, 114, 128, 0.7);
702 }
703 </style>
704
705 <div class="min-h-screen bg-white easy-invoice-admin">
706 <a href="#easy-invoice-main" class="easy-invoice-skip-link screen-reader-text"><?php esc_html_e( 'Skip to main content', 'easy-invoice' ); ?></a>
707
708 <?php // pl-64 only from `lg` up — under that the sidebar is an off-canvas drawer
709 // and reserving 256px of padding left phones with ~134px of usable width. ?>
710 <div id="easy-invoice-main" class="lg:pl-64" tabindex="-1">
711 <?php
712
713 $page = isset($_GET['page']) ? sanitize_text_field($_GET['page']) : 'easy-invoice';
714 // Content will be inserted here
715 do_action('easy_invoice_admin_before_main_content', $page);
716
717 do_action('easy_invoice_admin_main_content', $page);
718
719 do_action('easy_invoice_admin_after_main_content', $page);
720
721 ?>
722 </div>
723
724
725 <script>
726 /* Off-canvas sidebar for viewports below Tailwind's `lg` (1024px).
727 Kept dependency-free and inline so it works on every Easy Invoice screen
728 without touching the 13 individual page templates. */
729 (function () {
730 var toggle = document.getElementById('ei-sidebar-toggle');
731 var sidebar = document.getElementById('ei-app-sidebar');
732 var backdrop = document.getElementById('ei-sidebar-backdrop');
733 if (!toggle || !sidebar || !backdrop) { return; }
734
735 function setOpen(open) {
736 sidebar.classList.toggle('-translate-x-full', !open);
737 backdrop.classList.toggle('hidden', !open);
738 toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
739 /* Stop the page scrolling behind the drawer while it is open. */
740 document.body.style.overflow = open ? 'hidden' : '';
741 }
742
743 toggle.addEventListener('click', function () {
744 setOpen(sidebar.classList.contains('-translate-x-full'));
745 });
746 backdrop.addEventListener('click', function () { setOpen(false); });
747
748 document.addEventListener('keydown', function (e) {
749 if (e.key === 'Escape' && !sidebar.classList.contains('-translate-x-full')) {
750 setOpen(false);
751 toggle.focus();
752 }
753 });
754
755 /* Closing on navigation keeps the drawer from being stuck open after a
756 click-through, and resizing up to desktop must clear the inline
757 overflow lock the drawer set. */
758 sidebar.addEventListener('click', function (e) {
759 if (e.target.closest('a') && window.matchMedia('(max-width: 1023px)').matches) { setOpen(false); }
760 });
761 window.matchMedia('(min-width: 1024px)').addEventListener('change', function (ev) {
762 if (ev.matches) { setOpen(false); document.body.style.overflow = ''; }
763 });
764 })();
765
766 if (typeof ajaxurl === 'undefined') {
767 var ajaxurl = '<?php echo esc_url(admin_url('admin-ajax.php')); ?>';
768 }
769 </script>
770 </div>
771