Fix Header Dark Mode and Mobile

deniz-9 / Olimpos

0 stars 1 forks source link

Fix Header Dark Mode and Mobile #1

Closed gokhanozdemir closed 1 week ago

gokhanozdemir commented 1 month ago

https://github.com/deniz-9/Olimpos/blob/62f463e5f56e32b86fd39a1b59fb630a9e4e21c6/src/layouts/Header.jsx#L9

[x] Dark Mode konusunda bir kaç antipattern gördüm. Örn header'da neden iki farklı component oluşturdun? Tailwind Dark Mode docs
[x] Mobile header alanında mobilde görünmemesi gereken alanları gizleyebilirsin. className="hidden sm:block" gibi

gokhanozdemir commented 1 month ago

128px padding-x

gokhanozdemir commented 1 month ago

@deniz-9 https://tailwindcss.com/docs/container Anlamadığın yerler olursa yeniden bakalım. Burada başka video bulamadım. Yine konuyu netleştirmezsen bakalım. https://www.youtube.com/watch?v=dOM78mzeBsQ

deniz-9 commented 1 month ago

@gokhanozdemir Dark ve Light bileşenlerinde, dark iletişim bilgilerini, light ise menü başlıklarını içeriyor hocam. Dark mode özelliği değiller. Ben ayırt etmek için bu şekilde adlandırdım. Mobil görünüm için bir sidebar bileşeni oluşturdum. Bu sayede mobil versiyonda, ilgili alanlarda açılıp kapanan bir panel bulunuyor, böylece gereksiz bilgiler gözükmüyor.