Her programlama dilinde olduğu gibi, kod okunurluğunu kolaylaştırmak amacıyla Sass içinde de yorum satırları kullanabilirsiniz. Sass içinde iki farklı yorumlama yöntemi bulunur. Bu yöntemlerden bir tanesi; kod içine attığınız yorum satırı oluşturulan CSS içine dahil edilir, diğeri ise sadece “*.sass” veya “*.scss” dosyanızda kalarak oluşturulan CSS dosyasına dahil edilmez.

İkinci yöntem sayesinde yorum satırları sadece development ortamında bulunur, proje gerçek ortamda çalışırken ihtiyacınız olmayan gereksiz satırlardan kurtulmuş olursunuz. Eğer siz de benim gibi performansa gereğinden fazla değer veriyorsanız bu özelliği seveceksiniz.

 

1 – Çok Satırlı Yorumlar

“/*” ve “*/”  karakterleri arasına yazılan bu yorum şekli, oluşturulan CSS dosyasına dahil edilir. Eğer yorum satırına hem geliştirme hem de gerçek çalışan ortamda ihtiyaç duyuyorsanız kullanmanız daha mantıklı olacaktır.

NOT: Koala uygulaması yorum içindeki Türkçe karakterleri tanımadığı için dosyamızın başına @charset "utf-8" tanımlaması yapmamız gerekiyor.

SCSS:

@charset "utf-8";

/* Çoklu yorum satırı başlangıcı 
 * Bu yorum css çıktısında görünür
 * Css açıklama sözdizimi biçimindedir */
 
body {
	font-size: 16px;
}

SASS:

@charset "utf-8"

/* Çoklu yorum satırı başlangıcı 
 * Bu yorum css çıktısında görünür
 * Css açıklama sözdizimi biçimindedir */
 
body
	font-size: 16px

ÇIKTI:

@charset "UTF-8";
/* Çoklu yorum satırı başlangıcı
 * Bu yorum css çıktısında görünür
 * Css açıklama sözdizimi biçimindedir */
 
body {
	font-size: 16px;
}

 

2 – Tek Satırlı Yorumlar

Sass, JavaScript’ten alışık olduğumuz “//” karakterleri ile başlayan yorum satırları kullanmamızı sağlar. Bu şekilde kullanılan yorum satırları, oluşturulan CSS dosyasına dahil edilmez. Standart CSS sözdiziminde böyle bir kullanım mümkün değildir.

Her “//” ile başlayan yorum, Sass için bir satır olarak kabul edilir, dilerseniz alt alta sınırsız olarak bu yorum satırını kullanabilirsiniz.

SCSS:

@charset "utf-8";

// Tek satır yorum başlangıcı 
// Bu yorum css çıktısında görünmez
// Bu satırları dilediğiniz kadar çoğaltabilirsiniz.
 
body {
	font-size: 16px;
}

SASS:

@charset "utf-8"

// Tek satır yorum başlangıcı 
// Bu yorum css çıktısında görünmez
// Bu satırları dilediğiniz kadar çoğaltabilirsiniz.
 
body
	font-size: 16px

ÇIKTI:

body {
	font-size: 16px;
}

 

3 – Dinamik Yorum Satırları

Herhangi bir değişkenden gelen bir veriyi yorum satırı içinde kullanmanız Sass ile mümkün. Versiyon numarası gibi sürekli değiştireceğiniz bir veriyi yorum satırı içine dahil edebilirsiniz.

Aşağıdaki örnekteki işlemin detayını String Operasyonları bölümünde detaylıca inceleyeceğiz.

SCSS:

@charset "utf-8";

$name : 'Yunus Sass Framework';
$version : '1.0.1';

/* Proje Adı: #{$name} - Versiyon: #{$version} */

body {
	margin: 0px;
}

SASS:

@charset "utf-8"

$name : 'Yunus Sass Framework'
$version : '1.0.1'

/* Proje Adı: #{$name} - Versiyon: #{$version} */

body
	margin: 0px

ÇIKTI:

@charset "UTF-8";
/* Proje Adı: Yunus Sass Framework - Versiyon: 1.0.1 */

body {
	margin: 0px;
}

Okuduğunuz için teşekkürler, bir sonraki yazıda değişkenler konusuna değineceğiz.