Member-only story

Bu benim son makalem olabilir!

Nuri Erginer
8 min readDec 5, 2022

--

OpenAI ChatGPT adında bir doğal dil işleme sohbet uygulaması yayınladı. Herkese açık ve bedava. Ben de bu yeniliği test etmek için bazı teknik sorular sordum kendisine. Türkçe olarak sordum. Ve gördüm ki her dilde sizi anlıyor. Bu nasıl münkün olabilir. Bu teknolojinin kullanılacağı alanlar konusunda size fikir vermesi için bazı dialoglarımızı onun iznini alarak burada yayınlamak istedim. Kullanım alanları ile ilgili başka fikirlerinizi bekliyorum. Yalnız öğrenciler ödevlerini bu chatbota yaptırır şimdiden söyleyim değerli hocalarım.

Nuri: tailwind css ile güzel açık mavi bir button tasarlarmısın

ChatGPT: Evet, Tailwind CSS ile güzel bir açık mavi bir button tasarlamak mümkündür. Örneğin, aşağıdaki CSS kodu kullanarak açık mavi bir button oluşturabilirsiniz:

<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full">
Açık Mavi Button
</button>

Bu kod, bir <button> elementi oluşturur ve ona Tailwind CSS sınıflarını uygular. Özellikle, bg-blue-500 sınıfı button'un arka planını açık mavi bir renkle boyar, hover:bg-blue-700 sınıfı ise button'a fare ile üzerine gelindiğinde daha koyu bir mavi renk verir. text-white sınıfı ise button içindeki yazıyı beyaza boyar, font-bold sınıfı ise yazıyı kalın hale getirir. py-2 ve px-4 sınıfları ise button'un yatay ve dikey olarak boşluk bırakmasını ayarlar. Son olarak, rounded-full sınıfı button'un köşelerini yuvarlatır.

Nuri: tailwind css ile dashboard üzerinde sıcaklığı gösterecek bir adet card yap

Evet, Tailwind CSS ile bir dashboard üzerinde sıcaklığı gösteren bir card oluşturmak mümkündür. Örneğin, aşağıdaki CSS kodunu kullanarak bu card’ı oluşturabilirsiniz:

<div class="bg-white rounded-lg shadow-lg p-6">
<div class="flex items-center mb-4">
<svg class="w-6 h-6 mr-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path></svg>
<h3 class="text-gray-700 font-bold text-xl">Sıcaklık</h3>
</div>
<div class="text-center">
<h2…

--

--

Nuri Erginer
Nuri Erginer

Written by Nuri Erginer

Industrial Engineer, Developer, Maker

No responses yet