Skip to content

Commit e3d9f5d

Browse files
chrisdburrchrisdburr
committed
fix links and centering of content
1 parent 5764783 commit e3d9f5d

9 files changed

Lines changed: 470 additions & 271 deletions

File tree

‎src/components/common/MegaMenu/Blog.astro‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ if (latestPost && latestPost.data.coverImage) {
2929
latestPostItem = {
3030
title: latestPost.data.title,
3131
description: latestPost.data.description,
32-
href: `/blog/${latestPost.slug}`,
32+
href: `${import.meta.env.BASE_URL}/blog/${latestPost.slug}`,
3333
image: latestPost.data.coverImage, // Pass the metadata object
3434
};
3535
} else if (latestPost) {
@@ -38,7 +38,7 @@ if (latestPost && latestPost.data.coverImage) {
3838
latestPostItem = {
3939
title: latestPost.data.title,
4040
description: latestPost.data.description,
41-
href: `/blog/${latestPost.slug}`,
41+
href: `${import.meta.env.BASE_URL}/blog/${latestPost.slug}`,
4242
icon: "mdi:text-box-multiple-outline", // Fallback icon
4343
};
4444
}

‎src/pages/blog/[slug].astro‎

Lines changed: 68 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,8 @@ const seo = {
3535
};
3636
---
3737
<BaseLayout seo={seo}>
38-
<article class="container py-16 lg:py-20">
39-
<div class="mx-auto max-w-3xl">
38+
<article class="py-16 lg:py-20">
39+
<div class="mx-auto max-w-3xl px-4 sm:px-6 lg:px-8">
4040
<!-- Post Header -->
4141
<header class="mb-8 text-center">
4242
<h1 class="mb-4 text-4xl font-bold text-slate-800 lg:text-5xl">{post.data.title}</h1>
@@ -65,14 +65,72 @@ const seo = {
6565
)}
6666

6767
<!-- Post Content -->
68-
<div class="prose prose-lg mx-auto max-w-none
69-
prose-headings:font-semibold prose-headings:text-slate-800
70-
prose-p:text-slate-600
71-
prose-a:text-blue-700 hover:prose-a:underline
72-
prose-img:rounded-lg prose-img:shadow-md
73-
prose-strong:text-slate-700
74-
prose-li:text-slate-600">
75-
<Content />
68+
<div class="mx-auto max-w-none">
69+
<style is:global>
70+
/* Replace Prose classes with explicit styling */
71+
.blog-content h1, .blog-content h2, .blog-content h3,
72+
.blog-content h4, .blog-content h5, .blog-content h6 {
73+
font-weight: 600;
74+
color: #1e293b; /* slate-800 */
75+
margin-top: 1.5em;
76+
margin-bottom: 0.5em;
77+
line-height: 1.2;
78+
}
79+
.blog-content h1 { font-size: 2.25rem; }
80+
.blog-content h2 { font-size: 1.875rem; }
81+
.blog-content h3 { font-size: 1.5rem; }
82+
.blog-content h4 { font-size: 1.25rem; }
83+
.blog-content p, .blog-content ul, .blog-content ol {
84+
margin-top: 1.25em;
85+
margin-bottom: 1.25em;
86+
color: #475569; /* slate-600 */
87+
line-height: 1.6;
88+
font-size: 1.125rem;
89+
}
90+
.blog-content a {
91+
color: #1d4ed8; /* blue-700 */
92+
text-decoration: none;
93+
}
94+
.blog-content a:hover {
95+
text-decoration: underline;
96+
}
97+
.blog-content img {
98+
border-radius: 0.5rem;
99+
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
100+
margin: 1.5rem 0;
101+
}
102+
.blog-content ul, .blog-content ol {
103+
padding-left: 2rem;
104+
}
105+
.blog-content li {
106+
margin: 0.5rem 0;
107+
color: #475569; /* slate-600 */
108+
}
109+
.blog-content strong {
110+
font-weight: 700;
111+
color: #334155; /* slate-700 */
112+
}
113+
.blog-content blockquote {
114+
border-left: 4px solid #94a3b8; /* slate-400 */
115+
padding-left: 1rem;
116+
font-style: italic;
117+
margin: 1.5rem 0;
118+
}
119+
.blog-content pre {
120+
background-color: #f1f5f9; /* slate-100 */
121+
border-radius: 0.375rem;
122+
padding: 1rem;
123+
overflow-x: auto;
124+
margin: 1.5rem 0;
125+
}
126+
.blog-content code {
127+
font-family: ui-monospace, monospace;
128+
font-size: 0.875em;
129+
}
130+
</style>
131+
<div class="blog-content">
132+
<Content />
133+
</div>
76134
</div>
77135

