<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="257549" data-post-id="257549">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="sreenadh_tc" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/sreenadh_tc/120/17763_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  sreenadh_tc
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="odix67" data-post="10" data-topic="49359">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/odix67/48/19855_2.png" class="avatar"> odix67:</div>
<blockquote>
<p>if you need the react-loading-skeleton css, include it in the <code>app.css</code></p>
</blockquote>
</aside>
<p>yep, that part however is taken care by imports in react component(s) already.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="257549" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/tailwind-css-classes-are-not-loaded-in-production-release-deployments-docker-fly-io/49359/12">Post #11</a>
	                </div>
	            </div>
              <div id="likers-container-257549" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="257549"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #11"></div>
  </section>
</div>
    <div class="postbit" id="257750" data-post-id="257750">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="odix67" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/odix67/120/19855_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  odix67
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>if you reverse the order, this “import” will be overwritten by tailwind, to clean up that code, I would remove the import from the components and import all CSS related stuff in the source <code>app.css</code>, so that tailwind can take care of  it.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="257750" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/tailwind-css-classes-are-not-loaded-in-production-release-deployments-docker-fly-io/49359/13">Post #12</a>
	                </div>
	            </div>
              <div id="likers-container-257750" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="257750"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #12"></div>
  </section>
</div>
    <div class="postbit" id="346316" data-post-id="346316">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="Bodhert" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/Bodhert/120/20943_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  Bodhert
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>This approach will work unless you are using nested styles. As noted in the <a href="https://pragmaticstudio.com/tutorials/using-tailwind-css-in-phoenix#sas" rel="noopener nofollow ugc">Pragmatic Programmer reference</a>, the Tailwind CLI does not include functionality to “flatten out” nested CSS rules. Currently, the <code>@tailwind/nesting</code> NPM package is required if you’re using this method to create CSS. in that Case <code>:dart_sass</code> help to solve the issue, You can unflatten the styles manually also and should work as expected.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="346316" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/tailwind-css-classes-are-not-loaded-in-production-release-deployments-docker-fly-io/49359/14">Post #13</a>
	                </div>
	            </div>
              <div id="likers-container-346316" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="346316"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-last-post cat-last-post" title="Last post!"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <span class="all-loaded">— All posts loaded —</span>
</div></template></turbo-stream>