portfolio/index.html at master · savefolla/portfolio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<html lang="en">
<head>
  <title>Saverio Follador</title>
  <meta name="viewport" content="width=device-width"/>
  <meta name="theme-color" content="#000000">
  <meta name="description" content="My name is Saverio. I work at OpenPhone.">
  <link rel="stylesheet" href="style.css">
  <link href="https://fonts.googleapis.com/css?family=Work+Sans:100" rel="stylesheet">
</head>
<body>
<div class="stuff" style="display: none">
  <div class="content">
    <div>
      saverio <br>
      follador <br>
    </div>
    <div class="content__smaller">
      <span id="age"></span> years old software engineer from italy <br>
      currently working @ <a target="_blank" href="https://quo.com/">Quo</a>
    </div>
    <div class="content__smaller">
    </div>
    <div class="content__smallest">
      <a target="_blank" href="https://www.instagram.com/savefolla/">instagram</a> <br>
      <a target="_blank" href="https://github.com/savefolla/">github</a> <br>
      <a target="_blank" href="https://www.linkedin.com/in/saverio-follador/">linkedin</a> <br>
      <a class="content__email" href="mailto:hello@folladorsaver.io">
        <span class="label">email</span>
        <span class="text">hello@folladorsaver.io</span>
      </a>
    </div>
  </div>
  <div class="info hidden">
    keep holding to morph
  </div>
  <div class="call-to-action">
    <div class="call-to-action--desktop">
      click and hold
      <div class="call-to-action--desktop__progress"></div>
    </div>
    <div class="call-to-action--mobile">
      <svg xmlns="http://www.w3.org/2000/svg" height="24px" version="1.1" viewBox="0 0 24 24" width="24px" xml:space="preserve">
      <g fill="none" stroke="#000" stroke-linejoin="round" stroke-miterlimit="10" id="Outline_Icons_1_">
        <path id="mobile-progress-bar" stroke="white" d="M6.487 14.426a6.5 6.5 0 1 1 11.016.014" stroke-linecap="round"/>
        <path stroke="transparent" fill="white" d="M10.497 10.481a1 1 0 1 1 2 0v4.754l3.92 1.17c.654.189 1.047.855.894 1.52 0 0-.746 4.002-.85 4.576h-6.12l-3.06-4.59c-1.215-1.857 1.836-2.502 3.217.59v-8.02z"/>
      </g>
    </svg>
    </div>
  </div>
</div>
<div class="init" style="display: none">
  <div class="button" onclick="init()">ENTER</div>
  <div>I need your permission to use orientation data to do magical stuff.</div>
</div>
</body>
<script src="GetDays.js"></script>
<script src="vendor/three.min.js"></script>
<script src="vendor/anime.min.js"></script>
<script src="vendor/EffectComposer.js"></script>
<script src="vendor/RenderPass.js"></script>
<script src="vendor/GlitchPass.js"></script>
<script src="vendor/ShaderPass.js"></script>
<script src="vendor/CopyShader.js"></script>
<script src="vendor/DotScreenShader.js"></script>
<script src="vendor/RGBShiftShader.js"></script>
<script src="vendor/DigitalGlitch.js"></script>
<script src="vendor/DeviceOrientationControls.js"></script>
<script src="script.js"></script>
</html>