استبدال عنصر التنقل #current-user بالنص

مطور
1

مرحبًا بالجميع.

أحتاج إلى استبدال عنصر #current-user (صورة الملف الشخصي) في شريط التنقل بالنص “profile”.
ما هو أفضل نهج للقيام بذلك؟

لقد جربت إضافة نص إلى #current-user a::before

وتعيين خاصية العرض لصورة الملف الشخصي إلى none،

ولكن هذا سيؤدي أيضًا إلى إخفاء الإشعارات.

النتيجة المطلوبة هي شيء من هذا القبيل.

27%20PM

شكرًا مقدّمًا.

2

أعتقد أنه يمكنك إنشاء صورة تحتوي على النص “الملف الشخصي”. وعرض هذه الصورة بدلاً من الصورة الرمزية.

3

@blake، شكرًا لك على الرد.
أعمل على تصميم قالب جديد ولا أعتقد أن ذلك سيكون الأمثل.
هل تعتقد أنه يمكنني فعل ذلك باستخدام واجهة برمجة التطبيقات للإضافات أو أداة؟

5

مرحباً،
هذا ممكن أيضاً باستخدام css. :slightly_smiling_face:

عام > CSS

li#current-user {
  a.icon {
    padding: 0.2143em 0.5em;
    border: 1px solid transparent;
    border-bottom: none;
    &:before {
      content: "profile";
      font-weight: 600;
    }
    img.avatar {
      display: none;
    }
  }
}
// محاذاة قائمة المستخدم الجديدة
.desktop-view {
  .user-menu.revamped {
    right: 0.25em;
  }
}