Front page copy is more interesting
This commit is contained in:
parent
e863616086
commit
8caff7960d
@ -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
|
||||
|
||||
@ -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;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user