magiun_website/src/components/edition3/mittens.vue

<style scoped>
@import url('https://fonts.googleapis.com/css2?family=Viga&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');
@font-face {
  font-family: 'Happy Times';
  src: url('../../../fonts/happy-times-NG_regular_master.otf');
}
@font-face {
  font-family: 'Semi Light Dots';
  src: url('../../../fonts/AC1-SemiLightDots.otf');
}
@font-face {
  font-family: 'ED Regular';
  src: url('../../../fonts/ED-Regular.otf');
}
* {
    border: 0px black solid;
    background-color: transparent;
}

.container_width {
  max-width: 100%;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 70px;
}


a:hover {
  color: hotpink;
  text-decoration: none;
}

a {
  color: gray;
}

.content {
  /*padding-right: 50px;*/
  /*padding-left: 60px;*/
  font-family: 'Happy Times';
  font-size: 18px;
  line-height: 24px;
  /*padding-bottom: 40px;*/
  color: #1B75BC;
  text-align: left;
}

.controls {
  padding-top: 12px;
  height: 120px;
  z-index: 1;
  position: relative;
  }

.title_story {
  font-size: 80px;
  font-family: 'Semi Light Dots', sans-serif;
  padding-top: 20px;
  color: #FA00FF;
  text-align: center;
}

.arrows {
  font-size: 80px;
  font-family: 'Semi Light Dots', sans-serif;
  top: 36px;
  color: #FA00FF;
  vertical-align: top;
  position: fixed;
  overflow: hidden;
}

.arrows a {
    display: block;
}

#leftarrow {
  float: left;
  color: #FA00FF;
}

#rightarrow {
  float: right;
  color: #FA00FF;
}

.image_container {
  padding-top: 5px;
}

.photo {
-webkit-filter: grayscale(100%);
        filter: grayscale(100%);
        width: auto;
  max-height: 100%;
  max-width: 100%;
  padding: 12px;
}

.img-fluid {
  filter: sepia(100%) saturate(300%) brightness(100%) hue-rotate(270deg);
}

.author {
  font-size: 20px;
  font-family: 'ED-regular', sans-serif;;
  text-align: center;
  color: #FA00FF;
}

.dialogue {
  /*font-family: 'ED-Regular', sans-serif;*/
  margin-left: 36px;
}

.small_icon {
  max-width: 60%;
  padding-top: 100px;
}

.zoom {
  max-width: 100%;
}

@media (max-width: 575px){
     .small_icon {
       display: none;

     }
     .title_story {
       font-size: 48px;
     }
     .author {
       font-size: 21px;
     }

     .content {
       padding-bottom: 40px;
     }

     .photo {
       padding-bottom: 40px;
     }
   }

</style>

<template>
  <b-container fluid class="p-0">
    <MenuBar/>
    <b-row class="controls">
        <b-col md="12" class="arrows">
          <a href="/soulsoup" id="leftarrow">←</a>
          <a href="/whatwecan" id="rightarrow">→</a>
        </b-col>
      </b-row>

    <b-row>
      <b-col md="4">
        <b-row>
          <b-col md="6" offset-md="3">
        <div class="zoom">
  <b-img center class="img-fluid" alt="Responsive image" src="media/magiun2/phone.png"> </b-img>
        </div>
          </b-col>
        </b-row>
        <b-row>
          <b-col md="12">
        <p class="title_story">How to Poach an Egg (Perfectly)</p>
      </b-col>
    </b-row>
        <b-row>
          <b-col md="12">
            <p class="author">a poem by Valentina Vella</p>

          </b-col>
        </b-row>
      </b-col>

  <b-col md="6">
<div class='content'>

<p class="monologue">
  These soft, colorful shapes
<br>
  <span class="dialogue">Came to me from compost and dark earth,
