Front page copy is more interesting

This commit is contained in:
Rob Kelly 2025-12-20 15:12:42 -07:00
parent e863616086
commit 8caff7960d
2 changed files with 37 additions and 8 deletions

View File

@ -8,6 +8,10 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous" referrerpolicy="no-referrer">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" integrity="sha512-5Hs3dF2AEPkpNAR7UiOHba+lRSJNeM2ECkwxUIxC1Q/FLycGTbNapWXB4tP889k5T5Ju8fs4b1P5z/iB4nMfSQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="style.css" rel="stylesheet">
<!-- REMOVEME !-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=BBH+Bartle&family=BBH+Bogle&display=swap" rel="stylesheet">
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
@ -145,19 +149,22 @@
<span class="visually-hidden">Next</span>
</button>
</div>
<main class="container mt-2 fs-4 flex-fill">
<div class="section p-5 text-center">
<p>
We are artists, designers, developers, and creators based in Albuquerque, New Mexico.
<main class="container mt-2 fs-4">
<div class="section pt-2 text-center">
<p>The</p>
<span class="h1 text-impact">INTRUSIVE THOUGHTS</span>
<span class="h1 text-impact">CREATIVE COLLECTIVE</span>
</div>
<div class="section px-5 text-center">
<p class="fading-container">
are artists, designers, developers, <span class="fading">creators, comrades, musicians, technicians, magicians, engineers, entrepreneurs, philosophers, scientists, doctors, poets, warriors, line cooks, private investigators, teachers, train conductors, renegades, fugitives, captains of ships, streetfighters, economists, browsers, mid-sized luxury sedans, animals, out-of-place artifacts, team leaders, billionaires, stalactites, small rodents, firefighters, losers, bowlers, shamans, frameworks, architects, camels, nudists, and so on, and so forth</span>
</p>
<p>
In the summer of 2024, we formed the Intrusive Thoughts Creative Collective as a collectively-organized independent games studio.
</p>
<p>
We make games to tell the stories we want to tell.
who assembled as a collectively-organized independent games studio at their secret headquarters in the city of Albuquerque, New Mexico in the summer of 2024 so that by combining their collective efforts they might produce for your enjoyment something
</p>
</div>
</main>
<div class="h2 text-impact flex-fill">interesting.</div>
<footer class="pt-5">
<div class="container text-center text-muted text-small">
<p>
@ -172,6 +179,15 @@
</footer>
</div>
</body>
<script>
document.querySelectorAll('.fading').forEach(el => {
const words = el.textContent.trim().split(/,/);
el.innerHTML = "";
for(let i = 0; i < words.length; i++) {
el.innerHTML += `<span style="opacity: ${1.0 - i / (words.length)}; font-size: calc(1.5rem * ${1.0 - i / (words.length + 16)});">${words[i]}, </span>`;
}
});
</script>
<script>
(function() {
// Executes when DOM available

View File

@ -54,10 +54,23 @@ a {
.text-small {
font-size: 12px;
}
.text-xsmall {
font-size: 10px;
}
.text-impact {
font-family: "BBH Bartle", sans-serif;
font-weight: 400;
font-style: normal;
width: 100%;
text-align: center;
}
.fading-container {
font-size: 1.5rem;
}
.carousel-fit {
height:40vh;
width: 100vw;