adam/doordesk-js
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

shadows for articles

Browse source
This commit is contained in:
Adam 2024-01-19 22:36:03 -05:00
parent 2119658560
commit ee4b2c0ced
2 changed files with 7 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
doordesk/app/src/components/article.rs
View file

@ -12,7 +12,8 @@ pub struct ArticleData {
#[component] #[component]
pub fn Article(data: ArticleData) -> impl IntoView { pub fn Article(data: ArticleData) -> impl IntoView {
view! { view! {
<article class="p-7 my-5 mx-auto w-11/12 max-w-screen-xl bg-opacity-10 rounded-md bg-zinc-700 shadow-1g"> // Shadow styling is in main .css file
<article class="p-7 my-5 mx-auto w-11/12 max-w-screen-xl bg-opacity-10 rounded-md bg-zinc-700">
<h1 class="text-3xl font-light text-orange-600 capitalize max-6-xs">{&data.title}</h1> <h1 class="text-3xl font-light text-orange-600 capitalize max-6-xs">{&data.title}</h1>
<hr class="opacity-50"/> <hr class="opacity-50"/>
<span class="pt-0 pb-3.5 text-xs opacity-50 m-t">{&data.date}</span> <span class="pt-0 pb-3.5 text-xs opacity-50 m-t">{&data.date}</span>

5
doordesk/style/tailwind.css
View file

@ -19,6 +19,11 @@ nav li:has(> a[aria-current="page"]) {
@apply border-b-orange-700 border-b-2; @apply border-b-orange-700 border-b-2;
} }
/* Shadows don't work inline for some reason */
article {
@apply shadow-lg shadow-black;
}
/* for innerHTML articles */ /* for innerHTML articles */
article p { article p {
@apply mt-5 indent-4; @apply mt-5 indent-4;