Skip to content

Commit 0e61333

Browse files
James1x0James1x0
committed
2025 LFG
1 parent fcf26bc commit 0e61333

File tree

2 files changed

+106
-107
lines changed

2 files changed

+106
-107
lines changed

‎index.html‎

Lines changed: 52 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -18,15 +18,18 @@
1818
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
1919
<link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap"
2020
rel="stylesheet">
21+
<link href="https://fonts.googleapis.com/css2?family=Jersey+15&display=swap" rel="stylesheet">
22+
2123
</head>
2224

2325
<body>
2426
<nav id="navbar">
25-
<img src="public/images/devlogo.png" alt="Big Sky Dev Con Logo"
27+
<img src="https://bsdc.sfo2.cdn.digitaloceanspaces.com/lazr-logo.png" alt="Big Sky Dev Con Logo"
2628
style="width: 97px; object-fit: contain; height: 100%">
2729
<div class="navbar-items">
28-
<a href="https://www.montanaprogrammers.org/community-guidelines" target="_blank">Code of Conduct</a>
29-
<a href="https://forms.gle/BgPTdmFz1nsE2w4o8" target="_blank">Call for proposals</a>
30+
<a href="https://www.montanaprogrammers.org/community-guidelines" target="_blank">Code Of Conduct</a>
31+
<a href="https://forms.gle/BgPTdmFz1nsE2w4o8" target="_blank">Call For Proposals</a>
32+
<a href="https://bsdc25.eventbrite.com" target="_blank">Tickets ▶▶▶</a>
3033
</div>
3134
</nav>
3235

@@ -35,54 +38,20 @@
3538
<div class="image-container main-hero">
3639
<div class="text-container">
3740
<div class="text-background">
38-
<h1 class="big-sky">BIG SKY</h1>
39-
<h2 class="dev-con">
40-
&lt;DEV CON&gt;
41-
</h2>
42-
<p class="conference-text">We're back for 2025! Call for proposals open now!</p>
41+
<p class="conference-text">We're back for 2025.<br />CFP & ticket sales now open.</p>
4342
</div>
4443
</div>
4544
</div>
4645

4746
<div
48-
style="position: relative; width: 100%; height: 100%; padding: 80px; background: #1E1E1E; flex-direction: column; justify-content: center; align-items: center; gap: 20px; display: inline-flex; padding-bottom: 200px;">
49-
<div class="bison-herd">
50-
51-
</div>
52-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
53-
<div style="width: 265px; height: 24px; background: #0F29E9"></div>
54-
<div style="width: 278px; height: 24px; background: #EFEFEF"></div>
55-
</div>
56-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
57-
<div style="width: 98px; height: 24px"></div>
58-
<div style="width: 123px; height: 24px; background: #EFEFEF"></div>
59-
<div style="width: 123px; height: 24px; background: #FFBA00"></div>
60-
<div style="width: 245px; height: 24px; background: #EFEFEF"></div>
61-
<div style="width: 108px; height: 24px; background: #86D5F1"></div>
62-
<div style="width: 699px; height: 24px; background: #828F60"></div>
63-
</div>
64-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
65-
<div style="width: 98px; height: 24px"></div>
66-
<div style="width: 123px; height: 24px; background: #86D5F1"></div>
67-
<div style="width: 123px; height: 24px; background: #EFEFEF"></div>
68-
<div style="width: 321px; height: 24px; background: #F14436"></div>
69-
<div style="width: 543px; height: 24px; background: #0F29E9"></div>
70-
<div style="width: 188px; height: 24px; background: #FFBA00"></div>
71-
</div>
72-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
73-
<div style="width: 178px; height: 24px; background: #FFBA00"></div>
74-
<div style="width: 83px; height: 24px; background: #F14436"></div>
75-
</div>
76-
<div
77-
style="align-self: stretch; padding-left: 24px; padding-right: 24px; padding-top: 25px; padding-bottom: 25px; justify-content: center; align-items: center; gap: 30px; display: inline-flex;">
47+
style="position: relative; width: 100%; height: 100%; padding: 10px; background: #1E1E1E; flex-direction: column; justify-content: center; align-items: center; gap: 20px; display: inline-flex;">
7848
<div><span
79-
style="color: #D6FF62; font-size: 72px; font-family: Source Code Pro; font-weight: 500; line-height: 113.40px; word-wrap: break-word">{
49+
style="color: #D6FF62; font-size: 72px; font-family: 'Jersey 15', Serif; font-weight: 500; line-height: 113.40px; word-wrap: break-word">{
8050
</span><span
81-
style="color: #EFEFEF; font-size: 72px; font-family: Source Code Pro; font-weight: 500; line-height: 113.40px; word-wrap: break-word">August
51+
style="color: #EFEFEF; font-size: 72px; font-family: 'Jersey 15', Serif; font-weight: 500; line-height: 113.40px; word-wrap: break-word">August
8252
2nd, 2025 </span><span
83-
style="color: #D6FF62; font-size: 84px; font-family: Source Code Pro; font-weight: 500; line-height: 113.40px; word-wrap: break-word">}</span>
53+
style="color: #D6FF62; font-size: 84px; font-family: 'Jersey 15', Serif; font-weight: 500; line-height: 113.40px; word-wrap: break-word">}</span>
8454
</div>
85-
</div>
8655
<div
8756
style="align-self: stretch; margin-bottom: 50px; height: 72px; flex-direction: column; justify-content: center; align-items: center; gap: 10px; display: flex">
8857
<div
@@ -92,39 +61,12 @@ <h2 class="dev-con">
9261
style="text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word">
9362

