Weblate ön yüzü#
Ön yüz şu anda Bootstrap, jQuery ve birkaç üçüncü taraf kitaplığı kullanılarak oluşturulmuştur.
Desteklenen tarayıcılar#
Weblate, tüm bilinen tarayıcıların ve platformların en yeni ve kararlı sürümlerini destekler.
Güncel WebKit, Blink ya da Gecko sürümünü kullanan alternatif tarayıcılar, doğrudan ya da platformun site görünümü API uygulaması üzerinden açıkça desteklenmez. Bununla birlikte, Weblate (çoğu durumda) bu tarayıcılarda da düzgün bir şekilde görüntülenmeli ve çalışmalıdır.
Eski tarayıcılar çalışabilir, ancak bazı özellikler sınırlı olabilir.
Bağımlılık yönetimi#
Üçüncü taraf kitaplıklarını güncellemek için Yarn paket yöneticisi kullanılır. Yapılandırma scripts/yarn içindedir ve kitaplıkları yükseltmek, bunları oluşturmak ve üçüncü taraf ön yüz kodunun bulunduğu weblate/static/vendor içindeki konumlara kopyalamak için scripts/yarn-update sarmalayıcı betiği kullanılır. Weblate kodu doğrudan weblate/static içine yerleştirilmeli ya da belirli alt klasörler bulunmalıdır (weblate/static/editor gibi).
Yeni üçüncü taraf kitaplığı eklemek genellikle şu şekildedir:
# Add a yarn package
yarn --cwd scripts/yarn add PACKAGE
# Edit the script to copy package to the static folder
edit scripts/yarn-update
# Run the update script
./scripts/yarn-update
# Add files to git
git add .
Kodlama biçemi#
Weblate, hem JavaScript hem de CSS dosyalarının kod biçimlendirmesi için Prettier kullanır.
Ek olarak JavaScript kodunu denetlemek için ESLint kullanıyoruz.
Yerelleştirme#
Ön yüz kodunda kullanıcı tarafından görülebilecek herhangi bir metne gerek duyuyorsanız, bu yerelleştirilebilir olmalıdır. Çoğu durumda yalnızca, metninizi gettext işlevinin içine kaydırmanız yeterlidir. Ancak kullanılabilecek daha karmaşık özellikler de vardır:
document.write(gettext('this is to be translated'));
var object_count = 1 // or 0, or 2, or 3, ...
s = ngettext('literal for the singular case',
'literal for the plural case', object_count);
fmts = ngettext('There is %s object. Remaining: %s',
'There are %s objects. Remaining: %s', 11);
s = interpolate(fmts, [11, 20]);
// s is 'There are 11 objects. Remaining: 20'
Ayrıca bakınız
Simgeler#
Weblate şu anda material design simgelerini kullanıyor. Yeni simgeler arıyorsanız, Material Design Icons ya da Material Design Resources seçeneğini işaretleyin.
Ek olarak, SVG boyutunu küçültmek için scripts/optimize-svg kullanılır. Çünkü simgelerin çoğu yolların biçemine izin vermek için HTML içine gömülüdür.