bunch of small changes

master
alicestrt 4 years ago
parent 57d52cfca4
commit 274c19bebf

@ -1,5 +1,5 @@
DEST := /var/www/staticwebapp__6/ DEST := /var/www/portfolio.alicestrete.me/
REMOTE := vps.decentral1.se REMOTE := portfolio.alicestrete.me
RSYNC := rsync -chavzP RSYNC := rsync -chavzP
SRC := dist/* SRC := dist/*
SSH := ssh -t SSH := ssh -t

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>magiun_logo.png">
<title>Alice Strete</title> <title>Alice Strete</title>
</head> </head>
<body> <body>

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

@ -0,0 +1,97 @@
<style scoped>
* {
border: 0px black solid;
}
.project_title {
font-size: 40px;
font-weight: bold;
font-family: "Open Sans", sans-serif;
padding-bottom: 40px;
padding-top: 100px;
}
.description_text {
font-size: 15px;
font-family: "Roboto Mono", monospace;
padding-bottom: 10px;
}
.tags {
padding-top: 10px;
font-size: 15px;
font-style: italic;
font-family: "Roboto Mono", monospace;
}
a:hover {
color: hotpink;
text-decoration: none;
}
a {
color: gray;
}
.content {
padding-bottom: 40px;
}
</style>
<template>
<b-container fluid>
<MenuBar/>
<b-row>
<b-col md="12">
<p class="project_title">A Nourishing Network</p>
</b-col>
</b-row>
<b-row class="content">
<b-col md="4">
<div class="description_text">
<p class="tags">Publications, website, commissioned work</p>
<p>A Nourishing Network is a publishing project that documents and circulates current research done by a network of artists, activists and programmers that collaborate with the Austrian net culture initiative servus.at.</p> <p>A Nourishing Network is initiated by servus.at (Davide Bevilacqua) in collaboration with
varia.zone (Manetta Berends) and is published in the context of AMRO 2020
(Arts Meets Radical Openness).</p>
</div>
</b-col>
<b-col md="8">
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/ann/website.png"></b-img>
</b-col>
</b-row>
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/ann/ann_page.JPG"></b-img>
</b-col>
</b-row>
</b-col>
</b-row>
</b-container>
</template>
<script>
import MenuBar from './MenuBar'
export default {
name: 'ANNPage',
data: function() {
return {
}
},
components: {
MenuBar
}
}
</script>

@ -4,6 +4,9 @@
font-size: 18px; font-size: 18px;
color: #212322; color: #212322;
text-align: justify; text-align: justify;
padding-top: 100px;
padding-bottom: 100px;
padding-left: 20px;
} }
h3 { h3 {
@ -25,6 +28,10 @@ a:hover {
a { a {
color: gray; color: gray;
} }
.cv_sub {
font-size: 24px;
}
</style> </style>
@ -34,13 +41,72 @@ a {
<MenuBar/> <MenuBar/>
<b-row class="about-text"> <b-row class="about-text">
<b-col md="10"> <b-col md="10">
<p>I'm Alice, a Romanian artist/researcher based in Rotterdam, and you're looking at my portfolio.</p> <p>Alice Strete (1991) is a Romanian media artist/researcher based in Rotterdam. She is a board member of <a href="http://varia.zone/">Varia</a> and a board member of <a href="https://biobulkbende.org/">BioBulkBende</a> food co-operative.</p>
<p>For more information/questions/collaboration enquiries, drop me an <a href="mailto:alice.strt@gmail.com">email</a>. <p>For more information/questions/collaboration enquiries, drop her an <a href="mailto:alice.strt@gmail.com">email</a>.
You can also find me on <a href="https://www.instagram.com/alicestrt/" target="_blank">Instagram</a> and <a href="https://post.lurk.org/@alcstrt" target="_blank">Mastodon</a>. You can also find her on <a href="https://www.instagram.com/alicestrt/" target="_blank">Instagram</a> and <a href="https://post.lurk.org/@alcstrt" target="_blank">Mastodon</a>.
</p> </p>
<p class="cv_sub">Art and Research </p>
<p>2020, A Nourishing Network, collaboration with servus.at<br>
2020, Hybrid Publishing, hybrid publication project commissioned by the WDKA, Rotterdam <br>
2020, Magiun Magazine, self-publishing project <br>
2020, Intersectional Search in Queer and Trans Archives, Feminist Search Tool project <br>
2020, Groningen Timeline Gallery Exhibition, Book Launch & Review, Group exhibition, Rumour Camp, The Happiness Project<br>
2020, Amsterdam
Repository of Feminist Search Strategies
Workshop with Hackers&Designers, Read-in <br>
2019, Rotterdam Piet Zwart Institute, Upsetting Settings Graduation Show
Group exhibition, Is it time to eat, or is there no more time to eat?<br>
2019, Paris Gaîté Lyrique, Grrrls Tech Zine Fair
Participated with over/under, Techno/Cyber/Xeno-Feminism <br>
2018, Groningen
SIGN, Spread Zinefest
Zine Machines Workshop<br>
2018, Groningen
Timeline Gallery Project
Rumour Camp Project<br>
2018, Groningen
Timeline Gallery Project
The Happiness Project<br>
2018, Rotterdam
Piet Zwart Institute, Interfacing the Law
Group Show, XPPL project presented at Leeszaal West<br>
2018, Rotterdam
Piet Zwart Institute, OuNuPo
Group show, over/under, carlandre presented at Varia, WORM
Work<br>
2018, Rotterdam TENT Gallery, Rotterdam Cultural Histories
G roup show/exhibition, Temporary Autonomous Bureau</p>
<p class="cv_sub">Publications</p>
<p>2020, Rotterdam, Magiun Magazine <br>
2020, UK Code::Art Journal<br>
2019, Rotterdam Upsetting Settings Catalogue<br>
2019, Rotterdam Upsetting Settings, Collected Works<br>
2019, Rotterdam Over/Under zine<br>
2018, Rotterdam Techno/Cyber/Xeno-Feminism Reader<br>
2017, Rotterdam A Bed, a Chair and a Table</p>
<p class="cv_sub">Work</p>
<p>2019 present, Willem de Kooning Academy, Tutor/Researcher
Developer of publishing platform Beyond Social within the
social practices minor, workshop facilitator, substitute tutor <br>
2016 present,
Fairplanet.org, Social Media Manager for a non-profit independent
solution journalism platform focused on human rights and the environment.
</p>
<p class="cv_sub">Education</p>
<p>2017 2019, Rotterdam
Piet Zwart Institute, Willem de Kooning Academy, MA
Master of Arts in Fine Art and Design: Experimental Publishing <br>
2013 2014, Dublin
Dublin City University
Erasmus Semester Abroad, Communication Studies <br>
2011-2014, Cluj-Napoca
Babes-Bolyai University, Bachelor
Faculty of Political, Administrative and Communication Studies</p>
<p class="cv_sub">Awards</p>
<p>2020, Temporary Work Contribution Production, Presentation and Research (PPR) from CBK Rotterdam
<br>2018,
Van Beek-Donner Stichting
Awarded the Grada van Beek-Donner Scholarship</p>
</b-col> </b-col>
</b-row> </b-row>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -51,7 +54,7 @@ a {
<b-row> <b-row class='content'>
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication</p> <p class="tags">Publication</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,8 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
<template> <template>
@ -51,7 +52,7 @@ a {
<b-row> <b-row class='content'>
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication, graduation catalogue</p> <p class="tags">Publication, graduation catalogue</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -51,7 +54,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication, art submission, code art</p> <p class="tags">Publication, art submission, code art</p>

@ -0,0 +1,99 @@
<style scoped>
* {
border: 0px black solid;
}
.project_title {
font-size: 40px;
font-weight: bold;
font-family: "Open Sans", sans-serif;
padding-bottom: 40px;
padding-top: 100px;
}
.description_text {
font-size: 15px;
font-family: "Roboto Mono", monospace;
padding-bottom: 10px;
}
.tags {
padding-top: 10px;
font-size: 15px;
font-style: italic;
font-family: "Roboto Mono", monospace;
}
a:hover {
color: hotpink;
text-decoration: none;
}
a {
color: gray;
}
.content {
padding-bottom: 40px;
}
</style>
<template>
<b-container fluid>
<MenuBar/>
<b-row>
<b-col md="12">
<p class="project_title">Feminist Search Tools</p>
</b-col>
</b-row>
<b-row class="content">
<b-col md="4">
<div class="description_text">
<p class="tags">Data visualisation, research, commissioned work</p>
<p>Feminist Search Tools is an ongoing artistic research project that explores different ways of engaging with the items of digital library catalogues and their systems of categorization. The project attempts to stir conversations around the inclusion and exclusion mechanisms that are inherent to current Western knowledge economies.</p>
<p>Together with <a href="http://w-i-t-m.net/"> Angeliki Diakrousi</a>, I worked on further developing and complexifying the existing visualisation tool built by the design team during Digital Methods Summer School 2019, Amsterdam. The tool is built using D3js and uses as database the catalogue of IHLIA. The code can be found <a href="https://github.com/alicestrt/fst-viz-tool">here</a>.</p>
<p> The project is part of a long-term collaboration between the two collectives <a href="https://read-in.info/">Read-in</a> and <a href="https://hackersanddesigners.nl/">Hackers & Designers</a>. The Feminist Search Tools work group consists of: Read-in (Annette Krauss, Svenja Engels, Laura Pardo), Hackers & Designers, (Anja Groten, André Fincato, Heerko van der Kooij, and and previous member James Bryan Graves), Ola Hassanain, Angeliki Diakrousi and Alice Strete. </p>
</div>
</b-col>
<b-col md="8">
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/fst/fst-website-4.jpg"></b-img>
</b-col>
</b-row>
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/fst/fst-website-12.jpg"></b-img>
</b-col>
</b-row>
</b-col>
</b-row>
</b-container>
</template>
<script>
import MenuBar from './MenuBar'
export default {
name: 'FSTPage',
data: function() {
return {
}
},
components: {
MenuBar
}
}
</script>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: black; color: black;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
<template> <template>
@ -49,7 +52,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Workshop</p> <p class="tags">Workshop</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,7 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
<template> <template>
@ -75,7 +77,7 @@ a {
</b-col> </b-col>
</b-row> </b-row>
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<b-img class="img-fluid" src="media/happiness/grow.JPG"></b-img> <b-img class="img-fluid" src="media/happiness/grow.JPG"></b-img>
</b-col> </b-col>

@ -0,0 +1,123 @@
<style scoped>
* {
border: 0px black solid;
}
.project_title {
font-size: 40px;
font-weight: bold;
font-family: "Open Sans", sans-serif;
padding-bottom: 40px;
padding-top: 100px;
}
.description_text {
font-size: 15px;
font-family: "Roboto Mono", monospace;
padding-bottom: 10px;
}
.tags {
padding-top: 10px;
font-size: 15px;
font-style: italic;
font-family: "Roboto Mono", monospace;
}
a:hover {
color: hotpink;
text-decoration: none;
}
a {
color: gray;
}
.content {
padding-bottom: 40px;
}
.image_right {
padding-bottom: 40px;
}
</style>
<template>
<b-container fluid>
<MenuBar/>
<b-row>
<b-col md="12">
<p class="project_title">Magiun</p>
</b-col>
</b-row>
<b-row class='content'>
<b-col md="4">
<div class="description_text">
<p class="tags">Publication</p>
<p>
Magiun is a magazine about everyday food. It publishes stories, poems, essays, recipes, photos and illustrations.</p>
<p>
The <a href="https://magiun.online/">first edition</a> deals with eating in isolation - the struggles, the joys, the unexpected discoveries, the newly added anxieties. It came about as a desire to talk about our ever changing relationship to food, and how unexpected external factors (such as a global quarantine) can bring out new ways of relating to what we grow, buy, eat and share.</p>
<p>The print publication was developed in collaboration with Simon Browne.</p>
</div>
</b-col>
<b-col md="8">
<b-row class="image_right">
<b-col md="8" offset-md="2">
<b-img class="img-fluid" src="media/magiun/magiun_line_small.JPG"></b-img>
</b-col>
</b-row>
<b-row class="image_right">
<b-col md="8" offset-md="2">
<b-img class="img-fluid" src="media/magiun/magiun_shadow_small.JPG"></b-img>
</b-col>
</b-row>
<b-row class="image_right">
<b-col md="8" offset-md="2">
<b-img class="img-fluid" src="media/magiun/magiun_simon.png"></b-img>
</b-col>
</b-row>
<b-row>
<b-col md="8" offset-md="2">
<b-img class="img-fluid" src="media/magiun/magiun_tash.png"></b-img>
</b-col>
</b-row>
</b-col>
</b-row>
</b-container>
</template>
<script>
import MenuBar from './MenuBar'
export default {
name: 'Magiun',
data: function() {
return {
}
},
components: {
MenuBar
}
}
</script>

@ -1,12 +1,12 @@
<template> <template>
<b-row class="mb-5-menu"> <b-row>
<b-navbar toggleable="lg"> <b-navbar fixed=top toggleable="lg">
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle> <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<b-collapse id="nav-collapse" is-nav> <b-collapse id="nav-collapse" is-nav>
<b-navbar-nav> <b-nav class="justify-content-center mx-auto w-100">
<b-nav-item to='/'>Home</b-nav-item> <b-nav-item to='/'>Home</b-nav-item>
<b-nav-item to='/about'>About</b-nav-item> <b-nav-item to='/about'>About</b-nav-item>
</b-navbar-nav> </b-nav>
</b-collapse> </b-collapse>
</b-navbar> </b-navbar>
</b-row> </b-row>
@ -22,5 +22,18 @@ export default {
<style scoped> <style scoped>
@import url('https://fonts.googleapis.com/css?family=Inconsolata&display=swap'); @import url('https://fonts.googleapis.com/css?family=Inconsolata&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap'); @import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
.navbar {
background-color: white;
}
.navbar a {
color: black;
font-family: "Open Sans", sans-serif;
font-size: 16px;
}
.navbar a:hover {
color: hotpink;
}
</style> </style>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -26,6 +26,9 @@
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -40,7 +43,7 @@
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication, software art</p> <p class="tags">Publication, software art</p>

@ -8,31 +8,48 @@
border: 0px black solid; border: 0px black solid;
} }
.row_title { .row_title {
font-size: 30px; font-size: 30px;
writing-mode: vertical-rl; writing-mode: vertical-rl;
text-orientation: upright; text-orientation: upright;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
text-align: center; text-align: center;
padding-top: 25px; padding-top: 45px;
padding-bottom: 10px; padding-bottom: 10px;
} }
@media (max-width: 575px) {
.row_title {
writing-mode: horizontal-tb;
}
.item_title {
padding-top: 40px;
padding-bottom: 15px;
}
}
.item_title { .item_title {
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
font-size: 15px; font-size: 15px;
padding-top: 10px; padding-top: 20px;
padding-bottom: 10px; padding-bottom: 10px;
text-align: center; text-align: center;
} }
#myname { #myname {
font-size: 30px; font-size: 30px;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
font-weight: bold; font-weight: bold;
padding-top: 80px;
} }
#repo {
width: 110%;
}
a:hover { a:hover {
color: hotpink; color: hotpink;
text-decoration: none; text-decoration: none;
@ -43,7 +60,33 @@ a {
color: black; color: black;
} }
.items {
padding-top: 30px;
padding-bottom: 40px;
}
.img-fluid:hover {
webkit-filter: blur(4px);
filter: blur(4px);
}
.bg {
height: 100%;
width: 100%;
}
.bg::before {
content: "";
background-image: url("");
background-repeat: repeat;
background-size: cover;
background-position: center;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
}
</style> </style>
@ -51,9 +94,10 @@ a {
<div> <div>
<MenuBar/> <MenuBar/>
<div class="bg">
<b-container fluid> <b-container fluid>
<b-row> <b-row class="text-center">
<b-col md="4"> <b-col md="4" offset-md="4">
<p id='myname'> <p id='myname'>
Alice Strete Alice Strete
</p> </p>
@ -62,94 +106,135 @@ a {
</b-container> </b-container>
<b-container fluid> <b-container fluid>
<b-row> <b-row class="items">
<b-col md="1"> <b-col md="1">
<p class="row_title">PROJECTS</p> <p class="row_title">PROJECTS</p>
</b-col> </b-col>
<b-col md="2"> <b-col md="10">
<b-row>
<b-col md="3">
<p class="item_title"><b-link to="/TimeCard">Is it time to eat, or is there no more time to eat?</b-link></p> <p class="item_title"><b-link to="/TimeCard">Is it time to eat, or is there no more time to eat?</b-link></p>
<b-link to="/TimeCard"><b-img class="img-fluid" center src="media/making_huel.gif"></b-img></b-link> <b-link to="/TimeCard"><b-img class="img-fluid" center src="media/making_huel.gif"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/HappinessPage">The Happiness Project</b-link></p> <p class="item_title"><b-link to="/HappinessPage">The Happiness Project</b-link></p>
<b-link to="/HappinessPage"><b-img class="img-fluid" center src="media/privilege.JPG"></b-img></b-link> <b-link to="/HappinessPage"><b-img class="img-fluid" center src="media/privilege.JPG"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/xppl" >XPPL</b-link></p> <p class="item_title"><b-link to="/xppl" >XPPL</b-link></p>
<b-link to="/xppl" ><b-img class="img-fluid" src="media/xppl_main.png"></b-img></b-link> <b-link to="/xppl" ><b-img class="img-fluid" src="media/xppl_main.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/tab">Temporary Autonomous Bureau</b-link></p> <p class="item_title"><b-link to="/tab">Temporary Autonomous Bureau</b-link></p>
<b-link to="/tab"><b-img class="img-fluid" src="media/tab.jpg"></b-img></b-link> <b-link to="/tab"><b-img class="img-fluid" src="media/tab.jpg"></b-img></b-link>
</b-col> </b-col>
</b-row> </b-row>
</b-col>
</b-row>
</b-container> </b-container>
<b-container fluid> <b-container fluid>
<b-row> <b-row class="items">
<b-col md="1"> <b-col md="1">
<p class="row_title">PUBLICATIONS</p> <p class="row_title">PUBLICATIONS</p>
</b-col> </b-col>
<b-col md="2"> <b-col md="10">
<b-row>
<b-col md="3">
<p class="item_title"><b-link to="/magiun">Magiun</b-link></p>
<b-link to="/magiun"><b-img class="img-fluid" src="media/magiun_scan_test2.jpg"></b-img></b-link>
</b-col>
<b-col md="3">
<p class="item_title"><b-link to="/upsetting">Upsetting Settings, Collected Works</b-link></p> <p class="item_title"><b-link to="/upsetting">Upsetting Settings, Collected Works</b-link></p>
<b-link to="/upsetting"><b-img class="img-fluid" src="media/upsetting_settings_book.png"></b-img></b-link> <b-link to="/upsetting"><b-img class="img-fluid" src="media/upsetting_settings_book.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/catalogue">Upsetting Settings Catalogue</b-link></p> <p class="item_title"><b-link to="/catalogue">Upsetting Settings Catalogue</b-link></p>
<b-link to="/catalogue"><b-img class="img-fluid" src="media/catalogue.png"></b-img></b-link> <b-link to="/catalogue"><b-img class="img-fluid" src="media/catalogue.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/xeno">Techno/Cyber/Xeno-Feminism</b-link></p>
<b-link to="/xeno"><b-img class="img-fluid" src="media/Xeno.png"></b-img></b-link>
</b-col>
</b-row>
</b-col>
</b-row>
</b-container>
<b-container fluid>
<b-row>
<b-col md="10" offset-md="1">
<b-row>
<b-col md="3">
<p class="item_title"><b-link to="/overunder">Over/Under</b-link></p> <p class="item_title"><b-link to="/overunder">Over/Under</b-link></p>
<b-link to="/overunder"><b-img class="img-fluid" src="media/overunder.png"></b-img></b-link> <b-link to="/overunder"><b-img class="img-fluid" src="media/overunder.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/xeno">Techno/Cyber/Xeno-Feminism</b-link></p> <p class="item_title"><b-link to="/codeart">Code::art Journal</b-link></p>
<b-link to="/xeno"><b-img class="img-fluid" src="media/Xeno.png"></b-img></b-link> <b-link to="/codeart"><b-img class="img-fluid" src="media/codeart.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/bedchairtable">A Bed, a Chair and a Table</b-link></p> <p class="item_title"><b-link to="/bedchairtable">A Bed, a Chair and a Table</b-link></p>
<b-link to="/bedchairtable"><b-img class="img-fluid" src="media/bed.png"></b-img></b-link> <b-link to="/bedchairtable"><b-img class="img-fluid" src="media/bed.png"></b-img></b-link>
</b-col> </b-col>
</b-row>
</b-col>
</b-row> </b-row>
</b-container> </b-container>
<b-container fluid> <b-container fluid>
<b-row> <b-row class="items">
<b-col md="1"> <b-col md="1">
<p></p> <p class="row_title">OTHER WORK</p>
</b-col> </b-col>
<b-col md="2"> <b-col md="10">
<p class="item_title"><b-link to="/codeart">Code::art Journal</b-link></p> <b-row>
<b-link to="/codeart"><b-img class="img-fluid" src="media/codeart.png"></b-img></b-link> <b-col md="3">
<p class="item_title"><b-link to="/fst">Feminist Search Tools</b-link></p>
<b-link to="/fst"><b-img class="img-fluid" src="media/fst/blobs.png"></b-img></b-link>
</b-col>
<b-col md="3">
<p class="item_title"><b-link to="/surveillance">Surveillance Stories</b-link></p>
<b-link to="/surveillance"><b-img class="img-fluid" src="media/surveillance.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="3">
<p class="item_title"><b-link to="/ann">A Nourishing Network</b-link></p>
<b-link to="/ann"><b-img class="img-fluid" src="media/ann_envelopes.JPG"></b-img></b-link>
</b-col>
</b-row>
</b-col>
</b-row> </b-row>
</b-container> </b-container>
<b-container fluid> <b-container fluid>
<b-row> <b-row class="items">
<b-col md="1"> <b-col md="1">
<p class="row_title">WORKSHOPS</p> <p class="row_title">WORKSHOPS</p>
</b-col> </b-col>
<b-col md="2"> <b-col md="10">
<b-row>
<b-col md="3">
<p class="item_title"><b-link to="/zinemachines">Zine Machines</b-link></p> <p class="item_title"><b-link to="/zinemachines">Zine Machines</b-link></p>
<b-link to="/zinemachines"><b-img class="img-fluid" src="media/zinemachines.png"></b-img></b-link> <b-link to="/zinemachines"><b-img class="img-fluid" src="media/zinemachines.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/unpacking">Unpacking Gender Roles</b-link></p> <p class="item_title"><b-link to="/unpacking">Unpacking Gender Roles</b-link></p>
<b-link to="/unpacking"><b-img class="img-fluid" src="media/unpacking.png"></b-img></b-link> <b-link to="/unpacking"><b-img class="img-fluid" src="media/unpacking.png"></b-img></b-link>
</b-col> </b-col>
<b-col md="2"> <b-col md="3">
<p class="item_title"><b-link to="/femtools">Repository of Feminist Search Strategies</b-link></p> <p class="item_title"><b-link to="/femtools">Repository of Feminist Search Strategies</b-link></p>
<b-link to="/femtools"><b-img class="img-fluid" src="media/femrepo.gif"></b-img></b-link> <b-link to="/femtools"><b-img id="repo" src="media/femrepo.gif"></b-img></b-link>
</b-col> </b-col>
</b-row>
</b-col>
</b-row> </b-row>
</b-container> </b-container>
</div>
</div> </div>
</template> </template>

@ -0,0 +1,97 @@
<style scoped>
* {
border: 0px black solid;
}
.project_title {
font-size: 40px;
font-weight: bold;
font-family: "Open Sans", sans-serif;
padding-bottom: 40px;
padding-top: 100px;
}
.description_text {
font-size: 15px;
font-family: "Roboto Mono", monospace;
padding-bottom: 10px;
}
.tags {
padding-top: 10px;
font-size: 15px;
font-style: italic;
font-family: "Roboto Mono", monospace;
}
a:hover {
color: hotpink;
text-decoration: none;
}
a {
color: gray;
}
.content {
padding-bottom: 40px;
}
</style>
<template>
<b-container fluid>
<MenuBar/>
<b-row>
<b-col md="12">
<p class="project_title">Surveillance Stories</p>
</b-col>
</b-row>
<b-row class="content">
<b-col md="4">
<div class="description_text">
<p class="tags">Website, commissioned work</p>
<p>Surveillance Stories is a research project exploring the relationship with AI based surveillance and the human body. The website presents a series of conversations with people with an interest in surveillance and public space, design, art, artificial intelligence, technology and social justice. </p>
<p>Together with Gill Balwdin, I've worked on developing the website using Bootstrap Vue.</p>
</div>
</b-col>
<b-col md="8">
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/surveillance/front.png"></b-img>
</b-col>
</b-row>
<b-row>
<b-col md="10" offset-md="1">
<b-img class="img-fluid" src="media/surveillance/luke.png"></b-img>
</b-col>
</b-row>
</b-col>
</b-col>
</b-row>
</b-container>
</template>
<script>
import MenuBar from './MenuBar'
export default {
name: 'SurveillancePage',
data: function() {
return {
}
},
components: {
MenuBar
}
}
</script>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -74,7 +77,7 @@ a {
</b-col> </b-col>
</b-row> </b-row>
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<b-img class="img-fluid" src="media/tab/zine.JPG"></b-img> <b-img class="img-fluid" src="media/tab/zine.JPG"></b-img>
</b-col> </b-col>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,10 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
<template> <template>
@ -75,7 +79,7 @@ a {
</b-col> </b-col>
</b-row> </b-row>
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<b-img class="img-fluid" src="media/timetoeat/review.png"></b-img> <b-img class="img-fluid" src="media/timetoeat/review.png"></b-img>
</b-col> </b-col>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -26,7 +26,9 @@
} }
.content {
padding-bottom: 40px;
}
</style> </style>
<template> <template>
@ -40,7 +42,7 @@
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Workshop, discussion</p> <p class="tags">Workshop, discussion</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -50,7 +53,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication, graduation thesis</p> <p class="tags">Publication, graduation thesis</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: gray; color: gray;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -50,7 +53,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Publication, reader</p> <p class="tags">Publication, reader</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -36,6 +36,9 @@ a {
color: black; color: black;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -50,7 +53,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Pirate library, web application</p> <p class="tags">Pirate library, web application</p>

@ -9,7 +9,7 @@
font-weight: bold; font-weight: bold;
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-bottom: 40px; padding-bottom: 40px;
padding-top: 30px; padding-top: 100px;
} }
.description_text { .description_text {
@ -35,6 +35,9 @@ a:hover {
a { a {
color: black; color: black;
} }
.content {
padding-bottom: 40px;
}
</style> </style>
@ -49,7 +52,7 @@ a {
<b-row> <b-row class="content">
<b-col md="4"> <b-col md="4">
<div class="description_text"> <div class="description_text">
<p class="tags">Workshop</p> <p class="tags">Workshop</p>

@ -41,6 +41,10 @@ import XenoPage from './components/XenoPage'
import BedchairtablePage from './components/BedchairtablePage' import BedchairtablePage from './components/BedchairtablePage'
import CodeartPage from './components/CodeartPage' import CodeartPage from './components/CodeartPage'
import FemToolsPage from './components/FemToolsPage' import FemToolsPage from './components/FemToolsPage'
import Magiun from './components/Magiun'
import FSTPage from './components/FSTPage'
import SurveillancePage from './components/SurveillancePage'
import ANNPage from './components/ANNPage'
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.use(BootstrapVue) Vue.use(BootstrapVue)
@ -68,6 +72,12 @@ const router = new VueRouter({
{ path: '/bedchairtable', component: BedchairtablePage }, { path: '/bedchairtable', component: BedchairtablePage },
{ path: '/codeart', component: CodeartPage }, { path: '/codeart', component: CodeartPage },
{ path: '/femtools', component: FemToolsPage }, { path: '/femtools', component: FemToolsPage },
{ path: '/magiun', component: Magiun },
{ path: '/fst', component: FSTPage },
{ path: '/surveillance', component: SurveillancePage },
{ path: '/ann', component: ANNPage },
] ]

Loading…
Cancel
Save