Как применить переопределение CSS на основе текста, примененного к объекту? - PullRequest
Новая
       23

Как применить переопределение CSS на основе текста, примененного к объекту?

0 голосов
/ 03 апреля 2019

Я использую платформу, которую не могу изменить / настроить (Salesforce's Community Cloud), поэтому для изменения пользовательского интерфейса мне нужно применить переопределение CSS.

В пользовательском интерфейсе на странице сведений о вопросе(который показывает только родительский пост и все связанные ответы), он: 1) усекает каждый ответ до первых нескольких строк 2) предлагает кликабельный текст «Показать больше» или «Развернуть больше» для расширения поста

Iхотите переопределить, только когда текст, примененный к объекту, соответствует определенному условию, возможно ли это?

Я использовал это переопределение, и оно работает, но применяется к объекту 

/* Hides the .cuf-more object */
.forceChatterFeedBodyText .cuf-more {display:none !important;}
/* when this .cuf-more object is hidden, I want to override a max-height variable and show all of what is there */
.forceChatterFeedBodyText .feedBodyInnerTruncated {max-height:100% !important;}

Я не хочу, чтобы это применялось к каждому экземпляру объекта, только в том случае, если к спецификации применен / использован текст:

Использованиедля этого условия (где текст «Показать больше»): 

<a tabindex="0" href="javascript:void(0);" title="Show more text" class="cuf-more fadeOut">
<div class="">Show More</div></a>

НЕ используйте для этого (где текст «Развернуть сообщение»): 

<a tabindex="0" href="javascript:void(0);" title="Show more text" class="cuf-more fadeOut">
<div class="">Expand Post</div></a>

1 Ответ

0 голосов
/ 03 апреля 2019

Вы можете установить определенный идентификатор имени класса в каждом случае.

Например: 

<div class="show-more">Show More</div>
<div class="expand-post">Expand Post</div>

Затем вы можете запросить имена классов в CSS с помощью 

.show-more {

}

.expand-post {

}
...