SendPulse Marketplace UI Skill

Temel Özellikler

SendPulse stilleri. CDN paketini doğru sırayla bağlar, CSS değişkenlerini ayarlar ve panellerin, alanların ve diğer öğelerin doğru görünmesi için gereken düzeltmeleri uygular.

Tasarım sistemi bileşenleri. Formlar, butonlar, seçim alanları, anahtarlar, modal pencereler, tablolar, açılır menüler, rozetler ve ücretli plan blokları için pakette bulunan sınıfları kullanır. Entegrasyon ayarları ve bağlı hesaplar listesi için iki örnek ekran içerir.

İkonlar. sp_icons koleksiyonundaki 536 ikon arasından doğru adı seçmenize yardımcı olur. Örneğin icon-plus, kare içindeki artı işaretidir; icon-plus-add ise düz artı işaretidir.

SendPulse içinde yerleşim. iframe boyutunu dikkate alır, çift boşlukları önler ve alanlar için standart 364 px genişliği kullanır.

Açık ve koyu tema. SendPulse’ın ?theme=dark parametresiyle ilettiği temayı destekler ve yönlendirme veya OAuth yetkilendirmesi sonrasında temanın korunmasına yardımcı olur.

Bilinen paket sorunları. Ek ayar gerektiren 16 durumu açıklar. Her biri için belirtisini, nedenini ve çözümünü sunar.

Sonuç kontrolü. Betikler bulunmayan sınıfları, stil dosyalarının yanlış yükleme sırasını ve çözülmemiş paket sorunlarını tespit eder. Node ortamında sayfayı Chrome’da her iki temada da kontrol edebilirsiniz.

Nasıl Kurulur

1. SendPulse’ın GitHub deposundan sendpulse-marketplace-ui-cdn klasörünü indirin.
2. Skill’i yapay zekâ asistanınıza ekleyin. Claude Code için klasörü ~/.claude/skills/ veya projenizin .claude/skills/ dizinine yerleştirin. Claude uygulamasında ZIP arşivini Settings → Capabilities → Skills → Upload skill yoluyla yükleyin.
3. Yapmak istediğiniz ekranı tarif edin. Örneğin: “API anahtarı alanı, satış hunisi seçimi ve Kaydet butonu içeren bir entegrasyon ayarları sayfası oluştur.”

Skill’i ChatGPT, Cursor, Gemini ve Copilot ile de kullanabilirsiniz. Bu araçlara yönelik talimatlar adapters klasöründedir. MCP sunucusu veya API anahtarı gerekmez.

Skill, SendPulse tasarım sistemini CDN üzerinden yükleyen uygulamalar için hazırlanmıştır. Stilleri kendi derlemenize dahil ediyorsanız bileşen, ikon ve yerleşim önerilerini kullanıp CDN kurulum adımlarını atlayabilirsiniz.

Kullanım Alanları

Yeni bir entegrasyon oluşturun. SendPulse tasarım sistemine uygun, açık ve koyu temada çalışan ekranlar hazırlayın.

Yapay zekâ ile uygulama geliştirin. İhtiyacınız olan arayüzü tarif edin; asistan uygun SendPulse bileşenlerini ve sınıflarını kullansın.

Mevcut arayüzü düzeltin. Koyu temadaki yanlış arka planın, liste gibi görünen sekmelerin veya açılmayan bir modal pencerenin nedenini bulun.

Yayınlamadan önce kontrol edin. Ekranların iframe içinde ve her iki temada nasıl göründüğünü doğrulayın.

Belirli bir ekranı güncelleyin. Uygulamanın tamamını yeniden oluşturmadan bir sayfayı veya bileşeni SendPulse tasarım sistemine uyarlayın.