portfolio-website/src/components/HappinessPage.vue

<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">The Happiness Project</p>
      </b-col>
    </b-row>



    <b-row>
      <b-col md="4">
        <div class="description_text">
        <p class="tags">Public intervention</p>
        <p>
        The Happiness Project was created together with Angeliki Diakrousi as a intervention in the city of Groningen. The intervention took place in parallel and as a response to the local event <i>Let's Gro</i>, a festival about improving the city through start up initiatives, with a focus on the assumption that Groningen locals are 'happy'. </p>
        <p>Borrowing the existing infrastructure for advertising and corporate communication, or signs placed by people to regulate their own private space, creating borders between private and public, we made our own statements as a response/dialogue to the words of Let’s Gro. Using similar materials, communication methods and graphics, we created small engravings that blend in with the grass, buildings and sidewalk, and make a surprising comment on the issue of happiness. At the same time, we understand the term growing, that is included in the name of the festival, as occupying a space, making a big and bold statement, which led to our choice of printing big banner. We walked with the banner, with the statement ‘Happiness is a privilege’, through the city during rush hour.</p>
        <p>The project was part of the Timeline Gallery project, developed with the help of SIGN Groningen. Find this project <a href="https://sign2.nl/events/timeline-intervention-happiness-project-alice-strete-angeliki-diakrousi/" target="_blank">here</a> as well.</p>

      </div>
      </b-col>

      <b-col md="4">
        <b-img class="img-fluid" src="media/happiness/happy.gif"></b-img>
        <p></p>
        <b-img class="img-fluid" src="media/happiness/cope.png"></b-img>
      </b-col>

      <b-col md="4">
      <b-img class="img-fluid" src="media/happiness/grass1.JPG"></b-img>
      <p></p>
      <b-img class="img-fluid" src="media/happiness/grass2.JPG"></b-img>
      </b-col>
    </b-row>

    <b-row class="content">
      <b-col md="4">
        <b-img class="img-fluid" src="media/happiness/grow.JPG"></b-img>
      </b-col>
      <b-col md="4">
        <b-img class="img-fluid" src="media/happiness/city.JPG"></b-img>
      </b-col>
      <b-col md="4">
        <b-img class="img-fluid" src="media/happiness/signs.JPG"></b-img>
      </b-col>
    </b-row>
  </b-container>

</template>

<script>
import MenuBar from './MenuBar'

export default {
    name: 'HappinessPage',
    data: function() {
        return {
        }
    },
    components: {
        MenuBar
    }
}

</script>