alicestrete.me/index.html
2019-01-02 18:31:32 +01:00

153 lines
5.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Alice Strete</title>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:700,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<style type="text/css" media="screen">
#wrapper{
margin-left: 10px;
width: 50%;
}
@media(max-width: 768px){
#wrapper {
width: 80%;
}
}
ul{
padding-top: 15px;
padding-left: 0px;
}
ul li{
display: inline;
margin-left: 5px;
}
a{ color: gray; }
a:link { text-decoration: underline; }
a:hover{ color: black; }
h1{
font-family: 'Open Sans', sans-serif;
font-weight: 700;
}
p{
font-family: 'Open Sans', sans-serif;
font-weight: 300;
}
#smaller-inner{
font-size: 0.5em !important;
font-weight: 300 !important;
}
.fa{
font-size: 1.2em;
}
#links a{
color:black;
}
#links a:hover{
color:gray;
}
#written-text p{
padding: 0px;
margin: 5px;
}
.typed-cursor{
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
@keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-webkit-keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-moz-keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
</style>
</head>
<body>
<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-TS467T"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-TS467T');</script>
<!-- End Google Tag Manager -->
<div id="wrapper">
<div id="header">
<h1>Hi there, I'm Alice. <span id="smaller-inner"> <span class="element"> </span> </span> </h1>
</div>
<div id="written-text">
<p>
I cook, write, draw and manage things online.
</p>
<p>
I'm currently expanding my brain at the Piet Zwart Institute, doing my master in Experimental Publishing. Current work is on the <a target="_blank" href="http://pzwiki.wdka.nl/mediadesign/User:Alice"> wiki </a>. I also help out at <a target="_blank" href="https://www.fairplanet.org/about-fairplanet/">Fairplanet.org</a>
</p>
<p>
Here's some of my <a target="_blank" href="work.html">latest work</a>. For info, drop me an email at alice.strt@gmail.com
</p>
<p>
My drawings are mostly for my own enjoyment. You can take a peek <a target="_blank" href="http://drawing.alicestrete.me/">here</a>.
</p>
<p>
Here's my <a target="_blank" href="./cv.html">résumé</a>.
</p>
</div>
<ul id="links">
<li> <a target="_blank" href="https://www.facebook.com/alice.strt"><i class="fab fa-facebook-f fa-1x"></i></a></li>
<li> <a target="_blank" href="https://post.lurk.org/@alcstrt"><i class="fab fa-mastodon fa-1x"></i></a></li>
<li> <a target="_blank" href="https://www.instagram.com/alicestrt/"><i class="fas fa-camera-retro fa-1x"></i></a></li>
</ul>
</div>
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="typed.js" type="text/javascript" charset="utf-8"></script>
<script>
$(function(){
$(".element").typed({
strings: [
"I like to read Vonnegut.",
"I like to paint with watercolours.",
"I like to cook things.",
"I like to buy notebooks.",
"I like to drink wine.",
"I like to eat often.",
"I like to talk about food politics.",
"I like to listen to The Smiths."
],
startDelay: 3000,
typeSpeed: 100,
backSpeed: 30,
loop: true,
shuffle:true,
contentType: 'html'
});
});
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-74692444-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>