mirror of
https://github.com/uqbar-dao/nectar.git
synced 2024-11-28 05:35:35 +03:00
fixes
This commit is contained in:
dr-frmr
parent
758a58fc12
commit
5623cb2203
@ -61,8 +61,6 @@ fn make_widget() -> String {
|
||||
return r#"<html>
|
||||
<head>
|
||||
<style>
|
||||
/* General body styles */
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
@ -73,13 +71,12 @@ fn make_widget() -> String {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Flex container for apps */
|
||||
|
||||
#latest-apps {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@ -95,8 +92,7 @@ fn make_widget() -> String {
|
||||
scrollbar-color: transparent transparent;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
/* Individual app container */
|
||||
|
||||
.app {
|
||||
padding: 0.5rem;
|
||||
display: flex;
|
||||
@ -109,39 +105,35 @@ fn make_widget() -> String {
|
||||
font-family: sans-serif;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.app:hover {
|
||||
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;
|
||||
width: 92px;
|
||||
max-width: 33%;
|
||||
}
|
||||
|
||||
/* App information styling */
|
||||
|
||||
.app-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
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%;
|
||||
@ -165,7 +157,7 @@ fn make_widget() -> String {
|
||||
a.target = '_blank';
|
||||
a.rel = 'noopener noreferrer';
|
||||
const iconLetter = app.metadata_hash.replace('0x', '')[0].toUpperCase();
|
||||
a.innerHTML = `<div
|
||||
a.innerHTML = `<div
|
||||
class="app-image"
|
||||
style="
|
||||
background-image: url('${app.metadata.image || `/icons/${iconLetter}`}');
|
||||
|
||||
@ -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,15 +49,13 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
|
||||
return format!(
|
||||
r#"<html>
|
||||
<head>
|
||||
|
||||
<style>
|
||||
/* General body styles */
|
||||
* {{
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}}
|
||||
|
||||
|
||||
a {{
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
@ -77,8 +75,7 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
|
||||
gap: 0.5rem;
|
||||
font-family: sans-serif;
|
||||
}}
|
||||
|
||||
/* Flex container for blog posts */
|
||||
|
||||
#latest-blog-posts {{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -94,8 +91,7 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
|
||||
scrollbar-width: none;
|
||||
align-self: stretch;
|
||||
}}
|
||||
|
||||
/* Individual blog post container */
|
||||
|
||||
.post {{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -104,8 +100,7 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
|
||||
border-radius: 0.5em;
|
||||
padding: 0.5em;
|
||||
}}
|
||||
|
||||
/* Blog post image styling */
|
||||
|
||||
.post-image {{
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
@ -114,13 +109,12 @@ fn create_widget(posts: Vec<KinodeBlogPost>) -> String {
|
||||
height: 100px;
|
||||
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>
|
||||
@ -176,17 +168,17 @@ 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"
|
||||
r#"<a
|
||||
class="post"
|
||||
href="https://kinode.org/blog/post/{}"
|
||||
target="_blank"
|
||||
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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user