@smbcloud / solanastockholmmeetup
Code Commits Issues Pulls Cloud Agent CI/CD
main
dependabot/npm_and_yarn/eslint-9.39.1 dependabot/npm_and_yarn/eslint-plugin-astro-1.5.0 dependabot/npm_and_yarn/eslint/js-9.39.1 dependabot/npm_and_yarn/katex-0.16.25 dependabot/npm_and_yarn/sharp-0.34.5 dependabot/npm_and_yarn/tailwindcss/vite-4.1.17 dependabot/npm_and_yarn/tsx-4.20.6 dependabot/npm_and_yarn/typescript-eslint-8.46.4 dependabot/npm_and_yarn/typescript-eslint/eslint-plugin-8.36.0 dependabot/npm_and_yarn/typescript-eslint/parser-8.46.4 main
astro 132 lines 2.87 KB
Raw
1 ---
2 import { getEntry } from 'astro:content'
3 import { render } from 'astro:content'
4 import { Image } from 'astro:assets'
5
6 const aboutEntry = await getEntry('about', 'about')
7 // Check if there is actual content (excluding comments)
8 const hasContent = aboutEntry?.body
9 ? aboutEntry.body.replace(/<!--[\s\S]*?-->/g, '').trim().length > 0
10 : false
11 const { Content } = hasContent && aboutEntry ? await render(aboutEntry) : { Content: null }
12 ---
13
14 {
15 hasContent && Content && (
16 <div class="about prose">
17 <div class="app-header">
18 <Image
19 src="/images/1f3f5-fe0f.png"
20 alt="SuperTeam Stockholm App Icon"
21 width="120"
22 height="120"
23 class="app-icon"
24 />
25 </div>
26 <Content />
27 <div id="join-us" class="download-badges">
28 <h2>Join Us</h2>
29 <div class="badge-container">
30 <a
31 href="https://t.me/+H5UTU3562KoyYTA8"
32 target="_blank"
33 class="store-badge"
34 aria-label="Join our Telegram channel"
35 >
36 <img
37 src="https://upload.wikimedia.org/wikipedia/commons/8/82/Telegram_logo.svg"
38 alt="Join our Telegram channel"
39 class="badge-image"
40 />
41 </a>
42 <a
43 href="https://github.com/smbcloudXYZ/superteamstockholm"
44 target="_blank"
45 class="store-badge"
46 aria-label="Edit this website"
47 >
48 <img
49 src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg"
50 alt="Edit this website"
51 class="badge-image"
52 />
53 </a>
54 </div>
55 </div>
56 </div>
57 )
58 }
59
60 <style>
61 .about:not(:empty) {
62 margin-bottom: 1.25rem;
63 }
64
65 .app-header {
66 text-align: center;
67 margin-bottom: 2rem;
68 }
69
70 .app-icon {
71 border-radius: 22%;
72 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
73 }
74
75 .download-badges {
76 margin-top: 3rem;
77 padding-top: 2rem;
78 border-top: 1px solid var(--border-color, #e5e7eb);
79 text-align: center;
80 scroll-margin-top: 2rem;
81 }
82
83 .download-badges h2 {
84 margin-bottom: 1.5rem;
85 font-size: 1.5rem;
86 }
87
88 .badge-container {
89 display: flex;
90 justify-content: center;
91 align-items: center;
92 gap: 1rem;
93 flex-wrap: wrap;
94 margin-bottom: 1rem;
95 }
96
97 .store-badge {
98 display: inline-block;
99 transition:
100 transform 0.2s ease,
101 opacity 0.2s ease;
102 }
103
104 .store-badge:hover {
105 transform: scale(1.05);
106 opacity: 0.9;
107 }
108
109 .badge-image {
110 height: 50px;
111 width: auto;
112 display: block;
113 }
114
115 .coming-soon {
116 font-size: 0.9rem;
117 color: var(--text-secondary, #6b7280);
118 font-style: italic;
119 margin-top: 0.5rem;
120 }
121
122 @media (max-width: 640px) {
123 .badge-container {
124 flex-direction: column;
125 gap: 0.75rem;
126 }
127
128 .badge-image {
129 height: 45px;
130 }
131 }
132 </style>