main
Alina Marquardt 2025-05-13 14:46:59 +02:00
parent 2fe2a4a267
commit e3692bf536
3 changed files with 63 additions and 122 deletions

View File

@ -107,7 +107,7 @@ window.onload = function() {
// For each edge, create: // For each edge, create:
// 1. A thin cylindrical tube with back material that ignores depth // 1. A thin cylindrical tube with back material that ignores depth
// 2. A cylindrical tube with front material that uses depth testing // 2. A cylindrical tube with front material that uses depth testing
const backRadius = 0.03; // thin for back lines const backRadius = 0.025; // thin for back lines
const frontRadius = 0.035; // thick for front lines const frontRadius = 0.035; // thick for front lines
icosa.edges.forEach((edge, index) => { icosa.edges.forEach((edge, index) => {
@ -120,7 +120,7 @@ window.onload = function() {
group.add(backLine); group.add(backLine);
// Create front line (thin) // Create front line (thin)
const frontLine = createCylinderBetweenPoints(start, end, frontRadius, 0.95, frontMaterial); const frontLine = createCylinderBetweenPoints(start, end, frontRadius, 1.022, frontMaterial);
frontLine.renderOrder = 3; // Render before back lines frontLine.renderOrder = 3; // Render before back lines
group.add(frontLine); group.add(frontLine);
}); });
@ -246,21 +246,6 @@ window.onload = function() {
renderer.render(scene, camera); renderer.render(scene, camera);
} }
/*
// Set up controls
const toggleAnimationBtn = document.getElementById('toggle-animation');
const resetRotationBtn = document.getElementById('reset-rotation');
toggleAnimationBtn.addEventListener('click', function() {
animating = !animating;
this.textContent = animating ? 'Pause' : 'Resume';
});
resetRotationBtn.addEventListener('click', function() {
icosahedronGroup.rotation.set(0, 0, 0);
});
*/
// Start animation // Start animation
animate(); animate();

View File

@ -23,7 +23,6 @@
<header> <header>
<div id="greeting"> <div id="greeting">
<!-- <img class="avatar" src="img/avatar.png" width="90" height="73" alt="alina marquardt" /> -->
<div id="icosahedron-container" class="avatar"></div> <div id="icosahedron-container" class="avatar"></div>
<span class="line1">hello!</span> <span class="line1">hello!</span>
<span class="line2">my name is</span> <span class="line2">my name is</span>
@ -33,28 +32,18 @@
<aside> <aside>
<section class="iam"> <section class="iam">
<span class="line1">i am a senior</span> <span class="line1">i am a senior</span>
<span class="line2"><em>UX/UI designer</em></span> <span class="line2 bigline"><em>UX/UI designer</em></span>
<span class="line3">&amp; electronic musician</span> <span class="line3">&amp; electronic musician</span>
<span class="line4">based in germany</span> <span class="line4">based in germany</span>
</section> </section>
</aside> </aside>
<!--
<nav>
<ul>
<li class="music line1"><a href="#music">i make <em>music</em><img class="icon" src="img/nav-music.png" width="17" height="19" alt></a></li>
<li class="design line2"><a href="#design">i <em>design</em> things<img class="icon" src="img/nav-design.png" width="12" height="20" alt></a><div class="icon"></div></li>
<li class="experiment line3"><a href="#experiment">i <em>experiment<img class="icon" src="img/nav-experiment.png" width="15" height="26" alt></em></a><div class="icon"></div></li>
</ul>
</nav>
-->
<aside> <aside>
<section class="findme"> <section class="findme">
<span class="line1">please also see</span> <span class="line1">please also see</span>
<ul> <ul>
<li class="line2"><a href="https://git.broken.graphics/explore/repos" target="_blank">my <em>git repos</em></a></li> <li class="line2 bigline"><a href="https://git.broken.graphics/explore/repos" target="_blank">my <em>git repos</em></a></li>
<li class="line3"><a href="https://lastfuture.bandcamp.com/" target="_blank">my <em>bandcamp</em></a></li> <li class="line3 bigline"><a href="https://lastfuture.bandcamp.com/" target="_blank">my <em>bandcamp</em></a></li>
</ul> </ul>
<!-- <span class="line4"><a href="">more places »</a></span> -->
</section> </section>
</aside> </aside>
</div> </div>
@ -97,40 +86,7 @@
</a> </a>
</article> </article>
</section> </section>
<!--
<section class="box" id="experiment">
<header class="blurgreen headlineshadow"><h1><em>experiments</em> box<img class="icon" src="img/head-experiment.png" width="63" height="103" alt></h1></header>
<div class="opaque whitebg">
<h2><span class="halfbubble blurgreen"></span>video experiments</h2>
<h2><span class="halfbubble blurgreen"></span>lorem ipsum</h2>
</div> </div>
</section>
-->
</div>
<!--
<div class="column">
<section class="box invertedbox" id="recent">
<header class="headlineshadow whitebg"><h1><em>highlighted</em> tracks</h1></header>
<div class="opaque blurgreen">
<h2 class="headlineshadow"><em>track</em></h2>
</div>
</section>
<section class="box" id="design">
<header class="blurgreen headlineshadow"><h1><em>design</em> work<img class="icon" src="img/head-design.png" width="46" height="75" alt></h1></header>
<div class="opaque whitebg">
<h2><span class="halfbubble blurgreen"></span>web</h2>
<div style="height: 300px;"></div>
<h2><span class="halfbubble blurgreen"></span>apps</h2>
<div style="height: 400px;"></div>
</div>
</section>
</div>
-->
</div> </div>

View File

@ -385,7 +385,7 @@ article.album a:hover {
margin-left: 3rem; margin-left: 3rem;
} }
#base a, #base section.iam .line2 { #base a, #base .bigline {
font-size: 1.5rem; font-size: 1.5rem;
display: block; display: block;
line-height: 1em; line-height: 1em;