inhji
/
microformats2-elixir


			
				
					
						
						
							
							<div
  class="w-100 mt1 mt3-l cb pv2 flex flex-grow flex-auto flex-column content-stretch"
>
  <article
    class="w-100 h-entry mt1 mt3-l pa2 flex flex-grow flex-auto flex-column content-stretch justify-center items-center"
  >
    <div class="flex flex-column flex-auto flex-grow w-100">
      <div class="mw7 w-100 center">
        <h2 class="navy f2 lh-title p-summary p-name mb1">
          <i class="br-100 pa1 fw1 h2 w2 v-mid" data-feather="heart">Liked</i>
          <span class="v-mid">Liked</span>
          <a
            target="_new"
            class="u-like-of h-cite v-mid fw5 underline link navy"
            href="http://67efebc0.ngrok.io/post/b5a600c5-98a0-4112-b2d5-9df7c600f5e2"
          >
            67efebc0.ngrok.io
          </a>
        </h2>
        <h5 class="f5 code gray lh-solid fw1 ttu">67efebc0.ngrok.io</h5>
      </div>
      <div
        class="mw8 center w-100 order-2 items-end flex flex-wrap justify-around-m justify-between mt4-l mt2"
      >
        <div
          class="db bg-near-black mt4-s ma3-l self-start order-1 w-100 w-auto-ns self-stretch items-center sans-serif"
        >
          <ul
            class="flex flex-column w-100 h-100 justify-center w-auto-l ba b--near-black relative-l left-1-l bottom-1-l self-end-l self-center ma0 pa3 f6 gray list lh-copy bg-dark-gray moon-gray"
          >
            <li class="lh-copy">
              <a href="#mentions-reposts" class="link color-inherit dim">
                <i class="v-mid ph1 w1 h1" data-feather="repeat"></i>
                <span class="v-mid"><strong>0</strong> Reposts</span>
              </a>
            </li>
            <li class="lh-copy mt1">
              <a href="#mentions-replies" class="link color-inherit dim">
                <i class="v-mid ph1 w1 h1" data-feather="corner-up-right"></i>
                <span class="v-mid"><strong>0</strong> Replies</span>
              </a>
            </li>
            <li class="lh-copy mt1">
              <a href="#mentions-likes" class="link color-inherit dim">
                <i class="v-mid ph1 w1 h1" data-feather="heart"></i>
                <span class="v-mid"><strong>0</strong> Likes</span>
              </a>
            </li>
            <li class="lh-copy mt1">
              <a href="#mentions-mentions" class="link color-inherit dim">
                <i class="v-mid ph1 w1 h1" data-feather="at-sign"></i>
                <span class="v-mid"><strong>0</strong> Mentions</span>
              </a>
            </li>
            <li class="lh-copy mt1">
              <a href="#mentions-syndication" class="link color-inherit dim">
                <i class="v-mid ph1 w1 h1" data-feather="upload-cloud"></i>
                <span class="v-mid"><strong>8</strong> Syndications</span>
              </a>
            </li>
          </ul>
        </div>
        <div class="w-100 w-auto-l order-3 order-2-l self-center mv3 mv4-m">
          <p class="dn-l lh-copy pa0 ma0 f6 gray">An uncategorized post.</p>
        </div>

        <div
          class="db bg-near-black mt3 mt0-m ma3-l self-start w-100 w-auto-ns order-2 order-3-l self-stretch items-center sans-serif"
        >
          <ul
            class="flex flex-column w-100 h-100 justify-center w-auto-l relative-l left--1-l top--1-l self-end-l self-center ma0 pa2 f6 dark-gray list lh-copy bg-lightest-blue near-black ba b--mid-gray"
          >
            <li class="lh-copy">
              published
              <time
                class="fw5 dt-published"
                title="2018-12-19T00:19:04.410503Z"
                datetime="2018-12-19T00:19:04.410503Z"
              >
                7 minutes
              </time>
            </li>
            <li class="lh-copy mt1">
              updated
              <time
                class="fw5 dt-updated"
                title="2018-12-19 00:19:04.406330"
                datetime="2018-12-19 00:19:04.406330"
              >
                7 minutes
              </time>
            </li>
            <li class="lh-copy mt1">
              <a class="link dim fw5 color-inherit" href="/post/of-type/like">
                a
                <i class="v-mid pv1 h1 w1" data-feather="message-square"></i>
                like post
              </a>
            </li>
            <li class="lh-copy mt1">
              <a
                class="link navy fw5 u-url u-uid"
                href="/post/a4ab5c98-c476-4800-9f09-2f7f5a337f32"
                >Permalink</a
              >
            </li>
            <li class="lh-copy mt1">
              <span class="v-mid">by</span>
              <a
                class="ml1 u-author h-card v-mid link fw5 navy"
                rel="me"
                href="/"
              >
                <img
                  class="v-mid u-photo br-100 h1 w1 b--near-black"
                  src="http://localhost:9000/koype-dev/photos/floating/original_self-portrait.jpg"
                />
                <span class="v-mid">Jacky Alciné</span>
              </a>
            </li>
          </ul>
        </div>
        <div class="w-100 order-4 self-end bt b--moon-gray">
          <h3 class="f3 ttu fw3 tracked lh-title">
            <i class="v-mid w2 h2" data-feather="message-circle"></i>
            <span class="v-mid">Responses</span>
          </h3>
          <p class="f5 lh-copy measure">
            Here's what people had to say about this like. Want to join in?
            <a
              target="_new"
              href="https://indieweb.org/reply#How_To"
              class="link underline navy fw7"
              >Learn how</a
            >.
          </p>
        </div>
      </div>
    </div>
  </article>
</div>