Merge branch 'master' of https://git.xpub.nl/alicestrt/food-review

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "serve": "vue-cli-service serve --host 0.0.0.0",
     "build": "vue-cli-service build",
     "lint": "vue-cli-service lint"
   },

src/components/CookingCard.vue

@@ -107,9 +107,9 @@ export default {
             home_cooking: '<a href="https://www.washingtonpost.com/news/wonk/wp/2015/03/05/the-slow-death-of-the-home-cooked-meal/?noredirect=on&utm_term=.3da4866e460d" target="_blank">"Less than 60 percent of suppers served at home were actually cooked at home last year. Only 30 years ago, the percentage was closer to 75 percent."</a>',
             brain: '<a href="https://www.scientificamerican.com/article/cooking-up-bigger-brains/?redirect=1" target="_blank"> "Our hominid ancestors could never have eaten enough raw food to support our large, calorie-hungry brains, Richard Wrangham claims. The secret to our evolution, he says, is cooking" </a>',
             taskrabbit: '<img width="500" height="200" src="./media/topics/post-mom_economy/images/task.png"></img>',
-            cooking_timetoeat: '<iframe width="250" height="200" src="./media/topics/cooking/video/cooking.mp4"></iframe>',
+            cooking_timetoeat: '<video width="250" height="200" controls autoplay src="./media/topics/cooking/video/cooking.mp4"></video>',
             soylent_quote: '<img width="600" height="300" src="./media/topics/meal_replacement_brands/quotes/soylent2.png"></img>',
-            performance_timetoeat: '<iframe width="250" height="200" src="./media/topics/gender_in_food/video/making_huel.mp4"></iframe>',
+            performance_timetoeat: '<video width="250" height="200" controls autoplay src="./media/topics/gender_in_food/video/making_huel.mp4"></video>',
 
         }
     },

src/components/MenuBar.vue

@@ -1,12 +1,12 @@
 <template>
 <b-row class="mb-5-menu">
     <b-col md="8">
-      <b-button variant="light"><router-link to='/' class='routerlink'>Home</router-link></b-button>
-        <b-button variant="light"><router-link to='/about' class='routerlink'>About</router-link></b-button>
-        <b-button variant="light"><router-link to='/review' class='routerlink'>Review</router-link></b-button>
-  <!--      <b-button variant="light"><router-link to='/glossary' class='routerlink'>Glossary</router-link></b-button> -->
-        <b-button variant="light"><router-link to='/fulltext' class='routerlink'>Full text</router-link></b-button>
-        <b-button variant="light"><router-link to='/video' class='routerlink'>Video</router-link></b-button>
+      <b-button variant="light" to='/'>Home</b-button>
+        <b-button variant="light" to='/about'>About</b-button>
+        <b-button variant="light" to='/review'>Review</b-button>
+
+<b-button variant="light" to='/fulltext'>Full text</b-button>
+        <b-button variant="light" to='/video'>Video</b-button>
     </b-col>
 </b-row>
 </template>

src/components/SolutionsCard.vue

