portfolio-website/src/components/CataloguePage.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: 30px;
}

.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;
}



</style>

<template>
  <b-container fluid>
    <MenuBar/>
    <b-row>
      <b-col md="12">
        <p class="project_title">Upsetting Settings Catalogue</p>
      </b-col>
    </b-row>



    <b-row>
      <b-col md="4">
        <div class="description_text">
        <p class="tags">Publication, graduation catalogue</p>
        <p>The Upsetting Settings Catalogue presents two years' worth of work from the 2019 graduates of the Piet Zwart Institute, Experimental Publishing. The publication was launched within the graduation show Upsetting Settings, at UBIK Rotterdam. The concept behind 'Upsetting settings' arises from the defaults of technology. In every system there are settings predefined by its creators, that most of the time stay untouched by us, as users. It's their default, not ours, but it's up to us to change it. Society is made of similar preset frameworks that we take for granted. The projects in this exhibition engage with these different default modes and intervene in their core structure/source/root.
        </p>


      </div>
      </b-col>

      <b-col md="4">
        <b-img class="img-fluid" src="media/catalogue/catalogue.png"></b-img>
        <p></p>
        <b-img class="img-fluid" src="media/catalogue/catalogue1.png"></b-img>
      </b-col>
      <b-col md="4">
      <b-img class="img-fluid" src="media/catalogue/ounupo.png"></b-img>
      <p></p>
      <b-img class="img-fluid" src="media/catalogue/timetoeat.png"></b-img>
      </b-col>

    </b-row>

  </b-container>

</template>

<script>
import MenuBar from './MenuBar'
export default {
    name: 'CataloguePage',
    data: function() {
        return {
        }
    },
    components: {
        MenuBar
    }
}

</script>