كيفية تغيير ألوان الأزرار عند التحويم؟

الدعم
2

مرحباً @xomiamoore :slight_smile:

يمكنك تجربة شيء مثل هذا وتعديل الألوان والخصائص الأخرى حسب احتياجاتك:

في CSS المشترك لموضوع أو مكون موضوع:

// * خلفية الزر * //

.banner-box .button-container .close, 
.banner-box .button-container .toggle {
    background: silver;
    &:hover {
    background: yellow;
    }
}

// * ألوان نص الزر //

.banner-box .button-container .close .d-button-label, 
.banner-box .button-container .toggle .d-button-label {
    color: red;
    &:hover {
    color: blue;
    }     
}

// * ألوان أيقونة السهم * //

.banner-box .button-container .close svg, 
.banner-box .button-container .toggle svg {
    color: grey;
    &:hover {
    color: black;
    }
}

يمكنك أيضًا استخدام رموز الألوان السداسية العشرية (على سبيل المثال: #000000) أو متغيرات الموضوع (على سبيل المثال: var(--secondary) للألوان.

5 إعجابات