much style

This commit is contained in:
Rüdiger Diedrich
2022-07-25 11:05:55 +02:00
parent bd8177a7c0
commit ef0e89478c
3 changed files with 29 additions and 17 deletions

View File

@ -5,12 +5,15 @@
/* This file is for your main application CSS */
body {
@apply bg-neutral text-[14pt];
@apply bg-base-300 text-[14pt] leading-8;
}
.post {
@apply bg-base-200 shadow-md rounded;
@apply flex mb-4 p-4 py-3 gap-4;
@apply bg-base-200 shadow-md rounded-md;
@apply flex mb-4;
}
.post :where(article, .userinfo) {
@apply p-4 pt-4;
}
.post .bbc-block {
@ -19,12 +22,19 @@ body {
.post .bbc-block h4 {
@apply text-sm mb-2;
}
.post .bbc-spoiler { @apply bg-black; }
.post .bbc-spoiler { @apply bg-black text-black; }
.post .bbc-spoiler img { @apply invisible; }
.post .bbc-spoiler:hover { @apply text-inherit bg-inherit; }
.post .bbc-spoiler:hover img { @apply visible; }
.post iframe {
@apply w-full;
@apply w-full bg-[brown];
}
.post .code { @apply mockup-code border-l-0; }
.post .code:before { @apply -ml-[2ch]; }
.post .code pre:before { @apply mr-0; }
.post .code h5 { @apply hidden; }
.post a[href] { @apply link; }
.post .editedby { @apply text-sm italic opacity-70 mt-4; }
/* Alerts and form errors used by phx.new */
.alert {

View File

@ -9,6 +9,10 @@ module.exports = {
theme: {
extend: {},
},
daisyui: {
themes: ["winter", "night"],
darkTheme: "night"
},
plugins: [
require('@tailwindcss/forms'),
require('@tailwindcss/typography'),

View File

@ -11,18 +11,16 @@
</.modal>
<% end %>
<h2>
<%= @thread.title %>
</h2>
<h2>
<%= @thread.title %>
</h2>
<div class="thread my-8">
<%= for post <- @thread.posts do %>
<.post author={post.userinfo} article={post.postbody} />
<% end %>
</div>
<div class="thread my-8">
<.pagination socket={@socket} thread={@thread} />
<%= for post <- @thread.posts do %>
<.post author={post.userinfo} article={post.postbody} />
<% end %>
<span><%= live_redirect "Back", to: Routes.thread_index_path(@socket, :index) %></span>
<span><%= @thread.page %></span>
<span><%= live_redirect "Next Page", class: "link",
to: Routes.thread_show_path(@socket, :show, @thread.id, page: @thread.page+1) %></span>
<.pagination socket={@socket} thread={@thread} />
</div>