Compare commits

...

10 commits

6 changed files with 41 additions and 9 deletions

View file

@ -18,7 +18,8 @@
</style> </style>
<div class="noscriptmsg"> <div class="noscriptmsg">
You don't have javascript enabled. <br/> You don't have javascript enabled. <br/>
Please visit this website without javascript: <a href="https://scriptless.deprived.dev/">link</a> This website is not finished anyway. Come check back later or contact us at: alex@deprived.dev
<!-- Please visit this website without javascript: <a href="https://scriptless.deprived.dev/">link</a> -->
</div> </div>
</noscript> </noscript>
</body> </body>

0
run.sh Normal file → Executable file
View file

View file

@ -5,11 +5,13 @@
import ZSpacer from './lib/Universal/ZSpacer.svelte'; import ZSpacer from './lib/Universal/ZSpacer.svelte';
import planeImg from './assets/images/PlaneGrid.png'; import planeImg from './assets/images/PlaneGrid.png';
import imgBackground from './assets/images/CubeSideTransparent.png'; import imgBackground from './assets/images/CubeSideTransparent.png';
import deprivedTeam from './assets/images/deprivedTeam.jpg'; import deprivedTeam from './assets/images/DeprivedTeam.jpg';
import location from './assets/images/thisLocation.png';
import photo from './assets/images/realistic.png';
window.onload = function() { window.onload = function() {
//window.scrollTo(0, 100); //window.scrollTo(0, 100);
window.scrollTo(0, 5500); // Debug window.scrollTo(0, 5800); // Debug
} }
// Auto assigned fields (Will change after load) // Auto assigned fields (Will change after load)
@ -23,7 +25,7 @@
function debugClick(){ function debugClick(){
} }
let weAreTexts: string[] = ['overlooked', 'underfunded', 'constrained', 'depleated']; let weAreTexts: string[] = ['overlooked', 'underfunded', 'constrained', 'depleted'];
</script> </script>
<svelte:window bind:scrollY={scrollPos} /> <svelte:window bind:scrollY={scrollPos} />
@ -38,10 +40,10 @@
<Parallax <Parallax
onProgress={handleProgress} onProgress={handleProgress}
sections={10} sections={7.000000001}
config={{stiffness: 0.2, damping: 0.3}} config={{stiffness: 0.2, damping: 0.3}}
> >
<ParallaxLayer rate={0} span={10} style="background: url('{planeImg}'); filter: brightness(10%);" /> <ParallaxLayer rate={0} span={7.000000001} style="background: url('{planeImg}'); filter: brightness(10%);" />
<ParallaxLayer rate={1} span={2}> <ParallaxLayer rate={1} span={2}>
<div style="background: url('{imgBackground}'); filter: brightness(100%); z-index: 1; height: 10%;"> <div style="background: url('{imgBackground}'); filter: brightness(100%); z-index: 1; height: 10%;">
@ -72,18 +74,43 @@
<div class="align-center stickyText" style="font-size: 9vw; padding-top: 200px;"> <div class="align-center stickyText" style="font-size: 9vw; padding-top: 200px;">
The deprived devs The deprived devs
</div> </div>
</StickyLayer>
<ParallaxLayer offset={6.5}>
<div class="align-center"> <div class="align-center">
<img src="{deprivedTeam}" alt="The deprived team" style=" width: 50%; height: 50%; border-radius: 2vw;"/> <img src="{deprivedTeam}" alt="The deprived team" style=" width: 50%; height: 50%; border-radius: 2vw;"/>
</div> </div>
</ParallaxLayer> </StickyLayer>
<StickyLayer class="align-center" offset={{ top: 0, bottom: 5.6 }} let:progress> <StickyLayer class="align-center" offset={{ top: 0, bottom: 5.6 }} let:progress>
<WeAreText containerProgress={progress}/> <WeAreText containerProgress={progress}/>
</StickyLayer> </StickyLayer>
</Parallax> </Parallax>
<div class="align-center" style="font-size: 3vw; height: 50vh;">
Timeline!
This website is not at all finished. Come back later or contact us at: alex@deprived.dev
</div>
<!-- <div >
<div class="align-center">
<img src="{location}" alt="a funny place" style=" width: 50%; height: 50%; border-radius: 2vw;"/>
</div>
<div class="align-center" style="padding-top: 2.5vw;">
<img src="{photo}" alt="a funny place" style=" width: 50%; height: 50%; border-radius: 2vw;"/>
</div>
</div> -->
<!-- <div class="align-center" style="width: 100%;">
<div style="justify-items: center; display: flex">
{#each {length: 10} as _, i}
<div style="justify-items: start; display: flex;">
<div class="align-center">
THE TEAM!!!
</div>
<img src="{deprivedTeam}" alt="The deprived team" style=" width: 50%; height: 50%; border-radius: 2vw;"/>
</div>
{/each}
</div>
</div> -->
</main> </main>
<style> <style>
@ -91,5 +118,9 @@
font-family: CozetteVector; font-family: CozetteVector;
font-size: 5vw; font-size: 5vw;
} }
div {
font-family: CozetteVector;
}
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 378 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB