## 1 - Basic examples

### 1.1 - Default

Code

      <time
          class="pat-display-time"
          datetime="2015-01-20T08:00Z">
          20 January 2015, 08:00
      </time>

Output

### 1.2 - Example setting the output format explicitly

Code

      <time
          class="pat-display-time"
          datetime="2015-01-20T08:00Z"
          data-pat-display-time="output-format: MMMM dddd Do YYYY, h:mm:ss a">
          20 January 2015, 08:00
      </time>

Output

### 1.3 - Output formatted as local

Code

      <time
          class="pat-display-time"
          datetime="2015-01-20T08:00Z"
          data-pat-display-time="output-format: L">
          20 January 2015, 08:00
      </time>

Output

## 2 - from-now (relative date) with date/time.

### 2.1 - Today

Code

    <time
        class="pat-display-time"
        datetime="2022-07-21T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.2 - Tomorrow

Code

    <time
        class="pat-display-time"
        datetime="2022-07-22T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.3 - Yesterday

Code

    <time
        class="pat-display-time"
        datetime="2022-07-20T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.4 - Next week

Code

    <time
        class="pat-display-time"
        datetime="2022-07-21T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.5 - Last week

Code

    <time
        class="pat-display-time"
        datetime="2022-07-22T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.6 - 10 days in the future

Code

    <time
        class="pat-display-time"
        datetime="2022-07-22T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.7 - 10 days in the past

Code

    <time
        class="pat-display-time"
        datetime="2022-07-22T10:00Z"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.8 - Output formatted as 'from now' with no suffix, in English

Code

    <time
        class="pat-display-time"
        datetime="2015-01-20T08:00Z"
        lang="en"
        data-pat-display-time="from-now: true; no-suffix: true">
    </time>

Output

### 2.9 - Output formatted as 'from now' in English

Code

    <time
        class="pat-display-time"
        datetime="2015-01-20T08:00Z"
        lang="en"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.10 - Output formatted as 'from now' in Italian

Code

    <time
        class="pat-display-time"
        datetime="2015-01-20T08:00Z"
        lang="it"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.11 - Output formatted as 'from now' in Gaelic

Code

    <time
        class="pat-display-time"
        datetime="2015-01-20T08:00Z"
        lang="ga"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 2.12 - Output formatted as 'from now' in Dutch

Code

    <time
        class="pat-display-time"
        datetime="2015-01-20T08:00Z"
        lang="nl"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

## 3 - from-now (relative date) with date only dates.

### 3.1 - Today

Code

    <time
        class="pat-display-time"
        datetime="2022-07-21"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.2 - Tomorrow

Code

    <time
        class="pat-display-time"
        datetime="2022-07-22"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.3 - Yesterday

Code

    <time
        class="pat-display-time"
        datetime="2022-07-20"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.4 - Next week

Code

    <time
        class="pat-display-time"
        datetime="2022-07-25"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.5 - Last week

Code

    <time
        class="pat-display-time"
        datetime="2022-07-17"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.6 - 10 days in the future

Code

    <time
        class="pat-display-time"
        datetime="2022-07-31"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output

### 3.7 - 10 days in the past

Code

    <time
        class="pat-display-time"
        datetime="2022-07-11"
        lang="de"
        data-pat-display-time="from-now: true"
    >
    </time>

Output