9463
<a href="https://calendar.google.com/calendar/render?action=TEMPLATE&dates=20250802%2F20250803&details=Join%20us%20at%20BSDC%202025&location=1794%20E%20Baxter%20Ln%2C%20Bozeman%2C%20MT%2059718&text=Big%20Sky%20Dev%20Con%202025"
95-
style="text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word"
64+
style="text-decoration: none; text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word"
9665
title="Save Event in my Calendar"><span style="color: #1E1E1E; font-weight: 800;"> + </span>Add Calendar
9766
Reminder</a>
98-
99-
10067
</div>
10168
</div>
10269
</div>
103-
<div tyle="jutify-content: center; align-item: center; gap: 30px; display: inline-flex">
104-
<div style="width: 140px; height: 24px; background: #828F60"></div>
105-
<div style="width: 158px; height: 24px; background: #0F29E9"></div>
106-
</div>
107-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
108-
<div style="width: 98px; height: 24px"></div>
109-
<div style="width: 123px; height: 24px; background: #EFEFEF"></div>
110-
<div style="width: 123px; height: 24px; background: #828F60"></div>
111-
<div style="width: 321px; height: 24px; background: #F14436"></div>
112-
<div style="width: 543px; height: 24px; background: #86D5F1"></div>
113-
</div>
114-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
115-
<div style="width: 215px; height: 24px"></div>
116-
<div style="width: 123px; height: 24px; background: #FFBA00"></div>
117-
<div style="width: 123px; height: 24px; background: #0F29E9"></div>
118-
<div style="width: 242px; height: 24px; background: #EFEFEF"></div>
119-
<div style="width: 422px; height: 24px; background: #F14436"></div>
120-
</div>
121-
<div style="justify-content: center; align-items: center; gap: 30px; display: inline-flex">
122-
<div style="width: 309px; height: 24px"></div>
123-
<div style="width: 123px; height: 24px; background: #86D5F1"></div>
124-
<div style="width: 123px; height: 24px; background: #EFEFEF"></div>
125-
<div style="width: 321px; height: 24px; background: #828F60"></div>
126-
<div style="width: 586px; height: 24px; background: #FFBA00"></div>
127-
</div>
12870
</div>
12971

13072

