Dark mod aktif etme.

[muratbudak54]

Dark modu aktif ediyorum tek ettiğim sayfada kalıyor bunu bütün sayfalarda nasıl aktif ederim?

kodlar

                        <div class="checkbox checkbox-slider--b-flat">
                            <label class="mode-control">
                                <input id="mode-btn" type="checkbox">
                                <span>Dark mod</span>
                            </label>
                        </div>
<style>
    body
    {
        background-color: #eee;
        color: #222;
        transition: 300ms;
    }

    body.dark
    {
        background-color: #413d3e;
        color: #fff;
    }

    .mode-control span:nth-of-type(2)
    {
        display: none;
    }

    .mode-control input:checked + span
    {
        display: inline-block;
    }
</style>
<script src="script.js"></script>

document.getElementById('mode-btn').addEventListener('click', () =>{
    document.body.classList.toggle('dark');
    localStorage.setItem('mode', document.body.classList);
})

if (localStorage.getItem('mode') != ''){
    document.body.classList.add(localStorage.getItem('mode'));
    document.getElementById('mode-btn').checked = true;
}

 

[Web Kartalı]

Dark mod için bir çok yöntem var aslında , yapınızı net bilmeden birşeyler söylemek pek doğru değil ama, en basit yöntemlerden birini söylemek isterim. Belki bir fikir olur sizin için.

Veritabanında kullanıcı detaylarını tuttuğun yerde bir tanede de tema seçeneği alanı eklersin.
değer 0 yada 1 olur. Açık temam ya 0 dersin dark yani koyu temaya da 1 dersin..

php yada benzeri web dillerinden bir ni kullanıyorsanız if kullanarak ilgili css dosyasını include edebilirsiniz.. Veritabanındaki değer 0 ise beyaz temanın css dosyası gelip çalışacak, 1 ise dark tema

Bu durumu her defasında sql sorgusu yaparak çekmene gerek yok session değeri ile de tutabilirsin.
Mod değişimi olunca ilgili session değierini sıfırlayıp yeni değeri oluşturursunuz.

Öneli olan işin işleyişini ve mantığını anlamak. Kolay gelsin.

 

[muratbudak54]

Güzel fikir, teşekkür ederim.

 

[quaresma71]

Dark mod için bir çok yöntem var aslında , yapınızı net bilmeden birşeyler söylemek pek doğru değil ama, en basit yöntemlerden birini söylemek isterim. Belki bir fikir olur sizin için.

Veritabanında kullanıcı detaylarını tuttuğun yerde bir tanede de tema seçeneği alanı eklersin.
değer 0 yada 1 olur. Açık temam ya 0 dersin dark yani koyu temaya da 1 dersin..

php yada benzeri web dillerinden bir ni kullanıyorsanız if kullanarak ilgili css dosyasını include edebilirsiniz.. Veritabanındaki değer 0 ise beyaz temanın css dosyası gelip çalışacak, 1 ise dark tema

Bu durumu her defasında sql sorgusu yaparak çekmene gerek yok session değeri ile de tutabilirsin.
Mod değişimi olunca ilgili session değierini sıfırlayıp yeni değeri oluşturursunuz.

Öneli olan işin işleyişini ve mantığını anlamak. Kolay gelsin.

bunun için veritabanı kullanmaya gerek yok javascript ile cookie ekleyebilir