@@ -25,11 +25,11 @@ p {
 
                 <p>The way we eat and think of food today is bound to change. The increasing demand for food, especially meat and dairy, combined with the damaging effects of climate change on agriculture (Cho, 2018), has the potential to push the food industry
                     in new directions, and consumers to reconsider their choices. Within this context, technology companies, the new actors on the food industry stage, are putting forward a solution which regards food as being archaic and inefficient,
-                    and the practices around food preparation as time- wasters. Their solution, materialized in products dubbed as ‘complete foods’ or ‘meal replacements’, which allegedly contain all the essential nutrients for the human body, is backed
-                    up by huge financial support from venture capital, and presented as the future of food. However, besides that fact that it does not offer a real solution to the problems we are facing, this interpretation of food does not reflect its
+                    and the practices around food preparation as time-wasters. Their solution, materialized in products dubbed as ‘complete foods’ or ‘meal replacements’, which allegedly contain all the essential nutrients for the human body, is backed
+                    up by <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="funding" title="Despite setbacks, Soylent drinks up $50 million in fresh funding">huge financial support</span> from venture capital, and presented as the future of food. However, besides that fact that it <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="solution_timetoeat" title="To what extent do meal replacements represent solutions">does not offer a real solution </span> to the problems we are facing, this interpretation of food does not reflect its
                     historical importance. The cultural role of food, gender representation, or collective values associated with sharing food, are largely disregarded. Instead, the emphasis is on the continuous quest to improve food products, within
                     the value system of <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="techno_solutionism" title="Evgeni Morozov on techno-solutionism">techno-solutionism</span>. In his book To Save Everything, Click Here, Evgeny Morozov critically describes this value system, explaining that “this never-ending quest to ameliorate [. . . ] is shortsighted and only perfunctorily
-                    interested in the activity for which improvement is sought” (Morozov, 2013). This critique applies to the development of meal replacements, the materialization of techno-solutionism in food, which are promoted as an universal response
+                    interested in the activity for which improvement is sought” (Morozov, 2013). This critique applies to the development of meal replacements, the materialization of techno-solutionism in food, which are promoted as an <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="benefits" title="The benefits of Huel">universal response</span>
                     to anything from time management, nutritional dilemmas, food waste and sustainability. Throughout this work, I will look at the development and implications of the meal replacement phenomenon, and, through the lens of food, provide
                     an outlook on tech industry’s influence on Western culture.
                 </p>
@@ -37,10 +37,10 @@ p {
                 <p>
                     The rise of products branded as innovative foods has largely happened in the last decade, originating from Silicon Valley. The latest innovations, such as meal replacements, make promises for an empowered self, with full control over what one puts in
                     one’s body. Companies place a lot of emphasis on a scientific approach to selecting ingredients for a particular product, and brand their products as technologically advanced food items. But the process of producing or sourcing the
-                    ingredients is almost never exposed, thus further obscuring the processes involved in food production. One notable example is the company Huel, which created a video on YouTube titled How Huel Is Made, but failed to actually show their
-                    process. Instead, the video described its packaging and delivery system, a fact that was quickly noted in the comments section as disingenuous.</p>
+                    ingredients is almost never exposed, thus further obscuring the processes involved in food production. One notable example is the company Huel, which created a <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="how_its_made" title="Devon to Doorstep. How Huel is Made">video on YouTube</span> titled How Huel Is Made, but failed to actually show their
+                    process. Instead, the video described its packaging and delivery system, a fact that was quickly noted in the <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="comment" title="A comment on the video allegedly showing how Huel is made">comments</span> section as disingenuous.</p>
                 <p>The celebration of not having time to tend to your bodily needs properly, together with the emphasis on giving the body personalized nutrition in the most pleasureless way is, of course, a paradoxical incongruity. At the same time, the
-                    idea that you are solely responsible for your well-being, and that you can control your health and efficiency with the right consumer habits is another heavily promoted concept. Trying to reconcile and adopt all these suggestions for
+                    idea that you are <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="humans_timetoeat" title="You're the only one responsible for your success and failure">solely responsible</span> for your well-being, and that you can control your health and efficiency with the right consumer habits is another heavily promoted concept. Trying to reconcile and adopt all these suggestions for
                     how one should live their life is almost impossible, and leads to burnout. However, startups in Silicon Valley and all over the world are more than ready to provide products to any imaginable issue that can be identified, in order
                     to achieve their prescribed quality of life. This is problematic in many ways, because it completely ignores other factors that influence our lives, such as social class, income, education, access etc, while promoting efficiency and
                     production as the main goals to be achieved by humans.</p>
@@ -61,8 +61,14 @@ export default {
     data: function() {
         return {
 
-            techno_solutionism: '<iframe width="560" height="315" src="https://www.youtube.com/embed/fOvaNzIxz54?start=26" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
-            lot_2046: '<a href="https://www.lot2046.com/">LOT is a subscription-based service which distributes a basic set of clothing, footwear, essential self-care products, accessories, and media content.</a>'
+            techno_solutionism: '<iframe width="250" height="200" src="https://www.youtube.com/embed/fOvaNzIxz54?start=26" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
+            lot_2046: '<a href="https://www.lot2046.com/">LOT is a subscription-based service which distributes a basic set of clothing, footwear, essential self-care products, accessories, and media content.</a>',
+            solution_timetoeat: '<video width="250" height="200" controls autoplay src="./media/topics/meal_replacement_products/video/end_of_day_cut.mp4"></video>',
+            humans_timetoeat: '<video width="250" height="200" controls autoplay src="./media/topics/personal_experience/video/humans.mp4"></video>',
+            comment: '<img width="800" height="600" src="./media/topics/personal_experience/communities/images/doorstep.png"></img>',
+            how_its_made: '<iframe width="560" height="315" src="https://www.youtube.com/embed/NpK63Auk1_A" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
+            funding: '<a href="https://techcrunch.com/2017/05/04/despite-setbacks-soylent-drinks-up-50-million-in-fresh-funding/"></a>',
+            benefits: '<img src="./media/topics/meal_replacement_brands/images/icons/huel.png"></img>',
 
         }
     },

src/components/SplashPage.vue

@@ -49,6 +49,8 @@ p {
   margin-top: 20px;
   font-family: 'Open Sans', sans-serif;
   color: #212322;
+
+
 }
 
 #read_full {
@@ -56,24 +58,52 @@ p {
   color: #212322;
 }
 
+#subtitle {
+  background-color: #212322;
+  color: white;
+  margin-top: 20px;
+  font-family: 'Open Sans', sans-serif;
+  font-size: 16px;
+  margin-bottom: 20px;
+}
+
+#review_title {
+  font-family: 'Open sans', sans-serif;
+  font-size: 30px;
+  font-weight: 800;
+  text-align: center;
+}
+
 .router-link {
   text-decoration: none;
   color: black;
 }
 
+.signs {
+  margin-bottom: 20px;
+}
+
+
+
 </style>
 
 <template>
 
 <div>
+
     <b-row align-h="center">
-        <b-col cols="4">
-            <h3>A critical resource for the meal-replacement curious</h3>
+        <b-col cols="12" id="subtitle">
+            <p style="text-align: center;">A critical resource for the meal-replacement curious</p>
         </b-col>
     </b-row>
     <!--end header -->
-    <b-row align-h="center" style="border-bottom: 1px solid #D3D3D3;">
-        <b-col cols="10" id="introduction">
+    <b-row align-h="center">
+      <b-col cols="4">
+        <h2 id='review_title'>A REVIEW</h2>
+      </b-col>
+    </b-row>
+    <b-row align-h="center" style="border-bottom: 2px solid #D3D3D3;">
+        <b-col cols="6" id="introduction">
             <p>
 
                 Throughout this past year, I’ve become fascinated with meal replacements. From their surprising form and aspiration to replace normal food, to the entire growing culture and community base around them, I’ve delved deep into the rabbit hole. I have now
@@ -90,6 +120,7 @@ p {
     </b-row>
 
     <!--end introduction -->
+    <div class='signs'>
 <b-row align-h="center">
   <b-col cols="3" id="why">
   Why meal replacements?
@@ -115,10 +146,11 @@ p {
             </p>
         </b-col>
     </b-row>
+  </div>
     <!-- end first row of icons-->
 
 
-    <b-row align-h="center">
+    <b-row align-h="center" class="signs">
         <b-col cols="2" style="text-align:center;">
             <font-awesome-icon icon="search-dollar" size="4x" />
             <p id="icon-text" style="text-align:center;">
@@ -134,7 +166,7 @@ p {
     </b-row>
     <!-- end second row of icons-->
 
-    <b-row align-h="center" style="border-top: 1px solid #D3D3D3;">
+    <b-row align-h="center" style="border-top: 2px solid #D3D3D3 margin-top: 10px; ">
         <b-col cols="2" id="review_end">
             <p style="text-align: right;">
                 Alice says:
@@ -155,8 +187,8 @@ p {
             </p>
         </b-col>
         <b-col cols="1" id="read_full">
-            <b-button variant="light">
-                <router-link to='/review'>Read full review</router-link>
+            <b-button variant="light" to='/review'>
+              Read full review
             </b-button>
 
 

src/components/TimeCard.vue

@@ -36,15 +36,15 @@ p {
                     can manage their time however they want. Once mommy stopped providing these services, it’s time for her to be <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="replace" title="Post-Mom Jobs">replaced</span> with an app. </p>
                 <p>
                     The main goal of these services it to convince users to separate important decisions from meaningless ones, and focus their time on paid labour. Deciding how to dress and what to eat can be outsourced to a corporation, which uses this as its selling point.
-                    This form of convenient consumption limits the need to think about your choices, and becomes an automated form of comfort. Within this mindset, cooking is being presented as a chore rather than an activity that can be done as leisure.
+                    This form of convenient consumption limits the need to think about your choices, and becomes an automated form of comfort. Within this mindset, cooking is being presented as a <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="chore_timetoeat" title="A quote from Rob Rhinehart, the founder of Soylent">chore </span>rather than an activity that can be done as leisure.
                     Entrepreneurs are encouraged, <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="startup_timetoeat" title="What problems are addressed, and how, and by whom?">or rather pressured</span>, to find solutions to problems they are facing themselves, and monetize every aspect of life. For many, the problem they face is becoming an adult with too much money to spend, and
                     too little time outside of work. Keeping a constant high level of performance at work does not allow much time and mind space for dealing with the practicalities of adult life, especially when they are framed as low-value, time-consuming
                     activities, and the latest consumer products reflect this reality.</p>
                 <p>
                     The post-mom economy reflects embedded preconceptions on gender roles within the home. When the main provider of these services is not available, startups offer the option to replace her with a techno-solutionist product, that brings convenience for those
                     who can afford it, while pushing others into low-wage gig work. Instead of reflecting on the value of maintaining a home and caregiving, or on the struggles of those who are pushed into these roles, the tasks are simply delegated to
-                    strangers. This further increases the infiltration of corporations into our lives under the pretense of earning more freedom (Pollan, 2014), while continuing to devalue what is regarded as women’s work. Unless it is done for the purpose
-                    of entertainment, cooking is framed as an archaic chore, subjected to the specialization of labour, and awarded with a low wage.</p>
+                    strangers. This further increases the infiltration of corporations into our lives under the pretense of earning more <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="freedom" title="Quote from the Feed website">freedom</span> (Pollan, 2014), while continuing to devalue what is regarded as women’s work. Unless it is done for the purpose
+                    of entertainment, cooking is framed as an archaic chore, subjected to the specialization of labour, and awarded with a <span style='border-bottom: 2px black dashed;' v-b-popover.click.html="living" title="Can you make a living as a delivery app bike messenger?">low wage</span>.</p>
             </div>
         </b-col>
 
@@ -67,7 +67,10 @@ export default {
             replace: '<img  width="300" height="200" src="/media/topics/post-mom_economy/images/post_mom_jobs.png"></img>',
             sleepscore: '<a href="https://www.sleepscore.com/" target="_blank">We’re the sleep company changing the world by changing the way you sleep</a>',
             hydrocoach: '<iframe width="250" height="200" src="https://www.youtube.com/embed/iFnfkDV_5P4" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
-            startup_timetoeat: '<img  width="300" height="200" src="/media/topics/post-mom_economy/video/startup.mp4"></img>',
+            startup_timetoeat: '<video width="300" height="200" controls autoplay src="/media/topics/post-mom_economy/video/startup.mp4"></video>',
+            freedom: '<img width="300" height="200" src="/media/topics/meal_replacement_brands/quotes/freedom.png"></img>',
+            living: '<iframe width="560" height="315" src="https://www.youtube.com/embed/2I0fxeeI1sg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>',
+            chore_timetoeat: '<img width="300" height="200" src="/media/topics/meal_replacement_brands/quotes/rob_quote.png"></img>',
 
 
 

src/components/ValueCard.vue

@@ -80,7 +80,7 @@ export default {
 
             post_mom_economy: '<iframe src="https://imgur.com/i1w6ztH"></iframe>',
             lot_2046: '<a href="https://www.lot2046.com/">LOT is a subscription-based service which distributes a basic set of clothing, footwear, essential self-care products, accessories, and media content.</a>',
-            purpose_timetoeat: '<img  width="300" height="200" src="/media/topics/meal_replacement_products/video/unlike_food.mp4"></img>',
+            purpose_timetoeat: '<img width="300" height="200" src="./media/topics/meal_replacement_products/video/unlike_food.mp4"></img>',
 
         }
     },

src/components/VideoPage.vue

@@ -28,12 +28,12 @@ h3 {
     <MenuBar/>
     <b-row align-h="center">
         <b-col cols="4">
-            <h3>Is it time to eat, or is there no more time to eat</h3>
+            <h3>Is it time to eat, or is there no more time to eat?</h3>
         </b-col>
     </b-row>
     <b-row align-h="center">
         <b-col cols="6" text-center>
-          <iframe width="860" height="515" src="https://www.youtube.com/embed/xzhw2rbroig" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+          <iframe width="860" height="515" src="https://www.youtube.com/embed/S-maUIUAC3I" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
         </b-col>
     </b-row>
 </div>