LessCss ve CrunchApp

LessCss ve CrunchApp

LessCss ve CrunchApp'tan bahsetmek istiyorum. Stil dosyaları üzerinde kontrol sahibi olmak belirli bir zaman sonra cidden zorlaşıyor, aynı sınıfların ve aynı kodların tekrar tekrar yazılması sık karşılaştığım bir sorun, bir renkte ve ya bir border kalınlığında yapılacak değişiklikler ctrl+f tuş kombinasyonuyla zahmetli bir süreçtir.

Bu noktada  LessCss bizi bir çok dertten kurtarıyor, isteğimize göre değişkenler tanımlayıp istediğimiz gibi fonksiyonlar oluşturarak, işimizi ciddi bir oranda kolaylaştırabiliyoruz. Aşağıda bir kaç örnekte sistemi anlatmaya çalışacağım.

Less Örnekleri 

Değişken Yapısı Kullanımı:

Sonuç olarak çıkan CSS yapısı:

Fonksiyon Yapısı Kullanımı:

Sonuç olarak çıkan CSS Yapısı:

Yukarıda  sistemin temel işleyişine yönelik 2 örnek verdim, daha detaylı örnekleri http://lesscss.org adresinde bulabilir, kendiniz çeşitlendirebilirsiniz.

Crunch App

LessCss kullanmanın farklı yöntemleri var, ben CrunchApp'tan bahsetmek istiyorum, tasarım ve kullanımıyla benim cidden hoşuma giden bir Air uygulaması, eksikleri tabiki var ama bu haliyle bile yeterince kullanışlı ve şık.

Aşağıda gördüğünüz uygulama ana ekranı, oluşturduğunuz .less dosyasını bu ekranda hazırlayarak Crunch It butonuna bastığınızda sizin için CSS dosyasını oluşturuyor.

Uygulama hakkında daha detaylı bilgiye http://crunchapp.net/ adresinden ulaşabilir, uygulamayıburadan indirebilirsiniz.