</span><br>
Thanks, earth!<br>
  <span class="dialogue">And thank you, human beings who planted, harvested,</span><br>
  Carried them to my local food co-op<br>

  <span class="dialogue">(Fuck the capitalists stealing our labor</span><br>
And buying up our housing stock).<br>
  <span class="dialogue">Tongue licking witty jokes on white ceramic,</span><br>
  Bubbles, waves, carbonated currents<br>
  <span class="dialogue">Rippling through papillae,</span><br>
  Hands appear,<br>
  <span class="dialogue">Disappear,</span><br>
  Inside oven mittens,<br>
  <span class="dialogue">A bell sound: three strikes,</span><br>
  Open the oven,<br>
  <span class="dialogue">Stomach juices flowing.</span><br>
  Getting dumped<br>
  <span class="dialogue">Was the best thing that’s ever happened to me:</span><br>
  All alone and forlorn I figured I should learn how to parent myself.<br>
  <span class="dialogue">Turns out my inner mamma takes care of me through food,</span><br>
  How unoriginal,<br>
  <span class="dialogue">How convenient.</span><br>
  She makes the most delicious food and I eat it all<br>
  <span class="dialogue">
  She makes the most delicious food and I sometimes share it</span><br>
  With my roommate Johanna (who's great and I hope will stick around<br>
  <span class="dialogue">Instead of moving back to Germany and giving up on Art with a capital A).</span><br>
  Rhubarb Crumble;<br>
  <span class="dialogue">Spinach Quiche with gruyère and heavy cream;</span><br>
  Flammkuchen with goat cheese and pears;<br>
  <span class="dialogue">Pasta alla Norma, melanzane fritte e primo sale;</span><br>
  Avocado Toast with cherry tomatoes, buffalo mozzarella, chili peppers,<br>
  <span class="dialogue">Basilico genovese, extra virgin olive oil;</span><br>
  The best poached eggs you’ve ever tried,<br>
  <span class="dialogue">(Here’s how I learned:</span><br>
  https://www.youtube.com/watch?v=yifZtA3uF-E,<br>
  <span class="dialogue">You’re welcome)</span><br>
  So round and fluffy,<br>
  <span class="dialogue">Bleeding yellow yolk over Johanna’s perfectly cooked sourdough bread;</span><br>
  My slightly boring overnight oats cheered up by kiwi berries and some weird<br>
  <span class="dialogue">Açaí-guarana frozen paste that I paid too much for;</span><br>
  Chai Tea cooled off by oat milk and sweetened by maple syrup<br>
  <span class="dialogue">To be sipped in the company of new, exciting,</span><br>
  Artist friends you can bitch about Dutch mental health care with;<br>
  <span class="dialogue">Vegetarian carbonara with zucchini, pecorino and smoked eggs.</span><br>
  Yesterday I fixed Pleun’s stereo so Johanna, my future comrades and I<br>
<span class="dialogue">Will eat tiramisù</span><br>
  While watching Italian classics projected on the lavender wall,
<br>
<span class="dialogue">Our asses pampered by the ridiculously comfortable turquoise velvet couch.</span>
<br>
  (I don’t particularly enjoy cooking
<br>
<span class="dialogue">I just need my delicious, edible love so much</span><br>
  That a little bit of sculpting<br>
  <span class="dialogue">With sharp blades and domesticated fire</span><br>
  (Which actually sounds cool!<br>
<span class="dialogue">But full disclosure:</span><br>
  I’ve always sneered at those who see food as their <i>art form</i>.<br>
<span class="dialogue">  Hate me, if you must)</span><br>
  Is totally worth the effort,<br>
<span class="dialogue">While before, cooking was a chore among chores,</span><br>
  One of the things that need to be done<br>
<span class="dialogue">  When you share your life 24/7 with another person</span><br>
  Which is in itself depleting,<br>
<span class="dialogue">So I was often trying to save energy:</span><br>
  Washing dishes and cleaning the house<br>
  <span class="dialogue">Requires less brain power than cooking.</span><br>
  I guess we made each other miserable<br>
<span class="dialogue">More often than happy</span><br>
  Since he recently called me a RUDE UNGRATEFUL ICE WITCH.<br>
  <span class="dialogue">It turns out he was a people pleaser,</span><br>
  Which is as far from a true giver as can be.<br>
<span class="dialogue">My window sill is where basil, sage and appelmunt plants live.</span><br>
  This small square kitchen will always be warm and filled with light,<br>
  <span class="dialogue">As we build loving, well-fed, Queer Communal Kinships</span><br>
  Where we'll communicate so well that<br>
<span class="dialogue">Nobody, hopefully,</span><br>
  Will plot complex revenge fantasies inspired by Korean cult directors,<br>
  <span class="dialogue">Where everyone will be stuffing each other’s mouths</span><br>
  With fluffy, doughy, crunchy bits of<br>
<span class="dialogue">Unconditional adoration.</span><br>

</p>
</div>
</b-col>



</b-row>
      </b-container>
</template>

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

</script>