Skip to content

Commit 2624a91

Browse files
devnamdev2003devnamdev2003
committed
update doc
1 parent 5e4b037 commit 2624a91

2 files changed

Lines changed: 4 additions & 4 deletions

File tree

‎documentation/components/CalendarComponent.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1918,7 +1918,7 @@ <h3 id="inputs">
19181918
&lt;/div&gt;
19191919

19201920
&lt;!-- ░░ HEATMAP SUMMARY ░░ --&gt;
1921-
&lt;div class&#x3D;&quot;my-6 text-center&quot; *ngIf&#x3D;&quot;isShowHeatmap&quot;&gt;
1921+
&lt;div class&#x3D;&quot;my-6 text-center&quot; *ngIf&#x3D;&quot;heatmapSummary.length &gt; 0&quot;&gt;
19221922
&lt;div
19231923
class&#x3D;&quot;max-w-[300px] md:max-w-md mx-auto w-full border border-[var(--input-border)] rounded-lg overflow-hidden text-sm&quot;&gt;
19241924

@@ -2009,7 +2009,7 @@ <h3 id="inputs">
20092009
<script src="../js/libs/htmlparser.js"></script>
20102010
<script src="../js/libs/deep-iterator.js"></script>
20112011
<script>
2012-
var COMPONENT_TEMPLATE = '<div><section id="calendar" class="section p-3"> <!-- ░░ TOP BAR ░░ --> <div class="flex flex-col justify-between md:w-[60%] m-auto"> <div class="flex items-center justify-start pb-2"> <label for="isShowHeatmap" class="font-semibold pr-2">Show HeatMap</label> <label class="relative inline-flex items-center cursor-pointer"> <input type="checkbox" id="isShowHeatmap" [checked]="isShowHeatmap" (change)="toggleHeatmap()" class="sr-only peer"> <div class="w-10 h-6 bg-gray-600 rounded-full peer peer-checked:bg-[var(--color-accent)] transition-all"> </div> <span class="absolute left-1 top-1 w-4 h-4 bg-white rounded-full transition-all peer-checked:translate-x-4"></span> </label> </div> <div class="flex justify-between items-center pt-2 pb-6"> <button class="shrink-0" (click)="changeMonth(-1)"> <img src="assets/img/icon/icons8-left-arrow-50.png" alt="prev" class="w-[25px] h-[25px] transition-all duration-300 ease-in-out" style="filter: var(--icon-color2);"> </button> <div class="text-center font-semibold"> <a href="/music">Total Expenses: </a> <span class="text-[var(--color-green)]">{{currency}} {{ totalExpenses }}</span> </div> <button class="shrink-0" (click)="changeMonth(1)"> <img src="assets/img/icon/icons8-right-arrow-50.png" alt="next" class="w-[25px] h-[25px] transition-all duration-300 ease-in-out" style="filter: var(--icon-color2);"> </button> </div> <!-- ░░ CALENDAR ░░ --> <div> <h2 class="border-b border-[var(--color-white)] p-2 bg-[var(--color-accent)] text-[var(--color-white)] text-lg font-semibold text-center"> {{ calendarTitle }} </h2> <div class="grid grid-cols-7 text-center font-semibold shadow bg-[var(--color-accent)] text-[var(--color-white)] uppercase text-xs"> <div class="border-r border-[var(--color-white)] p-2" *ngFor="let day of weekDays">{{ day }}</div> </div> <div class="grid grid-cols-7 gap-2 mt-2 text-center text-sm"> <ng-container *ngFor="let day of calendarDays"> <div [ngClass]="day.classes" class="p-2 rounded" (click)="day.isCurrentMonth && openModal(day.date)"> {{ day.label }} </div> </ng-container> </div> </div> </div> <!-- ░░ HEATMAP LEGEND ░░ --> <div class="mt-6" *ngIf="isShowHeatmap"> <div class="flex justify-around md:justify-center md:gap-4 text-[0.8rem]"> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-gray)] inline-block"></span> <span class="text-[var(--color-text)]">No expense</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-emerald)] inline-block"></span> <span class="text-[var(--color-text)]">&lt; 300</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-amber)] inline-block"></span> <span class="text-[var(--color-text)]">300 – 1000</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-rose)] inline-block"></span> <span class="text-[var(--color-text)]">&gt; 1000</span> </div> </div> </div> <!-- ░░ HEATMAP SUMMARY ░░ --> <div class="my-6 text-center" *ngIf="isShowHeatmap"> <div class="max-w-[300px] md:max-w-md mx-auto w-full border border-[var(--input-border)] rounded-lg overflow-hidden text-sm"> <!-- Table Header --> <div class="grid grid-cols-3 bg-[var(--color-gray)] text-[var(--color-text)] font-semibold py-2"> <span>Color</span> <span>Days</span> <span>Amount</span> </div> <!-- Table Rows --> <div *ngFor="let item of heatmapSummary" class="grid grid-cols-3 items-center py-2 border-t border-[var(--input-border)] text-[var(--color-text)] text-[0.8rem] hover:bg-[var(--list-hover)]"> <span class="flex justify-center"> <span class="w-4 h-4 rounded inline-block" [ngClass]="item.color"></span> </span> <span class="font-medium">{{ item.days }}</span> <span class="font-medium">{{ currency }} {{ item.amount}}</span> </div> <!-- Total Row --> <div class="grid grid-cols-3 items-center py-2 border-t border-[var(--input-border)] text-[var(--color-text)] font-semibold"> <span class="col-span-2 text-center">Total</span> <span class="text-center text-green-500">{{ currency }} {{ totalExpenses }}</span> </div> </div> </div> <!-- Modal --> <div id="dayModal" class="fixed inset-0 bg-black bg-opacity-50 items-center justify-center z-50 flex" *ngIf="showModal"> <div class="bg-[var(--color-bg)] p-6 rounded-xl w-11/12 md:w-1/2 max-h-[60vh] flex flex-col shadow-xl"> <div class="flex justify-between items-center mb-4"> <h2 class="text-lg font-bold text-[var(--color-text)]">{{ modalTitle }}</h2> <button (click)="closeModal()" class="text-[var(--color-red)] font-bold text-xl">&times;</button> </div> <ul class="space-y-3 overflow-y-auto pr-2 scrollbar-thin scrollbar-thumb-[var(--color-gray-500)] scrollbar-track-[var(--color-gray-500)] " style="max-height: 60vh;"> <li *ngIf="modalExpenses.length === 0" class="text-[var(--color-gray-500)]">No expenses found for this date.</li> <li *ngFor="let exp of modalExpenses" class="bg-[var(--color-surface)] hover:bg-[var(--list-hover)] rounded-lg p-4 shadow-md"> <div class="flex justify-between items-center mb-2"> <span class="text-lg font-semibold text-[var(--color-green)]">{{currency}} {{ exp.amount }}</span> <span class="text-sm">{{ exp.category_name || \'Uncategorized\' }}</span> </div> <div class="text-sm space-y-1"> <div><strong>Time:</strong> {{ exp.time }}</div> <div *ngIf="exp.note"><strong>Note:</strong> {{ exp.note }}</div> <div *ngIf="exp.location"><strong>Location:</strong> {{ exp.location }}</div> <div *ngIf="exp.payment_mode"><strong>Payment Mode:</strong> {{ exp.payment_mode }}</div> </div> </li> </ul> </div> </div></section></div>'
2012+
var COMPONENT_TEMPLATE = '<div><section id="calendar" class="section p-3"> <!-- ░░ TOP BAR ░░ --> <div class="flex flex-col justify-between md:w-[60%] m-auto"> <div class="flex items-center justify-start pb-2"> <label for="isShowHeatmap" class="font-semibold pr-2">Show HeatMap</label> <label class="relative inline-flex items-center cursor-pointer"> <input type="checkbox" id="isShowHeatmap" [checked]="isShowHeatmap" (change)="toggleHeatmap()" class="sr-only peer"> <div class="w-10 h-6 bg-gray-600 rounded-full peer peer-checked:bg-[var(--color-accent)] transition-all"> </div> <span class="absolute left-1 top-1 w-4 h-4 bg-white rounded-full transition-all peer-checked:translate-x-4"></span> </label> </div> <div class="flex justify-between items-center pt-2 pb-6"> <button class="shrink-0" (click)="changeMonth(-1)"> <img src="assets/img/icon/icons8-left-arrow-50.png" alt="prev" class="w-[25px] h-[25px] transition-all duration-300 ease-in-out" style="filter: var(--icon-color2);"> </button> <div class="text-center font-semibold"> <a href="/music">Total Expenses: </a> <span class="text-[var(--color-green)]">{{currency}} {{ totalExpenses }}</span> </div> <button class="shrink-0" (click)="changeMonth(1)"> <img src="assets/img/icon/icons8-right-arrow-50.png" alt="next" class="w-[25px] h-[25px] transition-all duration-300 ease-in-out" style="filter: var(--icon-color2);"> </button> </div> <!-- ░░ CALENDAR ░░ --> <div> <h2 class="border-b border-[var(--color-white)] p-2 bg-[var(--color-accent)] text-[var(--color-white)] text-lg font-semibold text-center"> {{ calendarTitle }} </h2> <div class="grid grid-cols-7 text-center font-semibold shadow bg-[var(--color-accent)] text-[var(--color-white)] uppercase text-xs"> <div class="border-r border-[var(--color-white)] p-2" *ngFor="let day of weekDays">{{ day }}</div> </div> <div class="grid grid-cols-7 gap-2 mt-2 text-center text-sm"> <ng-container *ngFor="let day of calendarDays"> <div [ngClass]="day.classes" class="p-2 rounded" (click)="day.isCurrentMonth && openModal(day.date)"> {{ day.label }} </div> </ng-container> </div> </div> </div> <!-- ░░ HEATMAP LEGEND ░░ --> <div class="mt-6" *ngIf="isShowHeatmap"> <div class="flex justify-around md:justify-center md:gap-4 text-[0.8rem]"> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-gray)] inline-block"></span> <span class="text-[var(--color-text)]">No expense</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-emerald)] inline-block"></span> <span class="text-[var(--color-text)]">&lt; 300</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-amber)] inline-block"></span> <span class="text-[var(--color-text)]">300 – 1000</span> </div> <div class="flex items-center gap-1"> <span class="w-4 h-4 rounded bg-[var(--color-rose)] inline-block"></span> <span class="text-[var(--color-text)]">&gt; 1000</span> </div> </div> </div> <!-- ░░ HEATMAP SUMMARY ░░ --> <div class="my-6 text-center" *ngIf="heatmapSummary.length > 0"> <div class="max-w-[300px] md:max-w-md mx-auto w-full border border-[var(--input-border)] rounded-lg overflow-hidden text-sm"> <!-- Table Header --> <div class="grid grid-cols-3 bg-[var(--color-gray)] text-[var(--color-text)] font-semibold py-2"> <span>Color</span> <span>Days</span> <span>Amount</span> </div> <!-- Table Rows --> <div *ngFor="let item of heatmapSummary" class="grid grid-cols-3 items-center py-2 border-t border-[var(--input-border)] text-[var(--color-text)] text-[0.8rem] hover:bg-[var(--list-hover)]"> <span class="flex justify-center"> <span class="w-4 h-4 rounded inline-block" [ngClass]="item.color"></span> </span> <span class="font-medium">{{ item.days }}</span> <span class="font-medium">{{ currency }} {{ item.amount}}</span> </div> <!-- Total Row --> <div class="grid grid-cols-3 items-center py-2 border-t border-[var(--input-border)] text-[var(--color-text)] font-semibold"> <span class="col-span-2 text-center">Total</span> <span class="text-center text-green-500">{{ currency }} {{ totalExpenses }}</span> </div> </div> </div> <!-- Modal --> <div id="dayModal" class="fixed inset-0 bg-black bg-opacity-50 items-center justify-center z-50 flex" *ngIf="showModal"> <div class="bg-[var(--color-bg)] p-6 rounded-xl w-11/12 md:w-1/2 max-h-[60vh] flex flex-col shadow-xl"> <div class="flex justify-between items-center mb-4"> <h2 class="text-lg font-bold text-[var(--color-text)]">{{ modalTitle }}</h2> <button (click)="closeModal()" class="text-[var(--color-red)] font-bold text-xl">&times;</button> </div> <ul class="space-y-3 overflow-y-auto pr-2 scrollbar-thin scrollbar-thumb-[var(--color-gray-500)] scrollbar-track-[var(--color-gray-500)] " style="max-height: 60vh;"> <li *ngIf="modalExpenses.length === 0" class="text-[var(--color-gray-500)]">No expenses found for this date.</li> <li *ngFor="let exp of modalExpenses" class="bg-[var(--color-surface)] hover:bg-[var(--list-hover)] rounded-lg p-4 shadow-md"> <div class="flex justify-between items-center mb-2"> <span class="text-lg font-semibold text-[var(--color-green)]">{{currency}} {{ exp.amount }}</span> <span class="text-sm">{{ exp.category_name || \'Uncategorized\' }}</span> </div> <div class="text-sm space-y-1"> <div><strong>Time:</strong> {{ exp.time }}</div> <div *ngIf="exp.note"><strong>Note:</strong> {{ exp.note }}</div> <div *ngIf="exp.location"><strong>Location:</strong> {{ exp.location }}</div> <div *ngIf="exp.payment_mode"><strong>Payment Mode:</strong> {{ exp.payment_mode }}</div> </div> </li> </ul> </div> </div></section></div>'
20132013
var COMPONENTS = [{'name': 'AddExpenseComponent', 'selector': 'app-add-expense'},{'name': 'AiComponent', 'selector': 'app-ai'},{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'BudgetComponent', 'selector': 'app-budget'},{'name': 'CalendarComponent', 'selector': 'app-calendar'},{'name': 'CategoryDropdownComponent', 'selector': 'app-category-dropdown'},{'name': 'DownloadComponentComponent', 'selector': 'app-download-component'},{'name': 'ExpenseDetailsModalComponent', 'selector': 'app-expense-details-modal'},{'name': 'ExpenseListComponent', 'selector': 'app-expense-list'},{'name': 'ExpenseWiseComponent', 'selector': 'app-expense-wise'},{'name': 'FooterComponent', 'selector': 'app-footer'},{'name': 'FormModelComponent', 'selector': 'app-form-model'},{'name': 'GlobalLoaderComponent', 'selector': 'app-global-loader'},{'name': 'GraphsComponent', 'selector': 'app-graphs'},{'name': 'HamburgerMenuComponent', 'selector': 'app-hamburger-menu'},{'name': 'HomeComponent', 'selector': 'app-home'},{'name': 'InstallAppPopupComponentComponent', 'selector': 'app-install-app-popup-component'},{'name': 'ListExpensesComponent', 'selector': 'app-list-expenses'},{'name': 'MusicComponent', 'selector': 'app-music'},{'name': 'NavbarComponent', 'selector': 'app-navbar'},{'name': 'PieChartComponent', 'selector': 'app-pie-chart'},{'name': 'PlaylistMusicComponent', 'selector': 'app-playlist-music'},{'name': 'SearchButtonComponent', 'selector': 'app-search-button'},{'name': 'SearchMusicComponent', 'selector': 'app-search-music'},{'name': 'SettingItemComponent', 'selector': 'app-setting-item'},{'name': 'SettingsComponent', 'selector': 'app-settings'},{'name': 'SidebarComponent', 'selector': 'app-sidebar'},{'name': 'TemplatePlaygroundComponent', 'selector': 'template-playground-root'},{'name': 'ToastComponent', 'selector': 'app-toast'}];
20142014
var DIRECTIVES = [];
20152015
var ACTUAL_COMPONENT = {'name': 'CalendarComponent'};

‎documentation/js/search/search_index.js‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)