78136
<!-- TODO: Add author bio section? -->

‎src/pages/blog/index.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const posts = (await getCollection("blog")).sort(
1818
---
1919

2020
<BaseLayout seo={seo}>
21-
<div class="container mx-auto max-w-6xl px-4 py-12">
21+
<div class="mx-auto max-w-6xl px-4 py-12 sm:px-6 lg:px-8">
2222
<div class="mx-auto mb-12 max-w-4xl text-center">
2323
<h1 class="mb-4 text-4xl font-bold text-slate-800 lg:text-5xl">
2424
Blog

‎src/pages/news-events.astro‎

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,20 @@
11
---
2-
import BaseLayout from '@layout/BaseLayout.astro';
2+
import BaseLayout from "@layout/BaseLayout.astro";
33
44
const seo = {
5-
title: 'News & Events | CVD-Net',
6-
description: 'Latest news and upcoming events from the CVD-Net project.',
5+
title: "News & Events | CVD-Net",
6+
description: "Latest news and upcoming events from the CVD-Net project.",
77
};
88
---
9+
910
<!-- TODO: Content strategy needed (manual updates, CMS, collection?). -->
1011
<BaseLayout seo={seo}>
11-
<section class="container py-16 lg:py-20">
12-
<div class="mx-auto max-w-2xl text-center">
13-
<h1 class="mb-4 text-4xl font-bold lg:text-5xl">News & Events</h1>
14-
<p class="text-lg text-foreground/80">
15-
News and upcoming events will be posted here soon.
16-
</p>
17-
</div>
18-
</section>
19-
</BaseLayout>
12+
<section class="py-16 lg:py-20">
13+
<div class="mx-auto max-w-2xl px-4 text-center sm:px-6 lg:px-8">
14+
<h1 class="mb-4 text-4xl font-bold lg:text-5xl">News & Events</h1>
15+
<p class="text-foreground/80 text-lg">
16+
News and upcoming events will be posted here soon.
17+
</p>
18+
</div>
19+
</section>
20+
</BaseLayout>

‎src/pages/resources/data-safe-haven.astro‎

Lines changed: 40 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,7 @@ const seo = {
1111
<BaseLayout seo={seo}>
1212
<div class="container mx-auto max-w-4xl px-4 py-12">
1313
<div class="mb-12 text-center">
14-
<h1 class="mb-4 text-4xl font-bold lg:text-5xl">
15-
Data Safe Haven
16-
</h1>
14+
<h1 class="mb-4 text-4xl font-bold lg:text-5xl">Data Safe Haven</h1>
1715
<div class="mb-6 flex flex-wrap justify-center gap-2">
1816
<a
1917
href="https://github.com/alan-turing-institute/data-safe-haven"
@@ -69,43 +67,43 @@ const seo = {
6967
</div>
7068
<div class="mb-10">
7169
<img
72-
src="/images/data-safe-haven.jpg"
70+
src={`${import.meta.env.BASE_URL}/images/data-safe-haven.jpg`}
7371
alt="Data Safe Haven hero image"
7472
class="h-auto w-full rounded-lg shadow-md"
7573
/>
7674
</div>
7775

78-
<div class="prose prose-lg mx-auto">
79-
<p>
80-
Project researchers need access to highly sensitive data
81-
from real-world patients to develop cardiovascular digital
82-
twins. For researchers to do their work securely, the Alan
83-
Turing Institute is hosting these datasets in its own Secure
84-
Research Environment (SRE): A computational environment with
85-
technical and process controls for safe data access. The
86-
technical controls are provided by the <a
76+
<div class="mx-auto">
77+
<p class="mb-4 text-lg leading-relaxed text-slate-600">
78+
Project researchers need access to highly sensitive data from
79+
real-world patients to develop cardiovascular digital twins. For
80+
researchers to do their work securely, the Alan Turing Institute
81+
is hosting these datasets in its own Secure Research Environment
82+
(SRE): A computational environment with technical and process
83+
controls for safe data access. The technical controls are
84+
provided by the <a
8785
href="https://github.com/alan-turing-institute/data-safe-haven"
8886
>Turing Data Safe Haven</a
8987
>, an open-source project for the deployment of SREs in the
90-
Microsoft Azure cloud. The process controls are managed by
91-
the Trusted Research team, a team within the Turing's <a
88+
Microsoft Azure cloud. The process controls are managed by the
89+
Trusted Research team, a team within the Turing's <a
9290
href="https://www.turing.ac.uk/work-turing/research/research-engineering-group"
9391
>Research Engineering Group</a
9492
> in charge of secure data management.
9593
</p>
96-
<p>
94+
<p class="mb-4 text-lg leading-relaxed text-slate-600">
9795
For the CVD-Net project, we are using two SRE instances:
9896
<ol>
9997
<li>
100-
The Staging SRE: This SRE receives the raw patient
101-
data from our project partners. It is in this
102-
environment that the <a
98+
The Staging SRE: This SRE receives the raw patient data
99+
from our project partners. It is in this environment
100+
that the <a
103101
href="https://www.turing.ac.uk/research/data-for-research"
104102
>Data Wrangling team</a
105103
> consolidates and anonymises the data so it can be safely
106-
shared with the project researchers. Given its access
107-
to real patient data, digital twin evaluation is also
108-
performed in this environment.
104+
shared with the project researchers. Given its access to
105+
real patient data, digital twin evaluation is also performed
106+
in this environment.
109107
</li>
110108
<li>
111109
The Insights SRE: This SRE receives the processed
@@ -115,37 +113,40 @@ const seo = {
115113
</li>
116114
</ol>
117115
</p>
118-
<p>
119-
As part of the project, we will contribute to the Turing
120-
Data Safe Haven codebase by building features to make it
121-
more cost-efficient and by making it easier to take data,
122-
code and other resources from one SRE and use in the other.
116+
<p class="mb-4 text-lg leading-relaxed text-slate-600">
117+
As part of the project, we will contribute to the Turing Data
118+
Safe Haven codebase by building features to make it more
119+
cost-efficient and by making it easier to take data, code and
120+
other resources from one SRE and use in the other.
123121
</p>
124122

125-
<h2>Key Features</h2>
126-
<ul>
123+
<h2 class="mb-4 text-2xl font-semibold text-slate-700">
124+
Key Features
125+
</h2>
126+
<ul class="mb-6 list-disc space-y-2 pl-5 text-lg text-slate-600">
127127
<li>
128-
Secure, isolated research environments for sensitive
129-
data analysis
128+
Secure, isolated research environments for sensitive data
129+
analysis
130130
</li>
131131
<li>Controlled access management and data governance</li>
132132
<li>Scalable infrastructure using Microsoft Azure</li>
133133
<li>
134134
Familiar data science and analysis tools for researchers
135135
</li>
136136
<li>
137-
Compliance with data protection standards and
138-
regulations
137+
Compliance with data protection standards and regulations
139138
</li>
140139
</ul>
141140

142-
<h2>Community Resources</h2>
143-
<p>
141+
<h2 class="mb-4 text-2xl font-semibold text-slate-700">
142+
Community Resources
143+
</h2>
144+
<p class="mb-4 text-lg leading-relaxed text-slate-600">
144145
The Data Safe Haven is an open-source community project with
145-
active development and support. For more information or to
146-
get involved, you can:
146+
active development and support. For more information or to get
147+
involved, you can:
147148
</p>
148-
<ul>
149+
<ul class="mb-6 list-disc space-y-2 pl-5 text-lg text-slate-600">
149150
<li>
150151
Visit the <a
151152
href="https://data-safe-haven.readthedocs.io"
@@ -171,4 +172,4 @@ const seo = {
171172
</ul>
172173
</div>
173174
</div>
174-
</BaseLayout>
175+
</BaseLayout>

0 commit comments

Comments
 (0)