@@ -166,38 +108,42 @@ <h2>Conference Schedule</h2>
166108
167109
</ul>
168110
</div> -->
169-
<div style="width: 100%;">
170-
<div
171-
style="width: 100%; padding: 10em 2em; background-color: white; width: 100%; height: 100%; flex-direction: row; justify-content: center; align-items: center; gap: 64px; display: inline-flex; text-align: center;">
172-
<div>
173-
<div
174-
style="align-self: stretch; color: #1E1E1E; font-size: 48px; font-family: Citizen Slab; font-weight: 400; line-height: 57.60px; word-wrap: break-word">
175-
Big thanks to our Sponsors</div>
176-
<div
177-
style="align-self: stretch; color: #1E1E1E; font-size: 24px; font-family: Source Code Pro; font-weight: 400; line-height: 32.40px; word-wrap: break-word">
178-
Thanks to our sponsors for making this event possible and help funding Montana Programmers throughout the
179-
years.
111+
<div
112+
style="background-color: white; width: 100%; height: 100%; flex-direction: column; justify-content: center; align-items: center; display: inline-flex; text-align: center;">
113+
<div>
114+
<div id="speakers-images" style="padding: 2em;">
115+
<div class="sponsor-info">
116+
<a href="https://instructlab.ai/">
117+
<img class="speaker-img"
118+
src="https://bsdc.sfo2.cdn.digitaloceanspaces.com/InstructLab%20Logo%20Full%20Color-1.png" alt="InstructLab">
119+
</a>
180120
</div>
121+
</div>
122+
</div>
123+
<div style="padding: 2em;">
124+
<div
125+
style="padding-bottom: .5em; align-self: stretch; color: #1E1E1E; font-size: 80px; font-family: 'Jersey 15'; font-weight: 400; line-height: 57.60px; word-wrap: break-word">
126+
Big Thanks To Our Sponsors</div>
127+
<div
128+
style="padding-bottom: 1em; align-self: stretch; color: #1E1E1E; font-size: 24px; font-family: Source Code Pro; font-weight: 400; line-height: 32.40px; word-wrap: break-word">
129+
Thanks to our sponsors for making this event possible and help funding Montana Programmers throughout the
130+
years.
131+
</div>
132+
<div
133+
style="padding-left: 40px; padding-right: 40px; padding-top: 24px; padding-bottom: 24px; border-radius: 40px; border: 2px #1E1E1E solid; justify-content: flex-start; align-items: center; gap: 10px; display: inline-flex">
181134
<div
182-
style="padding-left: 40px; padding-right: 40px; padding-top: 24px; padding-bottom: 24px; border-radius: 40px; border: 2px #1E1E1E solid; justify-content: flex-start; align-items: center; gap: 10px; display: inline-flex">
183-
<div
135+
style="text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word">
136+
<a href="mailto:bsdc@montanaprogrammers.org"
184137
style="text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word">
185-
<a href="mailto:bsdc@montanaprogrammers.org"
186-
style="text-align: center; color: #1E1E1E; font-size: 18px; font-family: Source Code Pro; font-weight: 600; line-height: 24.30px; word-wrap: break-word">
187-
Inquire about Sponsoring <span style="color: #1E1E1E; font-weight: 800;"> + </span></a>
188-
</div>
189-
190-
</div>
191-
</div>
192-
<div>
193-
<div id="speakers-images">
138+
Inquire about Sponsoring <span style="color: #1E1E1E; font-weight: 800;"> + </span></a>
194139
</div>
140+
195141
</div>
196142
</div>
197143
</div>
198144

199145
<div
200-
style="width: 100%; height: 100%; padding-left: 120px; padding-right: 120px; padding-top: 80px; padding-bottom: 80px; background: #1E1E1E; flex-direction: column; justify-content: center; align-items: center; gap: 64px; display: inline-flex;">
146+
style="width: 100%; height: 100%; padding-left: 120px; padding-right: 120px; padding-top: 80px; padding-bottom: 80px; background: #1E1E1E; flex-direction: column; justify-content: center; align-items: center; display: inline-flex;">
201147
<div
202148
style="width: 100%; text-align: center; color: #EFEFEF; font-size: 24px; font-family: Source Code Pro; font-weight: 400; line-height: 32.40px; word-wrap: break-word">
203149
Send questions to bsdc@montanaprogrammers.org!</div>
@@ -256,6 +202,9 @@ <h2>Conference Schedule</h2>
256202
</div>
257203
</div>
258204
</div>
205+
<div class="bison-herd">
206+
</div>
207+
259208
</div>
260209

