This commit is contained in:
dr-frmr 2024-06-17 22:53:12 -04:00
parent 758a58fc12
commit 5623cb2203
No known key found for this signature in database
2 changed files with 25 additions and 41 deletions

View File

@ -61,8 +61,6 @@ fn make_widget() -> String {
return r#"<html>
<head>
<style>
/* General body styles */
* {
box-sizing: border-box;
margin: 0;
@ -79,7 +77,6 @@ fn make_widget() -> String {
overflow: hidden;
}
/* Flex container for apps */
#latest-apps {
display: flex;
flex-wrap: wrap;
@ -96,7 +93,6 @@ fn make_widget() -> String {
scrollbar-width: none;
}
/* Individual app container */
.app {
padding: 0.5rem;
display: flex;
@ -114,12 +110,11 @@ fn make_widget() -> String {
background-color: rgba(255, 255, 255, 0.2);
}
/* App image styling */
.app-image {
border-radius: 0.75rem;
margin-right: 0.5rem;
flex-grow: 1;
background-size: cover;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
height: 92px;
@ -127,7 +122,6 @@ fn make_widget() -> String {
max-width: 33%;
}
/* App information styling */
.app-info {
display: flex;
flex-direction: column;
@ -135,13 +129,11 @@ fn make_widget() -> String {
max-width: 67%;
}
/* Headings within app-info */
.app-info h2 {
font-weight: bold;
font-size: medium;
}
/* Responsive design for larger screens */
@media screen and (min-width: 500px) {
.app {
width: 49%;

View File

@ -33,7 +33,7 @@ fn init(_our: Address) {
serde_json::json!({
"Add": {
"label": "KinoUpdates",
"widget": create_widget(fetch_most_recent_blog_posts(12)),
"widget": create_widget(fetch_most_recent_blog_posts(6)),
}
})
.to_string(),
@ -49,9 +49,7 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
return format!(
r#"<html>
<head>
<style>
/* General body styles */
* {{
box-sizing: border-box;
margin: 0;
@ -78,7 +76,6 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
font-family: sans-serif;
}}
/* Flex container for blog posts */
#latest-blog-posts {{
display: flex;
flex-direction: column;
@ -95,7 +92,6 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
align-self: stretch;
}}
/* Individual blog post container */
.post {{
width: 100%;
display: flex;
@ -105,7 +101,6 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
padding: 0.5em;
}}
/* Blog post image styling */
.post-image {{
background-size: cover;
background-repeat: no-repeat;
@ -115,12 +110,11 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
border-radius: 4px;
}}
/* Blog post information styling */
.post-info {{
max-width: 67%;
overflow: hidden;
}}
/* Responsive design for larger screens */
@media screen and (min-width: 500px) {{
.post {{
width: 49%;
@ -128,15 +122,13 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
}}
</style>
</head>
<body class="text-white overflow-hidden h-screen w-screen flex flex-col gap-2">
<body class="text-white overflow-hidden">
<div
id="latest-blog-posts"
class="flex flex-col p-2 gap-2 backdrop-brightness-125 rounded-xl shadow-lg h-screen w-screen overflow-y-auto self-stretch"
style="
scrollbar-color: transparent transparent;
scrollbar-width: none;
"
>
">
{}
</div>
</body>
@ -177,16 +169,16 @@ fn trim_content(content: &str) -> String {
fn post_to_html_string(post: KinodeBlogPost) -> String {
format!(
r#"<a
class="post p-2 grow self-stretch flex items-stretch rounded-lg shadow bg-white/10 hover:bg-white/20 font-sans w-full"
class="post"
href="https://kinode.org/blog/post/{}"
target="_blank"
rel="noopener noreferrer"
>
<div
class="post-image rounded mr-2 grow self-stretch h-full"
class="post-image"
style="background-image: url('https://kinode.org{}');"
></div>
<div class="post-info flex flex-col grow">
<div class="post-info">
<h2 class="font-bold">{}</h2>
<p>{}</p>
</div>