jQuery TimeAgo library to change color of Text if the DateTime is in the Past?
I am using the Yarp jQuery TimeAgo library in my new App in which I am showing relative timing for a Task records Due Date field.
What I want to do is simply show the date/time value as RED Text once the set Due Date value is in the past tense based on the current date.
So real simple, Future Due Date will show default green text set with CSS on the page:
Past Due Date will show Red text:
The library can be found here: http://timeago.yarp.com/
Can anyone help me to color past due text in Red?
The HTML on the page before the library converts it into a future or past DateTime in words looks like this...
<time id="duedatetimeago"></time>
After the library does it's magic on the element, it simply looks like this...
<time id="duedatetimeago">16 days ago</time>
So you can see no special CSS classes or data attributes or anything are added so it might be difficult to know when the current time is in the past. If you find out "anybody" then please share with me, thank you
Here's a Gist containing modifications to timeago.js - you can change the default past and future colors within the inPastColor variable on line 49
- Any difference between await Promise.all() and multiple await?
- do <something> N times (declarative syntax)
- Current time formatting with Javascript
- Delete related records using pre middleware in mongoose
- Redirecting mobile users according to their OS
- Organise imports for all files in project
- How do you add non-text parts to a multiturn chat with Gemini / Vertex AI?
- How to test if a RegExp contains capturing groups in its definition?
- How to pass my createReadStream of an image file into a HTTP Post Request Body?
- JSON from api to html
- Scan QR Code value into an input field after successful scan
- Trigger a re-render when window.location.search changes
- How to use getComputedStyle with DOMParser produced document (no defaultView or window objects)?
- run javascript function on griview pageindexchanging event
- Returning a Promise from "describe" is not supported. Tests must be defined synchronously
- vue 3 both helper and comosable functions return "is not a function"
- How to capture DOM animations as lossless 60fps video with code only approach
- Listen on multiple input tags and concatenate inputs to a single output field without need to click a button
- How to use a custom font in react native with nativewind?
- React.js passing one components variables to another component and vice-versa
- Reversing words in a string using JavaScript
- This type parameter might need an `extends` constraint in typescript
- How to make text bold with sweetalert in 2018?
- React Audio Player Change current time of Audio
- Mocking a useragent in javascript?
- How can I see the event that is attached to an html element?
- Is there a way to find the event handlers of an element with Javascript?
- How to find event listeners on a DOM node using JavaScript
- Get all events handlers attached to an element
- Changing the color of a <select> depending on its value - CSS only(?)