Skip to content

Commit a8b57e1

Browse files
vgxurl-stackvgxurl-stack
committed
✨ update(xyz): latest
1 parent 8e42793 commit a8b57e1

File tree

4 files changed

+108
-302
lines changed

4 files changed

+108
-302
lines changed

‎src/assets/style.css‎

Lines changed: 0 additions & 118 deletions
This file was deleted.

‎src/components/elements/ConnectionElement.js‎

Lines changed: 17 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,60 +1,33 @@
11
function ConnectionElement(Icon, Link, Username, Defined) {
22
if(!Defined) return ""
33

4-
const getIconHtml = () => {
5-
if (Icon.startsWith("custom:")) {
6-
if (Icon === "custom:bluesky") {
7-
return `
8-
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="20" height="20" class="me-2">
9-
<path fill="currentColor" d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"/>
10-
</svg>
11-
`
12-
}
13-
return ""
14-
}
15-
16-
const iconMap = {
17-
'whatsapp': 'whatsapp',
18-
'discord': 'discord',
19-
'telegram': 'telegram',
20-
'github': 'github',
21-
'gitlab': 'gitlab',
22-
'twitter': 'twitter',
23-
'mastodon': 'mastodon',
24-
'medium': 'medium',
25-
'twitch': 'twitch',
26-
'youtube': 'youtube'
27-
}
28-
29-
const iconClass = iconMap[Icon] || Icon
30-
return `<i class="bi bi-${iconClass} me-2 fs-5"></i>`
31-
}
32-
33-
const linkUrl = Link.startsWith('http') ? Link : `https://${Link}`
34-
354
return `
36-
<div writea="element.connection" class="col-12 col-sm-6 col-md-4 col-lg-3 mb-3">
37-
<a href="${linkUrl}" class="text-decoration-none" target="_blank">
5+
<div writea="element.connection" class="col py-2">
6+
<a href="https://${Link}" class="text-decoration-none">
387
<div
39-
class="connection-card border border-dark border-opacity-25 py-4 px-4 rounded-4 position-relative d-flex align-items-center justify-content-center text-center h-100"
8+
class="border border-dark border-opacity-25 py-2 px-3 rounded-4 position-relative"
409
style="
4110
--mdc-ripple-hover-opacity: .02;
4211
--mdc-ripple-focus-opacity: .02;
4312
--mdc-ripple-press-opacity: .05;
44-
transition: all 0.3s ease;
45-
background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
46-
backdrop-filter: blur(10px);
47-
min-height: 80px;
4813
"
49-
onmouseover="this.style.transform='translateY(-5px) scale(1.02)'; this.style.boxShadow='0 8px 25px rgba(0,0,0,0.15)'; this.style.borderColor='var(--bs-primary)'"
50-
onmouseout="this.style.transform='translateY(0) scale(1)'; this.style.boxShadow='none'; this.style.borderColor='rgba(0,0,0,0.25)'"
5114
>
52-
<div class="d-flex flex-column align-items-center">
53-
${getIconHtml()}
54-
<span class="text-body fw-semibold small">
15+
<p class="text-truncate my-1 text-body">
16+
${!Icon.startsWith("custom:") ? `
17+
<i class="bi bi-${Icon} pe-1"></i>
18+
` : `
19+
<span class="pe-1">
20+
${Icon == "custom:bluesky" ? `
21+
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="16" class="mt-0">
22+
<path fill="currentColor" d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"/>
23+
</svg>
24+
` : ``}
25+
</span>
26+
`}
27+
<span class="opacity-50">
5528
${Username}
5629
</span>
57-
</div>
30+
</p>
5831
<span class="ripple-surface"></span>
5932
</div>
6033
</a>

‎src/components/sections/BlogSection.js‎

Lines changed: 21 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -19,35 +19,34 @@ function BlogSection() {
1919
let PostThumbnail = ""
2020
if (Post.Thumbnail) {
2121
PostThumbnail = `
22-
<img src="./images/${Post.Thumbnail}" writea="post.entry.thumbnail" class="rounded-top-4 object-fit-cover" height="140px" width="100%"/>
22+
<img src="./images/${Post.Thumbnail}" writea="post.entry.thumbnail" class="rounded-top-4 object-fit-cover" height="110px" width="100%"/>
2323
`
2424
}
2525

2626
Posts = `
2727
${Posts}
2828
29-
<div writea="post.entry" class="col-12 col-md-6 col-lg-4 mb-4">
29+
<div writea="post.entry" class="col-12 mb-4">
3030
<a href="#read/${Post.Content.replace('.md', '')}" class="text-decoration-none text-body">
31-
<div class="rounded-4 bg-dark-subtle position-relative h-100 shadow-sm" style="--mdc-ripple-hover-opacity: .02; --mdc-ripple-focus-opacity: .02; --mdc-ripple-press-opacity: .05; transition: transform 0.2s ease, box-shadow 0.2s ease;" onmouseover="this.style.transform='translateY(-2px)'; this.style.boxShadow='0 4px 12px rgba(0,0,0,0.15)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 1px 3px rgba(0,0,0,0.1)'">
31+
<div class="rounded-4 bg-dark-subtle position-relative" style="--mdc-ripple-hover-opacity: .02; --mdc-ripple-focus-opacity: .02; --mdc-ripple-press-opacity: .05;">
3232
${PostThumbnail}
33-
<div class="p-4 d-flex flex-column h-100">
34-
<div class="flex-grow-1">
35-
<span writea="post.entry.info" class="d-block text-primary-emphasis mb-2 small fw-medium">
36-
<i class="bi bi-tag-fill me-1"></i>${Post.Topic || "post"}
37-
<span class="text-muted ms-2"><i class="bi bi-calendar3 me-1"></i>${Post.Content}</span>
33+
<div class="row d-flex p-4">
34+
<div class="col-auto col-sm-10 me-auto">
35+
<span writea="post.entry.info" class="d-block text-primary-emphasis mb-1">
36+
${Post.Topic || "post"}
37+
<span class="text-dark"><i class="bi bi-dot"></i> ${Post.Content}</span>
3838
</span>
39-
<h4 writea="post.entry.title" class="h5 fw-bold mb-3 text-dark">
39+
<span writea="post.entry.title" class="h5 fw-bold">
4040
${Post.Title || "No title available"}
41-
</h4>
42-
<p writea="post.entry.description" class="text-muted mb-3 lh-sm">
41+
</span>
42+
<span writea="post.entry.description" class="d-block">
4343
${Post.Description || "No description available"}
44-
</p>
44+
</span>
45+
</div>
46+
<div class="col-auto my-auto d-none d-sm-block">
47+
<button type="button" class="btn shadow-none text-primary-emphasis"><i class="bi bi-chevron-right"></i></button>
4548
</div>
46-
<div class="d-flex justify-content-between align-items-center mt-auto">
47-
<span class="text-primary-emphasis small fw-medium">Read more</span>
48-
<i class="bi bi-arrow-right-circle text-primary-emphasis"></i>
4949
</div>
50-
</div>
5150
<span class="ripple-surface"></span>
5251
</div>
5352
</a>
@@ -57,24 +56,12 @@ function BlogSection() {
5756
} catch {}
5857
return `
5958
${NavigationBarElement()}
60-
<div class="container-fluid">
61-
<div class="row pt-4">
62-
<div class="col-12 mb-4">
63-
<h2 class="h3 fw-bold text-dark mb-1">Latest Posts</h2>
64-
<p class="text-muted">Discover our latest articles and insights</p>
65-
</div>
66-
</div>
67-
<div class="row">
68-
${Posts || `
69-
<div class="col-12 text-center py-5">
70-
<div class="bg-light rounded-4 p-5">
71-
<i class="bi bi-journal-text text-muted" style="font-size: 3rem;"></i>
72-
<h4 class="mt-3 text-muted">No posts yet</h4>
73-
<p class="text-muted">Check back later for new content!</p>
74-
</div>
75-
</div>
76-
`}
77-
</div>
59+
<div class="row pt-2">
60+
${Posts || `
61+
<p>
62+
There haven't been any posts yet, check back later!
63+
</p>
64+
`}
7865
</div>
7966
${FooterElement()}
8067
`

0 commit comments

Comments
 (0)