departure-board
departure-board copied to clipboard
text color change based on content
Congratulation! It's very cool. I have a question: is there a easy way to chance text color based on text?
Example:
if text_match = 'world' than color yellow result:
first row: "this is a test"---> color white
second row: 'hello world!' ----> color yellow
I think I should use this._element.appendChild on DepartureBoard.Letter, but I tried without sucessful.
thank you
You can either achieve this with CSS:
.row:nth-child(2) .letter {
color: yellow;
}
...or with JavaScript. In the case of the demo, that would be:
// After the line: var board = new DepartureBoard(...);
board._element.querySelector('.row:nth-child(2)').style.color = 'yellow';
Thank you for your quick answer! Your great suggestion works well, but I'm looking for something like this:
board._element.querySelector(".row").should.have.text('world').style.color = 'yellow';
I mean, color yellow if the class .row contains the text 'world'