<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');

* {
    border: 0px black solid;
    background-color: #ffe6e6;

}

.title_story {
  font-size: 80px;
  font-family: 'Permanent Marker', cursive;
  padding-left: 20px;
  padding-top: 70px;
  color: #333042
}


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

}

a {
  color: gray;
}

.content {
  padding-right: 50px;
  padding-top: 40px;
  font-family: 'Roboto Mono', monospace;
  font-size: 15px;
  padding-left: 20px;
}

.egg_images img {
  max-width: 90%;
  padding-top: 40px;
}

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

}

.small_icon {
  max-width: 20%;
  padding-top: 70px;
}

.author {
  font-size: 20px;
  font-family: 'Roboto Mono', monospace;
  padding-left: 20px;


}

.zoom {
 transition: transform 1s;
}

.zoom:hover {
   transform: scale(1.1);}
</style>

<template>
  <b-container fluid class="p-0">
    <MenuBar/>
    <b-row>
      <b-col md="8">
        <p class="title_story">Egg story</p>
        <b-row>
          <b-col md="6">
            <p class="author">an essay by Amy Gowen</p>

          </b-col>
        </b-row>
      </b-col>
      <b-col md="2" class="small_icon">
        <div class="zoom">
        <a href="/pretzel"><b-img center class="img-fluid" alt="Responsive image" src="media/pretzel_prev.png"> </b-img></a>
      </div>
      </b-col>
      <b-col md="2" class="small_icon">
        <div class="zoom">

        <a href="/scooter"><b-img center class="img-fluid" alt="Responsive image" src="media/scooter_next.png"> </b-img></a>
        </div>
      </b-col>

    </b-row>


    <b-row>
      <b-col md="5">
<div class='content'>
<p>My brother has started cooking eggs. A marker of his independence, his progression into manhood. I woke up one morning to a picture he’d sent me of his craftwork the night before.
</p>
<p>
As I slept, he’d got cooking.
</p>
<p>
The eggs, his omelet, became a hot topic of conversation at the dinner table that evening.
</p>
<p>
“You need to flip it both sides, make sure it’s golden brown.” Dad had said between forkfuls of food. “Make sure the oil is piping hot, you want to hear that sizzle. I recommend smoked ham, peppers and onions.”
“It doesn’t matter if it scrambles, as long as it tastes good.” Mum encouraged.
“You don’t want the oil too hot,” I warned. “Otherwise the eggs will just wither and burn, you don’t want a weird, scrambled omelet. And don’t add meat. Vegetables are enough.”
</p>
<p>
After some further nights of experimentation, it transpired that my brother’s favorite filling was in fact cheese.
My nan took it upon herself to stand guard over the procedure the following week. The egg wasn’t cooking. “The oil is too cold; it won’t do anything.” He’d taken my advice too literally. I then heard my Nan order: “flip it like this, don’t move it, don’t touch, wait, leave it.”
“You need to be more patient”.
My dad happened to walk past. “Don’t break the eggs over the hob like that, you’re making a mess and life difficult for yourself. Here. Crack it like this.”
“I don’t know how to crack the eggs properly,” my brother replied. “I’ll just practice. Let me do it myself.”
</p>
<p>
It turned out my brother doesn’t like yolk. Or at least, if he has to eat it, it needs to be very, very hard. Funny because neither my mum nor I like yolk either, unless it’s also cooked that way. My dad thinks we’re mad “a runny yolk is the best bit.”
</p>
<p>
My brother then tried to move on to fried eggs, but didn't think he cooked the first batch properly. He felt sick the next day and went to bed early.
</p>
<p>
I woke up the next morning to yet another picture of a prized omelets. I guess he was sticking to what he knows.
Dad commented this one looked much better, he’d obviously taken his advice.
Nan said it was definitely down to her personal coaching.
Mum didn’t make a comment. She’d liked the look of them all.
As for me, I’m not even going to pretend it was because of my frankly lousy egg advice.
</p>
<p>
Since then, I’ve received practically a galleries worth of images of omelets victories.
</p>
<p>
And as some may count this current period through the changing of days, the passing of weeks and the tick of the clock. In our household, the marker of time rests amongst the eggs, the oil and the pan, between the omelets made and the omelets ate.</p></div>
      </b-col>
      <b-col md="7">
        <b-container fluid class="egg_images">
          <b-row>
            <b-col md="6">
              <b-img class="img-fluid" src="media/eggs/egg1.png"> </b-img>
            </b-col>
            <b-col md="6">
              <b-img class="img-fluid" src="media/eggs/egg2.png"> </b-img>
            </b-col>
          </b-row>

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

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

</script>
