Bolehkah Kurang pembolehubah seperti @navBarHeight ditemakan?

Seni Tematisasi dalam Kurang

Apabila membangunkan apl, pengubahsuaian visual yang kerap tidak dapat dielakkan semasa kami berusaha ke arah pengesahan pelanggan. Mengekalkan estetika halaman (tema) tertentu untuk persembahan pelanggan yang pantas adalah wajar.

Satu pendekatan melibatkan mencipta kelas penampilan yang digunakan pada elemen badan, membolehkan transformasi halaman pantas. Ini menimbulkan persoalan: bolehkah pembolehubah Kurang seperti @navBarHeight ditemakan?

Tema Boleh Disesuaikan dengan Kurang

Kebolehlaksanaan ini bergantung pada tahap gaya dan variasi pembolehubah antara tema. Titik permulaan yang mudah:

@themes: (
    blue   rgb( 41, 128, 185),
    marine rgb( 22, 160, 133),
    green  rgb( 39, 174,  96),
    orange rgb(211,  84,   0),
    red    rgb(192,  57,  43),
    purple rgb(142,  68, 173)
);

#navBar {
    .themed(background-color);
}

.themed(@property) {
    .for(@themes); .-each(@theme) {
        @name:  extract(@theme, 1);
        @color: extract(@theme, 2);

        .theme-@{name} & {
            @{property}: @color;
        }
    }
}

Melebihi Asas: Penyesuaian Dipertingkat

Menggunakan teknik seperti Padanan Corak dan Argumen Set Peraturan membolehkan penjanaan hierarki tema kompleks secara automatik. Pertimbangkan contoh ini:

#navBar {
    .themed({
        color:            @fore-color;
        background-color: @back-color;
    });
}

.theme(@name: green) {
    @fore-color: green;
    @back-color: spin(@fore-color, 180);
    .apply();
}

.theme(@name: blue) {
    @fore-color: blue;
    @back-color: (#fff - @fore-color);
    .apply();
}

.theme(@name: black-and-white) {
    @fore-color: black;
    @back-color: white;
    .apply();
}

Ini membolehkan sistem tema yang sangat boleh disesuaikan yang disesuaikan dengan keperluan reka bentuk khusus. Dengan Kurang, kemungkinan penematan fleksibel adalah tidak berkesudahan.

Atas ialah kandungan terperinci Bolehkah Kurang pembolehubah seperti @navBarHeight ditemakan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!