The element is pretty limited to English and the github date style right now. Ther

relative-time - Hard-coded format for non-relative output about relative-time-element HOT 2 CLOSED

github commented on May 13, 2024 5

relative-time - Hard-coded format for non-relative output

from relative-time-element.

Comments (2)

JasonBarnabe commented on May 13, 2024 1

If anyone's interested, here's what I'm doing to work around it. This will show a locale-formatted date instead of an "on..." string. You need to use <gf-relative-time> for this, but change it however you like.

import {RelativeTimeElement} from '@github/time-elements';

class GFRelativeTimeElement extends RelativeTimeElement {
  getLang() {
    return document.documentElement.getAttribute("lang")
  }

  // Don't show "on... ", show a localized date.
  // https://github.com/github/time-elements/issues/120
  getFormattedDate() {
    let v = super.getFormattedDate();
    if (v.startsWith('on ')) {
      return (new Date(this.getAttribute("datetime"))).toLocaleDateString(this.getLang());
    }
    return v;
  }
}

if (!window.customElements.get('gf-relative-time')) {
  window.GFRelativeTimeElement = GFRelativeTimeElement;
  window.customElements.define('gf-relative-time', GFRelativeTimeElement);
}

from relative-time-element.

keithamus commented on May 13, 2024

In v3.2.0 you can customise the format in many ways; either use format= to apply a strftime compatible format, or use the options that align to the DateTimeFormat options. For more check out the new Readme,

from relative-time-element.

Recommend Projects