Skip to content

Commit 331e3a9

Browse files
banner
1 parent dde8bab commit 331e3a9

File tree

3 files changed

+106
-1
lines changed

3 files changed

+106
-1
lines changed

index.qmd

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,9 @@
22
title: "Welcome"
33
---
44

5-
![Welcome to the McPherson Group](welcome-banner.png)
5+
6+
::: hero-banner
7+
# Welcome to the Workshop!
8+
9+
Advancing knowledge through innovative approaches to biomedical data
10+
:::

styles.scss

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
/* Minimal custom styling for McPherson Group website */
2+
3+
/* Header banner styling: white, light gray, and light blue */
4+
.header-banner {
5+
background: linear-gradient(90deg, #ffffff 0%, #f5f6fa 50%, #e3f2fd 100%);
6+
color: #003366; /* dark blue for contrast */
7+
padding: 2rem 0;
8+
border-bottom: 1px solid #e3f2fd;
9+
}
10+
11+
12+
/*-- scss:rules --*/
13+
.hero-banner {
14+
background: linear-gradient(135deg, #e3f2fd 0%, #003366 100%);
15+
color: white;
16+
padding: 3rem 1rem;
17+
margin-bottom: 2rem;
18+
border-radius: 0.5rem;
19+
text-align: center;
20+
}
21+
.hero-banner h1 {
22+
color: white;
23+
margin-bottom: 1rem;
24+
}
25+
26+
27+
.quarto-title-block {
28+
display: none;
29+
}
30+
.listing-box-title {
31+
font-size: 12px;
32+
font: bold;
33+
}
34+
.listing-box-subtitle {
35+
font-size: 11px;
36+
}
37+
.listing-box-education {
38+
font-size: 10px;
39+
font: italic;
40+
}
41+
/* Example: If using a navbar as header banner */
42+
.navbar {
43+
background: linear-gradient(90deg, #ffffff 0%, #f5f6fa 50%, #003366 100%);
44+
color: #003366;
45+
border-bottom: 1px solid #e3f2fd;
46+
}
47+
48+
/* Make navbar-brand text visible on light background */
49+
.navbar-brand {
50+
font-weight: bold;
51+
color: #003366 !important;
52+
}
53+
/* Make navbar right side icons (white) visible on mobile devices */
54+
@media (max-width: 768px) {
55+
.navbar .nav-link,
56+
.navbar .navbar-brand,
57+
.navbar .navbar-toggler-icon,
58+
.navbar .bi {
59+
color: #003366 !important;
60+
}
61+
}
62+
/* Left-side nav links (dark navy) */
63+
.navbar-nav.me-auto .nav-link {
64+
color: #003366 !important; /* midnight blue */
65+
}
66+
67+
/* Right-side nav links (white) */
68+
.navbar-nav.ms-auto .nav-link {
69+
color: #ffffff !important; /* white */
70+
}
71+
72+
.lead {
73+
font-size: 1.1rem;
74+
margin-bottom: 1.5rem;
75+
}
76+
77+
/* Ensure good spacing for content */
78+
.content {
79+
margin-top: 1rem;
80+
}
81+
82+
/* Style for publication lists */
83+
ol li {
84+
margin-bottom: 0.5rem;
85+
}
86+
87+
/* Responsive images */
88+
img {
89+
max-width: 100%;
90+
height: auto;
91+
}
92+
93+
/* Footer styling */
94+
.footer {
95+
margin-top: 3rem;
96+
padding-top: 2rem;
97+
border-top: 1px solid #e9ecef;
98+
color: #6c757d;
99+
font-size: 0.9rem;
100+
}

welcome-banner.png

-22.2 KB
Binary file not shown.

0 commit comments

Comments
 (0)