twitter_widget.html

<div class="flex flex-wrap justify-center mb-8 lg:mb-24">
{% for tweet in tweet_list %}
  <div class="w-full flex max-w-xs">
    <div class="p-4 flex flex-col items-center text-center border border-grey-100">
      <img
        class="rounded-full shadow-sm w-12 mb-2"
        src="{{ tweet.author_img_url }}"
        alt="user image"
      />
      <h5 class="font-alt mb-2">
        {{ tweet.author_name }}
      </h5>
      <small class="mb-4 text-turquoise-400">
        {{ tweet.author_username }}
      </small>
      <p class="text-base leading-6 mb-2">
        {{ tweet.text }}
      </p>
      <a href="" class="hover:no-underline">
        <i class="ico--twitter text-turquoise-400 text-xl"></i>
      </a>
    </div>
  </div>
{% endfor %}
</div>