truncgit/citrus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor template preview button and loading indicators: Updated the template preview Blade view to replace the fullscreen editor button with a preview update button, enhancing user interaction. Improved loading indicators with a new play icon for better visual feedback during content processing.

Browse Source
This commit is contained in:
Ümit Tunç
2025-10-31 17:59:13 -03:00
parent 6ec04cfdde
commit e7d6355b5c
1 changed files with 7 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/components/template-preview.blade.php
+7 -17
View File
@@ -15,34 +15,24 @@
</label>
</div>
<div class="mt-2 flex items-center justify-end gap-2 mb-2">
<button
@click="openFullscreenEditor()"
class="fi-btn fi-btn-color-gray fi-btn-size-sm inline-flex items-center justify-center rounded-lg font-semibold outline-none transition duration-75 focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-70 bg-gray-600 text-white hover:bg-gray-500 dark:bg-gray-500 dark:hover:bg-gray-400 p-2"
type="button"
title="Tam Ekran Editörü Aç">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"></path>
</svg>
</button>
<div class="fi-section-content">
<button
@click="updatePreview()"
:disabled="isLoading"
class="fi-btn fi-btn-color-primary fi-btn-size-sm inline-flex items-center justify-center rounded-lg font-semibold outline-none transition duration-75 focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-70 bg-primary-600 text-white hover:bg-primary-500 dark:bg-primary-500 dark:hover:bg-primary-400 p-2"
type="button"
title="Önizlemeyi Çalıştır">
<svg x-show="!isLoading" class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<svg x-show="isLoading" class="w-5 h-5 animate-spin" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
<svg class="fi-icon fi-size-lg fi-sidebar-item-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
<!-- Play icon (Heroicon solid play) -->
<path fill-rule="evenodd" d="M5.25 4.5v15a1.125 1.125 0 0 0 1.666.974l12-7.5a1.125 1.125 0 0 0 0-1.948l-12-7.5A1.125 1.125 0 0 0 5.25 4.5zm1.875 1.99 10.178 6.36-10.179 6.36V6.491z" clip-rule="evenodd"></path>
</svg>
</button>
</div>
<div class="border border-gray-300 dark:border-gray-700 rounded-lg overflow-hidden bg-white dark:bg-gray-800"
style="min-height: 400px; position: relative; width: 100%;">
style="min-height: 400px; position: relative; width: 100%;margin-top: 10px;">
<!-- Loading indicator with modern preloader -->
<div
x-show="isLoading || !iframeSrc"