261210
<div class="bison" style="height: 20px; width: 20px;">
@@ -297,6 +246,16 @@ <h2>Conference Schedule</h2>
297246
What are you doing here? You should go register for BSDC instead: https://meetu.ps/e/MYfFK/nDqlg/i
298247
`);
299248

249+
window.addEventListener('scroll', function () {
250+
const nav = document.querySelector('#navbar');
251+
var top = window.innerHeight / 3;
252+
if (window.scrollY >= top) {
253+
nav.classList.add('fixed');
254+
} else {
255+
nav.classList.remove('fixed');
256+
}
257+
});
258+
300259
document.querySelectorAll('#speakers > #speakers-images > .speaker-info').forEach(function ($speaker) {
301260
$speaker.addEventListener('click', handleSpeakerExpand($speaker));
302261
const closeBtn = document.createElement('div');

‎style.css‎

Lines changed: 54 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -27,17 +27,29 @@ html {
2727
#navbar {
2828
/* margin-top: 100px; */
2929
overflow: hidden;
30-
background: var(--Brand-Primary-P01, #1e1e1e);
30+
/* background: white; */
31+
position: fixed;
32+
z-index: 1;
33+
left: 0;
34+
right: 0;
35+
top: 0;
3136
display: flex;
3237
padding: 24px 120px;
3338
justify-content: space-between;
3439
align-items: center;
3540
align-self: stretch;
41+
height: 180px;
42+
transition: all ease-in-out 0.4s;
43+
}
44+
45+
#navbar.fixed {
46+
background: rgba(255, 255, 255, 0.8);
47+
height: 60px;
3648
}
3749

3850
.text-background {
39-
background-color: rgba(216, 216, 216, 0.75);
40-
padding: 10px 20px;
51+
/* background-color: rgba(216, 216, 216, 0.75); */
52+
/* padding: 10px 10px; */
4153
border-radius: 10px;
4254
margin: 0 10px;
4355
}
@@ -54,10 +66,19 @@ html {
5466
padding: 14px;
5567
text-decoration: none;
5668
font-size: 0.8em;
57-
background-color: #f2f2f2;
69+
background-color: rgba(242, 242, 242, 1);
5870
border-radius: 0.3rem;
5971
margin: 0 0.5em;
60-
font-family: Source Code Pro, monospace;
72+
font-family: 'Source Code Pro', monospace;
73+
font-weight: bold;
74+
box-shadow: 1px 6px 12px -8px rgba(0, 0, 0, 0.6);
75+
transition: box-shadow ease-in-out 0.4s;
76+
}
77+
78+
#navbar .navbar-items a:hover {
79+
box-shadow: 0 6px 10px -5px rgba(0, 0, 50, 0.9);
80+
background-color: rgba(242, 242, 242, 0.4);
81+
transform: scale3d(-1, 1, 1);
6182
}
6283

6384
#navbar img {
@@ -360,8 +381,10 @@ x p {
360381
}
361382

362383
.image-container.main-hero {
363-
background-image: url("public/images/cloud.png");
384+
/* background-image: url('https://bsdc.sfo2.cdn.digitaloceanspaces.com/xbanner_hero.jpg'); */
385+
background-image: url('https://bsdc.sfo2.cdn.digitaloceanspaces.com/glitch-hero.gif');
364386
width: 100%;
387+
min-height: 100vh;
365388
height: 100%;
366389
object-fit: cover;
367390
background-position: center;
@@ -421,8 +444,8 @@ x p {
421444
overflow: scroll;
422445
}
423446
.about-header {
424-
font-size: 48px;
425-
font-family: "Citizen Slab", serif;
447+
font-size: 80px;
448+
font-family: "Jersey 15", serif;
426449
font-weight: 400;
427450
line-height: 57.6px;
428451
}
@@ -470,18 +493,19 @@ x p {
470493
}
471494

472495
.conference-text {
473-
color: var(--Brand-Primary-P01, #1e1e1e);
496+
color: var(--Brand-Primary-P01, #3b324b);
474497
text-align: center;
475498
leading-trim: both;
476499

477500
text-edge: cap;
478501
/* Headline/H—01 */
479-
font-family: "Source Code Pro";
480-
font-size: 64px;
481-
font-style: normal;
502+
font-family: "Jersey 15", serif;
503+
font-size: 90px;
504+
font-weight: bolder;
505+
/* font-style: normal; */
482506
font-weight: 500;
483-
line-height: 135%; /* 86.4px */
484-
margin-top: 10px;
507+
/* line-height: 135%; 86.4px */
508+
/* margin-top: 10px; */
485509
}
486510

487511
h1,
@@ -566,6 +590,10 @@ a {
566590
color: white;
567591
}
568592

593+
.sponsor-info a {
594+
color: black;
595+
}
596+
569597
.scroll-icon {
570598
height: 50px;
571599
width: 35px;
@@ -604,4 +632,16 @@ a {
604632
height: 10px;
605633
width: 10px;
606634
border-radius: 50%;
635+
}
636+
637+
@media screen and (max-width: 1000px) {
638+
#navbar {
639+
flex-direction: column;
640+
padding-left: 0;
641+
padding-right: 0;
642+
}
643+
644+
#navbar .navbar-items {
645+
margin-top: 2em;
646+
}
607647
}

0 commit comments

Comments
 (0)